@metamask-previews/design-system-react 0.15.0-preview.a73a010 → 0.17.0-preview.9d477a9
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/CHANGELOG.md +19 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.cjs +1 -2
- package/dist/components/AvatarFavicon/AvatarFavicon.cjs.map +1 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.d.cts.map +1 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.d.mts.map +1 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.mjs +1 -2
- package/dist/components/AvatarFavicon/AvatarFavicon.mjs.map +1 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.types.cjs.map +1 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.types.d.cts +6 -6
- package/dist/components/AvatarFavicon/AvatarFavicon.types.d.cts.map +1 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.types.d.mts +6 -6
- package/dist/components/AvatarFavicon/AvatarFavicon.types.d.mts.map +1 -1
- package/dist/components/AvatarFavicon/AvatarFavicon.types.mjs.map +1 -1
- package/dist/components/AvatarFavicon/index.cjs +2 -2
- package/dist/components/AvatarFavicon/index.cjs.map +1 -1
- package/dist/components/AvatarFavicon/index.d.cts +1 -1
- package/dist/components/AvatarFavicon/index.d.cts.map +1 -1
- package/dist/components/AvatarFavicon/index.d.mts +1 -1
- package/dist/components/AvatarFavicon/index.d.mts.map +1 -1
- package/dist/components/AvatarFavicon/index.mjs +1 -1
- package/dist/components/AvatarFavicon/index.mjs.map +1 -1
- package/dist/components/BadgeNetwork/BadgeNetwork.types.cjs.map +1 -1
- package/dist/components/BadgeNetwork/BadgeNetwork.types.d.cts +6 -16
- package/dist/components/BadgeNetwork/BadgeNetwork.types.d.cts.map +1 -1
- package/dist/components/BadgeNetwork/BadgeNetwork.types.d.mts +6 -16
- package/dist/components/BadgeNetwork/BadgeNetwork.types.d.mts.map +1 -1
- package/dist/components/BadgeNetwork/BadgeNetwork.types.mjs.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.cjs +1 -2
- package/dist/components/BannerAlert/BannerAlert.cjs.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.constants.cjs +16 -16
- 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/BannerAlert/BannerAlert.d.cts +6 -6
- package/dist/components/BannerAlert/BannerAlert.d.cts.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.d.mts +6 -6
- package/dist/components/BannerAlert/BannerAlert.d.mts.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.mjs +1 -2
- package/dist/components/BannerAlert/BannerAlert.mjs.map +1 -1
- package/dist/components/BannerBase/BannerBase.cjs +5 -5
- package/dist/components/BannerBase/BannerBase.cjs.map +1 -1
- package/dist/components/BannerBase/BannerBase.d.cts +2 -1
- package/dist/components/BannerBase/BannerBase.d.cts.map +1 -1
- package/dist/components/BannerBase/BannerBase.d.mts +2 -1
- package/dist/components/BannerBase/BannerBase.d.mts.map +1 -1
- package/dist/components/BannerBase/BannerBase.mjs +2 -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/components/ButtonIcon/ButtonIcon.constants.d.cts +3 -4
- package/dist/components/ButtonIcon/ButtonIcon.constants.d.cts.map +1 -1
- package/dist/components/ButtonIcon/ButtonIcon.constants.d.mts +3 -4
- package/dist/components/ButtonIcon/ButtonIcon.constants.d.mts.map +1 -1
- package/dist/components/Checkbox/Checkbox.types.cjs.map +1 -1
- package/dist/components/Checkbox/Checkbox.types.d.cts +2 -28
- package/dist/components/Checkbox/Checkbox.types.d.cts.map +1 -1
- package/dist/components/Checkbox/Checkbox.types.d.mts +2 -28
- package/dist/components/Checkbox/Checkbox.types.d.mts.map +1 -1
- package/dist/components/Checkbox/Checkbox.types.mjs.map +1 -1
- package/dist/components/Icon/Icon.cjs +2 -2
- package/dist/components/Icon/Icon.cjs.map +1 -1
- package/dist/components/Icon/Icon.constants.cjs +6 -6
- package/dist/components/Icon/Icon.constants.cjs.map +1 -1
- package/dist/components/Icon/Icon.constants.d.cts +1 -1
- package/dist/components/Icon/Icon.constants.d.cts.map +1 -1
- package/dist/components/Icon/Icon.constants.d.mts +1 -1
- package/dist/components/Icon/Icon.constants.d.mts.map +1 -1
- package/dist/components/Icon/Icon.constants.mjs +1 -1
- package/dist/components/Icon/Icon.constants.mjs.map +1 -1
- package/dist/components/Icon/Icon.d.cts.map +1 -1
- package/dist/components/Icon/Icon.d.mts.map +1 -1
- package/dist/components/Icon/Icon.mjs +1 -1
- package/dist/components/Icon/Icon.mjs.map +1 -1
- package/dist/components/Icon/Icon.types.cjs.map +1 -1
- package/dist/components/Icon/Icon.types.d.cts +2 -19
- package/dist/components/Icon/Icon.types.d.cts.map +1 -1
- package/dist/components/Icon/Icon.types.d.mts +2 -19
- package/dist/components/Icon/Icon.types.d.mts.map +1 -1
- package/dist/components/Icon/Icon.types.mjs.map +1 -1
- package/dist/components/Icon/icons/index.cjs +76 -76
- package/dist/components/Icon/icons/index.cjs.map +1 -1
- package/dist/components/Icon/icons/index.d.cts +38 -38
- package/dist/components/Icon/icons/index.d.cts.map +1 -1
- package/dist/components/Icon/icons/index.d.mts +38 -38
- package/dist/components/Icon/icons/index.d.mts.map +1 -1
- package/dist/components/Icon/icons/index.mjs +76 -76
- package/dist/components/Icon/icons/index.mjs.map +1 -1
- package/dist/components/Icon/index.cjs +5 -5
- package/dist/components/Icon/index.cjs.map +1 -1
- package/dist/components/Icon/index.d.cts +1 -1
- package/dist/components/Icon/index.d.cts.map +1 -1
- package/dist/components/Icon/index.d.mts +1 -1
- package/dist/components/Icon/index.d.mts.map +1 -1
- package/dist/components/Icon/index.mjs +1 -1
- package/dist/components/Icon/index.mjs.map +1 -1
- package/dist/components/Input/Input.cjs +3 -3
- package/dist/components/Input/Input.cjs.map +1 -1
- package/dist/components/Input/Input.d.cts +1 -1
- package/dist/components/Input/Input.d.cts.map +1 -1
- package/dist/components/Input/Input.d.mts +1 -1
- package/dist/components/Input/Input.d.mts.map +1 -1
- package/dist/components/Input/Input.mjs +3 -3
- package/dist/components/Input/Input.mjs.map +1 -1
- package/dist/components/Input/Input.types.cjs.map +1 -1
- package/dist/components/Input/Input.types.d.cts +1 -1
- package/dist/components/Input/Input.types.d.cts.map +1 -1
- package/dist/components/Input/Input.types.d.mts +1 -1
- package/dist/components/Input/Input.types.d.mts.map +1 -1
- package/dist/components/Input/Input.types.mjs.map +1 -1
- package/dist/components/Text/Text.cjs +5 -3
- package/dist/components/Text/Text.cjs.map +1 -1
- package/dist/components/Text/Text.constants.cjs +60 -46
- package/dist/components/Text/Text.constants.cjs.map +1 -1
- package/dist/components/Text/Text.constants.d.cts +6 -3
- package/dist/components/Text/Text.constants.d.cts.map +1 -1
- package/dist/components/Text/Text.constants.d.mts +6 -3
- package/dist/components/Text/Text.constants.d.mts.map +1 -1
- package/dist/components/Text/Text.constants.mjs +17 -3
- package/dist/components/Text/Text.constants.mjs.map +1 -1
- package/dist/components/Text/Text.d.cts.map +1 -1
- package/dist/components/Text/Text.d.mts.map +1 -1
- package/dist/components/Text/Text.mjs +5 -3
- package/dist/components/Text/Text.mjs.map +1 -1
- package/dist/components/Text/Text.types.cjs.map +1 -1
- package/dist/components/Text/Text.types.d.cts +4 -39
- package/dist/components/Text/Text.types.d.cts.map +1 -1
- package/dist/components/Text/Text.types.d.mts +4 -39
- package/dist/components/Text/Text.types.d.mts.map +1 -1
- package/dist/components/Text/Text.types.mjs.map +1 -1
- package/dist/components/Text/index.cjs +7 -6
- package/dist/components/Text/index.cjs.map +1 -1
- package/dist/components/Text/index.d.cts +2 -1
- package/dist/components/Text/index.d.cts.map +1 -1
- package/dist/components/Text/index.d.mts +2 -1
- package/dist/components/Text/index.d.mts.map +1 -1
- package/dist/components/Text/index.mjs +2 -1
- package/dist/components/Text/index.mjs.map +1 -1
- package/dist/types/index.cjs +194 -488
- package/dist/types/index.cjs.map +1 -1
- package/dist/types/index.d.cts +194 -462
- package/dist/types/index.d.cts.map +1 -1
- package/dist/types/index.d.mts +194 -462
- package/dist/types/index.d.mts.map +1 -1
- package/dist/types/index.mjs +189 -482
- package/dist/types/index.mjs.map +1 -1
- package/package.json +5 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":";;;AAAA
|
|
1
|
+
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":";;;AAAA,gFAAwF;AAA/E,iHAAA,SAAS,OAAA;AAAE,gHAAA,QAAQ,OAAA;AAAE,gHAAA,QAAQ,OAAA;AACtC,mCAA8B;AAArB,4FAAA,IAAI,OAAA","sourcesContent":["export { IconColor, IconName, IconSize } from '@metamask-previews/design-system-shared';\nexport { Icon } from './Icon';\nexport type { IconProps } from './Icon.types';\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { IconName, IconSize
|
|
1
|
+
export { IconColor, IconName, IconSize } from "@metamask-previews/design-system-shared";
|
|
2
2
|
export { Icon } from "./Icon.cjs";
|
|
3
3
|
export type { IconProps } from "./Icon.types.cjs";
|
|
4
4
|
//# sourceMappingURL=index.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,gDAAgD;AACxF,OAAO,EAAE,IAAI,EAAE,mBAAe;AAC9B,YAAY,EAAE,SAAS,EAAE,yBAAqB"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { IconName, IconSize
|
|
1
|
+
export { IconColor, IconName, IconSize } from "@metamask-previews/design-system-shared";
|
|
2
2
|
export { Icon } from "./Icon.mjs";
|
|
3
3
|
export type { IconProps } from "./Icon.types.mjs";
|
|
4
4
|
//# sourceMappingURL=index.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,gDAAgD;AACxF,OAAO,EAAE,IAAI,EAAE,mBAAe;AAC9B,YAAY,EAAE,SAAS,EAAE,yBAAqB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,gDAAgD;AACxF,OAAO,EAAE,IAAI,EAAE,mBAAe","sourcesContent":["export { IconColor, IconName, IconSize } from '@metamask-previews/design-system-shared';\nexport { Icon } from './Icon';\nexport type { IconProps } from './Icon.types';\n"]}
|
|
@@ -24,12 +24,12 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
24
24
|
};
|
|
25
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
26
|
exports.Input = void 0;
|
|
27
|
+
const design_system_shared_1 = require("@metamask-previews/design-system-shared");
|
|
27
28
|
const react_1 = __importStar(require("react"));
|
|
28
|
-
const types_1 = require("../../types/index.cjs");
|
|
29
29
|
const tw_merge_1 = require("../../utils/tw-merge.cjs");
|
|
30
30
|
const Text_constants_1 = require("../Text/Text.constants.cjs");
|
|
31
|
-
exports.Input = (0, react_1.forwardRef)(({ textVariant =
|
|
32
|
-
const mergedClassName = (0, tw_merge_1.twMerge)('w-full rounded border bg-default text-default outline-none transition-colors', 'border-transparent focus:border-primary-default focus:outline-none', 'placeholder:text-alternative', Text_constants_1.
|
|
31
|
+
exports.Input = (0, react_1.forwardRef)(({ textVariant = design_system_shared_1.TextVariant.BodyMd, isDisabled = false, isReadonly = false, className, style, ...rest }, ref) => {
|
|
32
|
+
const mergedClassName = (0, tw_merge_1.twMerge)('w-full rounded border bg-default text-default outline-none transition-colors', 'border-transparent focus:border-primary-default focus:outline-none', 'placeholder:text-alternative', Text_constants_1.TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[textVariant], Text_constants_1.TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant], isDisabled && 'cursor-not-allowed opacity-50', className);
|
|
33
33
|
return (react_1.default.createElement("input", { ref: ref, className: mergedClassName, style: style, ...rest, disabled: isDisabled, readOnly: isReadonly }));
|
|
34
34
|
});
|
|
35
35
|
exports.Input.displayName = 'Input';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,
|
|
1
|
+
{"version":3,"file":"Input.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kFAAsE;AACtE,+CAA0C;AAE1C,uDAA+C;AAC/C,+DAGgC;AAInB,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,WAAW,GAAG,kCAAW,CAAC,MAAM,EAChC,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,IAAA,kBAAO,EAC7B,8EAA8E,EAC9E,oEAAoE,EACpE,8BAA8B,EAC9B,kDAAiC,CAAC,WAAW,CAAC,EAC9C,mDAAkC,CAAC,WAAW,CAAC,EAC/C,UAAU,IAAI,+BAA+B,EAC7C,SAAS,CACV,CAAC;IAEF,OAAO,CACL,yCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,KAAK,KACR,IAAI,EACR,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,GACpB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import { TextVariant } from '@metamask-previews/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE,\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n textVariant = TextVariant.BodyMd,\n isDisabled = false,\n isReadonly = false,\n className,\n style,\n ...rest\n },\n ref,\n ) => {\n const mergedClassName = twMerge(\n 'w-full rounded border bg-default text-default outline-none transition-colors',\n 'border-transparent focus:border-primary-default focus:outline-none',\n 'placeholder:text-alternative',\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[textVariant],\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant],\n isDisabled && 'cursor-not-allowed opacity-50',\n className,\n );\n\n return (\n <input\n ref={ref}\n className={mergedClassName}\n style={style}\n {...rest}\n disabled={isDisabled}\n readOnly={isReadonly}\n />\n );\n },\n);\n\nInput.displayName = 'Input';\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { TextVariant } from "@metamask-previews/design-system-shared";
|
|
1
2
|
import React from "react";
|
|
2
|
-
import { TextVariant } from "../../types/index.cjs";
|
|
3
3
|
export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "disabled" | "readOnly"> & {
|
|
4
4
|
textVariant?: TextVariant | undefined;
|
|
5
5
|
isDisabled?: boolean | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Input.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,gDAAgD;AACtE,OAAO,KAAqB,cAAc;AAU1C,eAAO,MAAM,KAAK;;;;;;0CAiCjB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { TextVariant } from "@metamask-previews/design-system-shared";
|
|
1
2
|
import React from "react";
|
|
2
|
-
import { TextVariant } from "../../types/index.mjs";
|
|
3
3
|
export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "disabled" | "readOnly"> & {
|
|
4
4
|
textVariant?: TextVariant | undefined;
|
|
5
5
|
isDisabled?: boolean | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Input.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,gDAAgD;AACtE,OAAO,KAAqB,cAAc;AAU1C,eAAO,MAAM,KAAK;;;;;;0CAiCjB,CAAC"}
|
|
@@ -4,13 +4,13 @@ function $importDefault(module) {
|
|
|
4
4
|
}
|
|
5
5
|
return module;
|
|
6
6
|
}
|
|
7
|
+
import { TextVariant } from "@metamask-previews/design-system-shared";
|
|
7
8
|
import $React, { forwardRef } from "react";
|
|
8
9
|
const React = $importDefault($React);
|
|
9
|
-
import { TextVariant } from "../../types/index.mjs";
|
|
10
10
|
import { twMerge } from "../../utils/tw-merge.mjs";
|
|
11
|
-
import {
|
|
11
|
+
import { TWCLASSMAP_TEXT_VARIANT_FONTSTYLE, TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT } from "../Text/Text.constants.mjs";
|
|
12
12
|
export const Input = forwardRef(({ textVariant = TextVariant.BodyMd, isDisabled = false, isReadonly = false, className, style, ...rest }, ref) => {
|
|
13
|
-
const mergedClassName = twMerge('w-full rounded border bg-default text-default outline-none transition-colors', 'border-transparent focus:border-primary-default focus:outline-none', 'placeholder:text-alternative',
|
|
13
|
+
const mergedClassName = twMerge('w-full rounded border bg-default text-default outline-none transition-colors', 'border-transparent focus:border-primary-default focus:outline-none', 'placeholder:text-alternative', TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[textVariant], TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant], isDisabled && 'cursor-not-allowed opacity-50', className);
|
|
14
14
|
return (React.createElement("input", { ref: ref, className: mergedClassName, style: style, ...rest, disabled: isDisabled, readOnly: isReadonly }));
|
|
15
15
|
});
|
|
16
16
|
Input.displayName = 'Input';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Input.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,gDAAgD;AACtE,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EACL,iCAAiC,EACjC,kCAAkC,EACnC,mCAA+B;AAIhC,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EACE,WAAW,GAAG,WAAW,CAAC,MAAM,EAChC,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,OAAO,CAC7B,8EAA8E,EAC9E,oEAAoE,EACpE,8BAA8B,EAC9B,iCAAiC,CAAC,WAAW,CAAC,EAC9C,kCAAkC,CAAC,WAAW,CAAC,EAC/C,UAAU,IAAI,+BAA+B,EAC7C,SAAS,CACV,CAAC;IAEF,OAAO,CACL,+BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,KAAK,KACR,IAAI,EACR,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,GACpB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import { TextVariant } from '@metamask-previews/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE,\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n textVariant = TextVariant.BodyMd,\n isDisabled = false,\n isReadonly = false,\n className,\n style,\n ...rest\n },\n ref,\n ) => {\n const mergedClassName = twMerge(\n 'w-full rounded border bg-default text-default outline-none transition-colors',\n 'border-transparent focus:border-primary-default focus:outline-none',\n 'placeholder:text-alternative',\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[textVariant],\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant],\n isDisabled && 'cursor-not-allowed opacity-50',\n className,\n );\n\n return (\n <input\n ref={ref}\n className={mergedClassName}\n style={style}\n {...rest}\n disabled={isDisabled}\n readOnly={isReadonly}\n />\n );\n },\n);\n\nInput.displayName = 'Input';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"Input.types.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { TextVariant } from '@metamask-previews/design-system-shared';\nimport type { ComponentPropsWithoutRef } from 'react';\n\nexport type InputProps = Omit<\n ComponentPropsWithoutRef<'input'>,\n 'disabled' | 'readOnly'\n> & {\n /**\n * Optional enum to select between Typography variants.\n *\n * @default TextVariant.BodyMd\n */\n textVariant?: TextVariant;\n /**\n * Optional boolean to disable Input.\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional boolean to show readonly input.\n *\n * @default false\n */\n isReadonly?: boolean;\n /**\n * Optional prop for additional CSS classes.\n */\n className?: string;\n /**\n * Optional inline styles.\n */\n style?: React.CSSProperties;\n};\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import type { TextVariant } from "@metamask-previews/design-system-shared";
|
|
1
2
|
import type { ComponentPropsWithoutRef } from "react";
|
|
2
|
-
import type { TextVariant } from "../../types/index.cjs";
|
|
3
3
|
export type InputProps = Omit<ComponentPropsWithoutRef<'input'>, 'disabled' | 'readOnly'> & {
|
|
4
4
|
/**
|
|
5
5
|
* Optional enum to select between Typography variants.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Input.types.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,gDAAgD;AAC3E,OAAO,KAAK,EAAE,wBAAwB,EAAE,cAAc;AAEtD,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,wBAAwB,CAAC,OAAO,CAAC,EACjC,UAAU,GAAG,UAAU,CACxB,GAAG;IACF;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import type { TextVariant } from "@metamask-previews/design-system-shared";
|
|
1
2
|
import type { ComponentPropsWithoutRef } from "react";
|
|
2
|
-
import type { TextVariant } from "../../types/index.mjs";
|
|
3
3
|
export type InputProps = Omit<ComponentPropsWithoutRef<'input'>, 'disabled' | 'readOnly'> & {
|
|
4
4
|
/**
|
|
5
5
|
* Optional enum to select between Typography variants.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Input.types.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,gDAAgD;AAC3E,OAAO,KAAK,EAAE,wBAAwB,EAAE,cAAc;AAEtD,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,wBAAwB,CAAC,OAAO,CAAC,EACjC,UAAU,GAAG,UAAU,CACxB,GAAG;IACF;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"Input.types.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { TextVariant } from '@metamask-previews/design-system-shared';\nimport type { ComponentPropsWithoutRef } from 'react';\n\nexport type InputProps = Omit<\n ComponentPropsWithoutRef<'input'>,\n 'disabled' | 'readOnly'\n> & {\n /**\n * Optional enum to select between Typography variants.\n *\n * @default TextVariant.BodyMd\n */\n textVariant?: TextVariant;\n /**\n * Optional boolean to disable Input.\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional boolean to show readonly input.\n *\n * @default false\n */\n isReadonly?: boolean;\n /**\n * Optional prop for additional CSS classes.\n */\n className?: string;\n /**\n * Optional inline styles.\n */\n style?: React.CSSProperties;\n};\n"]}
|
|
@@ -4,16 +4,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.Text = void 0;
|
|
7
|
+
const design_system_shared_1 = require("@metamask-previews/design-system-shared");
|
|
7
8
|
const react_slot_1 = require("@radix-ui/react-slot");
|
|
8
9
|
const react_1 = __importDefault(require("react"));
|
|
9
|
-
const types_1 = require("../../types/index.cjs");
|
|
10
10
|
const tw_merge_1 = require("../../utils/tw-merge.cjs");
|
|
11
11
|
const Text_constants_1 = require("./Text.constants.cjs");
|
|
12
|
-
const Text = ({ variant =
|
|
12
|
+
const Text = ({ variant = design_system_shared_1.TextVariant.BodyMd, children, className, fontWeight, fontFamily = design_system_shared_1.FontFamily.Default, fontStyle, textTransform, textAlign, overflowWrap, ellipsis, asChild, color = design_system_shared_1.TextColor.TextDefault, style, ...props }) => {
|
|
13
13
|
// When asChild is true, use Radix Slot to merge props onto the child component.
|
|
14
14
|
// Otherwise, render the semantic HTML element mapped to this variant (e.g. h1-h4, p).
|
|
15
15
|
const Component = asChild ? react_slot_1.Slot : Text_constants_1.MAP_TEXT_VARIANT_TAG[variant];
|
|
16
|
-
const mergedClassName = `${(0, tw_merge_1.twMerge)(color, Text_constants_1.
|
|
16
|
+
const mergedClassName = `${(0, tw_merge_1.twMerge)(color, Text_constants_1.TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[variant], fontWeight
|
|
17
|
+
? Text_constants_1.TWCLASSMAP_TEXT_FONTWEIGHT[fontWeight]
|
|
18
|
+
: Text_constants_1.TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[variant], fontStyle ? Text_constants_1.TWCLASSMAP_TEXT_FONTSTYLE[fontStyle] : undefined, Text_constants_1.TWCLASSMAP_TEXT_FONTFAMILY[fontFamily], textTransform, textAlign, overflowWrap, ellipsis && 'truncate', className)}`;
|
|
17
19
|
return (react_1.default.createElement(Component, { className: mergedClassName, style: style, ...props }, children));
|
|
18
20
|
};
|
|
19
21
|
exports.Text = Text;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":";;;;;;AAAA,qDAA4C;AAC5C,kDAA0B;AAE1B,
|
|
1
|
+
{"version":3,"file":"Text.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":";;;;;;AAAA,kFAIiD;AACjD,qDAA4C;AAC5C,kDAA0B;AAE1B,uDAA+C;AAE/C,yDAO0B;AAGnB,MAAM,IAAI,GAAwB,CAAC,EACxC,OAAO,GAAG,kCAAW,CAAC,MAAM,EAC5B,QAAQ,EACR,SAAS,EACT,UAAU,EACV,UAAU,GAAG,iCAAU,CAAC,OAAO,EAC/B,SAAS,EACT,aAAa,EACb,SAAS,EACT,YAAY,EACZ,QAAQ,EACR,OAAO,EACP,KAAK,GAAG,gCAAS,CAAC,WAAW,EAC7B,KAAK,EACL,GAAG,KAAK,EACT,EAAE,EAAE;IACH,gFAAgF;IAChF,sFAAsF;IACtF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,qCAAoB,CAAC,OAAO,CAAC,CAAC;IAEjE,MAAM,eAAe,GAAG,GAAG,IAAA,kBAAO,EAChC,KAAK,EACL,kDAAiC,CAAC,OAAO,CAAC,EAC1C,UAAU;QACR,CAAC,CAAC,2CAA0B,CAAC,UAAU,CAAC;QACxC,CAAC,CAAC,mDAAkC,CAAC,OAAO,CAAC,EAC/C,SAAS,CAAC,CAAC,CAAC,0CAAyB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAC5D,2CAA0B,CAAC,UAAU,CAAC,EACtC,aAAa,EACb,SAAS,EACT,YAAY,EACZ,QAAQ,IAAI,UAAU,EACtB,SAAS,CACV,EAAE,CAAC;IAEJ,OAAO,CACL,8BAAC,SAAS,IAAC,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,IAC3D,QAAQ,CACC,CACb,CAAC;AACJ,CAAC,CAAC;AAxCW,QAAA,IAAI,QAwCf","sourcesContent":["import {\n FontFamily,\n TextColor,\n TextVariant,\n} from '@metamask-previews/design-system-shared';\nimport { Slot } from '@radix-ui/react-slot';\nimport React from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\n\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE,\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n TWCLASSMAP_TEXT_FONTFAMILY,\n TWCLASSMAP_TEXT_FONTSTYLE,\n TWCLASSMAP_TEXT_FONTWEIGHT,\n MAP_TEXT_VARIANT_TAG,\n} from './Text.constants';\nimport type { TextProps } from './Text.types';\n\nexport const Text: React.FC<TextProps> = ({\n variant = TextVariant.BodyMd,\n children,\n className,\n fontWeight,\n fontFamily = FontFamily.Default,\n fontStyle,\n textTransform,\n textAlign,\n overflowWrap,\n ellipsis,\n asChild,\n color = TextColor.TextDefault,\n style,\n ...props\n}) => {\n // When asChild is true, use Radix Slot to merge props onto the child component.\n // Otherwise, render the semantic HTML element mapped to this variant (e.g. h1-h4, p).\n const Component = asChild ? Slot : MAP_TEXT_VARIANT_TAG[variant];\n\n const mergedClassName = `${twMerge(\n color,\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[variant],\n fontWeight\n ? TWCLASSMAP_TEXT_FONTWEIGHT[fontWeight]\n : TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[variant],\n fontStyle ? TWCLASSMAP_TEXT_FONTSTYLE[fontStyle] : undefined,\n TWCLASSMAP_TEXT_FONTFAMILY[fontFamily],\n textTransform,\n textAlign,\n overflowWrap,\n ellipsis && 'truncate',\n className,\n )}`;\n\n return (\n <Component className={mergedClassName} style={style} {...props}>\n {children}\n </Component>\n );\n};\n"]}
|
|
@@ -1,53 +1,67 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.MAP_TEXT_VARIANT_TAG = exports.
|
|
4
|
-
const
|
|
5
|
-
exports.
|
|
6
|
-
[
|
|
7
|
-
[
|
|
8
|
-
[
|
|
9
|
-
[types_1.TextVariant.HeadingMd]: 'text-s-heading-md leading-s-heading-md tracking-s-heading-md md:text-l-heading-md md:leading-l-heading-md md:tracking-l-heading-md',
|
|
10
|
-
[types_1.TextVariant.HeadingSm]: 'text-s-heading-sm leading-s-heading-sm tracking-s-heading-sm md:text-l-heading-sm md:leading-l-heading-sm md:tracking-l-heading-sm',
|
|
11
|
-
[types_1.TextVariant.BodyLg]: 'text-s-body-lg leading-s-body-lg tracking-s-body-lg md:text-l-body-lg md:leading-l-body-lg md:tracking-l-body-lg',
|
|
12
|
-
[types_1.TextVariant.BodyMd]: 'text-s-body-md leading-s-body-md tracking-s-body-md md:text-l-body-md md:leading-l-body-md md:tracking-l-body-md',
|
|
13
|
-
[types_1.TextVariant.BodySm]: 'text-s-body-sm leading-s-body-sm tracking-s-body-sm md:text-l-body-sm md:leading-l-body-sm md:tracking-l-body-sm',
|
|
14
|
-
[types_1.TextVariant.BodyXs]: 'text-s-body-xs leading-s-body-xs tracking-s-body-xs md:text-l-body-xs md:leading-l-body-xs md:tracking-l-body-xs',
|
|
15
|
-
[types_1.TextVariant.PageHeading]: 'text-s-page-heading leading-s-page-heading tracking-s-page-heading md:text-l-page-heading md:leading-l-page-heading md:tracking-l-page-heading',
|
|
16
|
-
[types_1.TextVariant.SectionHeading]: 'text-s-section-heading leading-s-section-heading tracking-s-section-heading md:text-l-section-heading md:leading-l-section-heading md:tracking-l-section-heading',
|
|
17
|
-
[types_1.TextVariant.ButtonLabelMd]: 'text-s-button-label-md leading-s-button-label-md tracking-s-button-label-md md:text-l-button-label-md md:leading-l-button-label-md md:tracking-l-button-label-md',
|
|
18
|
-
[types_1.TextVariant.ButtonLabelLg]: 'text-s-button-label-lg leading-s-button-label-lg tracking-s-button-label-lg md:text-l-button-label-lg md:leading-l-button-label-lg md:tracking-l-button-label-lg',
|
|
19
|
-
[types_1.TextVariant.AmountDisplayLg]: 'text-s-amount-display-lg leading-s-amount-display-lg tracking-s-amount-display-lg md:text-l-amount-display-lg md:leading-l-amount-display-lg md:tracking-l-amount-display-lg',
|
|
3
|
+
exports.MAP_TEXT_VARIANT_TAG = exports.TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT = exports.TWCLASSMAP_TEXT_VARIANT_FONTSTYLE = exports.TWCLASSMAP_TEXT_FONTSTYLE = exports.TWCLASSMAP_TEXT_FONTFAMILY = exports.TWCLASSMAP_TEXT_FONTWEIGHT = void 0;
|
|
4
|
+
const design_system_shared_1 = require("@metamask-previews/design-system-shared");
|
|
5
|
+
exports.TWCLASSMAP_TEXT_FONTWEIGHT = {
|
|
6
|
+
[design_system_shared_1.FontWeight.Bold]: 'font-bold',
|
|
7
|
+
[design_system_shared_1.FontWeight.Medium]: 'font-medium',
|
|
8
|
+
[design_system_shared_1.FontWeight.Regular]: 'font-regular',
|
|
20
9
|
};
|
|
21
|
-
exports.
|
|
22
|
-
[
|
|
23
|
-
[
|
|
24
|
-
[
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
[
|
|
28
|
-
[
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
[
|
|
32
|
-
[
|
|
33
|
-
[
|
|
34
|
-
[
|
|
35
|
-
[
|
|
10
|
+
exports.TWCLASSMAP_TEXT_FONTFAMILY = {
|
|
11
|
+
[design_system_shared_1.FontFamily.Default]: 'font-default',
|
|
12
|
+
[design_system_shared_1.FontFamily.Accent]: 'font-accent',
|
|
13
|
+
[design_system_shared_1.FontFamily.Hero]: 'font-hero',
|
|
14
|
+
};
|
|
15
|
+
exports.TWCLASSMAP_TEXT_FONTSTYLE = {
|
|
16
|
+
[design_system_shared_1.FontStyle.Italic]: 'italic',
|
|
17
|
+
[design_system_shared_1.FontStyle.Normal]: 'not-italic',
|
|
18
|
+
};
|
|
19
|
+
exports.TWCLASSMAP_TEXT_VARIANT_FONTSTYLE = {
|
|
20
|
+
[design_system_shared_1.TextVariant.DisplayLg]: 'text-s-display-lg leading-s-display-lg tracking-s-display-lg md:text-l-display-lg md:leading-l-display-lg md:tracking-l-display-lg',
|
|
21
|
+
[design_system_shared_1.TextVariant.DisplayMd]: 'text-s-display-md leading-s-display-md tracking-s-display-md md:text-l-display-md md:leading-l-display-md md:tracking-l-display-md',
|
|
22
|
+
[design_system_shared_1.TextVariant.HeadingLg]: 'text-s-heading-lg leading-s-heading-lg tracking-s-heading-lg md:text-l-heading-lg md:leading-l-heading-lg md:tracking-l-heading-lg',
|
|
23
|
+
[design_system_shared_1.TextVariant.HeadingMd]: 'text-s-heading-md leading-s-heading-md tracking-s-heading-md md:text-l-heading-md md:leading-l-heading-md md:tracking-l-heading-md',
|
|
24
|
+
[design_system_shared_1.TextVariant.HeadingSm]: 'text-s-heading-sm leading-s-heading-sm tracking-s-heading-sm md:text-l-heading-sm md:leading-l-heading-sm md:tracking-l-heading-sm',
|
|
25
|
+
[design_system_shared_1.TextVariant.BodyLg]: 'text-s-body-lg leading-s-body-lg tracking-s-body-lg md:text-l-body-lg md:leading-l-body-lg md:tracking-l-body-lg',
|
|
26
|
+
[design_system_shared_1.TextVariant.BodyMd]: 'text-s-body-md leading-s-body-md tracking-s-body-md md:text-l-body-md md:leading-l-body-md md:tracking-l-body-md',
|
|
27
|
+
[design_system_shared_1.TextVariant.BodySm]: 'text-s-body-sm leading-s-body-sm tracking-s-body-sm md:text-l-body-sm md:leading-l-body-sm md:tracking-l-body-sm',
|
|
28
|
+
[design_system_shared_1.TextVariant.BodyXs]: 'text-s-body-xs leading-s-body-xs tracking-s-body-xs md:text-l-body-xs md:leading-l-body-xs md:tracking-l-body-xs',
|
|
29
|
+
[design_system_shared_1.TextVariant.PageHeading]: 'text-s-page-heading leading-s-page-heading tracking-s-page-heading md:text-l-page-heading md:leading-l-page-heading md:tracking-l-page-heading',
|
|
30
|
+
[design_system_shared_1.TextVariant.SectionHeading]: 'text-s-section-heading leading-s-section-heading tracking-s-section-heading md:text-l-section-heading md:leading-l-section-heading md:tracking-l-section-heading',
|
|
31
|
+
[design_system_shared_1.TextVariant.ButtonLabelMd]: 'text-s-button-label-md leading-s-button-label-md tracking-s-button-label-md md:text-l-button-label-md md:leading-l-button-label-md md:tracking-l-button-label-md',
|
|
32
|
+
[design_system_shared_1.TextVariant.ButtonLabelLg]: 'text-s-button-label-lg leading-s-button-label-lg tracking-s-button-label-lg md:text-l-button-label-lg md:leading-l-button-label-lg md:tracking-l-button-label-lg',
|
|
33
|
+
[design_system_shared_1.TextVariant.AmountDisplayLg]: 'text-s-amount-display-lg leading-s-amount-display-lg tracking-s-amount-display-lg md:text-l-amount-display-lg md:leading-l-amount-display-lg md:tracking-l-amount-display-lg',
|
|
34
|
+
};
|
|
35
|
+
exports.TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT = {
|
|
36
|
+
[design_system_shared_1.TextVariant.DisplayLg]: 'font-bold md:font-medium',
|
|
37
|
+
[design_system_shared_1.TextVariant.DisplayMd]: 'font-bold md:font-medium',
|
|
38
|
+
[design_system_shared_1.TextVariant.HeadingLg]: 'font-bold',
|
|
39
|
+
[design_system_shared_1.TextVariant.HeadingMd]: 'font-bold',
|
|
40
|
+
[design_system_shared_1.TextVariant.HeadingSm]: 'font-bold',
|
|
41
|
+
[design_system_shared_1.TextVariant.BodyLg]: 'font-medium',
|
|
42
|
+
[design_system_shared_1.TextVariant.BodyMd]: 'font-regular',
|
|
43
|
+
[design_system_shared_1.TextVariant.BodySm]: 'font-regular',
|
|
44
|
+
[design_system_shared_1.TextVariant.BodyXs]: 'font-regular',
|
|
45
|
+
[design_system_shared_1.TextVariant.PageHeading]: 'font-bold',
|
|
46
|
+
[design_system_shared_1.TextVariant.SectionHeading]: 'font-bold',
|
|
47
|
+
[design_system_shared_1.TextVariant.ButtonLabelMd]: 'font-medium',
|
|
48
|
+
[design_system_shared_1.TextVariant.ButtonLabelLg]: 'font-medium',
|
|
49
|
+
[design_system_shared_1.TextVariant.AmountDisplayLg]: 'font-bold md:font-medium',
|
|
36
50
|
};
|
|
37
51
|
exports.MAP_TEXT_VARIANT_TAG = {
|
|
38
|
-
[
|
|
39
|
-
[
|
|
40
|
-
[
|
|
41
|
-
[
|
|
42
|
-
[
|
|
43
|
-
[
|
|
44
|
-
[
|
|
45
|
-
[
|
|
46
|
-
[
|
|
47
|
-
[
|
|
48
|
-
[
|
|
49
|
-
[
|
|
50
|
-
[
|
|
51
|
-
[
|
|
52
|
+
[design_system_shared_1.TextVariant.DisplayLg]: 'h1',
|
|
53
|
+
[design_system_shared_1.TextVariant.DisplayMd]: 'h1',
|
|
54
|
+
[design_system_shared_1.TextVariant.HeadingLg]: 'h2',
|
|
55
|
+
[design_system_shared_1.TextVariant.HeadingMd]: 'h3',
|
|
56
|
+
[design_system_shared_1.TextVariant.HeadingSm]: 'h4',
|
|
57
|
+
[design_system_shared_1.TextVariant.BodyLg]: 'p',
|
|
58
|
+
[design_system_shared_1.TextVariant.BodyMd]: 'p',
|
|
59
|
+
[design_system_shared_1.TextVariant.BodySm]: 'p',
|
|
60
|
+
[design_system_shared_1.TextVariant.BodyXs]: 'p',
|
|
61
|
+
[design_system_shared_1.TextVariant.PageHeading]: 'h1',
|
|
62
|
+
[design_system_shared_1.TextVariant.SectionHeading]: 'h2',
|
|
63
|
+
[design_system_shared_1.TextVariant.ButtonLabelMd]: 'span',
|
|
64
|
+
[design_system_shared_1.TextVariant.ButtonLabelLg]: 'span',
|
|
65
|
+
[design_system_shared_1.TextVariant.AmountDisplayLg]: 'span',
|
|
52
66
|
};
|
|
53
67
|
//# sourceMappingURL=Text.constants.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.constants.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":";;;AAAA,
|
|
1
|
+
{"version":3,"file":"Text.constants.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n FontFamily,\n FontStyle,\n FontWeight,\n TextVariant,\n} from '@metamask-previews/design-system-shared';\n\nexport const TWCLASSMAP_TEXT_FONTWEIGHT: Record<FontWeight, string> = {\n [FontWeight.Bold]: 'font-bold',\n [FontWeight.Medium]: 'font-medium',\n [FontWeight.Regular]: 'font-regular',\n};\n\nexport const TWCLASSMAP_TEXT_FONTFAMILY: Record<FontFamily, string> = {\n [FontFamily.Default]: 'font-default',\n [FontFamily.Accent]: 'font-accent',\n [FontFamily.Hero]: 'font-hero',\n};\n\nexport const TWCLASSMAP_TEXT_FONTSTYLE: Record<FontStyle, string> = {\n [FontStyle.Italic]: 'italic',\n [FontStyle.Normal]: 'not-italic',\n};\n\nexport const TWCLASSMAP_TEXT_VARIANT_FONTSTYLE: Record<TextVariant, string> = {\n [TextVariant.DisplayLg]:\n 'text-s-display-lg leading-s-display-lg tracking-s-display-lg md:text-l-display-lg md:leading-l-display-lg md:tracking-l-display-lg',\n [TextVariant.DisplayMd]:\n 'text-s-display-md leading-s-display-md tracking-s-display-md md:text-l-display-md md:leading-l-display-md md:tracking-l-display-md',\n [TextVariant.HeadingLg]:\n 'text-s-heading-lg leading-s-heading-lg tracking-s-heading-lg md:text-l-heading-lg md:leading-l-heading-lg md:tracking-l-heading-lg',\n [TextVariant.HeadingMd]:\n 'text-s-heading-md leading-s-heading-md tracking-s-heading-md md:text-l-heading-md md:leading-l-heading-md md:tracking-l-heading-md',\n [TextVariant.HeadingSm]:\n 'text-s-heading-sm leading-s-heading-sm tracking-s-heading-sm md:text-l-heading-sm md:leading-l-heading-sm md:tracking-l-heading-sm',\n [TextVariant.BodyLg]:\n 'text-s-body-lg leading-s-body-lg tracking-s-body-lg md:text-l-body-lg md:leading-l-body-lg md:tracking-l-body-lg',\n [TextVariant.BodyMd]:\n 'text-s-body-md leading-s-body-md tracking-s-body-md md:text-l-body-md md:leading-l-body-md md:tracking-l-body-md',\n [TextVariant.BodySm]:\n 'text-s-body-sm leading-s-body-sm tracking-s-body-sm md:text-l-body-sm md:leading-l-body-sm md:tracking-l-body-sm',\n [TextVariant.BodyXs]:\n 'text-s-body-xs leading-s-body-xs tracking-s-body-xs md:text-l-body-xs md:leading-l-body-xs md:tracking-l-body-xs',\n [TextVariant.PageHeading]:\n 'text-s-page-heading leading-s-page-heading tracking-s-page-heading md:text-l-page-heading md:leading-l-page-heading md:tracking-l-page-heading',\n [TextVariant.SectionHeading]:\n 'text-s-section-heading leading-s-section-heading tracking-s-section-heading md:text-l-section-heading md:leading-l-section-heading md:tracking-l-section-heading',\n [TextVariant.ButtonLabelMd]:\n 'text-s-button-label-md leading-s-button-label-md tracking-s-button-label-md md:text-l-button-label-md md:leading-l-button-label-md md:tracking-l-button-label-md',\n [TextVariant.ButtonLabelLg]:\n 'text-s-button-label-lg leading-s-button-label-lg tracking-s-button-label-lg md:text-l-button-label-lg md:leading-l-button-label-lg md:tracking-l-button-label-lg',\n [TextVariant.AmountDisplayLg]:\n 'text-s-amount-display-lg leading-s-amount-display-lg tracking-s-amount-display-lg md:text-l-amount-display-lg md:leading-l-amount-display-lg md:tracking-l-amount-display-lg',\n};\n\nexport const TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT: Record<TextVariant, string> = {\n [TextVariant.DisplayLg]: 'font-bold md:font-medium',\n [TextVariant.DisplayMd]: 'font-bold md:font-medium',\n [TextVariant.HeadingLg]: 'font-bold',\n [TextVariant.HeadingMd]: 'font-bold',\n [TextVariant.HeadingSm]: 'font-bold',\n [TextVariant.BodyLg]: 'font-medium',\n [TextVariant.BodyMd]: 'font-regular',\n [TextVariant.BodySm]: 'font-regular',\n [TextVariant.BodyXs]: 'font-regular',\n [TextVariant.PageHeading]: 'font-bold',\n [TextVariant.SectionHeading]: 'font-bold',\n [TextVariant.ButtonLabelMd]: 'font-medium',\n [TextVariant.ButtonLabelLg]: 'font-medium',\n [TextVariant.AmountDisplayLg]: 'font-bold md:font-medium',\n};\n\nexport const MAP_TEXT_VARIANT_TAG: Record<\n TextVariant,\n keyof JSX.IntrinsicElements\n> = {\n [TextVariant.DisplayLg]: 'h1',\n [TextVariant.DisplayMd]: 'h1',\n [TextVariant.HeadingLg]: 'h2',\n [TextVariant.HeadingMd]: 'h3',\n [TextVariant.HeadingSm]: 'h4',\n [TextVariant.BodyLg]: 'p',\n [TextVariant.BodyMd]: 'p',\n [TextVariant.BodySm]: 'p',\n [TextVariant.BodyXs]: 'p',\n [TextVariant.PageHeading]: 'h1',\n [TextVariant.SectionHeading]: 'h2',\n [TextVariant.ButtonLabelMd]: 'span',\n [TextVariant.ButtonLabelLg]: 'span',\n [TextVariant.AmountDisplayLg]: 'span',\n};\n"]}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { TextVariant } from "
|
|
3
|
-
export declare const
|
|
4
|
-
export declare const
|
|
2
|
+
import { FontFamily, FontStyle, FontWeight, TextVariant } from "@metamask-previews/design-system-shared";
|
|
3
|
+
export declare const TWCLASSMAP_TEXT_FONTWEIGHT: Record<FontWeight, string>;
|
|
4
|
+
export declare const TWCLASSMAP_TEXT_FONTFAMILY: Record<FontFamily, string>;
|
|
5
|
+
export declare const TWCLASSMAP_TEXT_FONTSTYLE: Record<FontStyle, string>;
|
|
6
|
+
export declare const TWCLASSMAP_TEXT_VARIANT_FONTSTYLE: Record<TextVariant, string>;
|
|
7
|
+
export declare const TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT: Record<TextVariant, string>;
|
|
5
8
|
export declare const MAP_TEXT_VARIANT_TAG: Record<TextVariant, keyof JSX.IntrinsicElements>;
|
|
6
9
|
//# sourceMappingURL=Text.constants.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":";AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Text.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,SAAS,EACT,UAAU,EACV,WAAW,EACZ,gDAAgD;AAEjD,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAIjE,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAIjE,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAAC,SAAS,EAAE,MAAM,CAG/D,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CA6BzE,CAAC;AAEF,eAAO,MAAM,kCAAkC,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAe1E,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,MAAM,CACvC,WAAW,EACX,MAAM,GAAG,CAAC,iBAAiB,CAgB5B,CAAC"}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { TextVariant } from "
|
|
3
|
-
export declare const
|
|
4
|
-
export declare const
|
|
2
|
+
import { FontFamily, FontStyle, FontWeight, TextVariant } from "@metamask-previews/design-system-shared";
|
|
3
|
+
export declare const TWCLASSMAP_TEXT_FONTWEIGHT: Record<FontWeight, string>;
|
|
4
|
+
export declare const TWCLASSMAP_TEXT_FONTFAMILY: Record<FontFamily, string>;
|
|
5
|
+
export declare const TWCLASSMAP_TEXT_FONTSTYLE: Record<FontStyle, string>;
|
|
6
|
+
export declare const TWCLASSMAP_TEXT_VARIANT_FONTSTYLE: Record<TextVariant, string>;
|
|
7
|
+
export declare const TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT: Record<TextVariant, string>;
|
|
5
8
|
export declare const MAP_TEXT_VARIANT_TAG: Record<TextVariant, keyof JSX.IntrinsicElements>;
|
|
6
9
|
//# sourceMappingURL=Text.constants.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":";AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Text.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,SAAS,EACT,UAAU,EACV,WAAW,EACZ,gDAAgD;AAEjD,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAIjE,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAIjE,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAAC,SAAS,EAAE,MAAM,CAG/D,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CA6BzE,CAAC;AAEF,eAAO,MAAM,kCAAkC,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAe1E,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,MAAM,CACvC,WAAW,EACX,MAAM,GAAG,CAAC,iBAAiB,CAgB5B,CAAC"}
|
|
@@ -1,5 +1,19 @@
|
|
|
1
|
-
import { TextVariant } from "
|
|
2
|
-
export const
|
|
1
|
+
import { FontFamily, FontStyle, FontWeight, TextVariant } from "@metamask-previews/design-system-shared";
|
|
2
|
+
export const TWCLASSMAP_TEXT_FONTWEIGHT = {
|
|
3
|
+
[FontWeight.Bold]: 'font-bold',
|
|
4
|
+
[FontWeight.Medium]: 'font-medium',
|
|
5
|
+
[FontWeight.Regular]: 'font-regular',
|
|
6
|
+
};
|
|
7
|
+
export const TWCLASSMAP_TEXT_FONTFAMILY = {
|
|
8
|
+
[FontFamily.Default]: 'font-default',
|
|
9
|
+
[FontFamily.Accent]: 'font-accent',
|
|
10
|
+
[FontFamily.Hero]: 'font-hero',
|
|
11
|
+
};
|
|
12
|
+
export const TWCLASSMAP_TEXT_FONTSTYLE = {
|
|
13
|
+
[FontStyle.Italic]: 'italic',
|
|
14
|
+
[FontStyle.Normal]: 'not-italic',
|
|
15
|
+
};
|
|
16
|
+
export const TWCLASSMAP_TEXT_VARIANT_FONTSTYLE = {
|
|
3
17
|
[TextVariant.DisplayLg]: 'text-s-display-lg leading-s-display-lg tracking-s-display-lg md:text-l-display-lg md:leading-l-display-lg md:tracking-l-display-lg',
|
|
4
18
|
[TextVariant.DisplayMd]: 'text-s-display-md leading-s-display-md tracking-s-display-md md:text-l-display-md md:leading-l-display-md md:tracking-l-display-md',
|
|
5
19
|
[TextVariant.HeadingLg]: 'text-s-heading-lg leading-s-heading-lg tracking-s-heading-lg md:text-l-heading-lg md:leading-l-heading-lg md:tracking-l-heading-lg',
|
|
@@ -15,7 +29,7 @@ export const CLASSMAP_TEXT_VARIANT_FONTSTYLE = {
|
|
|
15
29
|
[TextVariant.ButtonLabelLg]: 'text-s-button-label-lg leading-s-button-label-lg tracking-s-button-label-lg md:text-l-button-label-lg md:leading-l-button-label-lg md:tracking-l-button-label-lg',
|
|
16
30
|
[TextVariant.AmountDisplayLg]: 'text-s-amount-display-lg leading-s-amount-display-lg tracking-s-amount-display-lg md:text-l-amount-display-lg md:leading-l-amount-display-lg md:tracking-l-amount-display-lg',
|
|
17
31
|
};
|
|
18
|
-
export const
|
|
32
|
+
export const TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT = {
|
|
19
33
|
[TextVariant.DisplayLg]: 'font-bold md:font-medium',
|
|
20
34
|
[TextVariant.DisplayMd]: 'font-bold md:font-medium',
|
|
21
35
|
[TextVariant.HeadingLg]: 'font-bold',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.constants.mjs","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"Text.constants.mjs","sourceRoot":"","sources":["../../../src/components/Text/Text.constants.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n FontFamily,\n FontStyle,\n FontWeight,\n TextVariant,\n} from '@metamask-previews/design-system-shared';\n\nexport const TWCLASSMAP_TEXT_FONTWEIGHT: Record<FontWeight, string> = {\n [FontWeight.Bold]: 'font-bold',\n [FontWeight.Medium]: 'font-medium',\n [FontWeight.Regular]: 'font-regular',\n};\n\nexport const TWCLASSMAP_TEXT_FONTFAMILY: Record<FontFamily, string> = {\n [FontFamily.Default]: 'font-default',\n [FontFamily.Accent]: 'font-accent',\n [FontFamily.Hero]: 'font-hero',\n};\n\nexport const TWCLASSMAP_TEXT_FONTSTYLE: Record<FontStyle, string> = {\n [FontStyle.Italic]: 'italic',\n [FontStyle.Normal]: 'not-italic',\n};\n\nexport const TWCLASSMAP_TEXT_VARIANT_FONTSTYLE: Record<TextVariant, string> = {\n [TextVariant.DisplayLg]:\n 'text-s-display-lg leading-s-display-lg tracking-s-display-lg md:text-l-display-lg md:leading-l-display-lg md:tracking-l-display-lg',\n [TextVariant.DisplayMd]:\n 'text-s-display-md leading-s-display-md tracking-s-display-md md:text-l-display-md md:leading-l-display-md md:tracking-l-display-md',\n [TextVariant.HeadingLg]:\n 'text-s-heading-lg leading-s-heading-lg tracking-s-heading-lg md:text-l-heading-lg md:leading-l-heading-lg md:tracking-l-heading-lg',\n [TextVariant.HeadingMd]:\n 'text-s-heading-md leading-s-heading-md tracking-s-heading-md md:text-l-heading-md md:leading-l-heading-md md:tracking-l-heading-md',\n [TextVariant.HeadingSm]:\n 'text-s-heading-sm leading-s-heading-sm tracking-s-heading-sm md:text-l-heading-sm md:leading-l-heading-sm md:tracking-l-heading-sm',\n [TextVariant.BodyLg]:\n 'text-s-body-lg leading-s-body-lg tracking-s-body-lg md:text-l-body-lg md:leading-l-body-lg md:tracking-l-body-lg',\n [TextVariant.BodyMd]:\n 'text-s-body-md leading-s-body-md tracking-s-body-md md:text-l-body-md md:leading-l-body-md md:tracking-l-body-md',\n [TextVariant.BodySm]:\n 'text-s-body-sm leading-s-body-sm tracking-s-body-sm md:text-l-body-sm md:leading-l-body-sm md:tracking-l-body-sm',\n [TextVariant.BodyXs]:\n 'text-s-body-xs leading-s-body-xs tracking-s-body-xs md:text-l-body-xs md:leading-l-body-xs md:tracking-l-body-xs',\n [TextVariant.PageHeading]:\n 'text-s-page-heading leading-s-page-heading tracking-s-page-heading md:text-l-page-heading md:leading-l-page-heading md:tracking-l-page-heading',\n [TextVariant.SectionHeading]:\n 'text-s-section-heading leading-s-section-heading tracking-s-section-heading md:text-l-section-heading md:leading-l-section-heading md:tracking-l-section-heading',\n [TextVariant.ButtonLabelMd]:\n 'text-s-button-label-md leading-s-button-label-md tracking-s-button-label-md md:text-l-button-label-md md:leading-l-button-label-md md:tracking-l-button-label-md',\n [TextVariant.ButtonLabelLg]:\n 'text-s-button-label-lg leading-s-button-label-lg tracking-s-button-label-lg md:text-l-button-label-lg md:leading-l-button-label-lg md:tracking-l-button-label-lg',\n [TextVariant.AmountDisplayLg]:\n 'text-s-amount-display-lg leading-s-amount-display-lg tracking-s-amount-display-lg md:text-l-amount-display-lg md:leading-l-amount-display-lg md:tracking-l-amount-display-lg',\n};\n\nexport const TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT: Record<TextVariant, string> = {\n [TextVariant.DisplayLg]: 'font-bold md:font-medium',\n [TextVariant.DisplayMd]: 'font-bold md:font-medium',\n [TextVariant.HeadingLg]: 'font-bold',\n [TextVariant.HeadingMd]: 'font-bold',\n [TextVariant.HeadingSm]: 'font-bold',\n [TextVariant.BodyLg]: 'font-medium',\n [TextVariant.BodyMd]: 'font-regular',\n [TextVariant.BodySm]: 'font-regular',\n [TextVariant.BodyXs]: 'font-regular',\n [TextVariant.PageHeading]: 'font-bold',\n [TextVariant.SectionHeading]: 'font-bold',\n [TextVariant.ButtonLabelMd]: 'font-medium',\n [TextVariant.ButtonLabelLg]: 'font-medium',\n [TextVariant.AmountDisplayLg]: 'font-bold md:font-medium',\n};\n\nexport const MAP_TEXT_VARIANT_TAG: Record<\n TextVariant,\n keyof JSX.IntrinsicElements\n> = {\n [TextVariant.DisplayLg]: 'h1',\n [TextVariant.DisplayMd]: 'h1',\n [TextVariant.HeadingLg]: 'h2',\n [TextVariant.HeadingMd]: 'h3',\n [TextVariant.HeadingSm]: 'h4',\n [TextVariant.BodyLg]: 'p',\n [TextVariant.BodyMd]: 'p',\n [TextVariant.BodySm]: 'p',\n [TextVariant.BodyXs]: 'p',\n [TextVariant.PageHeading]: 'h1',\n [TextVariant.SectionHeading]: 'h2',\n [TextVariant.ButtonLabelMd]: 'span',\n [TextVariant.ButtonLabelLg]: 'span',\n [TextVariant.AmountDisplayLg]: 'span',\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.d.cts","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Text.d.cts","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAY1B,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAqB;AAE9C,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAwCpC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.d.mts","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Text.d.mts","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAY1B,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAqB;AAE9C,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAwCpC,CAAC"}
|
|
@@ -4,17 +4,19 @@ function $importDefault(module) {
|
|
|
4
4
|
}
|
|
5
5
|
return module;
|
|
6
6
|
}
|
|
7
|
+
import { FontFamily, TextColor, TextVariant } from "@metamask-previews/design-system-shared";
|
|
7
8
|
import { Slot } from "@radix-ui/react-slot";
|
|
8
9
|
import $React from "react";
|
|
9
10
|
const React = $importDefault($React);
|
|
10
|
-
import { FontFamily, TextColor, TextVariant } from "../../types/index.mjs";
|
|
11
11
|
import { twMerge } from "../../utils/tw-merge.mjs";
|
|
12
|
-
import {
|
|
12
|
+
import { TWCLASSMAP_TEXT_VARIANT_FONTSTYLE, TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT, TWCLASSMAP_TEXT_FONTFAMILY, TWCLASSMAP_TEXT_FONTSTYLE, TWCLASSMAP_TEXT_FONTWEIGHT, MAP_TEXT_VARIANT_TAG } from "./Text.constants.mjs";
|
|
13
13
|
export const Text = ({ variant = TextVariant.BodyMd, children, className, fontWeight, fontFamily = FontFamily.Default, fontStyle, textTransform, textAlign, overflowWrap, ellipsis, asChild, color = TextColor.TextDefault, style, ...props }) => {
|
|
14
14
|
// When asChild is true, use Radix Slot to merge props onto the child component.
|
|
15
15
|
// Otherwise, render the semantic HTML element mapped to this variant (e.g. h1-h4, p).
|
|
16
16
|
const Component = asChild ? Slot : MAP_TEXT_VARIANT_TAG[variant];
|
|
17
|
-
const mergedClassName = `${twMerge(color,
|
|
17
|
+
const mergedClassName = `${twMerge(color, TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[variant], fontWeight
|
|
18
|
+
? TWCLASSMAP_TEXT_FONTWEIGHT[fontWeight]
|
|
19
|
+
: TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[variant], fontStyle ? TWCLASSMAP_TEXT_FONTSTYLE[fontStyle] : undefined, TWCLASSMAP_TEXT_FONTFAMILY[fontFamily], textTransform, textAlign, overflowWrap, ellipsis && 'truncate', className)}`;
|
|
18
20
|
return (React.createElement(Component, { className: mergedClassName, style: style, ...props }, children));
|
|
19
21
|
};
|
|
20
22
|
//# sourceMappingURL=Text.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.mjs","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,6BAA6B;AAC5C,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"Text.mjs","sourceRoot":"","sources":["../../../src/components/Text/Text.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,UAAU,EACV,SAAS,EACT,WAAW,EACZ,gDAAgD;AACjD,OAAO,EAAE,IAAI,EAAE,6BAA6B;AAC5C,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAE/C,OAAO,EACL,iCAAiC,EACjC,kCAAkC,EAClC,0BAA0B,EAC1B,yBAAyB,EACzB,0BAA0B,EAC1B,oBAAoB,EACrB,6BAAyB;AAG1B,MAAM,CAAC,MAAM,IAAI,GAAwB,CAAC,EACxC,OAAO,GAAG,WAAW,CAAC,MAAM,EAC5B,QAAQ,EACR,SAAS,EACT,UAAU,EACV,UAAU,GAAG,UAAU,CAAC,OAAO,EAC/B,SAAS,EACT,aAAa,EACb,SAAS,EACT,YAAY,EACZ,QAAQ,EACR,OAAO,EACP,KAAK,GAAG,SAAS,CAAC,WAAW,EAC7B,KAAK,EACL,GAAG,KAAK,EACT,EAAE,EAAE;IACH,gFAAgF;IAChF,sFAAsF;IACtF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC;IAEjE,MAAM,eAAe,GAAG,GAAG,OAAO,CAChC,KAAK,EACL,iCAAiC,CAAC,OAAO,CAAC,EAC1C,UAAU;QACR,CAAC,CAAC,0BAA0B,CAAC,UAAU,CAAC;QACxC,CAAC,CAAC,kCAAkC,CAAC,OAAO,CAAC,EAC/C,SAAS,CAAC,CAAC,CAAC,yBAAyB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAC5D,0BAA0B,CAAC,UAAU,CAAC,EACtC,aAAa,EACb,SAAS,EACT,YAAY,EACZ,QAAQ,IAAI,UAAU,EACtB,SAAS,CACV,EAAE,CAAC;IAEJ,OAAO,CACL,oBAAC,SAAS,IAAC,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,IAC3D,QAAQ,CACC,CACb,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {\n FontFamily,\n TextColor,\n TextVariant,\n} from '@metamask-previews/design-system-shared';\nimport { Slot } from '@radix-ui/react-slot';\nimport React from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\n\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE,\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n TWCLASSMAP_TEXT_FONTFAMILY,\n TWCLASSMAP_TEXT_FONTSTYLE,\n TWCLASSMAP_TEXT_FONTWEIGHT,\n MAP_TEXT_VARIANT_TAG,\n} from './Text.constants';\nimport type { TextProps } from './Text.types';\n\nexport const Text: React.FC<TextProps> = ({\n variant = TextVariant.BodyMd,\n children,\n className,\n fontWeight,\n fontFamily = FontFamily.Default,\n fontStyle,\n textTransform,\n textAlign,\n overflowWrap,\n ellipsis,\n asChild,\n color = TextColor.TextDefault,\n style,\n ...props\n}) => {\n // When asChild is true, use Radix Slot to merge props onto the child component.\n // Otherwise, render the semantic HTML element mapped to this variant (e.g. h1-h4, p).\n const Component = asChild ? Slot : MAP_TEXT_VARIANT_TAG[variant];\n\n const mergedClassName = `${twMerge(\n color,\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[variant],\n fontWeight\n ? TWCLASSMAP_TEXT_FONTWEIGHT[fontWeight]\n : TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[variant],\n fontStyle ? TWCLASSMAP_TEXT_FONTSTYLE[fontStyle] : undefined,\n TWCLASSMAP_TEXT_FONTFAMILY[fontFamily],\n textTransform,\n textAlign,\n overflowWrap,\n ellipsis && 'truncate',\n className,\n )}`;\n\n return (\n <Component className={mergedClassName} style={style} {...props}>\n {children}\n </Component>\n );\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.types.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\
|
|
1
|
+
{"version":3,"file":"Text.types.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { TextPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { OverflowWrap, TextAlign, TextTransform } from '../../types';\n\nexport type TextProps = TextPropsShared & {\n /**\n * Optional prop for inline styles\n */\n style?: React.CSSProperties;\n /**\n * Optional prop for additional CSS classes to be applied to the Text component.\n */\n className?: string;\n /**\n * Optional prop to apply text transformation to the content.\n * Options: Uppercase, Lowercase, Capitalize, Normal\n */\n textTransform?: TextTransform;\n /**\n * Optional prop to control the text alignment within its container.\n * Options: Left, Center, Right, Justify\n */\n textAlign?: TextAlign;\n /**\n * Optional prop to determine how text should wrap when it reaches the edge of its container.\n * Options: BreakWord, Anywhere, Normal\n */\n overflowWrap?: OverflowWrap;\n /**\n * Optional boolean that adds an ellipsis (...) when text overflows its container.\n *\n * @default false\n */\n ellipsis?: boolean;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a default DOM element.\n *\n * @default false\n */\n asChild?: boolean;\n /**\n * Optional prop for testing purposes\n */\n 'data-testid'?: string;\n};\n"]}
|