@metamask/design-system-react 0.18.0 → 0.19.0

package/CHANGELOG.md

@@ -7,6 +7,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.19.0]
+
+### Added
+
+- Added `Telegram` to the `IconName` set for use anywhere the React package accepts design system icons ([#1122](https://github.com/MetaMask/metamask-design-system/pull/1122))
+
+### Changed
+
+- **BREAKING:** Updated `AvatarIcon` exports to use shared const-object + string-union types rather than local enum-based definitions, aligning React with the shared cross-platform type contracts ([#996](https://github.com/MetaMask/metamask-design-system/pull/996))
+  - No migration required for typical usage; continue importing from `@metamask/design-system-react` as before.
+  - Runtime values remain stable while type definitions follow ADR-0003/ADR-0004.
+
 ## [0.18.0]
 
 ### Changed
@@ -257,7 +269,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Full TypeScript support with type definitions and enums
 - Tailwind CSS integration with design token support
 
-[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.18.0...HEAD
+[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.19.0...HEAD
+[0.19.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.18.0...@metamask/design-system-react@0.19.0
 [0.18.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.17.1...@metamask/design-system-react@0.18.0
 [0.17.1]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.17.0...@metamask/design-system-react@0.17.1
 [0.17.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.16.0...@metamask/design-system-react@0.17.0

package/dist/components/AvatarIcon/AvatarIcon.cjs

@@ -24,12 +24,12 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AvatarIcon = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const react_1 = __importStar(require("react"));
-const types_1 = require("../../types/index.cjs");
 const tw_merge_1 = require("../../utils/tw-merge.cjs");
 const AvatarBase_1 = require("../AvatarBase/index.cjs");
 const Icon_1 = require("../Icon/index.cjs");
 const AvatarIcon_constants_1 = require("./AvatarIcon.constants.cjs");
-exports.AvatarIcon = (0, react_1.forwardRef)(({ iconName, iconProps, size = types_1.AvatarIconSize.Md, severity = types_1.AvatarIconSeverity.Neutral, className, ...props }, ref) => (react_1.default.createElement(AvatarBase_1.AvatarBase, { ref: ref, shape: AvatarBase_1.AvatarBaseShape.Circle, size: size, className: (0, tw_merge_1.twMerge)(AvatarIcon_constants_1.TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR[severity], className), ...props }, iconName && (react_1.default.createElement(Icon_1.Icon, { name: iconName, size: AvatarIcon_constants_1.MAP_AVATARICON_SIZE_ICONSIZE[size], color: AvatarIcon_constants_1.MAP_AVATARICON_SEVERITY_ICONCOLOR[severity], ...iconProps })))));
+exports.AvatarIcon = (0, react_1.forwardRef)(({ iconName, iconProps, size = design_system_shared_1.AvatarIconSize.Md, severity = design_system_shared_1.AvatarIconSeverity.Neutral, className, ...props }, ref) => (react_1.default.createElement(AvatarBase_1.AvatarBase, { ref: ref, shape: AvatarBase_1.AvatarBaseShape.Circle, size: size, className: (0, tw_merge_1.twMerge)(AvatarIcon_constants_1.TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR[severity], className), ...props }, iconName && (react_1.default.createElement(Icon_1.Icon, { name: iconName, size: AvatarIcon_constants_1.MAP_AVATARICON_SIZE_ICONSIZE[size], color: AvatarIcon_constants_1.MAP_AVATARICON_SEVERITY_ICONCOLOR[severity], ...iconProps })))));
 exports.AvatarIcon.displayName = 'AvatarIcon';
 //# sourceMappingURL=AvatarIcon.cjs.map

package/dist/components/AvatarIcon/AvatarIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,iDAAiE;AACjE,uDAA+C;AAC/C,wDAA4D;AAC5D,4CAA+B;AAE/B,qEAIgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,QAAQ,GAAG,0BAAkB,CAAC,OAAO,EACrC,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE,CAAC,CACH,8BAAC,uBAAU,IACT,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,4BAAe,CAAC,MAAM,EAC7B,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,IAAA,kBAAO,EAChB,qEAA8C,CAAC,QAAQ,CAAC,EACxD,SAAS,CACV,KACG,KAAK,IAER,QAAQ,IAAI,CACX,8BAAC,WAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,mDAA4B,CAAC,IAAI,CAAC,EACxC,KAAK,EAAE,wDAAiC,CAAC,QAAQ,CAAC,KAC9C,SAAS,GACb,CACH,CACU,CACd,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { AvatarIconSize, AvatarIconSeverity } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { AvatarBase, AvatarBaseShape } from '../AvatarBase';\nimport { Icon } from '../Icon';\n\nimport {\n  MAP_AVATARICON_SIZE_ICONSIZE,\n  TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR,\n  MAP_AVATARICON_SEVERITY_ICONCOLOR,\n} from './AvatarIcon.constants';\nimport type { AvatarIconProps } from './AvatarIcon.types';\n\nexport const AvatarIcon = forwardRef<HTMLDivElement, AvatarIconProps>(\n  (\n    {\n      iconName,\n      iconProps,\n      size = AvatarIconSize.Md,\n      severity = AvatarIconSeverity.Neutral,\n      className,\n      ...props\n    },\n    ref,\n  ) => (\n    <AvatarBase\n      ref={ref}\n      shape={AvatarBaseShape.Circle}\n      size={size}\n      className={twMerge(\n        TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR[severity],\n        className,\n      )}\n      {...props}\n    >\n      {iconName && (\n        <Icon\n          name={iconName}\n          size={MAP_AVATARICON_SIZE_ICONSIZE[size]}\n          color={MAP_AVATARICON_SEVERITY_ICONCOLOR[severity]}\n          {...iconProps}\n        />\n      )}\n    </AvatarBase>\n  ),\n);\n\nAvatarIcon.displayName = 'AvatarIcon';\n"]}
+{"version":3,"file":"AvatarIcon.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yEAGwC;AACxC,+CAA0C;AAE1C,uDAA+C;AAC/C,wDAA4D;AAC5D,4CAA+B;AAE/B,qEAIgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,qCAAc,CAAC,EAAE,EACxB,QAAQ,GAAG,yCAAkB,CAAC,OAAO,EACrC,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE,CAAC,CACH,8BAAC,uBAAU,IACT,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,4BAAe,CAAC,MAAM,EAC7B,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,IAAA,kBAAO,EAChB,qEAA8C,CAAC,QAAQ,CAAC,EACxD,SAAS,CACV,KACG,KAAK,IAER,QAAQ,IAAI,CACX,8BAAC,WAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,mDAA4B,CAAC,IAAI,CAAC,EACxC,KAAK,EAAE,wDAAiC,CAAC,QAAQ,CAAC,KAC9C,SAAS,GACb,CACH,CACU,CACd,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import {\n  AvatarIconSeverity,\n  AvatarIconSize,\n} from '@metamask/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { AvatarBase, AvatarBaseShape } from '../AvatarBase';\nimport { Icon } from '../Icon';\n\nimport {\n  MAP_AVATARICON_SIZE_ICONSIZE,\n  TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR,\n  MAP_AVATARICON_SEVERITY_ICONCOLOR,\n} from './AvatarIcon.constants';\nimport type { AvatarIconProps } from './AvatarIcon.types';\n\nexport const AvatarIcon = forwardRef<HTMLDivElement, AvatarIconProps>(\n  (\n    {\n      iconName,\n      iconProps,\n      size = AvatarIconSize.Md,\n      severity = AvatarIconSeverity.Neutral,\n      className,\n      ...props\n    },\n    ref,\n  ) => (\n    <AvatarBase\n      ref={ref}\n      shape={AvatarBaseShape.Circle}\n      size={size}\n      className={twMerge(\n        TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR[severity],\n        className,\n      )}\n      {...props}\n    >\n      {iconName && (\n        <Icon\n          name={iconName}\n          size={MAP_AVATARICON_SIZE_ICONSIZE[size]}\n          color={MAP_AVATARICON_SEVERITY_ICONCOLOR[severity]}\n          {...iconProps}\n        />\n      )}\n    </AvatarBase>\n  ),\n);\n\nAvatarIcon.displayName = 'AvatarIcon';\n"]}

package/dist/components/AvatarIcon/AvatarIcon.constants.cjs

@@ -1,27 +1,27 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MAP_AVATARICON_SEVERITY_ICONCOLOR = exports.TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR = exports.MAP_AVATARICON_SIZE_ICONSIZE = void 0;
-const types_1 = require("../../types/index.cjs");
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const Icon_1 = require("../Icon/index.cjs");
 exports.MAP_AVATARICON_SIZE_ICONSIZE = {
-    [types_1.AvatarIconSize.Xs]: Icon_1.IconSize.Xs,
-    [types_1.AvatarIconSize.Sm]: Icon_1.IconSize.Sm,
-    [types_1.AvatarIconSize.Md]: Icon_1.IconSize.Md,
-    [types_1.AvatarIconSize.Lg]: Icon_1.IconSize.Lg,
-    [types_1.AvatarIconSize.Xl]: Icon_1.IconSize.Xl, // 48px avatar -> 32px icon
+    [design_system_shared_1.AvatarIconSize.Xs]: Icon_1.IconSize.Xs,
+    [design_system_shared_1.AvatarIconSize.Sm]: Icon_1.IconSize.Sm,
+    [design_system_shared_1.AvatarIconSize.Md]: Icon_1.IconSize.Md,
+    [design_system_shared_1.AvatarIconSize.Lg]: Icon_1.IconSize.Lg,
+    [design_system_shared_1.AvatarIconSize.Xl]: Icon_1.IconSize.Xl, // 48px avatar -> 32px icon
 };
 exports.TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR = {
-    [types_1.AvatarIconSeverity.Neutral]: 'bg-muted',
-    [types_1.AvatarIconSeverity.Info]: 'bg-info-muted',
-    [types_1.AvatarIconSeverity.Success]: 'bg-success-muted',
-    [types_1.AvatarIconSeverity.Error]: 'bg-error-muted',
-    [types_1.AvatarIconSeverity.Warning]: 'bg-warning-muted',
+    [design_system_shared_1.AvatarIconSeverity.Neutral]: 'bg-muted',
+    [design_system_shared_1.AvatarIconSeverity.Info]: 'bg-info-muted',
+    [design_system_shared_1.AvatarIconSeverity.Success]: 'bg-success-muted',
+    [design_system_shared_1.AvatarIconSeverity.Error]: 'bg-error-muted',
+    [design_system_shared_1.AvatarIconSeverity.Warning]: 'bg-warning-muted',
 };
 exports.MAP_AVATARICON_SEVERITY_ICONCOLOR = {
-    [types_1.AvatarIconSeverity.Neutral]: Icon_1.IconColor.IconAlternative,
-    [types_1.AvatarIconSeverity.Info]: Icon_1.IconColor.InfoDefault,
-    [types_1.AvatarIconSeverity.Success]: Icon_1.IconColor.SuccessDefault,
-    [types_1.AvatarIconSeverity.Error]: Icon_1.IconColor.ErrorDefault,
-    [types_1.AvatarIconSeverity.Warning]: Icon_1.IconColor.WarningDefault,
+    [design_system_shared_1.AvatarIconSeverity.Neutral]: Icon_1.IconColor.IconAlternative,
+    [design_system_shared_1.AvatarIconSeverity.Info]: Icon_1.IconColor.InfoDefault,
+    [design_system_shared_1.AvatarIconSeverity.Success]: Icon_1.IconColor.SuccessDefault,
+    [design_system_shared_1.AvatarIconSeverity.Error]: Icon_1.IconColor.ErrorDefault,
+    [design_system_shared_1.AvatarIconSeverity.Warning]: Icon_1.IconColor.WarningDefault,
 };
 //# sourceMappingURL=AvatarIcon.constants.cjs.map

package/dist/components/AvatarIcon/AvatarIcon.constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.constants.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":";;;AAAA,iDAAiE;AACjE,4CAA8C;AAEjC,QAAA,4BAA4B,GAAqC;IAC5E,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE,EAAE,2BAA2B;CAC9D,CAAC;AAEW,QAAA,8CAA8C,GAGvD;IACF,CAAC,0BAAkB,CAAC,OAAO,CAAC,EAAE,UAAU;IACxC,CAAC,0BAAkB,CAAC,IAAI,CAAC,EAAE,eAAe;IAC1C,CAAC,0BAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;IAChD,CAAC,0BAAkB,CAAC,KAAK,CAAC,EAAE,gBAAgB;IAC5C,CAAC,0BAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;CACjD,CAAC;AAEW,QAAA,iCAAiC,GAG1C;IACF,CAAC,0BAAkB,CAAC,OAAO,CAAC,EAAE,gBAAS,CAAC,eAAe;IACvD,CAAC,0BAAkB,CAAC,IAAI,CAAC,EAAE,gBAAS,CAAC,WAAW;IAChD,CAAC,0BAAkB,CAAC,OAAO,CAAC,EAAE,gBAAS,CAAC,cAAc;IACtD,CAAC,0BAAkB,CAAC,KAAK,CAAC,EAAE,gBAAS,CAAC,YAAY;IAClD,CAAC,0BAAkB,CAAC,OAAO,CAAC,EAAE,gBAAS,CAAC,cAAc;CACvD,CAAC","sourcesContent":["import { AvatarIconSize, AvatarIconSeverity } from '../../types';\nimport { IconSize, IconColor } from '../Icon';\n\nexport const MAP_AVATARICON_SIZE_ICONSIZE: Record<AvatarIconSize, IconSize> = {\n  [AvatarIconSize.Xs]: IconSize.Xs, // 16px avatar -> 12px icon\n  [AvatarIconSize.Sm]: IconSize.Sm, // 24px avatar -> 16px icon\n  [AvatarIconSize.Md]: IconSize.Md, // 32px avatar -> 20px icon\n  [AvatarIconSize.Lg]: IconSize.Lg, // 40px avatar -> 24px icon\n  [AvatarIconSize.Xl]: IconSize.Xl, // 48px avatar -> 32px icon\n};\n\nexport const TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR: Record<\n  AvatarIconSeverity,\n  string\n> = {\n  [AvatarIconSeverity.Neutral]: 'bg-muted',\n  [AvatarIconSeverity.Info]: 'bg-info-muted',\n  [AvatarIconSeverity.Success]: 'bg-success-muted',\n  [AvatarIconSeverity.Error]: 'bg-error-muted',\n  [AvatarIconSeverity.Warning]: 'bg-warning-muted',\n};\n\nexport const MAP_AVATARICON_SEVERITY_ICONCOLOR: Record<\n  AvatarIconSeverity,\n  IconColor\n> = {\n  [AvatarIconSeverity.Neutral]: IconColor.IconAlternative,\n  [AvatarIconSeverity.Info]: IconColor.InfoDefault,\n  [AvatarIconSeverity.Success]: IconColor.SuccessDefault,\n  [AvatarIconSeverity.Error]: IconColor.ErrorDefault,\n  [AvatarIconSeverity.Warning]: IconColor.WarningDefault,\n};\n"]}
+{"version":3,"file":"AvatarIcon.constants.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":";;;AAAA,yEAGwC;AAExC,4CAA8C;AAEjC,QAAA,4BAA4B,GAAqC;IAC5E,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE,EAAE,2BAA2B;CAC9D,CAAC;AAEW,QAAA,8CAA8C,GAGvD;IACF,CAAC,yCAAkB,CAAC,OAAO,CAAC,EAAE,UAAU;IACxC,CAAC,yCAAkB,CAAC,IAAI,CAAC,EAAE,eAAe;IAC1C,CAAC,yCAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;IAChD,CAAC,yCAAkB,CAAC,KAAK,CAAC,EAAE,gBAAgB;IAC5C,CAAC,yCAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;CACjD,CAAC;AAEW,QAAA,iCAAiC,GAG1C;IACF,CAAC,yCAAkB,CAAC,OAAO,CAAC,EAAE,gBAAS,CAAC,eAAe;IACvD,CAAC,yCAAkB,CAAC,IAAI,CAAC,EAAE,gBAAS,CAAC,WAAW;IAChD,CAAC,yCAAkB,CAAC,OAAO,CAAC,EAAE,gBAAS,CAAC,cAAc;IACtD,CAAC,yCAAkB,CAAC,KAAK,CAAC,EAAE,gBAAS,CAAC,YAAY;IAClD,CAAC,yCAAkB,CAAC,OAAO,CAAC,EAAE,gBAAS,CAAC,cAAc;CACvD,CAAC","sourcesContent":["import {\n  AvatarIconSeverity,\n  AvatarIconSize,\n} from '@metamask/design-system-shared';\n\nimport { IconSize, IconColor } from '../Icon';\n\nexport const MAP_AVATARICON_SIZE_ICONSIZE: Record<AvatarIconSize, IconSize> = {\n  [AvatarIconSize.Xs]: IconSize.Xs, // 16px avatar -> 12px icon\n  [AvatarIconSize.Sm]: IconSize.Sm, // 24px avatar -> 16px icon\n  [AvatarIconSize.Md]: IconSize.Md, // 32px avatar -> 20px icon\n  [AvatarIconSize.Lg]: IconSize.Lg, // 40px avatar -> 24px icon\n  [AvatarIconSize.Xl]: IconSize.Xl, // 48px avatar -> 32px icon\n};\n\nexport const TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR: Record<\n  AvatarIconSeverity,\n  string\n> = {\n  [AvatarIconSeverity.Neutral]: 'bg-muted',\n  [AvatarIconSeverity.Info]: 'bg-info-muted',\n  [AvatarIconSeverity.Success]: 'bg-success-muted',\n  [AvatarIconSeverity.Error]: 'bg-error-muted',\n  [AvatarIconSeverity.Warning]: 'bg-warning-muted',\n};\n\nexport const MAP_AVATARICON_SEVERITY_ICONCOLOR: Record<\n  AvatarIconSeverity,\n  IconColor\n> = {\n  [AvatarIconSeverity.Neutral]: IconColor.IconAlternative,\n  [AvatarIconSeverity.Info]: IconColor.InfoDefault,\n  [AvatarIconSeverity.Success]: IconColor.SuccessDefault,\n  [AvatarIconSeverity.Error]: IconColor.ErrorDefault,\n  [AvatarIconSeverity.Warning]: IconColor.WarningDefault,\n};\n"]}

package/dist/components/AvatarIcon/AvatarIcon.constants.d.cts

@@ -1,4 +1,4 @@
-import { AvatarIconSize, AvatarIconSeverity } from "../../types/index.cjs";
+import { AvatarIconSeverity, AvatarIconSize } from "@metamask/design-system-shared";
 import { IconSize, IconColor } from "../Icon/index.cjs";
 export declare const MAP_AVATARICON_SIZE_ICONSIZE: Record<AvatarIconSize, IconSize>;
 export declare const TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR: Record<AvatarIconSeverity, string>;

package/dist/components/AvatarIcon/AvatarIcon.constants.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.constants.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACjE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAE9C,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,cAAc,EAAE,QAAQ,CAMzE,CAAC;AAEF,eAAO,MAAM,8CAA8C,EAAE,MAAM,CACjE,kBAAkB,EAClB,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CACpD,kBAAkB,EAClB,SAAS,CAOV,CAAC"}
+{"version":3,"file":"AvatarIcon.constants.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,EACf,uCAAuC;AAExC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAE9C,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,cAAc,EAAE,QAAQ,CAMzE,CAAC;AAEF,eAAO,MAAM,8CAA8C,EAAE,MAAM,CACjE,kBAAkB,EAClB,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CACpD,kBAAkB,EAClB,SAAS,CAOV,CAAC"}

package/dist/components/AvatarIcon/AvatarIcon.constants.d.mts

@@ -1,4 +1,4 @@
-import { AvatarIconSize, AvatarIconSeverity } from "../../types/index.mjs";
+import { AvatarIconSeverity, AvatarIconSize } from "@metamask/design-system-shared";
 import { IconSize, IconColor } from "../Icon/index.mjs";
 export declare const MAP_AVATARICON_SIZE_ICONSIZE: Record<AvatarIconSize, IconSize>;
 export declare const TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR: Record<AvatarIconSeverity, string>;

package/dist/components/AvatarIcon/AvatarIcon.constants.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.constants.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACjE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAE9C,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,cAAc,EAAE,QAAQ,CAMzE,CAAC;AAEF,eAAO,MAAM,8CAA8C,EAAE,MAAM,CACjE,kBAAkB,EAClB,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CACpD,kBAAkB,EAClB,SAAS,CAOV,CAAC"}
+{"version":3,"file":"AvatarIcon.constants.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,EACf,uCAAuC;AAExC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAE9C,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,cAAc,EAAE,QAAQ,CAMzE,CAAC;AAEF,eAAO,MAAM,8CAA8C,EAAE,MAAM,CACjE,kBAAkB,EAClB,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CACpD,kBAAkB,EAClB,SAAS,CAOV,CAAC"}

package/dist/components/AvatarIcon/AvatarIcon.constants.mjs

@@ -1,4 +1,4 @@
-import { AvatarIconSize, AvatarIconSeverity } from "../../types/index.mjs";
+import { AvatarIconSeverity, AvatarIconSize } from "@metamask/design-system-shared";
 import { IconSize, IconColor } from "../Icon/index.mjs";
 export const MAP_AVATARICON_SIZE_ICONSIZE = {
     [AvatarIconSize.Xs]: IconSize.Xs,

package/dist/components/AvatarIcon/AvatarIcon.constants.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.constants.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACjE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAE9C,MAAM,CAAC,MAAM,4BAA4B,GAAqC;IAC5E,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE,EAAE,2BAA2B;CAC9D,CAAC;AAEF,MAAM,CAAC,MAAM,8CAA8C,GAGvD;IACF,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,UAAU;IACxC,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,eAAe;IAC1C,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;IAChD,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,gBAAgB;IAC5C,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;CACjD,CAAC;AAEF,MAAM,CAAC,MAAM,iCAAiC,GAG1C;IACF,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,eAAe;IACvD,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,WAAW;IAChD,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc;IACtD,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,YAAY;IAClD,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc;CACvD,CAAC","sourcesContent":["import { AvatarIconSize, AvatarIconSeverity } from '../../types';\nimport { IconSize, IconColor } from '../Icon';\n\nexport const MAP_AVATARICON_SIZE_ICONSIZE: Record<AvatarIconSize, IconSize> = {\n  [AvatarIconSize.Xs]: IconSize.Xs, // 16px avatar -> 12px icon\n  [AvatarIconSize.Sm]: IconSize.Sm, // 24px avatar -> 16px icon\n  [AvatarIconSize.Md]: IconSize.Md, // 32px avatar -> 20px icon\n  [AvatarIconSize.Lg]: IconSize.Lg, // 40px avatar -> 24px icon\n  [AvatarIconSize.Xl]: IconSize.Xl, // 48px avatar -> 32px icon\n};\n\nexport const TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR: Record<\n  AvatarIconSeverity,\n  string\n> = {\n  [AvatarIconSeverity.Neutral]: 'bg-muted',\n  [AvatarIconSeverity.Info]: 'bg-info-muted',\n  [AvatarIconSeverity.Success]: 'bg-success-muted',\n  [AvatarIconSeverity.Error]: 'bg-error-muted',\n  [AvatarIconSeverity.Warning]: 'bg-warning-muted',\n};\n\nexport const MAP_AVATARICON_SEVERITY_ICONCOLOR: Record<\n  AvatarIconSeverity,\n  IconColor\n> = {\n  [AvatarIconSeverity.Neutral]: IconColor.IconAlternative,\n  [AvatarIconSeverity.Info]: IconColor.InfoDefault,\n  [AvatarIconSeverity.Success]: IconColor.SuccessDefault,\n  [AvatarIconSeverity.Error]: IconColor.ErrorDefault,\n  [AvatarIconSeverity.Warning]: IconColor.WarningDefault,\n};\n"]}
+{"version":3,"file":"AvatarIcon.constants.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,EACf,uCAAuC;AAExC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAE9C,MAAM,CAAC,MAAM,4BAA4B,GAAqC;IAC5E,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE,EAAE,2BAA2B;CAC9D,CAAC;AAEF,MAAM,CAAC,MAAM,8CAA8C,GAGvD;IACF,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,UAAU;IACxC,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,eAAe;IAC1C,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;IAChD,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,gBAAgB;IAC5C,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,kBAAkB;CACjD,CAAC;AAEF,MAAM,CAAC,MAAM,iCAAiC,GAG1C;IACF,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,eAAe;IACvD,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,WAAW;IAChD,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc;IACtD,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,YAAY;IAClD,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc;CACvD,CAAC","sourcesContent":["import {\n  AvatarIconSeverity,\n  AvatarIconSize,\n} from '@metamask/design-system-shared';\n\nimport { IconSize, IconColor } from '../Icon';\n\nexport const MAP_AVATARICON_SIZE_ICONSIZE: Record<AvatarIconSize, IconSize> = {\n  [AvatarIconSize.Xs]: IconSize.Xs, // 16px avatar -> 12px icon\n  [AvatarIconSize.Sm]: IconSize.Sm, // 24px avatar -> 16px icon\n  [AvatarIconSize.Md]: IconSize.Md, // 32px avatar -> 20px icon\n  [AvatarIconSize.Lg]: IconSize.Lg, // 40px avatar -> 24px icon\n  [AvatarIconSize.Xl]: IconSize.Xl, // 48px avatar -> 32px icon\n};\n\nexport const TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR: Record<\n  AvatarIconSeverity,\n  string\n> = {\n  [AvatarIconSeverity.Neutral]: 'bg-muted',\n  [AvatarIconSeverity.Info]: 'bg-info-muted',\n  [AvatarIconSeverity.Success]: 'bg-success-muted',\n  [AvatarIconSeverity.Error]: 'bg-error-muted',\n  [AvatarIconSeverity.Warning]: 'bg-warning-muted',\n};\n\nexport const MAP_AVATARICON_SEVERITY_ICONCOLOR: Record<\n  AvatarIconSeverity,\n  IconColor\n> = {\n  [AvatarIconSeverity.Neutral]: IconColor.IconAlternative,\n  [AvatarIconSeverity.Info]: IconColor.InfoDefault,\n  [AvatarIconSeverity.Success]: IconColor.SuccessDefault,\n  [AvatarIconSeverity.Error]: IconColor.ErrorDefault,\n  [AvatarIconSeverity.Warning]: IconColor.WarningDefault,\n};\n"]}

package/dist/components/AvatarIcon/AvatarIcon.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAY1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,qGAgCtB,CAAC"}
+{"version":3,"file":"AvatarIcon.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAqB,cAAc;AAW1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,qGAgCtB,CAAC"}

package/dist/components/AvatarIcon/AvatarIcon.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAY1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,qGAgCtB,CAAC"}
+{"version":3,"file":"AvatarIcon.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAqB,cAAc;AAW1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,qGAgCtB,CAAC"}

package/dist/components/AvatarIcon/AvatarIcon.mjs

@@ -4,9 +4,9 @@ function $importDefault(module) {
     }
     return module;
 }
+import { AvatarIconSeverity, AvatarIconSize } from "@metamask/design-system-shared";
 import $React, { forwardRef } from "react";
 const React = $importDefault($React);
-import { AvatarIconSize, AvatarIconSeverity } from "../../types/index.mjs";
 import { twMerge } from "../../utils/tw-merge.mjs";
 import { AvatarBase, AvatarBaseShape } from "../AvatarBase/index.mjs";
 import { Icon } from "../Icon/index.mjs";

package/dist/components/AvatarIcon/AvatarIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACjE,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,gCAAsB;AAC5D,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAE/B,OAAO,EACL,4BAA4B,EAC5B,8CAA8C,EAC9C,iCAAiC,EAClC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,QAAQ,GAAG,kBAAkB,CAAC,OAAO,EACrC,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE,CAAC,CACH,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,eAAe,CAAC,MAAM,EAC7B,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,OAAO,CAChB,8CAA8C,CAAC,QAAQ,CAAC,EACxD,SAAS,CACV,KACG,KAAK,IAER,QAAQ,IAAI,CACX,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,4BAA4B,CAAC,IAAI,CAAC,EACxC,KAAK,EAAE,iCAAiC,CAAC,QAAQ,CAAC,KAC9C,SAAS,GACb,CACH,CACU,CACd,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { AvatarIconSize, AvatarIconSeverity } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { AvatarBase, AvatarBaseShape } from '../AvatarBase';\nimport { Icon } from '../Icon';\n\nimport {\n  MAP_AVATARICON_SIZE_ICONSIZE,\n  TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR,\n  MAP_AVATARICON_SEVERITY_ICONCOLOR,\n} from './AvatarIcon.constants';\nimport type { AvatarIconProps } from './AvatarIcon.types';\n\nexport const AvatarIcon = forwardRef<HTMLDivElement, AvatarIconProps>(\n  (\n    {\n      iconName,\n      iconProps,\n      size = AvatarIconSize.Md,\n      severity = AvatarIconSeverity.Neutral,\n      className,\n      ...props\n    },\n    ref,\n  ) => (\n    <AvatarBase\n      ref={ref}\n      shape={AvatarBaseShape.Circle}\n      size={size}\n      className={twMerge(\n        TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR[severity],\n        className,\n      )}\n      {...props}\n    >\n      {iconName && (\n        <Icon\n          name={iconName}\n          size={MAP_AVATARICON_SIZE_ICONSIZE[size]}\n          color={MAP_AVATARICON_SEVERITY_ICONCOLOR[severity]}\n          {...iconProps}\n        />\n      )}\n    </AvatarBase>\n  ),\n);\n\nAvatarIcon.displayName = 'AvatarIcon';\n"]}
+{"version":3,"file":"AvatarIcon.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,EACf,uCAAuC;AACxC,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,gCAAsB;AAC5D,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAE/B,OAAO,EACL,4BAA4B,EAC5B,8CAA8C,EAC9C,iCAAiC,EAClC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,QAAQ,GAAG,kBAAkB,CAAC,OAAO,EACrC,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE,CAAC,CACH,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,eAAe,CAAC,MAAM,EAC7B,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,OAAO,CAChB,8CAA8C,CAAC,QAAQ,CAAC,EACxD,SAAS,CACV,KACG,KAAK,IAER,QAAQ,IAAI,CACX,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,4BAA4B,CAAC,IAAI,CAAC,EACxC,KAAK,EAAE,iCAAiC,CAAC,QAAQ,CAAC,KAC9C,SAAS,GACb,CACH,CACU,CACd,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import {\n  AvatarIconSeverity,\n  AvatarIconSize,\n} from '@metamask/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { AvatarBase, AvatarBaseShape } from '../AvatarBase';\nimport { Icon } from '../Icon';\n\nimport {\n  MAP_AVATARICON_SIZE_ICONSIZE,\n  TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR,\n  MAP_AVATARICON_SEVERITY_ICONCOLOR,\n} from './AvatarIcon.constants';\nimport type { AvatarIconProps } from './AvatarIcon.types';\n\nexport const AvatarIcon = forwardRef<HTMLDivElement, AvatarIconProps>(\n  (\n    {\n      iconName,\n      iconProps,\n      size = AvatarIconSize.Md,\n      severity = AvatarIconSeverity.Neutral,\n      className,\n      ...props\n    },\n    ref,\n  ) => (\n    <AvatarBase\n      ref={ref}\n      shape={AvatarBaseShape.Circle}\n      size={size}\n      className={twMerge(\n        TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR[severity],\n        className,\n      )}\n      {...props}\n    >\n      {iconName && (\n        <Icon\n          name={iconName}\n          size={MAP_AVATARICON_SIZE_ICONSIZE[size]}\n          color={MAP_AVATARICON_SEVERITY_ICONCOLOR[severity]}\n          {...iconProps}\n        />\n      )}\n    </AvatarBase>\n  ),\n);\n\nAvatarIcon.displayName = 'AvatarIcon';\n"]}

package/dist/components/AvatarIcon/AvatarIcon.types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.types.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarIconSize, AvatarIconSeverity } from '../../types';\nimport type { AvatarBaseProps } from '../AvatarBase';\nimport type { IconName, IconProps } from '../Icon';\n\nexport type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> & {\n  /**\n   * Required icon name from the icon set\n   */\n  iconName: IconName;\n  /**\n   * Optional props to be passed to the Icon component\n   */\n  iconProps?: Omit<IconProps, 'name'>;\n  /**\n   * Optional prop to control the size of the avatar\n   *\n   * @default AvatarIconSize.Md\n   */\n  size?: AvatarIconSize;\n  /**\n   * Optional prop to control the severity of the avatar\n   *\n   * @default AvatarIconSeverity.Neutral\n   */\n  severity?: AvatarIconSeverity;\n};\n"]}
+{"version":3,"file":"AvatarIcon.types.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarIconPropsShared } from '@metamask/design-system-shared';\n\nimport type { AvatarBaseProps } from '../AvatarBase';\nimport type { IconProps } from '../Icon';\n\nexport type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> &\n  AvatarIconPropsShared & {\n    /**\n     * Optional props to be passed to the Icon component\n     */\n    iconProps?: Omit<IconProps, 'name'>;\n  };\n"]}

package/dist/components/AvatarIcon/AvatarIcon.types.d.cts

@@ -1,26 +1,10 @@
-import type { AvatarIconSize, AvatarIconSeverity } from "../../types/index.cjs";
+import type { AvatarIconPropsShared } from "@metamask/design-system-shared";
 import type { AvatarBaseProps } from "../AvatarBase/index.cjs";
-import type { IconName, IconProps } from "../Icon/index.cjs";
-export type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> & {
-    /**
-     * Required icon name from the icon set
-     */
-    iconName: IconName;
+import type { IconProps } from "../Icon/index.cjs";
+export type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> & AvatarIconPropsShared & {
     /**
      * Optional props to be passed to the Icon component
      */
     iconProps?: Omit<IconProps, 'name'>;
-    /**
-     * Optional prop to control the size of the avatar
-     *
-     * @default AvatarIconSize.Md
-     */
-    size?: AvatarIconSize;
-    /**
-     * Optional prop to control the severity of the avatar
-     *
-     * @default AvatarIconSeverity.Neutral
-     */
-    severity?: AvatarIconSeverity;
 };
 //# sourceMappingURL=AvatarIcon.types.d.cts.map

package/dist/components/AvatarIcon/AvatarIcon.types.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.types.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAEnD,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,GAAG;IACzE;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IACpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B,CAAC"}
+{"version":3,"file":"AvatarIcon.types.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uCAAuC;AAE5E,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,GACtE,qBAAqB,GAAG;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;CACrC,CAAC"}

package/dist/components/AvatarIcon/AvatarIcon.types.d.mts

@@ -1,26 +1,10 @@
-import type { AvatarIconSize, AvatarIconSeverity } from "../../types/index.mjs";
+import type { AvatarIconPropsShared } from "@metamask/design-system-shared";
 import type { AvatarBaseProps } from "../AvatarBase/index.mjs";
-import type { IconName, IconProps } from "../Icon/index.mjs";
-export type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> & {
-    /**
-     * Required icon name from the icon set
-     */
-    iconName: IconName;
+import type { IconProps } from "../Icon/index.mjs";
+export type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> & AvatarIconPropsShared & {
     /**
      * Optional props to be passed to the Icon component
      */
     iconProps?: Omit<IconProps, 'name'>;
-    /**
-     * Optional prop to control the size of the avatar
-     *
-     * @default AvatarIconSize.Md
-     */
-    size?: AvatarIconSize;
-    /**
-     * Optional prop to control the severity of the avatar
-     *
-     * @default AvatarIconSeverity.Neutral
-     */
-    severity?: AvatarIconSeverity;
 };
 //# sourceMappingURL=AvatarIcon.types.d.mts.map

package/dist/components/AvatarIcon/AvatarIcon.types.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.types.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAEnD,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,GAAG;IACzE;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IACpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B,CAAC"}
+{"version":3,"file":"AvatarIcon.types.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uCAAuC;AAE5E,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,GACtE,qBAAqB,GAAG;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;CACrC,CAAC"}

package/dist/components/AvatarIcon/AvatarIcon.types.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarIcon.types.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarIconSize, AvatarIconSeverity } from '../../types';\nimport type { AvatarBaseProps } from '../AvatarBase';\nimport type { IconName, IconProps } from '../Icon';\n\nexport type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> & {\n  /**\n   * Required icon name from the icon set\n   */\n  iconName: IconName;\n  /**\n   * Optional props to be passed to the Icon component\n   */\n  iconProps?: Omit<IconProps, 'name'>;\n  /**\n   * Optional prop to control the size of the avatar\n   *\n   * @default AvatarIconSize.Md\n   */\n  size?: AvatarIconSize;\n  /**\n   * Optional prop to control the severity of the avatar\n   *\n   * @default AvatarIconSeverity.Neutral\n   */\n  severity?: AvatarIconSeverity;\n};\n"]}
+{"version":3,"file":"AvatarIcon.types.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/AvatarIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarIconPropsShared } from '@metamask/design-system-shared';\n\nimport type { AvatarBaseProps } from '../AvatarBase';\nimport type { IconProps } from '../Icon';\n\nexport type AvatarIconProps = Omit<AvatarBaseProps, 'children' | 'size'> &\n  AvatarIconPropsShared & {\n    /**\n     * Optional props to be passed to the Icon component\n     */\n    iconProps?: Omit<IconProps, 'name'>;\n  };\n"]}

package/dist/components/AvatarIcon/index.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.AvatarIcon = exports.AvatarIconSeverity = exports.AvatarIconSize = void 0;
-var types_1 = require("../../types/index.cjs");
-Object.defineProperty(exports, "AvatarIconSize", { enumerable: true, get: function () { return types_1.AvatarIconSize; } });
-Object.defineProperty(exports, "AvatarIconSeverity", { enumerable: true, get: function () { return types_1.AvatarIconSeverity; } });
+exports.AvatarIcon = exports.AvatarIconSize = exports.AvatarIconSeverity = void 0;
+var design_system_shared_1 = require("@metamask/design-system-shared");
+Object.defineProperty(exports, "AvatarIconSeverity", { enumerable: true, get: function () { return design_system_shared_1.AvatarIconSeverity; } });
+Object.defineProperty(exports, "AvatarIconSize", { enumerable: true, get: function () { return design_system_shared_1.AvatarIconSize; } });
 var AvatarIcon_1 = require("./AvatarIcon.cjs");
 Object.defineProperty(exports, "AvatarIcon", { enumerable: true, get: function () { return AvatarIcon_1.AvatarIcon; } });
 //# sourceMappingURL=index.cjs.map

package/dist/components/AvatarIcon/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":";;;AAAA,+CAAiE;AAAxD,uGAAA,cAAc,OAAA;AAAE,2GAAA,kBAAkB,OAAA;AAC3C,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { AvatarIconSize, AvatarIconSeverity } from '../../types';\nexport { AvatarIcon } from './AvatarIcon';\nexport type { AvatarIconProps } from './AvatarIcon.types';\n"]}
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":";;;AAAA,uEAGwC;AAFtC,0HAAA,kBAAkB,OAAA;AAClB,sHAAA,cAAc,OAAA;AAEhB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export {\n  AvatarIconSeverity,\n  AvatarIconSize,\n} from '@metamask/design-system-shared';\nexport { AvatarIcon } from './AvatarIcon';\nexport type { AvatarIconProps } from './AvatarIcon.types';\n"]}

package/dist/components/AvatarIcon/index.d.cts

@@ -1,4 +1,4 @@
-export { AvatarIconSize, AvatarIconSeverity } from "../../types/index.cjs";
+export { AvatarIconSeverity, AvatarIconSize, } from "@metamask/design-system-shared";
 export { AvatarIcon } from "./AvatarIcon.cjs";
 export type { AvatarIconProps } from "./AvatarIcon.types.cjs";
 //# sourceMappingURL=index.d.cts.map

package/dist/components/AvatarIcon/index.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACjE,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,GACf,uCAAuC;AACxC,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

package/dist/components/AvatarIcon/index.d.mts

@@ -1,4 +1,4 @@
-export { AvatarIconSize, AvatarIconSeverity } from "../../types/index.mjs";
+export { AvatarIconSeverity, AvatarIconSize, } from "@metamask/design-system-shared";
 export { AvatarIcon } from "./AvatarIcon.mjs";
 export type { AvatarIconProps } from "./AvatarIcon.types.mjs";
 //# sourceMappingURL=index.d.mts.map

package/dist/components/AvatarIcon/index.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACjE,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,GACf,uCAAuC;AACxC,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

package/dist/components/AvatarIcon/index.mjs

@@ -1,3 +1,3 @@
-export { AvatarIconSize, AvatarIconSeverity } from "../../types/index.mjs";
+export { AvatarIconSeverity, AvatarIconSize } from "@metamask/design-system-shared";
 export { AvatarIcon } from "./AvatarIcon.mjs";
 //# sourceMappingURL=index.mjs.map

package/dist/components/AvatarIcon/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,8BAAoB;AACjE,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export { AvatarIconSize, AvatarIconSeverity } from '../../types';\nexport { AvatarIcon } from './AvatarIcon';\nexport type { AvatarIconProps } from './AvatarIcon.types';\n"]}
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/AvatarIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,EACf,uCAAuC;AACxC,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export {\n  AvatarIconSeverity,\n  AvatarIconSize,\n} from '@metamask/design-system-shared';\nexport { AvatarIcon } from './AvatarIcon';\nexport type { AvatarIconProps } from './AvatarIcon.types';\n"]}

package/dist/components/BadgeIcon/BadgeIcon.cjs

@@ -24,13 +24,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BadgeIcon = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const react_1 = __importStar(require("react"));
 const tw_merge_1 = require("../../utils/tw-merge.cjs");
 const Icon_1 = require("../Icon/index.cjs");
 exports.BadgeIcon = (0, react_1.forwardRef)(({ iconName, iconProps, className = '', style, ...props }, ref) => {
     const mergedClassName = (0, tw_merge_1.twMerge)('inline-flex size-4 items-center justify-center rounded-full bg-icon-default', className);
     return (react_1.default.createElement("div", { ref: ref, className: mergedClassName, style: style, ...props },
-        react_1.default.createElement(Icon_1.Icon, { size: Icon_1.IconSize.Xs, name: iconName, ...iconProps, className: (0, tw_merge_1.twMerge)(iconProps?.color ? '' : 'text-background-default', // if color is provided, use it, otherwise use background default
+        react_1.default.createElement(Icon_1.Icon, { size: design_system_shared_1.IconSize.Xs, name: iconName, ...iconProps, className: (0, tw_merge_1.twMerge)(iconProps?.color ? '' : 'text-background-default', // if color is provided, use it, otherwise use background default
             iconProps?.className) })));
 });
 exports.BadgeIcon.displayName = 'BadgeIcon';

package/dist/components/BadgeIcon/BadgeIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.cjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,uDAA+C;AAC/C,4CAAyC;AAI5B,QAAA,SAAS,GAAG,IAAA,kBAAU,EACjC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAChE,MAAM,eAAe,GAAG,IAAA,kBAAO,EAC7B,6EAA6E,EAC7E,SAAS,CACV,CAAC;IAEF,OAAO,CACL,uCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK;QAChE,8BAAC,WAAI,IACH,IAAI,EAAE,eAAQ,CAAC,EAAE,EACjB,IAAI,EAAE,QAAQ,KACV,SAAS,EACb,SAAS,EAAE,IAAA,kBAAO,EAChB,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,yBAAyB,EAAE,iEAAiE;YACpH,SAAS,EAAE,SAAS,CACrB,GACD,CACE,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,iBAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon, IconSize } from '../Icon';\n\nimport type { BadgeIconProps } from './BadgeIcon.types';\n\nexport const BadgeIcon = forwardRef<HTMLDivElement, BadgeIconProps>(\n  ({ iconName, iconProps, className = '', style, ...props }, ref) => {\n    const mergedClassName = twMerge(\n      'inline-flex size-4 items-center justify-center rounded-full bg-icon-default',\n      className,\n    );\n\n    return (\n      <div ref={ref} className={mergedClassName} style={style} {...props}>\n        <Icon\n          size={IconSize.Xs}\n          name={iconName}\n          {...iconProps}\n          className={twMerge(\n            iconProps?.color ? '' : 'text-background-default', // if color is provided, use it, otherwise use background default\n            iconProps?.className,\n          )}\n        />\n      </div>\n    );\n  },\n);\n\nBadgeIcon.displayName = 'BadgeIcon';\n"]}
+{"version":3,"file":"BadgeIcon.cjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yEAA0D;AAC1D,+CAA0C;AAE1C,uDAA+C;AAC/C,4CAA+B;AAIlB,QAAA,SAAS,GAAG,IAAA,kBAAU,EACjC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAChE,MAAM,eAAe,GAAG,IAAA,kBAAO,EAC7B,6EAA6E,EAC7E,SAAS,CACV,CAAC;IAEF,OAAO,CACL,uCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK;QAChE,8BAAC,WAAI,IACH,IAAI,EAAE,+BAAQ,CAAC,EAAE,EACjB,IAAI,EAAE,QAAQ,KACV,SAAS,EACb,SAAS,EAAE,IAAA,kBAAO,EAChB,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,yBAAyB,EAAE,iEAAiE;YACpH,SAAS,EAAE,SAAS,CACrB,GACD,CACE,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,iBAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import { IconSize } from '@metamask/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon } from '../Icon';\n\nimport type { BadgeIconProps } from './BadgeIcon.types';\n\nexport const BadgeIcon = forwardRef<HTMLDivElement, BadgeIconProps>(\n  ({ iconName, iconProps, className = '', style, ...props }, ref) => {\n    const mergedClassName = twMerge(\n      'inline-flex size-4 items-center justify-center rounded-full bg-icon-default',\n      className,\n    );\n\n    return (\n      <div ref={ref} className={mergedClassName} style={style} {...props}>\n        <Icon\n          size={IconSize.Xs}\n          name={iconName}\n          {...iconProps}\n          className={twMerge(\n            iconProps?.color ? '' : 'text-background-default', // if color is provided, use it, otherwise use background default\n            iconProps?.className,\n          )}\n        />\n      </div>\n    );\n  },\n);\n\nBadgeIcon.displayName = 'BadgeIcon';\n"]}

package/dist/components/BadgeIcon/BadgeIcon.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS,oGAqBrB,CAAC"}
+{"version":3,"file":"BadgeIcon.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS,oGAqBrB,CAAC"}

package/dist/components/BadgeIcon/BadgeIcon.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS,oGAqBrB,CAAC"}
+{"version":3,"file":"BadgeIcon.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS,oGAqBrB,CAAC"}

package/dist/components/BadgeIcon/BadgeIcon.mjs

@@ -4,10 +4,11 @@ function $importDefault(module) {
     }
     return module;
 }
+import { IconSize } from "@metamask/design-system-shared";
 import $React, { forwardRef } from "react";
 const React = $importDefault($React);
 import { twMerge } from "../../utils/tw-merge.mjs";
-import { Icon, IconSize } from "../Icon/index.mjs";
+import { Icon } from "../Icon/index.mjs";
 export const BadgeIcon = forwardRef(({ iconName, iconProps, className = '', style, ...props }, ref) => {
     const mergedClassName = twMerge('inline-flex size-4 items-center justify-center rounded-full bg-icon-default', className);
     return (React.createElement("div", { ref: ref, className: mergedClassName, style: style, ...props },

package/dist/components/BadgeIcon/BadgeIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.mjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,0BAAgB;AAIzC,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAChE,MAAM,eAAe,GAAG,OAAO,CAC7B,6EAA6E,EAC7E,SAAS,CACV,CAAC;IAEF,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK;QAChE,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,CAAC,EAAE,EACjB,IAAI,EAAE,QAAQ,KACV,SAAS,EACb,SAAS,EAAE,OAAO,CAChB,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,yBAAyB,EAAE,iEAAiE;YACpH,SAAS,EAAE,SAAS,CACrB,GACD,CACE,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon, IconSize } from '../Icon';\n\nimport type { BadgeIconProps } from './BadgeIcon.types';\n\nexport const BadgeIcon = forwardRef<HTMLDivElement, BadgeIconProps>(\n  ({ iconName, iconProps, className = '', style, ...props }, ref) => {\n    const mergedClassName = twMerge(\n      'inline-flex size-4 items-center justify-center rounded-full bg-icon-default',\n      className,\n    );\n\n    return (\n      <div ref={ref} className={mergedClassName} style={style} {...props}>\n        <Icon\n          size={IconSize.Xs}\n          name={iconName}\n          {...iconProps}\n          className={twMerge(\n            iconProps?.color ? '' : 'text-background-default', // if color is provided, use it, otherwise use background default\n            iconProps?.className,\n          )}\n        />\n      </div>\n    );\n  },\n);\n\nBadgeIcon.displayName = 'BadgeIcon';\n"]}
+{"version":3,"file":"BadgeIcon.mjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,QAAQ,EAAE,uCAAuC;AAC1D,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAI/B,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAChE,MAAM,eAAe,GAAG,OAAO,CAC7B,6EAA6E,EAC7E,SAAS,CACV,CAAC;IAEF,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK;QAChE,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,CAAC,EAAE,EACjB,IAAI,EAAE,QAAQ,KACV,SAAS,EACb,SAAS,EAAE,OAAO,CAChB,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,yBAAyB,EAAE,iEAAiE;YACpH,SAAS,EAAE,SAAS,CACrB,GACD,CACE,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import { IconSize } from '@metamask/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon } from '../Icon';\n\nimport type { BadgeIconProps } from './BadgeIcon.types';\n\nexport const BadgeIcon = forwardRef<HTMLDivElement, BadgeIconProps>(\n  ({ iconName, iconProps, className = '', style, ...props }, ref) => {\n    const mergedClassName = twMerge(\n      'inline-flex size-4 items-center justify-center rounded-full bg-icon-default',\n      className,\n    );\n\n    return (\n      <div ref={ref} className={mergedClassName} style={style} {...props}>\n        <Icon\n          size={IconSize.Xs}\n          name={iconName}\n          {...iconProps}\n          className={twMerge(\n            iconProps?.color ? '' : 'text-background-default', // if color is provided, use it, otherwise use background default\n            iconProps?.className,\n          )}\n        />\n      </div>\n    );\n  },\n);\n\nBadgeIcon.displayName = 'BadgeIcon';\n"]}

package/dist/components/BadgeIcon/BadgeIcon.types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.types.cjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type { IconName, IconProps } from '../Icon';\n\n/**\n * BadgeIcon component props.\n */\nexport type BadgeIconProps = ComponentProps<'div'> & {\n  /**\n   * Required prop to specify an icon to show\n   */\n  iconName: IconName;\n  /**\n   * Optional prop to pass additional properties to the icon\n   */\n  iconProps?: Omit<IconProps, 'name'>;\n  /**\n   * Optional prop for additional CSS classes to be applied to the BadgeIcon component.\n   * These classes will be merged with the component's default classes using twMerge.\n   */\n  className?: string;\n  /**\n   * Optional CSS styles to be applied to the component.\n   * Should be used sparingly and only for dynamic styles that can't be achieved with className.\n   */\n  style?: React.CSSProperties;\n};\n"]}
+{"version":3,"file":"BadgeIcon.types.cjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BadgeIconPropsShared } from '@metamask/design-system-shared';\nimport type { ComponentProps } from 'react';\n\nimport type { IconProps } from '../Icon';\n\n/**\n * BadgeIcon component props (React platform-specific)\n * Extends shared props from @metamask/design-system-shared with React-specific platform concerns\n */\nexport type BadgeIconProps = ComponentProps<'div'> &\n  BadgeIconPropsShared & {\n    /**\n     * Optional prop to pass additional properties to the icon\n     */\n    iconProps?: Omit<IconProps, 'name'>;\n    /**\n     * Optional prop for additional CSS classes to be applied to the BadgeIcon component.\n     * These classes will be merged with the component's default classes using twMerge.\n     */\n    className?: string;\n    /**\n     * Optional CSS styles to be applied to the component.\n     * Should be used sparingly and only for dynamic styles that can't be achieved with className.\n     */\n    style?: React.CSSProperties;\n  };\n"]}

package/dist/components/BadgeIcon/BadgeIcon.types.d.cts

@@ -1,13 +1,11 @@
+import type { BadgeIconPropsShared } from "@metamask/design-system-shared";
 import type { ComponentProps } from "react";
-import type { IconName, IconProps } from "../Icon/index.cjs";
+import type { IconProps } from "../Icon/index.cjs";
 /**
- * BadgeIcon component props.
+ * BadgeIcon component props (React platform-specific)
+ * Extends shared props from @metamask/design-system-shared with React-specific platform concerns
  */
-export type BadgeIconProps = ComponentProps<'div'> & {
-    /**
-     * Required prop to specify an icon to show
-     */
-    iconName: IconName;
+export type BadgeIconProps = ComponentProps<'div'> & BadgeIconPropsShared & {
     /**
      * Optional prop to pass additional properties to the icon
      */

package/dist/components/BadgeIcon/BadgeIcon.types.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAEnD;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACnD;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}
+{"version":3,"file":"BadgeIcon.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,uCAAuC;AAC3E,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAChD,oBAAoB,GAAG;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}

package/dist/components/BadgeIcon/BadgeIcon.types.d.mts

@@ -1,13 +1,11 @@
+import type { BadgeIconPropsShared } from "@metamask/design-system-shared";
 import type { ComponentProps } from "react";
-import type { IconName, IconProps } from "../Icon/index.mjs";
+import type { IconProps } from "../Icon/index.mjs";
 /**
- * BadgeIcon component props.
+ * BadgeIcon component props (React platform-specific)
+ * Extends shared props from @metamask/design-system-shared with React-specific platform concerns
  */
-export type BadgeIconProps = ComponentProps<'div'> & {
-    /**
-     * Required prop to specify an icon to show
-     */
-    iconName: IconName;
+export type BadgeIconProps = ComponentProps<'div'> & BadgeIconPropsShared & {
     /**
      * Optional prop to pass additional properties to the icon
      */

package/dist/components/BadgeIcon/BadgeIcon.types.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAEnD;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACnD;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}
+{"version":3,"file":"BadgeIcon.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,uCAAuC;AAC3E,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAChD,oBAAoB,GAAG;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}

package/dist/components/BadgeIcon/BadgeIcon.types.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeIcon.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type { IconName, IconProps } from '../Icon';\n\n/**\n * BadgeIcon component props.\n */\nexport type BadgeIconProps = ComponentProps<'div'> & {\n  /**\n   * Required prop to specify an icon to show\n   */\n  iconName: IconName;\n  /**\n   * Optional prop to pass additional properties to the icon\n   */\n  iconProps?: Omit<IconProps, 'name'>;\n  /**\n   * Optional prop for additional CSS classes to be applied to the BadgeIcon component.\n   * These classes will be merged with the component's default classes using twMerge.\n   */\n  className?: string;\n  /**\n   * Optional CSS styles to be applied to the component.\n   * Should be used sparingly and only for dynamic styles that can't be achieved with className.\n   */\n  style?: React.CSSProperties;\n};\n"]}
+{"version":3,"file":"BadgeIcon.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeIcon/BadgeIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BadgeIconPropsShared } from '@metamask/design-system-shared';\nimport type { ComponentProps } from 'react';\n\nimport type { IconProps } from '../Icon';\n\n/**\n * BadgeIcon component props (React platform-specific)\n * Extends shared props from @metamask/design-system-shared with React-specific platform concerns\n */\nexport type BadgeIconProps = ComponentProps<'div'> &\n  BadgeIconPropsShared & {\n    /**\n     * Optional prop to pass additional properties to the icon\n     */\n    iconProps?: Omit<IconProps, 'name'>;\n    /**\n     * Optional prop for additional CSS classes to be applied to the BadgeIcon component.\n     * These classes will be merged with the component's default classes using twMerge.\n     */\n    className?: string;\n    /**\n     * Optional CSS styles to be applied to the component.\n     * Should be used sparingly and only for dynamic styles that can't be achieved with className.\n     */\n    style?: React.CSSProperties;\n  };\n"]}

package/dist/components/Icon/icons/Telegram.cjs

@@ -0,0 +1,32 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_1 = require("react");
+const SvgTelegram = (props, ref) => React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", ref: ref, ...props },
+    React.createElement("path", { d: "m9.78 18.65.28-4.23 7.68-6.92c.34-.31-.07-.46-.52-.19L7.74 13.3 3.64 12c-.88-.25-.89-.86.2-1.3l15.97-6.16c.73-.33 1.43.18 1.15 1.3l-2.72 12.81c-.19.91-.74 1.13-1.5.71L12.6 16.3l-1.99 1.93c-.23.23-.42.42-.83.42" }));
+const ForwardRef = (0, react_1.forwardRef)(SvgTelegram);
+exports.default = ForwardRef;
+//# sourceMappingURL=Telegram.cjs.map

package/dist/components/Icon/icons/Telegram.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Telegram.cjs","sourceRoot":"","sources":["../../../../src/components/Icon/icons/Telegram.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAE/B,iCAAwC;AACxC,MAAM,WAAW,GAAG,CAAC,KAA8B,EAAE,GAAuB,EAAE,EAAE,CAAC,6BAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,cAAc,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK;IAAE,8BAAM,CAAC,EAAC,mNAAmN,GAAG,CAAM,CAAC;AAC3Z,MAAM,UAAU,GAAG,IAAA,kBAAU,EAAC,WAAW,CAAC,CAAC;AAC3C,kBAAe,UAAU,CAAC","sourcesContent":["import * as React from \"react\";\nimport type { SVGProps } from \"react\";\nimport { Ref, forwardRef } from \"react\";\nconst SvgTelegram = (props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" ref={ref} {...props}><path d=\"m9.78 18.65.28-4.23 7.68-6.92c.34-.31-.07-.46-.52-.19L7.74 13.3 3.64 12c-.88-.25-.89-.86.2-1.3l15.97-6.16c.73-.33 1.43.18 1.15 1.3l-2.72 12.81c-.19.91-.74 1.13-1.5.71L12.6 16.3l-1.99 1.93c-.23.23-.42.42-.83.42\" /></svg>;\nconst ForwardRef = forwardRef(SvgTelegram);\nexport default ForwardRef;"]}

package/dist/components/Icon/icons/Telegram.d.cts

@@ -0,0 +1,4 @@
+import * as React from "react";
+declare const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+export default ForwardRef;
+//# sourceMappingURL=Telegram.d.cts.map

package/dist/components/Icon/icons/Telegram.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Telegram.d.cts","sourceRoot":"","sources":["../../../../src/components/Icon/icons/Telegram.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,cAAc;AAI/B,QAAA,MAAM,UAAU,kHAA0B,CAAC;AAC3C,eAAe,UAAU,CAAC"}

package/dist/components/Icon/icons/Telegram.d.mts

@@ -0,0 +1,4 @@
+import * as React from "react";
+declare const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+export default ForwardRef;
+//# sourceMappingURL=Telegram.d.mts.map

package/dist/components/Icon/icons/Telegram.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Telegram.d.mts","sourceRoot":"","sources":["../../../../src/components/Icon/icons/Telegram.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,cAAc;AAI/B,QAAA,MAAM,UAAU,kHAA0B,CAAC;AAC3C,eAAe,UAAU,CAAC"}

package/dist/components/Icon/icons/Telegram.mjs

@@ -0,0 +1,7 @@
+import * as React from "react";
+import { forwardRef } from "react";
+const SvgTelegram = (props, ref) => React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", ref: ref, ...props },
+    React.createElement("path", { d: "m9.78 18.65.28-4.23 7.68-6.92c.34-.31-.07-.46-.52-.19L7.74 13.3 3.64 12c-.88-.25-.89-.86.2-1.3l15.97-6.16c.73-.33 1.43.18 1.15 1.3l-2.72 12.81c-.19.91-.74 1.13-1.5.71L12.6 16.3l-1.99 1.93c-.23.23-.42.42-.83.42" }));
+const ForwardRef = forwardRef(SvgTelegram);
+export default ForwardRef;
+//# sourceMappingURL=Telegram.mjs.map