@atlaskit/icon 26.0.0 → 26.1.1

package/dist/cjs/recommended-small.js

@@ -0,0 +1,7 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.recommendedSmallIcons = void 0;
+var recommendedSmallIcons = exports.recommendedSmallIcons = ['chevron-double-left', 'chevron-double-right', 'chevron-down', 'chevron-left', 'chevron-right', 'chevron-up'];

package/dist/es2019/components/icon-facade.js

@@ -23,34 +23,36 @@ const sizeSpacingMap = {
  */
 export const IconFacade = /*#__PURE__*/memo(function IconFacade({
   dangerouslySetGlyph,
+  size,
   ...props
 }) {
-  var _props$size;
   const NewIcon = props.newIcon;
 
   // By default, the icon size will be medium for core icons and small for utility icons
-  const size = (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : 'medium';
+  const iconSize = size !== null && size !== void 0 ? size : 'medium';
   const useNewIcon = !props.isFacadeDisabled &&
   // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
   fg('platform-visual-refresh-icons-legacy-facade');
-  if (useNewIcon && NewIcon && (size === 'small' || size === 'medium')) {
+  if (useNewIcon && NewIcon && (iconSize === 'small' || iconSize === 'medium')) {
     if (props.iconType === 'utility') {
       const Icon = NewIcon;
       return /*#__PURE__*/React.createElement(Icon, _extends({}, props, {
-        spacing: fg('platform-visual-refresh-icons-facade-button-fix') ? sizeSpacingMap['utility'][size] : 'none',
+        spacing: fg('platform-visual-refresh-icons-facade-button-fix') ? sizeSpacingMap['utility'][iconSize] : 'none',
         color: props.primaryColor || 'currentColor',
         type: props.iconType
       }));
     } else {
       const Icon = NewIcon;
       return /*#__PURE__*/React.createElement(Icon, _extends({}, props, {
-        spacing: sizeSpacingMap['core'][size],
+        size: iconSize,
+        spacing: sizeSpacingMap['core'][iconSize],
         color: props.primaryColor || 'currentColor',
         type: props.iconType
       }));
     }
   }
   return /*#__PURE__*/React.createElement(LegacyIcon, _extends({
-    dangerouslySetGlyph: dangerouslySetGlyph
+    dangerouslySetGlyph: dangerouslySetGlyph,
+    size: size
   }, props));
 });

package/dist/es2019/components/icon-new.js

@@ -20,9 +20,14 @@ const scaleStyles = null;
  */
 const baseHcmStyles = null;
 const scaleSize = null;
-const coreSizes = {
+const coreSizeMedium = {
   none: "_1bsbpxbi _4t3ipxbi",
-  compact: "",
+  compact: "_1bsb1ejb _4t3i1ejb",
+  spacious: "_1bsb1ejb _4t3i1ejb"
+};
+const coreSizeSmall = {
+  none: "_1bsbutpp _4t3iutpp",
+  compact: "_1bsbpxbi _4t3ipxbi",
   spacious: "_1bsb1ejb _4t3i1ejb"
 };
 const utilSizes = {
@@ -36,13 +41,28 @@ const baseSizeMap = {
 };
 const paddingMap = {
   core: {
-    none: 0,
-    spacious: 4
+    medium: {
+      none: 0,
+      compact: 4,
+      spacious: 4
+    },
+    small: {
+      none: 0,
+      compact: 2.66,
+      spacious: 8
+    }
   },
   utility: {
-    none: 0,
-    compact: 2,
-    spacious: 6
+    medium: {
+      none: 0,
+      compact: 2,
+      spacious: 6
+    },
+    small: {
+      none: 0,
+      compact: 2,
+      spacious: 6
+    }
   }
 };
 
@@ -55,7 +75,7 @@ const paddingMap = {
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/icon/docs/custom-icons)
  */
 export const Icon = /*#__PURE__*/memo(function Icon(props) {
-  var _props$type, _props$spacing3, _props$spacing4;
+  var _props$type;
   const {
     color = 'currentColor',
     testId,
@@ -69,7 +89,8 @@ export const Icon = /*#__PURE__*/memo(function Icon(props) {
     dangerouslySetGlyph,
     // Used with iconTile to scale icon up and down
     shouldScale,
-    LEGACY_margin
+    LEGACY_margin,
+    spacing = 'none'
   } = props;
   const dangerouslySetInnerHTML = dangerouslySetGlyph ? {
     __html: dangerouslySetGlyph
@@ -90,15 +111,14 @@ export const Icon = /*#__PURE__*/memo(function Icon(props) {
       UNSAFE_margin: LEGACY_margin
     });
   }
-  const baseSize = baseSizeMap[(_props$type = props.type) !== null && _props$type !== void 0 ? _props$type : 'core'];
-  let viewBoxPadding;
-  if (props.type === 'utility') {
-    var _props$spacing;
-    viewBoxPadding = paddingMap[props.type][(_props$spacing = props.spacing) !== null && _props$spacing !== void 0 ? _props$spacing : 'none'];
-  } else {
-    var _props$spacing2;
-    viewBoxPadding = paddingMap['core'][(_props$spacing2 = props.spacing) !== null && _props$spacing2 !== void 0 ? _props$spacing2 : 'none'];
-  }
+  const type = (_props$type = props.type) !== null && _props$type !== void 0 ? _props$type : 'core';
+  const size = 'size' in props && props.size !== undefined && (
+  // This prevents invalid sizes being passed in, which is required
+  // for handling unsupported legacy icon sizes which can
+  // cause errors.
+  props.size === 'small' || props.size === 'medium') ? props.size : 'medium';
+  const baseSize = baseSizeMap[type];
+  const viewBoxPadding = paddingMap[type][size][spacing];
   const viewBoxSize = baseSize + 2 * viewBoxPadding;
   return /*#__PURE__*/React.createElement("span", {
     "data-testid": testId,
@@ -108,7 +128,7 @@ export const Icon = /*#__PURE__*/memo(function Icon(props) {
     style: {
       color
     },
-    className: ax(["_1e0c1o8l _vchhusvi _1o9zidpf _vwz4kb7n _y4ti1igz _bozg1mb9", "_12va1onz _jcxd1r8n", shouldScale && "_1bsb1kw7 _4t3i1kw7", props.type === 'utility' && "_vwz4utpp"])
+    className: ax(["_1e0c1o8l _vchhusvi _1o9zidpf _vwz4kb7n _y4ti1igz _bozg1mb9", "_12va1onz _jcxd1r8n", shouldScale && "_1bsb1kw7 _4t3i1kw7", (type === 'utility' || size === 'small') && "_vwz4utpp"])
   }, /*#__PURE__*/React.createElement("svg", {
     fill: "none"
     // Adjusting the viewBox allows the icon padding to scale with the contents of the SVG, which
@@ -117,7 +137,7 @@ export const Icon = /*#__PURE__*/memo(function Icon(props) {
     viewBox: `${0 - viewBoxPadding} ${0 - viewBoxPadding} ${viewBoxSize} ${viewBoxSize}`,
     role: "presentation",
     dangerouslySetInnerHTML: dangerouslySetInnerHTML,
-    className: ax(["_1reo15vq _18m915vq _syaz1r31 _lcxvglyw _s7n4yfq0 _vc881r31", shouldScale ? "_1bsb1kw7 _4t3i1kw7" : props.type === 'utility' ? utilSizes[(_props$spacing3 = props.spacing) !== null && _props$spacing3 !== void 0 ? _props$spacing3 : 'none'] : coreSizes[(_props$spacing4 = props.spacing) !== null && _props$spacing4 !== void 0 ? _props$spacing4 : 'none']])
+    className: ax(["_1reo15vq _18m915vq _syaz1r31 _lcxvglyw _s7n4yfq0 _vc881r31", shouldScale ? "_1bsb1kw7 _4t3i1kw7" : type === 'utility' ? utilSizes[spacing] : size === 'small' ? coreSizeSmall[spacing] : coreSizeMedium[spacing]])
   }));
 });
 export default Icon;

package/dist/es2019/metadata-core.js

@@ -3,7 +3,7 @@
  *
  * To change the format of this file, modify `createIconDocsNew` in icon-build-process/src/create-icon-docs.tsx.
  *
- * @codegen <<SignedSource::74e48f82d18722adc91c77fffafd647c>>
+ * @codegen <<SignedSource::60ca5eb1312bd9cabe699f3be0937d0f>>
  * @codegenCommand yarn build:icon-glyphs
  */
 
@@ -720,6 +720,76 @@ const metadata = {
     team: 'Design System Team',
     status: 'published'
   },
+  'chevron-double-left': {
+    keywords: ['chevron-double-left', 'chevrondoubleleft', 'icon', 'core', 'double chevron', 'left', 'previous year'],
+    componentName: 'ChevronDoubleLeftIcon',
+    package: '@atlaskit/icon/core/chevron-double-left',
+    shouldRecommendSmallIcon: true,
+    type: 'core',
+    categorization: 'multi-purpose',
+    team: 'Design System Team',
+    status: 'ready-to-publish',
+    slackChannel: '#icon-contributions'
+  },
+  'chevron-double-right': {
+    keywords: ['chevron-double-right', 'chevrondoubleright', 'icon', 'core', 'double chevron', 'right', 'next year'],
+    componentName: 'ChevronDoubleRightIcon',
+    package: '@atlaskit/icon/core/chevron-double-right',
+    shouldRecommendSmallIcon: true,
+    type: 'core',
+    categorization: 'multi-purpose',
+    team: 'Design System Team',
+    status: 'ready-to-publish',
+    slackChannel: '#icon-contributions'
+  },
+  'chevron-down': {
+    keywords: ['chevron-down', 'chevrondown', 'expand', 'collapse', 'icon', 'core', 'chevron down', 'open dropdown menu', 'expanded tree item', 'collapse tree item'],
+    componentName: 'ChevronDownIcon',
+    package: '@atlaskit/icon/core/chevron-down',
+    oldName: ['chevron-down', 'chevron-down-circle', 'hipchat/chevron-down'],
+    shouldRecommendSmallIcon: true,
+    type: 'core',
+    categorization: 'multi-purpose',
+    team: 'Design System Team',
+    status: 'ready-to-publish',
+    slackChannel: '#icon-contributions'
+  },
+  'chevron-left': {
+    keywords: ['chevron-left', 'chevronleft', 'back', 'previous', 'icon', 'core', 'chevron left', 'back'],
+    componentName: 'ChevronLeftIcon',
+    package: '@atlaskit/icon/core/chevron-left',
+    oldName: ['chevron-left-circle', 'chevron-left', 'chevron-left-large'],
+    shouldRecommendSmallIcon: true,
+    type: 'core',
+    categorization: 'multi-purpose',
+    team: 'Design System Team',
+    status: 'ready-to-publish',
+    slackChannel: '#icon-contributions'
+  },
+  'chevron-right': {
+    keywords: ['chevron-right', 'chevronright', 'forward', 'next', 'icon', 'core', 'chevron right', 'collapsed', 'expand tree item'],
+    componentName: 'ChevronRightIcon',
+    package: '@atlaskit/icon/core/chevron-right',
+    oldName: ['chevron-right-circle', 'chevron-right', 'chevron-right-large'],
+    shouldRecommendSmallIcon: true,
+    type: 'core',
+    categorization: 'multi-purpose',
+    team: 'Design System Team',
+    status: 'ready-to-publish',
+    slackChannel: '#icon-contributions'
+  },
+  'chevron-up': {
+    keywords: ['chevron-up', 'chevronup', 'expand', 'collapse', 'icon', 'core', 'chevron up', 'close dropdown menu', 'collapse'],
+    componentName: 'ChevronUpIcon',
+    package: '@atlaskit/icon/core/chevron-up',
+    oldName: ['chevron-up-circle', 'hipchat/chevron-up', 'chevron-up'],
+    shouldRecommendSmallIcon: true,
+    type: 'core',
+    categorization: 'multi-purpose',
+    team: 'Design System Team',
+    status: 'ready-to-publish',
+    slackChannel: '#icon-contributions'
+  },
   'child-issues': {
     keywords: ['child-issues', 'childissues', 'icon', 'core'],
     componentName: 'ChildIssuesIcon',

package/dist/es2019/metadata-utility.js

@@ -3,7 +3,7 @@
  *
  * To change the format of this file, modify `createIconDocsNew` in icon-build-process/src/create-icon-docs.tsx.
  *
- * @codegen <<SignedSource::0a9bbc9e058d3b90ee6b8b82cf2f9830>>
+ * @codegen <<SignedSource::d968f0d4e1bd5bc5e728353f8fdcc101>>
  * @codegenCommand yarn build:icon-glyphs
  */