@atlaskit/icon 28.2.1 → 28.3.0

package/dist/esm/components/icon-tile/index.js

@@ -0,0 +1,78 @@
+import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
+// Import both versions
+import IconTileNew from './icon-tile-new';
+import IconTileOld from './icon-tile-old';
+
+// Color mapping for size 16 standalone icons that will no longer be tiles
+var appearanceToIconColorMap = {
+  blue: "var(--ds-icon-accent-blue, #1D7AFC)",
+  blueBold: "var(--ds-icon-accent-blue, #1D7AFC)",
+  gray: "var(--ds-icon-accent-gray, #758195)",
+  grayBold: "var(--ds-icon-accent-gray, #758195)",
+  green: "var(--ds-icon-accent-green, #22A06B)",
+  greenBold: "var(--ds-icon-accent-green, #22A06B)",
+  lime: "var(--ds-icon-accent-lime, #6A9A23)",
+  limeBold: "var(--ds-icon-accent-lime, #6A9A23)",
+  magenta: "var(--ds-icon-accent-magenta, #CD519D)",
+  magentaBold: "var(--ds-icon-accent-magenta, #CD519D)",
+  orange: "var(--ds-icon-accent-orange, #E56910)",
+  orangeBold: "var(--ds-icon-accent-orange, #E56910)",
+  purple: "var(--ds-icon-accent-purple, #8270DB)",
+  purpleBold: "var(--ds-icon-accent-purple, #8270DB)",
+  red: "var(--ds-icon-accent-red, #C9372C)",
+  redBold: "var(--ds-icon-accent-red, #C9372C)",
+  teal: "var(--ds-icon-accent-teal, #2898BD)",
+  tealBold: "var(--ds-icon-accent-teal, #2898BD)",
+  yellow: "var(--ds-icon-accent-yellow, #B38600)",
+  yellowBold: "var(--ds-icon-accent-yellow, #B38600)"
+};
+
+/**
+ * __IconTile__
+ *
+ * An icon with background shape, color, and size properties determined by Tile.
+ */
+export default function IconTile(_ref) {
+  var appearance = _ref.appearance,
+    Icon = _ref.icon,
+    label = _ref.label,
+    size = _ref.size,
+    testId = _ref.testId,
+    shape = _ref.shape,
+    LEGACY_fallbackComponent = _ref.LEGACY_fallbackComponent,
+    UNSAFE_circleReplacementComponent = _ref.UNSAFE_circleReplacementComponent;
+  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+  if (LEGACY_fallbackComponent && !fg('platform-visual-refresh-icons')) {
+    return LEGACY_fallbackComponent;
+  }
+  if (UNSAFE_circleReplacementComponent && shape === 'circle' && fg('platform_dst_icon_tile_circle_replacement')) {
+    return UNSAFE_circleReplacementComponent;
+  }
+  if (shape !== 'circle' && fg('platform_dst_new_icon_tile')) {
+    // Handle size 16 - render icon directly without Tile
+    if (size === '16') {
+      return /*#__PURE__*/React.createElement(Icon, {
+        color: appearanceToIconColorMap[appearance],
+        label: label,
+        testId: testId
+      });
+    }
+    return /*#__PURE__*/React.createElement(IconTileNew, {
+      appearance: appearance,
+      icon: Icon,
+      label: label,
+      shape: shape,
+      size: size,
+      testId: testId
+    });
+  }
+  return /*#__PURE__*/React.createElement(IconTileOld, {
+    appearance: appearance,
+    icon: Icon,
+    label: label,
+    shape: shape,
+    size: size,
+    testId: testId
+  });
+}

package/dist/esm/components/icon.js

@@ -1,4 +1,4 @@
-/* icon.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* icon.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import "./icon.compiled.css";

package/dist/esm/components/skeleton.js

@@ -1,4 +1,4 @@
-/* skeleton.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* skeleton.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./skeleton.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/components/svg.js

@@ -1,4 +1,4 @@
-/* svg.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* svg.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./svg.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/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::736757b9fbc08cfe04a0dfd387060116>>
+ * @codegen <<SignedSource::ee18f4e5865068325a476701d51323b5>>
  * @codegenCommand yarn build:icon-glyphs
  */
 
@@ -511,7 +511,7 @@ var metadata = {
     package: '@atlaskit/icon/core/cash',
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Known usages: 'Sales' work type.",
+    usage: "Known usages: \'Sales\' work type.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -1111,7 +1111,7 @@ var metadata = {
     package: '@atlaskit/icon/core/devices',
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Known usages: 'Asset' work type.",
+    usage: "Known usages: \'Asset\' work type.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -1204,7 +1204,7 @@ var metadata = {
     oldName: ['editor/emoji', 'emoji/emoji', 'emoji', 'emoji/people'],
     type: 'core',
     categorization: 'single-purpose',
-    usage: "Single purpose - Reserved for Editor as a category for Emoji's.",
+    usage: "Single purpose - Reserved for Editor as a category for Emoji\'s.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -1417,7 +1417,7 @@ var metadata = {
     oldName: ['document-filled', 'document', 'editor/file', 'file'],
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Multi purpose - Known uses: document, file. Do not use to represent a page — use the dedicated 'Page' icon instead.",
+    usage: "Multi purpose - Known uses: document, file. Do not use to represent a page — use the dedicated \'Page\' icon instead.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -1428,7 +1428,7 @@ var metadata = {
     oldName: ['documents'],
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Multi purpose - Known uses: documents, files. Do not use to represent pages — use the dedicated 'Pages' icon instead.",
+    usage: "Multi purpose - Known uses: documents, files. Do not use to represent pages — use the dedicated \'Pages\' icon instead.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -1713,7 +1713,7 @@ var metadata = {
     oldName: ['tray'],
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Multi purpose - Known uses: 'Your work' in Confluence, inbox, mail.",
+    usage: "Multi purpose - Known uses: \'Your work\' in Confluence, inbox, mail.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -1739,7 +1739,7 @@ var metadata = {
       location: '@atlaskit/icon'
     },
     categorization: 'single-purpose',
-    usage: "Reserved for information statuses and messaging.  Filled status icons provide higher visual contrast to draw attention to important information. For information tooltips, use the unfilled 'information circle' icon.",
+    usage: "Reserved for information statuses and messaging.  Filled status icons provide higher visual contrast to draw attention to important information. For information tooltips, use the unfilled \'information circle\' icon.",
     team: 'Design System Team',
     status: 'deprecated'
   },
@@ -1901,7 +1901,7 @@ var metadata = {
     package: '@atlaskit/icon/core/list-checklist',
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Known usages: Checklist, 'Requirement' work type.",
+    usage: "Known usages: Checklist, \'Requirement\' work type.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -2115,7 +2115,7 @@ var metadata = {
     package: '@atlaskit/icon/core/minus-square',
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Known usages: 'Remove feature' work type.",
+    usage: "Known usages: \'Remove feature\' work type.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -2272,7 +2272,7 @@ var metadata = {
     package: '@atlaskit/icon/core/pen',
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Known usages: 'Design task' work type.",
+    usage: "Known usages: \'Design task\' work type.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -2400,7 +2400,7 @@ var metadata = {
     oldName: ['issue-raise'],
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Known usages: 'New feature' work type.",
+    usage: "Known usages: \'New feature\' work type.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -3073,7 +3073,7 @@ var metadata = {
     oldName: ['editor/info', 'editor/panel', 'info'],
     type: 'core',
     categorization: 'single-purpose',
-    usage: "Reserved for information statuses and messaging.  Filled status icons provide higher visual contrast to draw attention to important information. For information tooltips, use the unfilled 'information circle' icon.",
+    usage: "Reserved for information statuses and messaging.  Filled status icons provide higher visual contrast to draw attention to important information. For information tooltips, use the unfilled \'information circle\' icon.",
     team: 'Design System Team',
     status: 'published'
   },
@@ -3617,7 +3617,7 @@ var metadata = {
     package: '@atlaskit/icon/core/tools',
     type: 'core',
     categorization: 'multi-purpose',
-    usage: "Known usages: 'Service request' Jira work type.",
+    usage: "Known usages: \'Service request\' Jira work type.",
     team: 'Design System Team',
     status: 'published'
   },

package/dist/esm/metadata.js

@@ -6,7 +6,7 @@ var _excluded = ["packageLoader"];
  *
  * To change the format of this file, modify `createIconDocs` in icon-build-process/src/create-icon-docs.tsx.
  *
- * @codegen <<SignedSource::505188bcbfbd2bedd523b7a93366dd82>>
+ * @codegen <<SignedSource::5b9b70e1898d13b76e8faef592720556>>
  * @codegenCommand yarn build:icon-glyphs
  */
 /* eslint-disable import/no-extraneous-dependencies -- This import is within the same package, hence self-referential. */

package/dist/types/components/icon-tile/icon-tile-new.d.ts

@@ -0,0 +1,7 @@
+import { type IconTileProps } from '../../types';
+/**
+ * __IconTile__
+ *
+ * An icon with background shape, color, and size properties determined by Tile.
+ */
+export default function IconTileNew(props: IconTileProps): JSX.Element;

package/dist/types/components/icon-tile/icon-tile-old.d.ts

@@ -0,0 +1,7 @@
+import { type IconTileProps } from '../../types';
+/**
+ * __IconTile__
+ *
+ * An icon with background shape, color, and size properties determined by Tile.
+ */
+export default function IconTile(props: IconTileProps): JSX.Element;

package/dist/types/components/icon-tile/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { type IconTileProps } from '../../types';
+/**
+ * __IconTile__
+ *
+ * An icon with background shape, color, and size properties determined by Tile.
+ */
+export default function IconTile({ appearance, icon: Icon, label, size, testId, shape, LEGACY_fallbackComponent, UNSAFE_circleReplacementComponent, }: IconTileProps): React.JSX.Element;

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

@@ -1 +1 @@
-export type { CustomGlyphProps, GlyphProps, IconProps, Size, SkeletonProps, SVGProps, NewIconProps, NewGlyphColorProps, NewUtilityIconProps, NewCoreIconProps, IconMigrationMap, IconSpacing, } from '../types';
+export type { CustomGlyphProps, GlyphProps, IconProps, Size, SkeletonProps, SVGProps, NewIconProps, NewGlyphColorProps, NewUtilityIconProps, NewCoreIconProps, IconMigrationMap, IconSpacing, IconTileProps, } from '../types';

package/dist/types/metadata-core.d.ts

@@ -3,7 +3,7 @@
  *
  * To change the format of this file, modify `createIconDocsNew` in icon-build-process/src/create-icon-docs.tsx.
  *
- * @codegen <<SignedSource::736757b9fbc08cfe04a0dfd387060116>>
+ * @codegen <<SignedSource::ee18f4e5865068325a476701d51323b5>>
  * @codegenCommand yarn build:icon-glyphs
  */
 interface metadata {

package/dist/types/metadata.d.ts

@@ -3,7 +3,7 @@
  *
  * To change the format of this file, modify `createIconDocs` in icon-build-process/src/create-icon-docs.tsx.
  *
- * @codegen <<SignedSource::505188bcbfbd2bedd523b7a93366dd82>>
+ * @codegen <<SignedSource::5b9b70e1898d13b76e8faef592720556>>
  * @codegenCommand yarn build:icon-glyphs
  */
 interface Data {
@@ -15,11 +15,5 @@ interface Data {
     }>;
 }
 export declare const metaDataWithPackageLoader: Record<string, Data>;
-declare const metaData: {
-    [k: string]: {
-        keywords: string[];
-        componentName: string;
-        package: string;
-    };
-};
+declare const metaData: Record<string, Omit<Data, 'packageLoader'>>;
 export default metaData;

package/dist/types/types.d.ts

@@ -183,7 +183,9 @@ export type NewUtilityIconProps = Omit<UNSAFE_NewUtilityGlyphProps, 'dangerously
 export type UNSAFE_NewGlyphProps = UNSAFE_NewUtilityGlyphProps | UNSAFE_NewCoreGlyphProps;
 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 type NewIconTileSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+export type LegacyIconTileSize = '16' | '24' | '32' | '40' | '48';
+export type IconTileSize = NewIconTileSize | LegacyIconTileSize;
 export interface IconTileProps {
     /**
      * The icon to display
@@ -198,18 +200,39 @@ export interface IconTileProps {
      */
     appearance: IconTileAppearance;
     /**
-     * Size of the tile, in pixels. Defaults to "24".
-     * In a future release, semantic names will be introduced, and number values will be deprecated.
+     * Size of the tile, in pixels. Defaults to `24`.
+     *
+     * Now supports both semantic t-shirt size names and pixel number values. Pixel number values are deprecated and will be removed in a future release, however they will both be available and backwards-compatible during a transition period.
+     *
+     * Size `16` will not have a replacement after deprecation, and should be replaced with direct icons without a tile or enlarging to the next available size `xsmall`.
+     *
+     * All available sizes:
+     * - `16` (deprecated)
+     * - `xsmall` (new)
+     * - `small` or `24`
+     * - `medium` or `32`
+     * - `large` or `40`
+     * - `xlarge` or `48`
      */
     size?: IconTileSize;
     /**
      * Shape of the tile background. Defaults to "square"
+     * @deprecated Circle shape is deprecated and will be removed in a future version. Consider migrating to alternatives such as a square tile, or an `IconButton` for interactive elements.
+     * If necessary, the only way to retain a circle appearance is to rebuild the component custom using ADS primitives. The prop `UNSAFE_circleReplacementComponent` can be used to
+     * implement alternatives.
      */
     shape?: 'square' | 'circle';
     /**
      * Legacy component to render when the icon refresh feature flag is turned off.
+     * @deprecated This prop is deprecated and will be removed in a future version.
      */
     LEGACY_fallbackComponent?: ReactElement;
+    /**
+     * A component to render in place of circle shaped icon tiles, swapped out with a feature flag.
+     *
+     * This prop is temporary, and will be used by ADS to safely rollout alternatives as circle shaped icon tiles are deprecated.
+     */
+    UNSAFE_circleReplacementComponent?: ReactElement;
     /**
      * A unique string that appears as a data attribute `data-testid` in the rendered code,
      * serving as a hook for automated tests.

package/dist/types-ts4.5/components/icon-tile/icon-tile-new.d.ts

@@ -0,0 +1,7 @@
+import { type IconTileProps } from '../../types';
+/**
+ * __IconTile__
+ *
+ * An icon with background shape, color, and size properties determined by Tile.
+ */
+export default function IconTileNew(props: IconTileProps): JSX.Element;

package/dist/types-ts4.5/components/icon-tile/icon-tile-old.d.ts

@@ -0,0 +1,7 @@
+import { type IconTileProps } from '../../types';
+/**
+ * __IconTile__
+ *
+ * An icon with background shape, color, and size properties determined by Tile.
+ */
+export default function IconTile(props: IconTileProps): JSX.Element;

package/dist/types-ts4.5/components/icon-tile/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { type IconTileProps } from '../../types';
+/**
+ * __IconTile__
+ *
+ * An icon with background shape, color, and size properties determined by Tile.
+ */
+export default function IconTile({ appearance, icon: Icon, label, size, testId, shape, LEGACY_fallbackComponent, UNSAFE_circleReplacementComponent, }: IconTileProps): React.JSX.Element;

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

@@ -1 +1 @@
-export type { CustomGlyphProps, GlyphProps, IconProps, Size, SkeletonProps, SVGProps, NewIconProps, NewGlyphColorProps, NewUtilityIconProps, NewCoreIconProps, IconMigrationMap, IconSpacing, } from '../types';
+export type { CustomGlyphProps, GlyphProps, IconProps, Size, SkeletonProps, SVGProps, NewIconProps, NewGlyphColorProps, NewUtilityIconProps, NewCoreIconProps, IconMigrationMap, IconSpacing, IconTileProps, } from '../types';

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

@@ -3,7 +3,7 @@
  *
  * To change the format of this file, modify `createIconDocsNew` in icon-build-process/src/create-icon-docs.tsx.
  *
- * @codegen <<SignedSource::736757b9fbc08cfe04a0dfd387060116>>
+ * @codegen <<SignedSource::ee18f4e5865068325a476701d51323b5>>
  * @codegenCommand yarn build:icon-glyphs
  */
 interface metadata {

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

@@ -3,7 +3,7 @@
  *
  * To change the format of this file, modify `createIconDocs` in icon-build-process/src/create-icon-docs.tsx.
  *
- * @codegen <<SignedSource::505188bcbfbd2bedd523b7a93366dd82>>
+ * @codegen <<SignedSource::5b9b70e1898d13b76e8faef592720556>>
  * @codegenCommand yarn build:icon-glyphs
  */
 interface Data {
@@ -15,11 +15,5 @@ interface Data {
     }>;
 }
 export declare const metaDataWithPackageLoader: Record<string, Data>;
-declare const metaData: {
-    [k: string]: {
-        keywords: string[];
-        componentName: string;
-        package: string;
-    };
-};
+declare const metaData: Record<string, Omit<Data, 'packageLoader'>>;
 export default metaData;

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

@@ -183,7 +183,9 @@ export type NewUtilityIconProps = Omit<UNSAFE_NewUtilityGlyphProps, 'dangerously
 export type UNSAFE_NewGlyphProps = UNSAFE_NewUtilityGlyphProps | UNSAFE_NewCoreGlyphProps;
 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 type NewIconTileSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+export type LegacyIconTileSize = '16' | '24' | '32' | '40' | '48';
+export type IconTileSize = NewIconTileSize | LegacyIconTileSize;
 export interface IconTileProps {
     /**
      * The icon to display
@@ -198,18 +200,39 @@ export interface IconTileProps {
      */
     appearance: IconTileAppearance;
     /**
-     * Size of the tile, in pixels. Defaults to "24".
-     * In a future release, semantic names will be introduced, and number values will be deprecated.
+     * Size of the tile, in pixels. Defaults to `24`.
+     *
+     * Now supports both semantic t-shirt size names and pixel number values. Pixel number values are deprecated and will be removed in a future release, however they will both be available and backwards-compatible during a transition period.
+     *
+     * Size `16` will not have a replacement after deprecation, and should be replaced with direct icons without a tile or enlarging to the next available size `xsmall`.
+     *
+     * All available sizes:
+     * - `16` (deprecated)
+     * - `xsmall` (new)
+     * - `small` or `24`
+     * - `medium` or `32`
+     * - `large` or `40`
+     * - `xlarge` or `48`
      */
     size?: IconTileSize;
     /**
      * Shape of the tile background. Defaults to "square"
+     * @deprecated Circle shape is deprecated and will be removed in a future version. Consider migrating to alternatives such as a square tile, or an `IconButton` for interactive elements.
+     * If necessary, the only way to retain a circle appearance is to rebuild the component custom using ADS primitives. The prop `UNSAFE_circleReplacementComponent` can be used to
+     * implement alternatives.
      */
     shape?: 'square' | 'circle';
     /**
      * Legacy component to render when the icon refresh feature flag is turned off.
+     * @deprecated This prop is deprecated and will be removed in a future version.
      */
     LEGACY_fallbackComponent?: ReactElement;
+    /**
+     * A component to render in place of circle shaped icon tiles, swapped out with a feature flag.
+     *
+     * This prop is temporary, and will be used by ADS to safely rollout alternatives as circle shaped icon tiles are deprecated.
+     */
+    UNSAFE_circleReplacementComponent?: ReactElement;
     /**
      * A unique string that appears as a data attribute `data-testid` in the rendered code,
      * serving as a hook for automated tests.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/icon",
-	"version": "28.2.1",
+	"version": "28.3.0",
 	"description": "An icon is a symbol representing a command, device, directory, or common action.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -46,7 +46,7 @@
 					"id": "icon-tile",
 					"status": {
 						"type": "open-alpha",
-						"description": "This is an experiment. We may make frequent breaking changes with limited notice."
+						"description": "This is an experiment. We are in the process of making breaking changes."
 					},
 					"sortKey": 2
 				},
@@ -96,6 +96,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/platform-feature-flags": "^1.1.0",
+		"@atlaskit/tile": "^0.1.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@babel/register": "^7.25.9",
 		"@babel/runtime": "^7.0.0",
@@ -113,8 +114,8 @@
 		"@atlaskit/code": "^17.2.0",
 		"@atlaskit/css": "^0.14.0",
 		"@atlaskit/docs": "^11.1.0",
-		"@atlaskit/ds-lib": "^5.0.0",
-		"@atlaskit/form": "^12.7.0",
+		"@atlaskit/ds-lib": "^5.1.0",
+		"@atlaskit/form": "^14.0.0",
 		"@atlaskit/heading": "^5.2.0",
 		"@atlaskit/icon-file-type": "^7.0.0",
 		"@atlaskit/icon-object": "^7.2.0",
@@ -122,12 +123,13 @@
 		"@atlaskit/logo": "^19.7.0",
 		"@atlaskit/menu": "^8.4.0",
 		"@atlaskit/modal-dialog": "^14.3.0",
-		"@atlaskit/primitives": "^14.14.0",
+		"@atlaskit/primitives": "^14.15.0",
 		"@atlaskit/section-message": "^8.7.0",
 		"@atlaskit/textfield": "^8.0.0",
 		"@atlaskit/theme": "^21.0.0",
 		"@atlaskit/toggle": "^15.1.0",
 		"@atlaskit/tooltip": "^20.4.0",
+		"@atlassian/feature-flags-test-utils": "^0.3.0",
 		"@atlassian/ssr-tests": "^0.3.0",
 		"@babel/core": "7.24.9",
 		"@codeshift/utils": "^0.2.4",
@@ -192,6 +194,12 @@
 		},
 		"platform-visual-refresh-icons-facade-button-fix": {
 			"type": "boolean"
+		},
+		"platform_dst_new_icon_tile": {
+			"type": "boolean"
+		},
+		"platform_dst_icon_tile_circle_replacement": {
+			"type": "boolean"
 		}
 	}
 }

package/utils/logo-icons.tsx

@@ -3,55 +3,55 @@ Unlike its sister icon info files, this one is manually curated
 */
 
 import {
-  AtlassianIcon,
-  BitbucketIcon,
-  ConfluenceIcon,
-  JiraSoftwareIcon,
-  JiraIcon,
-  StatuspageIcon,
+	AtlassianIcon,
+	BitbucketIcon,
+	ConfluenceIcon,
+	JiraSoftwareIcon,
+	JiraIcon,
+	StatuspageIcon,
 } from '@atlaskit/logo';
 
 export default {
-  AtlassianIcon: {
-    componentName: 'AtlassianIcon',
-    isNamedImport: true,
-    component: AtlassianIcon,
-    keywords: ['product', 'logo', 'atlassian'],
-    package: '@atlaskit/logo',
-  },
-  BitbucketIcon: {
-    componentName: 'BitbucketIcon',
-    isNamedImport: true,
-    component: BitbucketIcon,
-    keywords: ['product', 'logo', 'bitbucket'],
-    package: '@atlaskit/logo',
-  },
-  ConfluenceIcon: {
-    componentName: 'ConfluenceIcon',
-    isNamedImport: true,
-    component: ConfluenceIcon,
-    keywords: ['product', 'logo', 'confluence'],
-    package: '@atlaskit/logo',
-  },
-  JiraSoftwareIcon: {
-    componentName: 'JiraSoftwareIcon',
-    isNamedImport: true,
-    component: JiraSoftwareIcon,
-    keywords: ['product', 'logo', 'jira', 'software'],
-    package: '@atlaskit/logo',
-  },
-  JiraIcon: {
-    componentName: 'JiraIcon',
-    isNamedImport: true,
-    component: JiraIcon,
-    keywords: ['product', 'logo', 'jira'],
-    package: '@atlaskit/logo',
-  },
-  StatuspageIcon: {
-    componentName: 'StatuspageIcon',
-    isNamedImport: true,
-    component: StatuspageIcon,
-    keywords: ['product', 'logo', 'statuspage'],
-    package: '@atlaskit/logo',
-  },
+	AtlassianIcon: {
+		componentName: 'AtlassianIcon',
+		isNamedImport: true,
+		component: AtlassianIcon,
+		keywords: ['product', 'app', 'logo', 'atlassian'],
+		package: '@atlaskit/logo',
+	},
+	BitbucketIcon: {
+		componentName: 'BitbucketIcon',
+		isNamedImport: true,
+		component: BitbucketIcon,
+		keywords: ['product', 'app', 'logo', 'bitbucket'],
+		package: '@atlaskit/logo',
+	},
+	ConfluenceIcon: {
+		componentName: 'ConfluenceIcon',
+		isNamedImport: true,
+		component: ConfluenceIcon,
+		keywords: ['product', 'app', 'logo', 'confluence'],
+		package: '@atlaskit/logo',
+	},
+	JiraSoftwareIcon: {
+		componentName: 'JiraSoftwareIcon',
+		isNamedImport: true,
+		component: JiraSoftwareIcon,
+		keywords: ['product', 'app', 'logo', 'jira', 'software'],
+		package: '@atlaskit/logo',
+	},
+	JiraIcon: {
+		componentName: 'JiraIcon',
+		isNamedImport: true,
+		component: JiraIcon,
+		keywords: ['product', 'app', 'logo', 'jira'],
+		package: '@atlaskit/logo',
+	},
+	StatuspageIcon: {
+		componentName: 'StatuspageIcon',
+		isNamedImport: true,
+		component: StatuspageIcon,
+		keywords: ['product', 'app', 'logo', 'statuspage'],
+		package: '@atlaskit/logo',
+	},
 };

package/dist/types/components/icon-tile.d.ts

@@ -1,11 +0,0 @@
-import { type IconTileProps } from '../types';
-/**
- * __IconTile__ -- ⚠️ Experimental ⚠️
- *
- * An icon tile is used to present an icon with a background color.
- * Icon tiles, unlike standard icons, can scale up and down to provide greater emphasis.
- *
- * This component is currently in an experimental state and is subject to change in minor or patch releases.
- *
- */
-export default function IconTile(props: IconTileProps): JSX.Element;