@metamask-previews/design-system-react 0.13.0-preview.69c659c → 0.13.0-preview.8028c20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AvatarBase/AvatarBase.cjs +3 -3
- package/dist/components/AvatarBase/AvatarBase.cjs.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.constants.cjs +21 -21
- package/dist/components/AvatarBase/AvatarBase.constants.cjs.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.constants.d.cts +1 -1
- package/dist/components/AvatarBase/AvatarBase.constants.d.cts.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.constants.d.mts +1 -1
- package/dist/components/AvatarBase/AvatarBase.constants.d.mts.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.constants.mjs +1 -1
- package/dist/components/AvatarBase/AvatarBase.constants.mjs.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.d.cts.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.d.mts.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.mjs +1 -1
- package/dist/components/AvatarBase/AvatarBase.mjs.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.types.cjs.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.types.d.cts +4 -42
- package/dist/components/AvatarBase/AvatarBase.types.d.cts.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.types.d.mts +4 -42
- package/dist/components/AvatarBase/AvatarBase.types.d.mts.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.types.mjs.map +1 -1
- package/dist/components/AvatarBase/index.cjs +3 -3
- package/dist/components/AvatarBase/index.cjs.map +1 -1
- package/dist/components/AvatarBase/index.d.cts +1 -1
- package/dist/components/AvatarBase/index.d.cts.map +1 -1
- package/dist/components/AvatarBase/index.d.mts +1 -1
- package/dist/components/AvatarBase/index.d.mts.map +1 -1
- package/dist/components/AvatarBase/index.mjs +1 -1
- package/dist/components/AvatarBase/index.mjs.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.constants.cjs +8 -8
- package/dist/components/BannerAlert/BannerAlert.constants.cjs.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.constants.d.cts +2 -2
- package/dist/components/BannerAlert/BannerAlert.constants.d.cts.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.constants.d.mts +2 -2
- package/dist/components/BannerAlert/BannerAlert.constants.d.mts.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.constants.mjs +2 -2
- package/dist/components/BannerAlert/BannerAlert.constants.mjs.map +1 -1
- package/dist/components/BannerBase/BannerBase.cjs +1 -2
- package/dist/components/BannerBase/BannerBase.cjs.map +1 -1
- package/dist/components/BannerBase/BannerBase.d.cts.map +1 -1
- package/dist/components/BannerBase/BannerBase.d.mts.map +1 -1
- package/dist/components/BannerBase/BannerBase.mjs +1 -2
- package/dist/components/BannerBase/BannerBase.mjs.map +1 -1
- package/dist/components/Box/Box.constants.cjs.map +1 -1
- package/dist/components/Box/Box.constants.d.cts +1 -1
- package/dist/components/Box/Box.constants.d.cts.map +1 -1
- package/dist/components/Box/Box.constants.d.mts +1 -1
- package/dist/components/Box/Box.constants.d.mts.map +1 -1
- package/dist/components/Box/Box.constants.mjs.map +1 -1
- package/dist/components/Box/Box.types.cjs.map +1 -1
- package/dist/components/Box/Box.types.d.cts +106 -2
- package/dist/components/Box/Box.types.d.cts.map +1 -1
- package/dist/components/Box/Box.types.d.mts +106 -2
- package/dist/components/Box/Box.types.d.mts.map +1 -1
- package/dist/components/Box/Box.types.mjs.map +1 -1
- package/dist/components/Box/index.cjs +7 -7
- package/dist/components/Box/index.cjs.map +1 -1
- package/dist/components/Box/index.d.cts +2 -1
- package/dist/components/Box/index.d.cts.map +1 -1
- package/dist/components/Box/index.d.mts +2 -1
- package/dist/components/Box/index.d.mts.map +1 -1
- package/dist/components/Box/index.mjs +1 -1
- package/dist/components/Box/index.mjs.map +1 -1
- package/dist/types/index.cjs +190 -41
- package/dist/types/index.cjs.map +1 -1
- package/dist/types/index.d.cts +182 -46
- package/dist/types/index.d.cts.map +1 -1
- package/dist/types/index.d.mts +182 -46
- package/dist/types/index.d.mts.map +1 -1
- package/dist/types/index.mjs +180 -48
- package/dist/types/index.mjs.map +1 -1
- package/package.json +5 -5
|
@@ -24,17 +24,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
24
24
|
};
|
|
25
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
26
|
exports.AvatarBase = void 0;
|
|
27
|
+
const design_system_shared_1 = require("@metamask-previews/design-system-shared");
|
|
27
28
|
const react_slot_1 = require("@radix-ui/react-slot");
|
|
28
29
|
const react_1 = __importStar(require("react"));
|
|
29
|
-
const types_1 = require("../../types/index.cjs");
|
|
30
30
|
const tw_merge_1 = require("../../utils/tw-merge.cjs");
|
|
31
31
|
const Text_1 = require("../Text/index.cjs");
|
|
32
32
|
const AvatarBase_constants_1 = require("./AvatarBase.constants.cjs");
|
|
33
|
-
exports.AvatarBase = (0, react_1.forwardRef)(({ children, fallbackText, fallbackTextProps, className, size =
|
|
33
|
+
exports.AvatarBase = (0, react_1.forwardRef)(({ children, fallbackText, fallbackTextProps, className, size = design_system_shared_1.AvatarBaseSize.Md, shape = design_system_shared_1.AvatarBaseShape.Circle, asChild, style, hasBorder = false, ...props }, ref) => {
|
|
34
34
|
const Component = asChild ? react_slot_1.Slot : 'div';
|
|
35
35
|
const mergedClassName = (0, tw_merge_1.twMerge)(
|
|
36
36
|
// Base styles
|
|
37
|
-
'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section', shape ===
|
|
37
|
+
'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section', shape === design_system_shared_1.AvatarBaseShape.Circle
|
|
38
38
|
? 'rounded-full'
|
|
39
39
|
: AvatarBase_constants_1.TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE[size],
|
|
40
40
|
// Size
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qDAA4C;AAC5C,+CAA0C;AAE1C,
|
|
1
|
+
{"version":3,"file":"AvatarBase.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kFAGiD;AACjD,qDAA4C;AAC5C,+CAA0C;AAE1C,uDAA+C;AAC/C,4CAAmE;AAEnE,qEAKgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,IAAI,GAAG,qCAAc,CAAC,EAAE,EACxB,KAAK,GAAG,sCAAe,CAAC,MAAM,EAC9B,OAAO,EACP,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,MAAM,eAAe,GAAG,IAAA,kBAAO;IAC7B,cAAc;IACd,6EAA6E,EAC7E,KAAK,KAAK,sCAAe,CAAC,MAAM;QAC9B,CAAC,CAAC,cAAc;QAChB,CAAC,CAAC,sEAA+C,CAAC,IAAI,CAAC;IACzD,OAAO;IACP,SAAS;QACP,CAAC,CAAC,qEAA8C,CAAC,IAAI,CAAC;QACtD,CAAC,CAAC,2DAAoC,CAAC,IAAI,CAAC;IAC9C,SAAS;IACT,SAAS,IAAI,wDAAiC,CAAC,IAAI,CAAC;IACpD,iBAAiB;IACjB,SAAS,CACV,CAAC;IAEF,OAAO,CACL,8BAAC,SAAS,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,IACrE,YAAY,CAAC,CAAC,CAAC,CACd,8BAAC,WAAI,IACH,OAAO,EAAE,kBAAW,CAAC,MAAM,EAC3B,UAAU,EAAE,iBAAU,CAAC,MAAM,EAC7B,KAAK,EAAE,gBAAS,CAAC,SAAS,EAC1B,OAAO,QACP,SAAS,EAAC,WAAW,KACjB,iBAAiB;QAGrB,4CAAO,YAAY,CAAQ,CACtB,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACS,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import {\n AvatarBaseSize,\n AvatarBaseShape,\n} from '@metamask-previews/design-system-shared';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Text, FontWeight, TextVariant, TextColor } from '../Text';\n\nimport {\n TWCLASSMAP_AVATARBASE_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE,\n TWCLASSMAP_AVATARBASE_SIZE_BORDER,\n} from './AvatarBase.constants';\nimport type { AvatarBaseProps } from './AvatarBase.types';\n\nexport const AvatarBase = forwardRef<HTMLDivElement, AvatarBaseProps>(\n (\n {\n children,\n fallbackText,\n fallbackTextProps,\n className,\n size = AvatarBaseSize.Md,\n shape = AvatarBaseShape.Circle,\n asChild,\n style,\n hasBorder = false,\n ...props\n },\n ref,\n ) => {\n const Component = asChild ? Slot : 'div';\n\n const mergedClassName = twMerge(\n // Base styles\n 'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section',\n shape === AvatarBaseShape.Circle\n ? 'rounded-full'\n : TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE[size],\n // Size\n hasBorder\n ? TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION[size]\n : TWCLASSMAP_AVATARBASE_SIZE_DIMENSION[size],\n // Border\n hasBorder && TWCLASSMAP_AVATARBASE_SIZE_BORDER[size],\n // Custom classes\n className,\n );\n\n return (\n <Component ref={ref} className={mergedClassName} style={style} {...props}>\n {fallbackText ? (\n <Text\n variant={TextVariant.BodySm}\n fontWeight={FontWeight.Medium}\n color={TextColor.TextMuted}\n asChild\n className=\"uppercase\"\n {...fallbackTextProps}\n >\n {/* asChild prop renders Text component as a span, it does not create an additional element */}\n <span>{fallbackText}</span>\n </Text>\n ) : (\n children\n )}\n </Component>\n );\n },\n);\n\nAvatarBase.displayName = 'AvatarBase';\n"]}
|
|
@@ -1,33 +1,33 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.TWCLASSMAP_AVATARBASE_SIZE_BORDER = exports.TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE = exports.TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION = exports.TWCLASSMAP_AVATARBASE_SIZE_DIMENSION = void 0;
|
|
4
|
-
const
|
|
4
|
+
const design_system_shared_1 = require("@metamask-previews/design-system-shared");
|
|
5
5
|
exports.TWCLASSMAP_AVATARBASE_SIZE_DIMENSION = {
|
|
6
|
-
[
|
|
7
|
-
[
|
|
8
|
-
[
|
|
9
|
-
[
|
|
10
|
-
[
|
|
6
|
+
[design_system_shared_1.AvatarBaseSize.Xs]: 'h-4 w-4',
|
|
7
|
+
[design_system_shared_1.AvatarBaseSize.Sm]: 'h-6 w-6',
|
|
8
|
+
[design_system_shared_1.AvatarBaseSize.Md]: 'h-8 w-8',
|
|
9
|
+
[design_system_shared_1.AvatarBaseSize.Lg]: 'h-10 w-10',
|
|
10
|
+
[design_system_shared_1.AvatarBaseSize.Xl]: 'h-12 w-12', // 48px
|
|
11
11
|
};
|
|
12
12
|
exports.TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION = {
|
|
13
|
-
[
|
|
14
|
-
[
|
|
15
|
-
[
|
|
16
|
-
[
|
|
17
|
-
[
|
|
13
|
+
[design_system_shared_1.AvatarBaseSize.Xs]: 'h-[18px] w-[18px]',
|
|
14
|
+
[design_system_shared_1.AvatarBaseSize.Sm]: 'h-[26px] w-[26px]',
|
|
15
|
+
[design_system_shared_1.AvatarBaseSize.Md]: 'h-[34px] w-[34px]',
|
|
16
|
+
[design_system_shared_1.AvatarBaseSize.Lg]: 'h-[44px] w-[44px]',
|
|
17
|
+
[design_system_shared_1.AvatarBaseSize.Xl]: 'h-[52px] w-[52px]', // 48px with 2px border on each side
|
|
18
18
|
};
|
|
19
19
|
exports.TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE = {
|
|
20
|
-
[
|
|
21
|
-
[
|
|
22
|
-
[
|
|
23
|
-
[
|
|
24
|
-
[
|
|
20
|
+
[design_system_shared_1.AvatarBaseSize.Xs]: 'rounded-sm',
|
|
21
|
+
[design_system_shared_1.AvatarBaseSize.Sm]: 'rounded-md',
|
|
22
|
+
[design_system_shared_1.AvatarBaseSize.Md]: 'rounded-lg',
|
|
23
|
+
[design_system_shared_1.AvatarBaseSize.Lg]: 'rounded-[10px]',
|
|
24
|
+
[design_system_shared_1.AvatarBaseSize.Xl]: 'rounded-xl', // 12px
|
|
25
25
|
};
|
|
26
26
|
exports.TWCLASSMAP_AVATARBASE_SIZE_BORDER = {
|
|
27
|
-
[
|
|
28
|
-
[
|
|
29
|
-
[
|
|
30
|
-
[
|
|
31
|
-
[
|
|
27
|
+
[design_system_shared_1.AvatarBaseSize.Xs]: 'border-background-default border',
|
|
28
|
+
[design_system_shared_1.AvatarBaseSize.Sm]: 'border-background-default border',
|
|
29
|
+
[design_system_shared_1.AvatarBaseSize.Md]: 'border-background-default border',
|
|
30
|
+
[design_system_shared_1.AvatarBaseSize.Lg]: 'border-background-default border-2',
|
|
31
|
+
[design_system_shared_1.AvatarBaseSize.Xl]: 'border-background-default border-2', // 2px border
|
|
32
32
|
};
|
|
33
33
|
//# sourceMappingURL=AvatarBase.constants.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.constants.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":";;;AAAA,
|
|
1
|
+
{"version":3,"file":"AvatarBase.constants.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":";;;AAAA,kFAAyE;AAE5D,QAAA,oCAAoC,GAG7C;IACF,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,WAAW;IAChC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,WAAW,EAAE,OAAO;CAC1C,CAAC;AAEW,QAAA,8CAA8C,GAGvD;IACF,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB,EAAE,oCAAoC;CAC/E,CAAC;AAEW,QAAA,+CAA+C,GAGxD;IACF,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,gBAAgB;IACrC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,YAAY,EAAE,OAAO;CAC3C,CAAC;AAEW,QAAA,iCAAiC,GAC5C;IACE,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,kCAAkC;IACvD,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,kCAAkC;IACvD,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,kCAAkC;IACvD,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,oCAAoC;IACzD,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,oCAAoC,EAAE,aAAa;CACzE,CAAC","sourcesContent":["import { AvatarBaseSize } from '@metamask-previews/design-system-shared';\n\nexport const TWCLASSMAP_AVATARBASE_SIZE_DIMENSION: Record<\n AvatarBaseSize,\n string\n> = {\n [AvatarBaseSize.Xs]: 'h-4 w-4', // 16px\n [AvatarBaseSize.Sm]: 'h-6 w-6', // 24px\n [AvatarBaseSize.Md]: 'h-8 w-8', // 32px\n [AvatarBaseSize.Lg]: 'h-10 w-10', // 40px\n [AvatarBaseSize.Xl]: 'h-12 w-12', // 48px\n};\n\nexport const TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION: Record<\n AvatarBaseSize,\n string\n> = {\n [AvatarBaseSize.Xs]: 'h-[18px] w-[18px]', // 16px with 1px border on each side\n [AvatarBaseSize.Sm]: 'h-[26px] w-[26px]', // 24px with 1px border on each side\n [AvatarBaseSize.Md]: 'h-[34px] w-[34px]', // 32px with 1px border on each side\n [AvatarBaseSize.Lg]: 'h-[44px] w-[44px]', // 40px with 2px border on each side\n [AvatarBaseSize.Xl]: 'h-[52px] w-[52px]', // 48px with 2px border on each side\n};\n\nexport const TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE: Record<\n AvatarBaseSize,\n string\n> = {\n [AvatarBaseSize.Xs]: 'rounded-sm', // 4px\n [AvatarBaseSize.Sm]: 'rounded-md', // 6px\n [AvatarBaseSize.Md]: 'rounded-lg', // 8px\n [AvatarBaseSize.Lg]: 'rounded-[10px]', // 10px (No tailwind class for this)\n [AvatarBaseSize.Xl]: 'rounded-xl', // 12px\n};\n\nexport const TWCLASSMAP_AVATARBASE_SIZE_BORDER: Record<AvatarBaseSize, string> =\n {\n [AvatarBaseSize.Xs]: 'border-background-default border', // 1px border\n [AvatarBaseSize.Sm]: 'border-background-default border', // 1px border\n [AvatarBaseSize.Md]: 'border-background-default border', // 1px border\n [AvatarBaseSize.Lg]: 'border-background-default border-2', // 2px border\n [AvatarBaseSize.Xl]: 'border-background-default border-2', // 2px border\n };\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { AvatarBaseSize } from "
|
|
1
|
+
import { AvatarBaseSize } from "@metamask-previews/design-system-shared";
|
|
2
2
|
export declare const TWCLASSMAP_AVATARBASE_SIZE_DIMENSION: Record<AvatarBaseSize, string>;
|
|
3
3
|
export declare const TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION: Record<AvatarBaseSize, string>;
|
|
4
4
|
export declare const TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE: Record<AvatarBaseSize, string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.constants.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,
|
|
1
|
+
{"version":3,"file":"AvatarBase.constants.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,gDAAgD;AAEzE,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,cAAc,EACd,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,8CAA8C,EAAE,MAAM,CACjE,cAAc,EACd,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,+CAA+C,EAAE,MAAM,CAClE,cAAc,EACd,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAO1E,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { AvatarBaseSize } from "
|
|
1
|
+
import { AvatarBaseSize } from "@metamask-previews/design-system-shared";
|
|
2
2
|
export declare const TWCLASSMAP_AVATARBASE_SIZE_DIMENSION: Record<AvatarBaseSize, string>;
|
|
3
3
|
export declare const TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION: Record<AvatarBaseSize, string>;
|
|
4
4
|
export declare const TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE: Record<AvatarBaseSize, string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.constants.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,
|
|
1
|
+
{"version":3,"file":"AvatarBase.constants.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,gDAAgD;AAEzE,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,cAAc,EACd,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,8CAA8C,EAAE,MAAM,CACjE,cAAc,EACd,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,+CAA+C,EAAE,MAAM,CAClE,cAAc,EACd,MAAM,CAOP,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAO1E,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.constants.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,
|
|
1
|
+
{"version":3,"file":"AvatarBase.constants.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,gDAAgD;AAEzE,MAAM,CAAC,MAAM,oCAAoC,GAG7C;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,EAAE,OAAO;CAC1C,CAAC;AAEF,MAAM,CAAC,MAAM,8CAA8C,GAGvD;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB;IACxC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,mBAAmB,EAAE,oCAAoC;CAC/E,CAAC;AAEF,MAAM,CAAC,MAAM,+CAA+C,GAGxD;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,gBAAgB;IACrC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,YAAY,EAAE,OAAO;CAC3C,CAAC;AAEF,MAAM,CAAC,MAAM,iCAAiC,GAC5C;IACE,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,kCAAkC;IACvD,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,kCAAkC;IACvD,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,kCAAkC;IACvD,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,oCAAoC;IACzD,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,oCAAoC,EAAE,aAAa;CACzE,CAAC","sourcesContent":["import { AvatarBaseSize } from '@metamask-previews/design-system-shared';\n\nexport const TWCLASSMAP_AVATARBASE_SIZE_DIMENSION: Record<\n AvatarBaseSize,\n string\n> = {\n [AvatarBaseSize.Xs]: 'h-4 w-4', // 16px\n [AvatarBaseSize.Sm]: 'h-6 w-6', // 24px\n [AvatarBaseSize.Md]: 'h-8 w-8', // 32px\n [AvatarBaseSize.Lg]: 'h-10 w-10', // 40px\n [AvatarBaseSize.Xl]: 'h-12 w-12', // 48px\n};\n\nexport const TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION: Record<\n AvatarBaseSize,\n string\n> = {\n [AvatarBaseSize.Xs]: 'h-[18px] w-[18px]', // 16px with 1px border on each side\n [AvatarBaseSize.Sm]: 'h-[26px] w-[26px]', // 24px with 1px border on each side\n [AvatarBaseSize.Md]: 'h-[34px] w-[34px]', // 32px with 1px border on each side\n [AvatarBaseSize.Lg]: 'h-[44px] w-[44px]', // 40px with 2px border on each side\n [AvatarBaseSize.Xl]: 'h-[52px] w-[52px]', // 48px with 2px border on each side\n};\n\nexport const TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE: Record<\n AvatarBaseSize,\n string\n> = {\n [AvatarBaseSize.Xs]: 'rounded-sm', // 4px\n [AvatarBaseSize.Sm]: 'rounded-md', // 6px\n [AvatarBaseSize.Md]: 'rounded-lg', // 8px\n [AvatarBaseSize.Lg]: 'rounded-[10px]', // 10px (No tailwind class for this)\n [AvatarBaseSize.Xl]: 'rounded-xl', // 12px\n};\n\nexport const TWCLASSMAP_AVATARBASE_SIZE_BORDER: Record<AvatarBaseSize, string> =\n {\n [AvatarBaseSize.Xs]: 'border-background-default border', // 1px border\n [AvatarBaseSize.Sm]: 'border-background-default border', // 1px border\n [AvatarBaseSize.Md]: 'border-background-default border', // 1px border\n [AvatarBaseSize.Lg]: 'border-background-default border-2', // 2px border\n [AvatarBaseSize.Xl]: 'border-background-default border-2', // 2px border\n };\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AvatarBase.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAqB,cAAc;AAW1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,qGAsDtB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AvatarBase.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAqB,cAAc;AAW1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,qGAsDtB,CAAC"}
|
|
@@ -4,10 +4,10 @@ function $importDefault(module) {
|
|
|
4
4
|
}
|
|
5
5
|
return module;
|
|
6
6
|
}
|
|
7
|
+
import { AvatarBaseSize, AvatarBaseShape } from "@metamask-previews/design-system-shared";
|
|
7
8
|
import { Slot } from "@radix-ui/react-slot";
|
|
8
9
|
import $React, { forwardRef } from "react";
|
|
9
10
|
const React = $importDefault($React);
|
|
10
|
-
import { AvatarBaseSize, AvatarBaseShape } from "../../types/index.mjs";
|
|
11
11
|
import { twMerge } from "../../utils/tw-merge.mjs";
|
|
12
12
|
import { Text, FontWeight, TextVariant, TextColor } from "../Text/index.mjs";
|
|
13
13
|
import { TWCLASSMAP_AVATARBASE_SIZE_DIMENSION, TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION, TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE, TWCLASSMAP_AVATARBASE_SIZE_BORDER } from "./AvatarBase.constants.mjs";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,6BAA6B;AAC5C,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"AvatarBase.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,cAAc,EACd,eAAe,EAChB,gDAAgD;AACjD,OAAO,EAAE,IAAI,EAAE,6BAA6B;AAC5C,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,SAAS,EAAE,0BAAgB;AAEnE,OAAO,EACL,oCAAoC,EACpC,8CAA8C,EAC9C,+CAA+C,EAC/C,iCAAiC,EAClC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,KAAK,GAAG,eAAe,CAAC,MAAM,EAC9B,OAAO,EACP,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,MAAM,eAAe,GAAG,OAAO;IAC7B,cAAc;IACd,6EAA6E,EAC7E,KAAK,KAAK,eAAe,CAAC,MAAM;QAC9B,CAAC,CAAC,cAAc;QAChB,CAAC,CAAC,+CAA+C,CAAC,IAAI,CAAC;IACzD,OAAO;IACP,SAAS;QACP,CAAC,CAAC,8CAA8C,CAAC,IAAI,CAAC;QACtD,CAAC,CAAC,oCAAoC,CAAC,IAAI,CAAC;IAC9C,SAAS;IACT,SAAS,IAAI,iCAAiC,CAAC,IAAI,CAAC;IACpD,iBAAiB;IACjB,SAAS,CACV,CAAC;IAEF,OAAO,CACL,oBAAC,SAAS,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,IACrE,YAAY,CAAC,CAAC,CAAC,CACd,oBAAC,IAAI,IACH,OAAO,EAAE,WAAW,CAAC,MAAM,EAC3B,UAAU,EAAE,UAAU,CAAC,MAAM,EAC7B,KAAK,EAAE,SAAS,CAAC,SAAS,EAC1B,OAAO,QACP,SAAS,EAAC,WAAW,KACjB,iBAAiB;QAGrB,kCAAO,YAAY,CAAQ,CACtB,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACS,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import {\n AvatarBaseSize,\n AvatarBaseShape,\n} from '@metamask-previews/design-system-shared';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Text, FontWeight, TextVariant, TextColor } from '../Text';\n\nimport {\n TWCLASSMAP_AVATARBASE_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE,\n TWCLASSMAP_AVATARBASE_SIZE_BORDER,\n} from './AvatarBase.constants';\nimport type { AvatarBaseProps } from './AvatarBase.types';\n\nexport const AvatarBase = forwardRef<HTMLDivElement, AvatarBaseProps>(\n (\n {\n children,\n fallbackText,\n fallbackTextProps,\n className,\n size = AvatarBaseSize.Md,\n shape = AvatarBaseShape.Circle,\n asChild,\n style,\n hasBorder = false,\n ...props\n },\n ref,\n ) => {\n const Component = asChild ? Slot : 'div';\n\n const mergedClassName = twMerge(\n // Base styles\n 'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section',\n shape === AvatarBaseShape.Circle\n ? 'rounded-full'\n : TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE[size],\n // Size\n hasBorder\n ? TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION[size]\n : TWCLASSMAP_AVATARBASE_SIZE_DIMENSION[size],\n // Border\n hasBorder && TWCLASSMAP_AVATARBASE_SIZE_BORDER[size],\n // Custom classes\n className,\n );\n\n return (\n <Component ref={ref} className={mergedClassName} style={style} {...props}>\n {fallbackText ? (\n <Text\n variant={TextVariant.BodySm}\n fontWeight={FontWeight.Medium}\n color={TextColor.TextMuted}\n asChild\n className=\"uppercase\"\n {...fallbackTextProps}\n >\n {/* asChild prop renders Text component as a span, it does not create an additional element */}\n <span>{fallbackText}</span>\n </Text>\n ) : (\n children\n )}\n </Component>\n );\n },\n);\n\nAvatarBase.displayName = 'AvatarBase';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.types.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"AvatarBase.types.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarBasePropsShared } from '@metamask-previews/design-system-shared';\nimport type { ComponentProps } from 'react';\n\nimport type { TextProps } from '../Text';\n\nexport type AvatarBaseProps = ComponentProps<'div'> &\n AvatarBasePropsShared & {\n /**\n * Optional test id for querying in tests.\n */\n 'data-testid'?: string;\n /**\n * Optional props to be passed to the Text component when rendering fallback text\n * Only used when fallbackText is provided and no children\n */\n fallbackTextProps?: Partial<\n React.HTMLAttributes<HTMLSpanElement> & TextProps\n >;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a div element\n *\n * @default false\n */\n asChild?: boolean;\n };\n"]}
|
|
@@ -1,32 +1,16 @@
|
|
|
1
|
+
import type { AvatarBasePropsShared } from "@metamask-previews/design-system-shared";
|
|
1
2
|
import type { ComponentProps } from "react";
|
|
2
|
-
import type { AvatarBaseSize, AvatarBaseShape } from "../../types/index.cjs";
|
|
3
3
|
import type { TextProps } from "../Text/index.cjs";
|
|
4
|
-
export type AvatarBaseProps = ComponentProps<'div'> & {
|
|
4
|
+
export type AvatarBaseProps = ComponentProps<'div'> & AvatarBasePropsShared & {
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
7
|
-
* Not required if fallbackText is provided
|
|
6
|
+
* Optional test id for querying in tests.
|
|
8
7
|
*/
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Optional text to display when no children are provided
|
|
12
|
-
*/
|
|
13
|
-
fallbackText?: string;
|
|
8
|
+
'data-testid'?: string;
|
|
14
9
|
/**
|
|
15
10
|
* Optional props to be passed to the Text component when rendering fallback text
|
|
16
11
|
* Only used when fallbackText is provided and no children
|
|
17
12
|
*/
|
|
18
13
|
fallbackTextProps?: Partial<React.HTMLAttributes<HTMLSpanElement> & TextProps>;
|
|
19
|
-
/**
|
|
20
|
-
* Optional prop for additional CSS classes to be applied to the AvatarBase component.
|
|
21
|
-
* These classes will be merged with the component's default classes using twMerge.
|
|
22
|
-
*/
|
|
23
|
-
className?: string;
|
|
24
|
-
/**
|
|
25
|
-
* Optional prop to control the size of the AvatarBase
|
|
26
|
-
*
|
|
27
|
-
* @default AvatarBaseSize.Md
|
|
28
|
-
*/
|
|
29
|
-
size?: AvatarBaseSize;
|
|
30
14
|
/**
|
|
31
15
|
* Optional boolean that determines if the component should merge its props onto its immediate child
|
|
32
16
|
* instead of rendering a div element
|
|
@@ -34,27 +18,5 @@ export type AvatarBaseProps = ComponentProps<'div'> & {
|
|
|
34
18
|
* @default false
|
|
35
19
|
*/
|
|
36
20
|
asChild?: boolean;
|
|
37
|
-
/**
|
|
38
|
-
* Optional CSS styles to be applied to the component.
|
|
39
|
-
* Should be used sparingly and only for dynamic styles that can't be achieved with className.
|
|
40
|
-
*/
|
|
41
|
-
style?: React.CSSProperties;
|
|
42
|
-
/**
|
|
43
|
-
* Optional prop to control the shape of the AvatarBase
|
|
44
|
-
*
|
|
45
|
-
* @default AvatarBaseShape.Circle
|
|
46
|
-
*/
|
|
47
|
-
shape?: AvatarBaseShape;
|
|
48
|
-
/**
|
|
49
|
-
* Optional prop to include the border with the Avatar.
|
|
50
|
-
* For internal use only
|
|
51
|
-
*
|
|
52
|
-
* @default false
|
|
53
|
-
*/
|
|
54
|
-
hasBorder?: boolean;
|
|
55
|
-
/**
|
|
56
|
-
* Optional prop to add a test id to the icon
|
|
57
|
-
*/
|
|
58
|
-
'data-testid'?: string;
|
|
59
21
|
};
|
|
60
22
|
//# sourceMappingURL=AvatarBase.types.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.types.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"AvatarBase.types.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,gDAAgD;AACrF,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,KAAK,CAAC,GACjD,qBAAqB,GAAG;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CACzB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,GAAG,SAAS,CAClD,CAAC;IACF;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC"}
|
|
@@ -1,32 +1,16 @@
|
|
|
1
|
+
import type { AvatarBasePropsShared } from "@metamask-previews/design-system-shared";
|
|
1
2
|
import type { ComponentProps } from "react";
|
|
2
|
-
import type { AvatarBaseSize, AvatarBaseShape } from "../../types/index.mjs";
|
|
3
3
|
import type { TextProps } from "../Text/index.mjs";
|
|
4
|
-
export type AvatarBaseProps = ComponentProps<'div'> & {
|
|
4
|
+
export type AvatarBaseProps = ComponentProps<'div'> & AvatarBasePropsShared & {
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
7
|
-
* Not required if fallbackText is provided
|
|
6
|
+
* Optional test id for querying in tests.
|
|
8
7
|
*/
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Optional text to display when no children are provided
|
|
12
|
-
*/
|
|
13
|
-
fallbackText?: string;
|
|
8
|
+
'data-testid'?: string;
|
|
14
9
|
/**
|
|
15
10
|
* Optional props to be passed to the Text component when rendering fallback text
|
|
16
11
|
* Only used when fallbackText is provided and no children
|
|
17
12
|
*/
|
|
18
13
|
fallbackTextProps?: Partial<React.HTMLAttributes<HTMLSpanElement> & TextProps>;
|
|
19
|
-
/**
|
|
20
|
-
* Optional prop for additional CSS classes to be applied to the AvatarBase component.
|
|
21
|
-
* These classes will be merged with the component's default classes using twMerge.
|
|
22
|
-
*/
|
|
23
|
-
className?: string;
|
|
24
|
-
/**
|
|
25
|
-
* Optional prop to control the size of the AvatarBase
|
|
26
|
-
*
|
|
27
|
-
* @default AvatarBaseSize.Md
|
|
28
|
-
*/
|
|
29
|
-
size?: AvatarBaseSize;
|
|
30
14
|
/**
|
|
31
15
|
* Optional boolean that determines if the component should merge its props onto its immediate child
|
|
32
16
|
* instead of rendering a div element
|
|
@@ -34,27 +18,5 @@ export type AvatarBaseProps = ComponentProps<'div'> & {
|
|
|
34
18
|
* @default false
|
|
35
19
|
*/
|
|
36
20
|
asChild?: boolean;
|
|
37
|
-
/**
|
|
38
|
-
* Optional CSS styles to be applied to the component.
|
|
39
|
-
* Should be used sparingly and only for dynamic styles that can't be achieved with className.
|
|
40
|
-
*/
|
|
41
|
-
style?: React.CSSProperties;
|
|
42
|
-
/**
|
|
43
|
-
* Optional prop to control the shape of the AvatarBase
|
|
44
|
-
*
|
|
45
|
-
* @default AvatarBaseShape.Circle
|
|
46
|
-
*/
|
|
47
|
-
shape?: AvatarBaseShape;
|
|
48
|
-
/**
|
|
49
|
-
* Optional prop to include the border with the Avatar.
|
|
50
|
-
* For internal use only
|
|
51
|
-
*
|
|
52
|
-
* @default false
|
|
53
|
-
*/
|
|
54
|
-
hasBorder?: boolean;
|
|
55
|
-
/**
|
|
56
|
-
* Optional prop to add a test id to the icon
|
|
57
|
-
*/
|
|
58
|
-
'data-testid'?: string;
|
|
59
21
|
};
|
|
60
22
|
//# sourceMappingURL=AvatarBase.types.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"AvatarBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,gDAAgD;AACrF,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,KAAK,CAAC,GACjD,qBAAqB,GAAG;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CACzB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,GAAG,SAAS,CAClD,CAAC;IACF;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.types.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"AvatarBase.types.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarBasePropsShared } from '@metamask-previews/design-system-shared';\nimport type { ComponentProps } from 'react';\n\nimport type { TextProps } from '../Text';\n\nexport type AvatarBaseProps = ComponentProps<'div'> &\n AvatarBasePropsShared & {\n /**\n * Optional test id for querying in tests.\n */\n 'data-testid'?: string;\n /**\n * Optional props to be passed to the Text component when rendering fallback text\n * Only used when fallbackText is provided and no children\n */\n fallbackTextProps?: Partial<\n React.HTMLAttributes<HTMLSpanElement> & TextProps\n >;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a div element\n *\n * @default false\n */\n asChild?: boolean;\n };\n"]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.AvatarBase = exports.AvatarBaseShape = exports.AvatarBaseSize = void 0;
|
|
4
|
-
var
|
|
5
|
-
Object.defineProperty(exports, "AvatarBaseSize", { enumerable: true, get: function () { return
|
|
6
|
-
Object.defineProperty(exports, "AvatarBaseShape", { enumerable: true, get: function () { return
|
|
4
|
+
var design_system_shared_1 = require("@metamask-previews/design-system-shared");
|
|
5
|
+
Object.defineProperty(exports, "AvatarBaseSize", { enumerable: true, get: function () { return design_system_shared_1.AvatarBaseSize; } });
|
|
6
|
+
Object.defineProperty(exports, "AvatarBaseShape", { enumerable: true, get: function () { return design_system_shared_1.AvatarBaseShape; } });
|
|
7
7
|
var AvatarBase_1 = require("./AvatarBase.cjs");
|
|
8
8
|
Object.defineProperty(exports, "AvatarBase", { enumerable: true, get: function () { return AvatarBase_1.AvatarBase; } });
|
|
9
9
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":";;;AAAA
|
|
1
|
+
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":";;;AAAA,gFAGiD;AAF/C,sHAAA,cAAc,OAAA;AACd,uHAAA,eAAe,OAAA;AAEjB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export {\n AvatarBaseSize,\n AvatarBaseShape,\n} from '@metamask-previews/design-system-shared';\nexport { AvatarBase } from './AvatarBase';\nexport type { AvatarBaseProps } from './AvatarBase.types';\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { AvatarBaseSize, AvatarBaseShape } from "
|
|
1
|
+
export { AvatarBaseSize, AvatarBaseShape, } from "@metamask-previews/design-system-shared";
|
|
2
2
|
export { AvatarBase } from "./AvatarBase.cjs";
|
|
3
3
|
export type { AvatarBaseProps } from "./AvatarBase.types.cjs";
|
|
4
4
|
//# sourceMappingURL=index.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,eAAe,GAChB,gDAAgD;AACjD,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { AvatarBaseSize, AvatarBaseShape } from "
|
|
1
|
+
export { AvatarBaseSize, AvatarBaseShape, } from "@metamask-previews/design-system-shared";
|
|
2
2
|
export { AvatarBase } from "./AvatarBase.mjs";
|
|
3
3
|
export type { AvatarBaseProps } from "./AvatarBase.types.mjs";
|
|
4
4
|
//# sourceMappingURL=index.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,eAAe,GAChB,gDAAgD;AACjD,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,eAAe,EAChB,gDAAgD;AACjD,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export {\n AvatarBaseSize,\n AvatarBaseShape,\n} from '@metamask-previews/design-system-shared';\nexport { AvatarBase } from './AvatarBase';\nexport type { AvatarBaseProps } from './AvatarBase.types';\n"]}
|
|
@@ -16,15 +16,15 @@ exports.MAP_BANNER_ALERT_SEVERITY_ICON_COLOR = {
|
|
|
16
16
|
danger: types_1.IconColor.ErrorDefault,
|
|
17
17
|
};
|
|
18
18
|
exports.MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR = {
|
|
19
|
-
info:
|
|
20
|
-
success:
|
|
21
|
-
warning:
|
|
22
|
-
danger:
|
|
19
|
+
info: types_1.BoxBackgroundColor.PrimaryMuted,
|
|
20
|
+
success: types_1.BoxBackgroundColor.SuccessMuted,
|
|
21
|
+
warning: types_1.BoxBackgroundColor.WarningMuted,
|
|
22
|
+
danger: types_1.BoxBackgroundColor.ErrorMuted,
|
|
23
23
|
};
|
|
24
24
|
exports.MAP_BANNER_ALERT_SEVERITY_BORDER_COLOR = {
|
|
25
|
-
info:
|
|
26
|
-
success:
|
|
27
|
-
warning:
|
|
28
|
-
danger:
|
|
25
|
+
info: types_1.BoxBorderColor.PrimaryDefault,
|
|
26
|
+
success: types_1.BoxBorderColor.SuccessDefault,
|
|
27
|
+
warning: types_1.BoxBorderColor.WarningDefault,
|
|
28
|
+
danger: types_1.BoxBorderColor.ErrorDefault,
|
|
29
29
|
};
|
|
30
30
|
//# sourceMappingURL=BannerAlert.constants.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerAlert.constants.cjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":";;;AAAA,
|
|
1
|
+
{"version":3,"file":"BannerAlert.constants.cjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":";;;AAAA,kFAA8E;AAE9E,iDAKqB;AAER,QAAA,mCAAmC,GAG5C;IACF,IAAI,EAAE,gBAAQ,CAAC,IAAI;IACnB,OAAO,EAAE,gBAAQ,CAAC,YAAY;IAC9B,OAAO,EAAE,gBAAQ,CAAC,MAAM;IACxB,MAAM,EAAE,gBAAQ,CAAC,MAAM;CACxB,CAAC;AAEW,QAAA,oCAAoC,GAG7C;IACF,IAAI,EAAE,iBAAS,CAAC,cAAc;IAC9B,OAAO,EAAE,iBAAS,CAAC,cAAc;IACjC,OAAO,EAAE,iBAAS,CAAC,cAAc;IACjC,MAAM,EAAE,iBAAS,CAAC,YAAY;CAC/B,CAAC;AAEW,QAAA,0CAA0C,GAGnD;IACF,IAAI,EAAE,0BAAkB,CAAC,YAAY;IACrC,OAAO,EAAE,0BAAkB,CAAC,YAAY;IACxC,OAAO,EAAE,0BAAkB,CAAC,YAAY;IACxC,MAAM,EAAE,0BAAkB,CAAC,UAAU;CACtC,CAAC;AAEW,QAAA,sCAAsC,GAG/C;IACF,IAAI,EAAE,sBAAc,CAAC,cAAc;IACnC,OAAO,EAAE,sBAAc,CAAC,cAAc;IACtC,OAAO,EAAE,sBAAc,CAAC,cAAc;IACtC,MAAM,EAAE,sBAAc,CAAC,YAAY;CACpC,CAAC","sourcesContent":["import { BannerAlertSeverity } from '@metamask-previews/design-system-shared';\n\nimport {\n BoxBackgroundColor,\n BoxBorderColor,\n IconColor,\n IconName,\n} from '../../types';\n\nexport const MAP_BANNER_ALERT_SEVERITY_ICON_NAME: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n IconName\n> = {\n info: IconName.Info,\n success: IconName.Confirmation,\n warning: IconName.Danger,\n danger: IconName.Danger,\n};\n\nexport const MAP_BANNER_ALERT_SEVERITY_ICON_COLOR: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n IconColor\n> = {\n info: IconColor.PrimaryDefault,\n success: IconColor.SuccessDefault,\n warning: IconColor.WarningDefault,\n danger: IconColor.ErrorDefault,\n};\n\nexport const MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n BoxBackgroundColor\n> = {\n info: BoxBackgroundColor.PrimaryMuted,\n success: BoxBackgroundColor.SuccessMuted,\n warning: BoxBackgroundColor.WarningMuted,\n danger: BoxBackgroundColor.ErrorMuted,\n};\n\nexport const MAP_BANNER_ALERT_SEVERITY_BORDER_COLOR: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n BoxBorderColor\n> = {\n info: BoxBorderColor.PrimaryDefault,\n success: BoxBorderColor.SuccessDefault,\n warning: BoxBorderColor.WarningDefault,\n danger: BoxBorderColor.ErrorDefault,\n};\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { BannerAlertSeverity
|
|
2
|
-
import { IconColor, IconName } from "../../types/index.cjs";
|
|
1
|
+
import { BannerAlertSeverity } from "@metamask-previews/design-system-shared";
|
|
2
|
+
import { BoxBackgroundColor, BoxBorderColor, IconColor, IconName } from "../../types/index.cjs";
|
|
3
3
|
export declare const MAP_BANNER_ALERT_SEVERITY_ICON_NAME: Record<(typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity], IconName>;
|
|
4
4
|
export declare const MAP_BANNER_ALERT_SEVERITY_ICON_COLOR: Record<(typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity], IconColor>;
|
|
5
5
|
export declare const MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR: Record<(typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity], BoxBackgroundColor>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerAlert.constants.d.cts","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"BannerAlert.constants.d.cts","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,gDAAgD;AAE9E,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,SAAS,EACT,QAAQ,EACT,8BAAoB;AAErB,eAAO,MAAM,mCAAmC,EAAE,MAAM,CACtD,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,QAAQ,CAMT,CAAC;AAEF,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,SAAS,CAMV,CAAC;AAEF,eAAO,MAAM,0CAA0C,EAAE,MAAM,CAC7D,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,kBAAkB,CAMnB,CAAC;AAEF,eAAO,MAAM,sCAAsC,EAAE,MAAM,CACzD,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,cAAc,CAMf,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { BannerAlertSeverity
|
|
2
|
-
import { IconColor, IconName } from "../../types/index.mjs";
|
|
1
|
+
import { BannerAlertSeverity } from "@metamask-previews/design-system-shared";
|
|
2
|
+
import { BoxBackgroundColor, BoxBorderColor, IconColor, IconName } from "../../types/index.mjs";
|
|
3
3
|
export declare const MAP_BANNER_ALERT_SEVERITY_ICON_NAME: Record<(typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity], IconName>;
|
|
4
4
|
export declare const MAP_BANNER_ALERT_SEVERITY_ICON_COLOR: Record<(typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity], IconColor>;
|
|
5
5
|
export declare const MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR: Record<(typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity], BoxBackgroundColor>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerAlert.constants.d.mts","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"BannerAlert.constants.d.mts","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,gDAAgD;AAE9E,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,SAAS,EACT,QAAQ,EACT,8BAAoB;AAErB,eAAO,MAAM,mCAAmC,EAAE,MAAM,CACtD,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,QAAQ,CAMT,CAAC;AAEF,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,SAAS,CAMV,CAAC;AAEF,eAAO,MAAM,0CAA0C,EAAE,MAAM,CAC7D,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,kBAAkB,CAMnB,CAAC;AAEF,eAAO,MAAM,sCAAsC,EAAE,MAAM,CACzD,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,EAC9D,cAAc,CAMf,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { BannerAlertSeverity
|
|
2
|
-
import { IconColor, IconName } from "../../types/index.mjs";
|
|
1
|
+
import { BannerAlertSeverity } from "@metamask-previews/design-system-shared";
|
|
2
|
+
import { BoxBackgroundColor, BoxBorderColor, IconColor, IconName } from "../../types/index.mjs";
|
|
3
3
|
export const MAP_BANNER_ALERT_SEVERITY_ICON_NAME = {
|
|
4
4
|
info: IconName.Info,
|
|
5
5
|
success: IconName.Confirmation,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerAlert.constants.mjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"BannerAlert.constants.mjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,gDAAgD;AAE9E,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,SAAS,EACT,QAAQ,EACT,8BAAoB;AAErB,MAAM,CAAC,MAAM,mCAAmC,GAG5C;IACF,IAAI,EAAE,QAAQ,CAAC,IAAI;IACnB,OAAO,EAAE,QAAQ,CAAC,YAAY;IAC9B,OAAO,EAAE,QAAQ,CAAC,MAAM;IACxB,MAAM,EAAE,QAAQ,CAAC,MAAM;CACxB,CAAC;AAEF,MAAM,CAAC,MAAM,oCAAoC,GAG7C;IACF,IAAI,EAAE,SAAS,CAAC,cAAc;IAC9B,OAAO,EAAE,SAAS,CAAC,cAAc;IACjC,OAAO,EAAE,SAAS,CAAC,cAAc;IACjC,MAAM,EAAE,SAAS,CAAC,YAAY;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,0CAA0C,GAGnD;IACF,IAAI,EAAE,kBAAkB,CAAC,YAAY;IACrC,OAAO,EAAE,kBAAkB,CAAC,YAAY;IACxC,OAAO,EAAE,kBAAkB,CAAC,YAAY;IACxC,MAAM,EAAE,kBAAkB,CAAC,UAAU;CACtC,CAAC;AAEF,MAAM,CAAC,MAAM,sCAAsC,GAG/C;IACF,IAAI,EAAE,cAAc,CAAC,cAAc;IACnC,OAAO,EAAE,cAAc,CAAC,cAAc;IACtC,OAAO,EAAE,cAAc,CAAC,cAAc;IACtC,MAAM,EAAE,cAAc,CAAC,YAAY;CACpC,CAAC","sourcesContent":["import { BannerAlertSeverity } from '@metamask-previews/design-system-shared';\n\nimport {\n BoxBackgroundColor,\n BoxBorderColor,\n IconColor,\n IconName,\n} from '../../types';\n\nexport const MAP_BANNER_ALERT_SEVERITY_ICON_NAME: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n IconName\n> = {\n info: IconName.Info,\n success: IconName.Confirmation,\n warning: IconName.Danger,\n danger: IconName.Danger,\n};\n\nexport const MAP_BANNER_ALERT_SEVERITY_ICON_COLOR: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n IconColor\n> = {\n info: IconColor.PrimaryDefault,\n success: IconColor.SuccessDefault,\n warning: IconColor.WarningDefault,\n danger: IconColor.ErrorDefault,\n};\n\nexport const MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n BoxBackgroundColor\n> = {\n info: BoxBackgroundColor.PrimaryMuted,\n success: BoxBackgroundColor.SuccessMuted,\n warning: BoxBackgroundColor.WarningMuted,\n danger: BoxBackgroundColor.ErrorMuted,\n};\n\nexport const MAP_BANNER_ALERT_SEVERITY_BORDER_COLOR: Record<\n (typeof BannerAlertSeverity)[keyof typeof BannerAlertSeverity],\n BoxBorderColor\n> = {\n info: BoxBorderColor.PrimaryDefault,\n success: BoxBorderColor.SuccessDefault,\n warning: BoxBorderColor.WarningDefault,\n danger: BoxBorderColor.ErrorDefault,\n};\n"]}
|
|
@@ -24,7 +24,6 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
24
24
|
};
|
|
25
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
26
|
exports.BannerBase = void 0;
|
|
27
|
-
const design_system_shared_1 = require("@metamask-previews/design-system-shared");
|
|
28
27
|
const react_1 = __importStar(require("react"));
|
|
29
28
|
const types_1 = require("../../types/index.cjs");
|
|
30
29
|
const tw_merge_1 = require("../../utils/tw-merge.cjs");
|
|
@@ -39,7 +38,7 @@ exports.BannerBase = (0, react_1.forwardRef)(({ title, titleProps, description,
|
|
|
39
38
|
const { ariaLabel: closeButtonAriaLabel = 'Close banner', onClick: closeButtonPropsOnClick, className: closeButtonClassName, ...resolvedCloseButtonProps } = closeButtonProps ?? {};
|
|
40
39
|
const shouldShowCloseButton = Boolean(onClose || closeButtonProps);
|
|
41
40
|
const shouldShowActionButton = Boolean(actionButtonOnClick);
|
|
42
|
-
return (react_1.default.createElement(Box_1.Box, { ref: ref, flexDirection:
|
|
41
|
+
return (react_1.default.createElement(Box_1.Box, { ref: ref, flexDirection: types_1.BoxFlexDirection.Row, alignItems: types_1.BoxAlignItems.Start, gap: 2, backgroundColor: types_1.BoxBackgroundColor.BackgroundDefault, padding: 3, className: (0, tw_merge_1.twMerge)('rounded-sm', className), ...props },
|
|
43
42
|
startAccessory,
|
|
44
43
|
react_1.default.createElement(Box_1.Box, { className: "min-w-0 flex-1" },
|
|
45
44
|
hasContent(title) &&
|