@atlaskit/icon 27.12.0 → 28.1.0

package/core/whiteboard.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b17a1d467ee36b565800b9226ad47576>>
+ * @codegen <<SignedSource::63bc83d2df21e8aa09401170cfaa4b9a>>
  * @codegenCommand yarn build:icon-glyphs
  */
 "use strict";
@@ -21,6 +21,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/icon/docs/custom-icons)
  */
 const WhiteboardIcon = props => /*#__PURE__*/_react.default.createElement(_baseNew.default, Object.assign({
+  name: "WhiteboardIcon",
   dangerouslySetGlyph: `<path fill="currentcolor" fill-rule="evenodd" d="M9.162 2.177c-.714.282-1.28.817-1.449 1.338l-1.426-.463C6.637 1.97 7.633 1.168 8.61.782c.943-.372 2.248-.49 3.09.375.346.356.536.777.548 1.236.011.437-.14.827-.323 1.144-.228.394-.557.761-.876 1.074 1.466-.136 2.717.239 3.421 1.134.827 1.05.644 2.464-.256 3.697l-1.212-.884c.66-.905.556-1.547.29-1.885-.305-.387-1.095-.757-2.524-.512-.521.09-.935.138-1.236.13a1.4 1.4 0 0 1-.537-.11.9.9 0 0 1-.345-.278.85.85 0 0 1-.164-.495 1.02 1.02 0 0 1 .197-.586c.077-.112.171-.215.256-.3.14-.143.323-.306.499-.464l.101-.09c.453-.407.87-.806 1.087-1.181.102-.178.124-.292.123-.354-.002-.04-.01-.113-.124-.23-.2-.204-.716-.321-1.464-.026M3.75 5.5a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5M0 7.75a3.75 3.75 0 1 1 7.5 0 3.75 3.75 0 0 1-7.5 0m10.25.75a.75.75 0 0 1 .643.364l3 5A.75.75 0 0 1 13.25 15h-6a.75.75 0 0 1-.643-1.136l3-5a.75.75 0 0 1 .643-.364m-1.675 5h3.35l-1.675-2.792z" clip-rule="evenodd"/>`
   // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
 }, props));

package/core/work-item.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::16b1a013266ea85d8875a6b5e1d2412a>>
+ * @codegen <<SignedSource::5af16ea80f1d58312eb2e017eb04c22b>>
  * @codegenCommand yarn build:icon-glyphs
  */
 "use strict";
@@ -21,6 +21,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/icon/docs/custom-icons)
  */
 const WorkItemIcon = props => /*#__PURE__*/_react.default.createElement(_baseNew.default, Object.assign({
+  name: "WorkItemIcon",
   dangerouslySetGlyph: `<path fill="currentcolor" d="M14.5 4a.5.5 0 0 0-.4-.49L14 3.5H2a.5.5 0 0 0-.5.5v8a.5.5 0 0 0 .5.5h12a.5.5 0 0 0 .5-.5zm-2.927 1.983-4 4.75a.75.75 0 0 1-1.146 0l-2-2.375 1.146-.966L7 9.085l3.427-4.068zM16 12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h12l.204.01A2 2 0 0 1 16 4z"/>`
   // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
 }, props));

package/core/work-items.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::fa0a7a20e9878c1f12b50feba4970dc6>>
+ * @codegen <<SignedSource::4eef8c7bda009f013e8cf54eb12259e1>>
  * @codegenCommand yarn build:icon-glyphs
  */
 "use strict";
@@ -21,6 +21,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/icon/docs/custom-icons)
  */
 const WorkItemsIcon = props => /*#__PURE__*/_react.default.createElement(_baseNew.default, Object.assign({
+  name: "WorkItemsIcon",
   dangerouslySetGlyph: `<path fill="currentcolor" d="M11.5 4a.5.5 0 0 0-.5-.5H2a.5.5 0 0 0-.5.5v6a.5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5zM9.448 5.608l-3.167 3.75a.75.75 0 0 1-1.09.061l-.055-.06-1.584-1.876 1.146-.966 1.01 1.196 2.594-3.071zM13 10a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2z"/><path fill="currentcolor" d="M14.5 11.75V7H16v4.75A3.25 3.25 0 0 1 12.75 15H5v-1.5h7.75a1.75 1.75 0 0 0 1.75-1.75"/>`
   // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
 }, props));

package/core/zoom-in.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::e4e3e14173b47c6de5fe1fa37ade34ee>>
+ * @codegen <<SignedSource::e9c8ff141bb3ac6f3d3c142a83802bd7>>
  * @codegenCommand yarn build:icon-glyphs
  */
 "use strict";
@@ -21,6 +21,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/icon/docs/custom-icons)
  */
 const ZoomInIcon = props => /*#__PURE__*/_react.default.createElement(_baseNew.default, Object.assign({
+  name: "ZoomInIcon",
   dangerouslySetGlyph: `<path fill="currentcolor" fill-rule="evenodd" d="M7 2.5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9M1 7a6 6 0 1 1 10.74 3.68l3.29 3.29-1.06 1.06-3.29-3.29A6 6 0 0 1 1 7m5.25.75V10h1.5V7.75H10v-1.5H7.75V4h-1.5v2.25H4v1.5z" clip-rule="evenodd"/>`
   // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
 }, props));

package/core/zoom-out.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::37fb24f79715a5e8762f768d1ae974b4>>
+ * @codegen <<SignedSource::38d4bb9285a504664d94867606cdaddc>>
  * @codegenCommand yarn build:icon-glyphs
  */
 "use strict";
@@ -21,6 +21,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/icon/docs/custom-icons)
  */
 const ZoomOutIcon = props => /*#__PURE__*/_react.default.createElement(_baseNew.default, Object.assign({
+  name: "ZoomOutIcon",
   dangerouslySetGlyph: `<path fill="currentcolor" fill-rule="evenodd" d="M7 2.5a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9M1 7a6 6 0 1 1 10.74 3.68l3.29 3.29-1.06 1.06-3.29-3.29A6 6 0 0 1 1 7m9 .75H4v-1.5h6z" clip-rule="evenodd"/>`
   // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
 }, props));

package/deprecated-map/package.json

@@ -8,7 +8,7 @@
   ],
   "types": "../dist/types/entry-points/deprecated-map.d.ts",
   "typesVersions": {
-    ">=4.5 <5.4": {
+    ">=4.5 <5.9": {
       "*": [
         "../dist/types-ts4.5/entry-points/deprecated-map.d.ts"
       ]

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

@@ -96,7 +96,8 @@ var Icon = exports.Icon = /*#__PURE__*/(0, _react.memo)(function Icon(props) {
     shouldScale = _ref.shouldScale,
     LEGACY_margin = _ref.LEGACY_margin,
     _ref$spacing = _ref.spacing,
-    spacing = _ref$spacing === void 0 ? 'none' : _ref$spacing;
+    spacing = _ref$spacing === void 0 ? 'none' : _ref$spacing,
+    name = _ref.name;
   var dangerouslySetInnerHTML = dangerouslySetGlyph ? {
     __html: dangerouslySetGlyph
   } : undefined;
@@ -117,11 +118,15 @@ var Icon = exports.Icon = /*#__PURE__*/(0, _react.memo)(function Icon(props) {
     });
   }
   var type = (_props$type = props.type) !== null && _props$type !== void 0 ? _props$type : 'core';
-  var 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';
+  var size = 'medium';
+  if ('size' in props && props.size !== undefined) {
+    if (typeof props.size === 'string') {
+      size = props.size === 'small' || props.size === 'medium' ? props.size : size;
+    } else if (name) {
+      var newSize = props.size(name);
+      size = newSize === 'small' || newSize === 'medium' ? newSize : size;
+    }
+  }
   var baseSize = baseSizeMap[type];
   var viewBoxPadding = paddingMap[type][size][spacing];
   var viewBoxSize = baseSize + 2 * viewBoxPadding;

package/dist/cjs/entry-points/base.js

@@ -10,12 +10,6 @@ Object.defineProperty(exports, "Icon", {
     return _icon.Icon;
   }
 });
-Object.defineProperty(exports, "IconFacade", {
-  enumerable: true,
-  get: function get() {
-    return _iconFacade.IconFacade;
-  }
-});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
@@ -23,5 +17,4 @@ Object.defineProperty(exports, "default", {
   }
 });
 var _icon = _interopRequireWildcard(require("../components/icon"));
-var _iconFacade = require("../components/icon-facade");
 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); }

package/dist/cjs/metadata-core.js

@@ -34,12 +34,7 @@ var metadata = {
     categorization: 'single-purpose',
     usage: 'Single purpose - Reserved for creating and adding an object.',
     team: 'Design System Team',
-    replacement: {
-      name: 'focus-area',
-      type: 'core',
-      location: '@atlaskit/icon'
-    },
-    status: 'deprecated'
+    status: 'published'
   },
   'ai-agent': {
     keywords: ['ai-agent', 'aiagent', 'icon', 'Rovo', 'AI', 'chat agent', 'ai'],

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

@@ -90,7 +90,8 @@ export const Icon = /*#__PURE__*/memo(function Icon(props) {
     // Used with iconTile to scale icon up and down
     shouldScale,
     LEGACY_margin,
-    spacing = 'none'
+    spacing = 'none',
+    name
   } = props;
   const dangerouslySetInnerHTML = dangerouslySetGlyph ? {
     __html: dangerouslySetGlyph
@@ -112,11 +113,15 @@ export const Icon = /*#__PURE__*/memo(function Icon(props) {
     });
   }
   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';
+  let size = 'medium';
+  if ('size' in props && props.size !== undefined) {
+    if (typeof props.size === 'string') {
+      size = props.size === 'small' || props.size === 'medium' ? props.size : size;
+    } else if (name) {
+      const newSize = props.size(name);
+      size = newSize === 'small' || newSize === 'medium' ? newSize : size;
+    }
+  }
   const baseSize = baseSizeMap[type];
   const viewBoxPadding = paddingMap[type][size][spacing];
   const viewBoxSize = baseSize + 2 * viewBoxPadding;

package/dist/es2019/entry-points/base.js

@@ -1,2 +1 @@
-export { default, Icon } from '../components/icon';
-export { IconFacade } from '../components/icon-facade';
+export { default, Icon } from '../components/icon';

package/dist/es2019/metadata-core.js

@@ -28,12 +28,7 @@ const metadata = {
     categorization: 'single-purpose',
     usage: 'Single purpose - Reserved for creating and adding an object.',
     team: 'Design System Team',
-    replacement: {
-      name: 'focus-area',
-      type: 'core',
-      location: '@atlaskit/icon'
-    },
-    status: 'deprecated'
+    status: 'published'
   },
   'ai-agent': {
     keywords: ['ai-agent', 'aiagent', 'icon', 'Rovo', 'AI', 'chat agent', 'ai'],

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

@@ -89,7 +89,8 @@ export var Icon = /*#__PURE__*/memo(function Icon(props) {
     shouldScale = _ref.shouldScale,
     LEGACY_margin = _ref.LEGACY_margin,
     _ref$spacing = _ref.spacing,
-    spacing = _ref$spacing === void 0 ? 'none' : _ref$spacing;
+    spacing = _ref$spacing === void 0 ? 'none' : _ref$spacing,
+    name = _ref.name;
   var dangerouslySetInnerHTML = dangerouslySetGlyph ? {
     __html: dangerouslySetGlyph
   } : undefined;
@@ -110,11 +111,15 @@ export var Icon = /*#__PURE__*/memo(function Icon(props) {
     });
   }
   var type = (_props$type = props.type) !== null && _props$type !== void 0 ? _props$type : 'core';
-  var 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';
+  var size = 'medium';
+  if ('size' in props && props.size !== undefined) {
+    if (typeof props.size === 'string') {
+      size = props.size === 'small' || props.size === 'medium' ? props.size : size;
+    } else if (name) {
+      var newSize = props.size(name);
+      size = newSize === 'small' || newSize === 'medium' ? newSize : size;
+    }
+  }
   var baseSize = baseSizeMap[type];
   var viewBoxPadding = paddingMap[type][size][spacing];
   var viewBoxSize = baseSize + 2 * viewBoxPadding;

package/dist/esm/entry-points/base.js

@@ -1,2 +1 @@
-export { default, Icon } from '../components/icon';
-export { IconFacade } from '../components/icon-facade';
+export { default, Icon } from '../components/icon';

package/dist/esm/metadata-core.js

@@ -28,12 +28,7 @@ var metadata = {
     categorization: 'single-purpose',
     usage: 'Single purpose - Reserved for creating and adding an object.',
     team: 'Design System Team',
-    replacement: {
-      name: 'focus-area',
-      type: 'core',
-      location: '@atlaskit/icon'
-    },
-    status: 'deprecated'
+    status: 'published'
   },
   'ai-agent': {
     keywords: ['ai-agent', 'aiagent', 'icon', 'Rovo', 'AI', 'chat agent', 'ai'],

package/dist/types/entry-points/base.d.ts

@@ -1,3 +1,2 @@
 export { default, Icon } from '../components/icon';
-export { IconFacade } from '../components/icon-facade';
 export type { IconProps } from '../types';

package/dist/types/types.d.ts

@@ -73,8 +73,11 @@ interface NewCoreGlyphSizeProps {
      * There are two icon sizes available:
      * - `medium` - 16px. (default).
      * - `small` - 12px.
+     *
+     * Alternatively a function can be passed to determine the size
+     * based on the icon's name, which can be useful for dynamic rendering.
      */
-    size?: IconSize;
+    size?: IconSize | ((iconName: string) => IconSize);
 }
 interface OtherGlyphProps {
     /**
@@ -127,7 +130,7 @@ export interface GlyphProps extends LegacyOtherGlyphProps, GlyphSizeProps, Glyph
 }
 interface NewCoreGlyphProps extends OtherGlyphProps, NewCoreGlyphSpacingProps, NewCoreGlyphSizeProps, NewGlyphColorProps {
 }
-interface NewUtilityGlyphProps extends OtherGlyphProps, NewUtilityGlyphSpacingProps, NewGlyphColorProps {
+interface NewUtilityGlyphProps extends OtherGlyphProps, NewUtilityGlyphSpacingProps, NewCoreGlyphSizeProps, NewGlyphColorProps {
 }
 export interface IconProps extends GlyphProps, IconInternalGlyphProps {
     /**
@@ -162,16 +165,23 @@ interface BaseNewIconProps {
 }
 export interface UNSAFE_NewCoreGlyphProps extends BaseNewIconProps, NewCoreGlyphProps, IconInternalGlyphProps {
     type?: 'core';
-    size?: NewCoreIconSize;
     shouldRecommendSmallIcon?: boolean;
+    /**
+     * Display name of the icon.
+     */
+    name?: string;
 }
 export interface UNSAFE_NewUtilityGlyphProps extends BaseNewIconProps, NewUtilityGlyphProps, IconInternalGlyphProps {
     type: 'utility';
+    /**
+     * Display name of the icon.
+     */
+    name?: string;
 }
-export type NewCoreIconProps = Omit<UNSAFE_NewCoreGlyphProps, 'dangerouslySetGlyph' | 'type'>;
-export type NewUtilityIconProps = Omit<UNSAFE_NewUtilityGlyphProps, 'dangerouslySetGlyph' | 'type'>;
+export type NewCoreIconProps = Omit<UNSAFE_NewCoreGlyphProps, 'dangerouslySetGlyph' | 'type' | 'name'>;
+export type NewUtilityIconProps = Omit<UNSAFE_NewUtilityGlyphProps, 'dangerouslySetGlyph' | 'type' | 'name'>;
 export type UNSAFE_NewGlyphProps = UNSAFE_NewUtilityGlyphProps | UNSAFE_NewCoreGlyphProps;
-export type NewIconProps = Omit<UNSAFE_NewGlyphProps, 'dangerouslySetGlyph' | 'type'>;
+export type NewIconProps = Omit<UNSAFE_NewGlyphProps, 'dangerouslySetGlyph' | 'type' | 'name'>;
 export type IconTileAppearance = 'gray' | 'blue' | 'teal' | 'green' | 'lime' | 'yellow' | 'orange' | 'red' | 'magenta' | 'purple' | 'grayBold' | 'blueBold' | 'tealBold' | 'greenBold' | 'limeBold' | 'yellowBold' | 'orangeBold' | 'redBold' | 'magentaBold' | 'purpleBold';
 export type IconTileSize = '16' | '24' | '32' | '40' | '48';
 export interface IconTileProps {
@@ -258,10 +268,6 @@ type IconMigrationResult = {
 };
 export type IconMigrationSizeGuidance = '16-icon-tile' | '24-icon-tile' | '32-icon-tile' | '48-icon-tile' | 'swap' | 'swap-slight-visual-change' | 'swap-visual-change' | 'product-icon' | 'not-recommended' | 'icon-tile' | 'top-nav' | 'icon-lab' | 'no-larger-size';
 export type IconMigrationMap = Record<string, IconMigrationResult>;
-export type IconFacadeProps = IconProps & {
-    newIcon?: React.ComponentType<NewUtilityIconProps> | React.ComponentType<NewCoreIconProps>;
-    iconType?: UNSAFE_NewGlyphProps['type'];
-};
 interface LEGACY_Data {
     keywords: string[];
     componentName: string;

package/dist/types-ts4.5/entry-points/base.d.ts

@@ -1,3 +1,2 @@
 export { default, Icon } from '../components/icon';
-export { IconFacade } from '../components/icon-facade';
 export type { IconProps } from '../types';

package/dist/types-ts4.5/types.d.ts

@@ -73,8 +73,11 @@ interface NewCoreGlyphSizeProps {
      * There are two icon sizes available:
      * - `medium` - 16px. (default).
      * - `small` - 12px.
+     *
+     * Alternatively a function can be passed to determine the size
+     * based on the icon's name, which can be useful for dynamic rendering.
      */
-    size?: IconSize;
+    size?: IconSize | ((iconName: string) => IconSize);
 }
 interface OtherGlyphProps {
     /**
@@ -127,7 +130,7 @@ export interface GlyphProps extends LegacyOtherGlyphProps, GlyphSizeProps, Glyph
 }
 interface NewCoreGlyphProps extends OtherGlyphProps, NewCoreGlyphSpacingProps, NewCoreGlyphSizeProps, NewGlyphColorProps {
 }
-interface NewUtilityGlyphProps extends OtherGlyphProps, NewUtilityGlyphSpacingProps, NewGlyphColorProps {
+interface NewUtilityGlyphProps extends OtherGlyphProps, NewUtilityGlyphSpacingProps, NewCoreGlyphSizeProps, NewGlyphColorProps {
 }
 export interface IconProps extends GlyphProps, IconInternalGlyphProps {
     /**
@@ -162,16 +165,23 @@ interface BaseNewIconProps {
 }
 export interface UNSAFE_NewCoreGlyphProps extends BaseNewIconProps, NewCoreGlyphProps, IconInternalGlyphProps {
     type?: 'core';
-    size?: NewCoreIconSize;
     shouldRecommendSmallIcon?: boolean;
+    /**
+     * Display name of the icon.
+     */
+    name?: string;
 }
 export interface UNSAFE_NewUtilityGlyphProps extends BaseNewIconProps, NewUtilityGlyphProps, IconInternalGlyphProps {
     type: 'utility';
+    /**
+     * Display name of the icon.
+     */
+    name?: string;
 }
-export type NewCoreIconProps = Omit<UNSAFE_NewCoreGlyphProps, 'dangerouslySetGlyph' | 'type'>;
-export type NewUtilityIconProps = Omit<UNSAFE_NewUtilityGlyphProps, 'dangerouslySetGlyph' | 'type'>;
+export type NewCoreIconProps = Omit<UNSAFE_NewCoreGlyphProps, 'dangerouslySetGlyph' | 'type' | 'name'>;
+export type NewUtilityIconProps = Omit<UNSAFE_NewUtilityGlyphProps, 'dangerouslySetGlyph' | 'type' | 'name'>;
 export type UNSAFE_NewGlyphProps = UNSAFE_NewUtilityGlyphProps | UNSAFE_NewCoreGlyphProps;
-export type NewIconProps = Omit<UNSAFE_NewGlyphProps, 'dangerouslySetGlyph' | 'type'>;
+export type NewIconProps = Omit<UNSAFE_NewGlyphProps, 'dangerouslySetGlyph' | 'type' | 'name'>;
 export type IconTileAppearance = 'gray' | 'blue' | 'teal' | 'green' | 'lime' | 'yellow' | 'orange' | 'red' | 'magenta' | 'purple' | 'grayBold' | 'blueBold' | 'tealBold' | 'greenBold' | 'limeBold' | 'yellowBold' | 'orangeBold' | 'redBold' | 'magentaBold' | 'purpleBold';
 export type IconTileSize = '16' | '24' | '32' | '40' | '48';
 export interface IconTileProps {
@@ -258,10 +268,6 @@ type IconMigrationResult = {
 };
 export type IconMigrationSizeGuidance = '16-icon-tile' | '24-icon-tile' | '32-icon-tile' | '48-icon-tile' | 'swap' | 'swap-slight-visual-change' | 'swap-visual-change' | 'product-icon' | 'not-recommended' | 'icon-tile' | 'top-nav' | 'icon-lab' | 'no-larger-size';
 export type IconMigrationMap = Record<string, IconMigrationResult>;
-export type IconFacadeProps = IconProps & {
-    newIcon?: React.ComponentType<NewUtilityIconProps> | React.ComponentType<NewCoreIconProps>;
-    iconType?: UNSAFE_NewGlyphProps['type'];
-};
 interface LEGACY_Data {
     keywords: string[];
     componentName: string;

package/glyph/activity.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _dashboard = _interopRequireDefault(require("@atlaskit/icon/core/dashboard"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ActivityIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const ActivityIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><g fill="currentcolor" fill-rule="evenodd"><path fill-rule="nonzero" d="M19.004 17C19 17 19 7.006 19 7.006 19 7 4.996 7 4.996 7 5 7 5 16.994 5 16.994 5 17 19.004 17 19.004 17M3 7.006A2 2 0 0 1 4.995 5h14.01A2 2 0 0 1 21 7.006v9.988A2 2 0 0 1 19.005 19H4.995A2 2 0 0 1 3 16.994z"/><path d="M4 6h16v5H4zm5 2c0 .556.446 1 .995 1h8.01c.54 0 .995-.448.995-1 0-.556-.446-1-.995-1h-8.01C9.455 7 9 7.448 9 8M5 8c0 .556.448 1 1 1 .556 0 1-.448 1-1 0-.556-.448-1-1-1-.556 0-1 .448-1 1"/></g></svg>`
-}, props, {
-  newIcon: _dashboard.default
-}));
+}, props));
 ActivityIcon.displayName = 'ActivityIcon';
 var _default = exports.default = ActivityIcon;

package/glyph/add-circle.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _add = _interopRequireDefault(require("@atlaskit/icon/core/add"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AddCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const AddCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><g fill-rule="evenodd"><circle cx="12" cy="12" r="10" fill="currentcolor"/><path fill="inherit" d="M11.046 7.958v3.088H7.958a.954.954 0 1 0 0 1.908h3.088v3.088a.954.954 0 1 0 1.908 0v-3.088h3.088a.954.954 0 1 0 0-1.908h-3.088V7.958a.954.954 0 1 0-1.908 0"/></g></svg>`
-}, props, {
-  newIcon: _add.default
-}));
+}, props));
 AddCircleIcon.displayName = 'AddCircleIcon';
 var _default = exports.default = AddCircleIcon;

package/glyph/add-item.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _shortcut = _interopRequireDefault(require("@atlaskit/icon/core/shortcut"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AddItemIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const AddItemIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><g fill="currentcolor" fill-rule="evenodd"><path fill-rule="nonzero" d="M16.002 3H4.995A1.995 1.995 0 0 0 3 4.995v14.01C3 20.107 3.893 21 4.995 21h14.01A1.995 1.995 0 0 0 21 19.005V7.998 11h-2v8H5V5h8V3z"/><path d="M19 5V3.99A1 1 0 0 0 18 3c-.556 0-1 .444-1 .99V5h-1a1 1 0 0 0 0 2h1v1.01A1 1 0 0 0 18 9c.556 0 1-.444 1-.99V7h1a1 1 0 0 0 0-2z"/></g></svg>`
-}, props, {
-  newIcon: _shortcut.default
-}));
+}, props));
 AddItemIcon.displayName = 'AddItemIcon';
 var _default = exports.default = AddItemIcon;

package/glyph/add.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _add = _interopRequireDefault(require("@atlaskit/icon/core/add"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AddIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const AddIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><path fill="currentcolor" fill-rule="evenodd" d="M13 11V3.993A.997.997 0 0 0 12 3c-.556 0-1 .445-1 .993V11H3.993A.997.997 0 0 0 3 12c0 .557.445 1 .993 1H11v7.007c0 .548.448.993 1 .993.556 0 1-.445 1-.993V13h7.007A.997.997 0 0 0 21 12c0-.556-.445-1-.993-1z"/></svg>`
-}, props, {
-  newIcon: _add.default
-}));
+}, props));
 AddIcon.displayName = 'AddIcon';
 var _default = exports.default = AddIcon;

package/glyph/addon.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _app = _interopRequireDefault(require("@atlaskit/icon/core/app"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AddonIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const AddonIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><g fill="currentcolor" fill-rule="evenodd"><path d="m5.376 6.455 5.248-3.104c.792-.469 1.963-.467 2.752 0l5.248 3.104C19.416 6.923 20 7.962 20 8.895v6.21c0 .936-.587 1.973-1.376 2.44l-5.248 3.104c-.792.469-1.963.467-2.752 0l-5.248-3.104C4.584 17.077 4 16.038 4 15.105v-6.21c0-.936.587-1.973 1.376-2.44m6.99-1.314c-.165-.098-.566-.098-.733 0L6.385 8.245c-.166.098-.367.454-.367.65v6.21c0 .195.2.551.367.65l5.248 3.104c.166.098.567.098.734 0l5.248-3.104c.166-.098.367-.454.367-.65v-6.21c0-.195-.2-.551-.367-.65z"/><path d="M12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8m0-2a2 2 0 1 0 0-4 2 2 0 0 0 0 4"/></g></svg>`
-}, props, {
-  newIcon: _app.default
-}));
+}, props));
 AddonIcon.displayName = 'AddonIcon';
 var _default = exports.default = AddonIcon;

package/glyph/app-access.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _personAdded = _interopRequireDefault(require("@atlaskit/icon/core/person-added"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AppAccessIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const AppAccessIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><g fill-rule="evenodd"><path fill="currentcolor" d="M12.682 12H5.01A2.006 2.006 0 0 0 3 14v4.446c0 2.162 4.836 2.951 8.368 2.368A5.98 5.98 0 0 1 10 17a6 6 0 0 1 2.682-5"/><circle cx="9" cy="7" r="4" fill="currentcolor"/><circle cx="16" cy="17" r="5" fill="currentcolor"/><path fill="inherit" d="M14.674 19.331c.36.36.941.36 1.3 0l2.758-2.763a.92.92 0 0 0-1.301-1.298l-2.108 2.11-.755-.754a.92.92 0 0 0-1.3 1.3z"/></g></svg>`
-}, props, {
-  newIcon: _personAdded.default
-}));
+}, props));
 AppAccessIcon.displayName = 'AppAccessIcon';
 var _default = exports.default = AppAccessIcon;

package/glyph/app-switcher.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _appSwitcher = _interopRequireDefault(require("@atlaskit/icon/core/app-switcher"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AppSwitcherIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const AppSwitcherIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><path fill="currentcolor" fill-rule="evenodd" d="M4 5.01C4 4.451 4.443 4 5.01 4h1.98C7.549 4 8 4.443 8 5.01v1.98C8 7.549 7.557 8 6.99 8H5.01C4.451 8 4 7.557 4 6.99zm0 6c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98C8 13.549 7.557 14 6.99 14H5.01C4.451 14 4 13.557 4 12.99zm6-6c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98C14 7.549 13.557 8 12.99 8h-1.98C10.451 8 10 7.557 10 6.99zm0 6c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98c0 .558-.443 1.01-1.01 1.01h-1.98c-.558 0-1.01-.443-1.01-1.01zm6-6c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98C20 7.549 19.557 8 18.99 8h-1.98C16.451 8 16 7.557 16 6.99zm0 6c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98c0 .558-.443 1.01-1.01 1.01h-1.98c-.558 0-1.01-.443-1.01-1.01zm-12 6c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98C8 19.549 7.557 20 6.99 20H5.01C4.451 20 4 19.557 4 18.99zm6 0c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98c0 .558-.443 1.01-1.01 1.01h-1.98c-.558 0-1.01-.443-1.01-1.01zm6 0c0-.558.443-1.01 1.01-1.01h1.98c.558 0 1.01.443 1.01 1.01v1.98c0 .558-.443 1.01-1.01 1.01h-1.98c-.558 0-1.01-.443-1.01-1.01z"/></svg>`
-}, props, {
-  newIcon: _appSwitcher.default
-}));
+}, props));
 AppSwitcherIcon.displayName = 'AppSwitcherIcon';
 var _default = exports.default = AppSwitcherIcon;

package/glyph/archive.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _archiveBox = _interopRequireDefault(require("@atlaskit/icon/core/archive-box"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ArchiveIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const ArchiveIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><path fill="currentcolor" fill-rule="evenodd" d="M19 3H4.85A2 2 0 0 0 3 5v4h1v10.45A1.67 1.67 0 0 0 5.77 21h12.46A1.67 1.67 0 0 0 20 19.45V9h1V5a2 2 0 0 0-2-2m-1 16H6V9h12zm1-12H5V5h14zm-4 7H9v-2h6z" clip-rule="evenodd"/></svg>`
-}, props, {
-  newIcon: _archiveBox.default
-}));
+}, props));
 ArchiveIcon.displayName = 'ArchiveIcon';
 var _default = exports.default = ArchiveIcon;

package/glyph/arrow-down-circle.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _arrowDown = _interopRequireDefault(require("@atlaskit/icon/core/arrow-down"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ArrowDownCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const ArrowDownCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><g fill-rule="evenodd"><circle cx="12" cy="12" r="10" fill="currentcolor" fill-rule="nonzero"/><path fill="inherit" d="M10.994 8v5.586l-1.279-1.272a1.01 1.01 0 0 0-1.421 0 1 1 0 0 0 0 1.416l2.994 2.977a1.01 1.01 0 0 0 1.423 0l2.994-2.977a1 1 0 0 0 0-1.416 1.01 1.01 0 0 0-1.421 0l-1.279 1.272V8c0-.552-.45-1-1.005-1s-1.006.448-1.006 1"/></g></svg>`
-}, props, {
-  newIcon: _arrowDown.default
-}));
+}, props));
 ArrowDownCircleIcon.displayName = 'ArrowDownCircleIcon';
 var _default = exports.default = ArrowDownCircleIcon;

package/glyph/arrow-down.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _arrowDown = _interopRequireDefault(require("@atlaskit/icon/core/arrow-down"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ArrowDownIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const ArrowDownIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><path fill="currentcolor" fill-rule="evenodd" d="M11 6v9.586l-3.793-3.793a1 1 0 0 0-1.414 0c-.39.39-.39 1.024 0 1.415l5.5 5.499A1 1 0 0 0 12 19a1 1 0 0 0 .707-.293l5.5-5.499a1 1 0 1 0-1.414-1.415L13 15.586V6a1 1 0 0 0-2 0"/></svg>`
-}, props, {
-  newIcon: _arrowDown.default
-}));
+}, props));
 ArrowDownIcon.displayName = 'ArrowDownIcon';
 var _default = exports.default = ArrowDownIcon;

package/glyph/arrow-left-circle.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _arrowLeft = _interopRequireDefault(require("@atlaskit/icon/core/arrow-left"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ArrowLeftCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const ArrowLeftCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><circle cx="12" cy="12" r="10" fill="currentcolor"/><path fill="inherit" d="M16 10.995h-5.586l1.272-1.279a1.01 1.01 0 0 0 0-1.421.996.996 0 0 0-1.415 0l-2.978 2.994a1.01 1.01 0 0 0 0 1.423l2.978 2.993a1 1 0 0 0 1.415 0 1.01 1.01 0 0 0 0-1.421l-1.272-1.279H16c.552 0 1-.45 1-1.005s-.448-1.005-1-1.005"/></svg>`
-}, props, {
-  newIcon: _arrowLeft.default
-}));
+}, props));
 ArrowLeftCircleIcon.displayName = 'ArrowLeftCircleIcon';
 var _default = exports.default = ArrowLeftCircleIcon;

package/glyph/arrow-left.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _arrowLeft = _interopRequireDefault(require("@atlaskit/icon/core/arrow-left"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ArrowLeftIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const ArrowLeftIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><path fill="currentcolor" fill-rule="evenodd" d="M12.207 5.793a1 1 0 0 1 0 1.414L8.414 11H18a1 1 0 1 1 0 2H8.414l3.793 3.793a1 1 0 1 1-1.415 1.414l-5.499-5.5A1 1 0 0 1 5 12.028v-.057a1 1 0 0 1 .293-.678l5.499-5.5a1 1 0 0 1 1.415 0" clip-rule="evenodd"/></svg>`
-}, props, {
-  newIcon: _arrowLeft.default
-}));
+}, props));
 ArrowLeftIcon.displayName = 'ArrowLeftIcon';
 var _default = exports.default = ArrowLeftIcon;

package/glyph/arrow-right-circle.js

@@ -6,12 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _base = require("@atlaskit/icon/base");
-var _arrowRight = _interopRequireDefault(require("@atlaskit/icon/core/arrow-right"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ArrowRightCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.IconFacade, Object.assign({
+const ArrowRightCircleIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
   dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><g fill-rule="evenodd"><circle cx="12" cy="12" r="10" fill="currentcolor" fill-rule="nonzero"/><path fill="inherit" d="M12.314 8.294a1.01 1.01 0 0 0 0 1.422l1.271 1.279H8c-.553 0-1.001.45-1.001 1.005S7.447 13.005 8 13.005h5.585l-1.271 1.279a1.01 1.01 0 0 0 0 1.422 1 1 0 0 0 1.415 0l2.978-2.995a1.01 1.01 0 0 0 0-1.422l-2.978-2.995a1 1 0 0 0-1.415 0"/></g></svg>`
-}, props, {
-  newIcon: _arrowRight.default
-}));
+}, props));
 ArrowRightCircleIcon.displayName = 'ArrowRightCircleIcon';
 var _default = exports.default = ArrowRightCircleIcon;