npm - @metamask/design-system-react-native - Versions diffs - 0.16.0 → 0.17.0 - Mend

@metamask/design-system-react-native 0.16.0 → 0.17.0

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.

Files changed (90) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -7,6 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [Unreleased]
+## [0.17.0]
+### Changed
+- **BREAKING:** Migrated `Text` typography types (`TextVariant`, `TextColor`, `FontWeight`, `FontStyle`, `FontFamily`) to `@metamask/design-system-shared`; all imports through `@metamask/design-system-react-native` continue to work without change ([#1047](https://github.com/MetaMask/metamask-design-system/pull/1047))
+  - `FontWeight` underlying string values changed from numeric strings (`'600'`, `'500'`, `'400'`) to semantic identifiers (`'bold'`, `'medium'`, `'regular'`); idiomatic usage (e.g. `FontWeight.Bold`) is unaffected
+  - See [Migration Guide](./MIGRATION.md#from-version-0160-to-0170)
 ## [0.16.0]
 ### Added
@@ -314,7 +322,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Full TypeScript support with type definitions and enums
 - React Native integration with TWRNC preset support
-[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.16.0...HEAD
+[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.17.0...HEAD
+[0.17.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.16.0...@metamask/design-system-react-native@0.17.0
 [0.16.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.15.0...@metamask/design-system-react-native@0.16.0
 [0.15.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.14.0...@metamask/design-system-react-native@0.15.0
 [0.14.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.13.0...@metamask/design-system-react-native@0.14.0

package/dist/components/BannerBase/BannerBase.cjs CHANGED Viewed

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BannerBase = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const react_1 = __importDefault(require("react"));
 const types_1 = require("../../types/index.cjs");
 const Box_1 = require("../Box/index.cjs");
@@ -34,18 +35,18 @@ const BannerBase = ({ title, titleProps, description, descriptionProps, children
       <Box_1.Box twClassName="flex-1">
         {hasContent(title) &&
-            (isTextContent(title) ? (<Text_1.Text variant={types_1.TextVariant.BodyMd} fontWeight={types_1.FontWeight.Medium} {...titleProps}>
+            (isTextContent(title) ? (<Text_1.Text variant={design_system_shared_1.TextVariant.BodyMd} fontWeight={design_system_shared_1.FontWeight.Medium} {...titleProps}>
               {title}
             </Text_1.Text>) : (title))}
         {hasContent(description) && (<Box_1.Box twClassName={hasContent(title) ? 'mt-1' : undefined}>
-            {isTextContent(description) ? (<Text_1.Text variant={types_1.TextVariant.BodySm} {...descriptionProps}>
+            {isTextContent(description) ? (<Text_1.Text variant={design_system_shared_1.TextVariant.BodySm} {...descriptionProps}>
                 {description}
               </Text_1.Text>) : (description)}
           </Box_1.Box>)}
         {hasContent(children) &&
-            (isTextContent(children) ? (<Text_1.Text variant={types_1.TextVariant.BodyMd} {...childrenWrapperProps}>
+            (isTextContent(children) ? (<Text_1.Text variant={design_system_shared_1.TextVariant.BodyMd} {...childrenWrapperProps}>
               {children}
             </Text_1.Text>) : (children))}

package/dist/components/BannerBase/BannerBase.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerBase.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAG1B,~~iDASqB~~;AACrB,0CAA6B;AAC7B,gDAAmC;AACnC,wDAA2C;AAC3C,4CAA+B;AAI/B,MAAM,aAAa,GAAG,CAAC,OAAwB,EAA8B,EAAE,CAC7E,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,OAAO,KAAK,QAAQ,CAAC;AAE7D,MAAM,UAAU,GAAG,CAAC,OAAwB,EAAE,EAAE,CAC9C,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,SAAS,CAAC;AAErC,MAAM,UAAU,GAA8B,CAAC,EACpD,KAAK,EACL,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,OAAO,EACP,gBAAgB,EAChB,WAAW,EACX,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,yBAAyB,GAAG,iBAAiB,IAAI,EAAE,CAAC;IAE1D,MAAM,EACJ,kBAAkB,EAAE,6BAA6B,GAAG,cAAc,EAClE,OAAO,EAAE,uBAAuB,EAChC,WAAW,EAAE,sBAAsB,EACnC,GAAG,wBAAwB,EAC5B,GAAG,gBAAgB,IAAI,EAAE,CAAC;IAE3B,MAAM,qBAAqB,GAAG,OAAO,CAAC,OAAO,IAAI,gBAAgB,CAAC,CAAC;IACnE,MAAM,sBAAsB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAE5D,MAAM,gBAAgB,GACpB,OAAO,IAAI,uBAAuB;QAChC,CAAC,CAAC,CAAC,KAA4B,EAAE,EAAE;YAC/B,IAAI,OAAO,EAAE;gBACX,OAAO,EAAE,CAAC;gBACV,OAAO;aACR;YACD,uBAAuB,EAAE,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,4BAA4B,GAAG,sBAAsB;QACzD,CAAC,CAAC,QAAQ,sBAAsB,EAAE;QAClC,CAAC,CAAC,MAAM,CAAC;IAEX,OAAO,CACL,CAAC,SAAG,CACF,aAAa,CAAC,CAAC,wBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,qBAAa,CAAC,KAAK,CAAC,CAChC,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,eAAe,CAAC,CAAC,0BAAkB,CAAC,iBAAiB,CAAC,CACtD,OAAO,CAAC,CAAC,CAAC,CAAC,CACX,WAAW,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,cAAc,WAAW,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CACtE,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,cAAc,CAEf;;MAAA,CAAC,SAAG,CAAC,WAAW,CAAC,QAAQ,CACvB;QAAA,CAAC,UAAU,CAAC,KAAK,CAAC;YAChB,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CACtB,CAAC,WAAI,CACH,OAAO,CAAC,CAAC,~~mBAAW~~,CAAC,MAAM,CAAC,CAC5B,UAAU,CAAC,CAAC,~~kBAAU~~,CAAC,MAAM,CAAC,CAC9B,IAAI,UAAU,CAAC,CAEf;cAAA,CAAC,KAAK,CACR;YAAA,EAAE,WAAI,CAAC,CACR,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CAAC,CAEJ;;QAAA,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,CAC1B,CAAC,SAAG,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CACvD;YAAA,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAC5B,CAAC,WAAI,CAAC,OAAO,CAAC,CAAC,~~mBAAW~~,CAAC,MAAM,CAAC,CAAC,IAAI,gBAAgB,CAAC,CACtD;gBAAA,CAAC,WAAW,CACd;cAAA,EAAE,WAAI,CAAC,CACR,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,CACH;UAAA,EAAE,SAAG,CAAC,CACP,CAED;;QAAA,CAAC,UAAU,CAAC,QAAQ,CAAC;YACnB,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CACzB,CAAC,WAAI,CAAC,OAAO,CAAC,CAAC,~~mBAAW~~,CAAC,MAAM,CAAC,CAAC,IAAI,oBAAoB,CAAC,CAC1D;cAAA,CAAC,QAAQ,CACX;YAAA,EAAE,WAAI,CAAC,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC,CAEJ;;QAAA,CAAC,sBAAsB,IAAI,CACzB,CAAC,SAAG,CAAC,WAAW,CAAC,MAAM,CACrB;YAAA,CAAC,eAAM,CACL,IAAI,CAAC,CAAC,kBAAU,CAAC,EAAE,CAAC,CACpB,OAAO,CAAC,CAAC,mBAAmB,CAAC,CAC7B,IAAI,yBAAyB,CAAC,CAE9B;cAAA,CAAC,iBAAiB,CACpB;YAAA,EAAE,eAAM,CACV;UAAA,EAAE,SAAG,CAAC,CACP,CACH;MAAA,EAAE,SAAG,CAEL;;MAAA,CAAC,qBAAqB,IAAI,CACxB,CAAC,uBAAU,CACT,WAAW,CAAC,CAAC,4BAA4B,CAAC,CAC1C,QAAQ,CAAC,CAAC,gBAAQ,CAAC,KAAK,CAAC,CACzB,IAAI,CAAC,CAAC,sBAAc,CAAC,EAAE,CAAC,CACxB,kBAAkB,CAAC,CAAC,6BAA6B,CAAC,CAClD,OAAO,CAAC,CAAC,gBAAgB,CAAC,CAC1B,IAAI,wBAAwB,CAAC,EAC7B,CACH,CACH;IAAA,EAAE,SAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AAnHW,QAAA,UAAU,cAmHrB","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent } from 'react-native';\n\nimport {\n BoxAlignItems,\n BoxBackgroundColor,\n ButtonIconSize,\n ButtonSize,\n ~~FontWeight,\n~~ BoxFlexDirection,\n IconName,\n ~~TextVariant,\n~~} from '../../types';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text } from '../Text';\n\nimport type { BannerBaseProps } from './BannerBase.types';\n\nconst isTextContent = (content: React.ReactNode): content is string \| number =>\n typeof content === 'string' \|\| typeof content === 'number';\n\nconst hasContent = (content: React.ReactNode) =>\n content !== null && content !== undefined;\n\nexport const BannerBase: React.FC<BannerBaseProps> = ({\n title,\n titleProps,\n description,\n descriptionProps,\n children,\n childrenWrapperProps,\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps,\n startAccessory,\n onClose,\n closeButtonProps,\n twClassName,\n ...props\n}) => {\n const resolvedActionButtonProps = actionButtonProps ?? {};\n\n const {\n accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n onPress: closeButtonPropsOnPress,\n twClassName: closeButtonTwClassName,\n ...resolvedCloseButtonProps\n } = closeButtonProps ?? {};\n\n const shouldShowCloseButton = Boolean(onClose \|\| closeButtonProps);\n const shouldShowActionButton = Boolean(actionButtonOnPress);\n\n const handleClosePress =\n onClose \|\| closeButtonPropsOnPress\n ? (event: GestureResponderEvent) => {\n if (onClose) {\n onClose();\n return;\n }\n closeButtonPropsOnPress?.(event);\n }\n : undefined;\n\n const mergedCloseButtonTwClassName = closeButtonTwClassName\n ? `ml-3 ${closeButtonTwClassName}`\n : 'ml-3';\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n gap={2}\n backgroundColor={BoxBackgroundColor.BackgroundDefault}\n padding={3}\n twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'}\n {...props}\n >\n {startAccessory}\n\n <Box twClassName=\"flex-1\">\n {hasContent(title) &&\n (isTextContent(title) ? (\n <Text\n variant={TextVariant.BodyMd}\n fontWeight={FontWeight.Medium}\n {...titleProps}\n >\n {title}\n </Text>\n ) : (\n title\n ))}\n\n {hasContent(description) && (\n <Box twClassName={hasContent(title) ? 'mt-1' : undefined}>\n {isTextContent(description) ? (\n <Text variant={TextVariant.BodySm} {...descriptionProps}>\n {description}\n </Text>\n ) : (\n description\n )}\n </Box>\n )}\n\n {hasContent(children) &&\n (isTextContent(children) ? (\n <Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>\n {children}\n </Text>\n ) : (\n children\n ))}\n\n {shouldShowActionButton && (\n <Box twClassName=\"mt-4\">\n <Button\n size={ButtonSize.Md}\n onPress={actionButtonOnPress}\n {...resolvedActionButtonProps}\n >\n {actionButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n\n {shouldShowCloseButton && (\n <ButtonIcon\n twClassName={mergedCloseButtonTwClassName}\n iconName={IconName.Close}\n size={ButtonIconSize.Sm}\n accessibilityLabel={closeButtonAccessibilityLabel}\n onPress={handleClosePress}\n {...resolvedCloseButtonProps}\n />\n )}\n </Box>\n );\n};\n"]}
1	+ {"version":3,"file":"BannerBase.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FontWeight, TextVariant } from '@metamask/design-system-shared';\nimport React from 'react';\nimport { GestureResponderEvent } from 'react-native';\n\nimport {\n BoxAlignItems,\n BoxBackgroundColor,\n ButtonIconSize,\n ButtonSize,\n BoxFlexDirection,\n IconName,\n} from '../../types';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text } from '../Text';\n\nimport type { BannerBaseProps } from './BannerBase.types';\n\nconst isTextContent = (content: React.ReactNode): content is string \| number =>\n typeof content === 'string' \|\| typeof content === 'number';\n\nconst hasContent = (content: React.ReactNode) =>\n content !== null && content !== undefined;\n\nexport const BannerBase: React.FC<BannerBaseProps> = ({\n title,\n titleProps,\n description,\n descriptionProps,\n children,\n childrenWrapperProps,\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps,\n startAccessory,\n onClose,\n closeButtonProps,\n twClassName,\n ...props\n}) => {\n const resolvedActionButtonProps = actionButtonProps ?? {};\n\n const {\n accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n onPress: closeButtonPropsOnPress,\n twClassName: closeButtonTwClassName,\n ...resolvedCloseButtonProps\n } = closeButtonProps ?? {};\n\n const shouldShowCloseButton = Boolean(onClose \|\| closeButtonProps);\n const shouldShowActionButton = Boolean(actionButtonOnPress);\n\n const handleClosePress =\n onClose \|\| closeButtonPropsOnPress\n ? (event: GestureResponderEvent) => {\n if (onClose) {\n onClose();\n return;\n }\n closeButtonPropsOnPress?.(event);\n }\n : undefined;\n\n const mergedCloseButtonTwClassName = closeButtonTwClassName\n ? `ml-3 ${closeButtonTwClassName}`\n : 'ml-3';\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n gap={2}\n backgroundColor={BoxBackgroundColor.BackgroundDefault}\n padding={3}\n twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'}\n {...props}\n >\n {startAccessory}\n\n <Box twClassName=\"flex-1\">\n {hasContent(title) &&\n (isTextContent(title) ? (\n <Text\n variant={TextVariant.BodyMd}\n fontWeight={FontWeight.Medium}\n {...titleProps}\n >\n {title}\n </Text>\n ) : (\n title\n ))}\n\n {hasContent(description) && (\n <Box twClassName={hasContent(title) ? 'mt-1' : undefined}>\n {isTextContent(description) ? (\n <Text variant={TextVariant.BodySm} {...descriptionProps}>\n {description}\n </Text>\n ) : (\n description\n )}\n </Box>\n )}\n\n {hasContent(children) &&\n (isTextContent(children) ? (\n <Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>\n {children}\n </Text>\n ) : (\n children\n ))}\n\n {shouldShowActionButton && (\n <Box twClassName=\"mt-4\">\n <Button\n size={ButtonSize.Md}\n onPress={actionButtonOnPress}\n {...resolvedActionButtonProps}\n >\n {actionButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n\n {shouldShowCloseButton && (\n <ButtonIcon\n twClassName={mergedCloseButtonTwClassName}\n iconName={IconName.Close}\n size={ButtonIconSize.Sm}\n accessibilityLabel={closeButtonAccessibilityLabel}\n onPress={handleClosePress}\n {...resolvedCloseButtonProps}\n />\n )}\n </Box>\n );\n};\n"]}

package/dist/components/BannerBase/BannerBase.d.cts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerBase.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,KAAK,cAAc;~~AAkB1B~~,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmHhD,CAAC"}
1	+ {"version":3,"file":"BannerBase.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAgB1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmHhD,CAAC"}

package/dist/components/BannerBase/BannerBase.d.mts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerBase.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,KAAK,cAAc;~~AAkB1B~~,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmHhD,CAAC"}
1	+ {"version":3,"file":"BannerBase.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAgB1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmHhD,CAAC"}

package/dist/components/BannerBase/BannerBase.mjs CHANGED Viewed

@@ -4,9 +4,10 @@ function $importDefault(module) {
     }
     return module;
 }
+import { FontWeight, TextVariant } from "@metamask/design-system-shared";
 import $React from "react";
 const React = $importDefault($React);
-import { BoxAlignItems, BoxBackgroundColor, ButtonIconSize, ButtonSize, FontWeight, BoxFlexDirection, IconName, TextVariant } from "../../types/index.mjs";
+import { BoxAlignItems, BoxBackgroundColor, ButtonIconSize, ButtonSize, BoxFlexDirection, IconName } from "../../types/index.mjs";
 import { Box } from "../Box/index.mjs";
 import { Button } from "../Button/index.mjs";
 import { ButtonIcon } from "../ButtonIcon/index.mjs";

package/dist/components/BannerBase/BannerBase.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,MAAK,cAAc;;AAG1B,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,~~UAAU,EACV,~~gBAAgB,EAChB,QAAQ,~~EACR~~,~~WAAW,EACZ,~~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","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent } from 'react-native';\n\nimport {\n BoxAlignItems,\n BoxBackgroundColor,\n ButtonIconSize,\n ButtonSize,\n ~~FontWeight,\n~~ BoxFlexDirection,\n IconName,\n ~~TextVariant,\n~~} from '../../types';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text } from '../Text';\n\nimport type { BannerBaseProps } from './BannerBase.types';\n\nconst isTextContent = (content: React.ReactNode): content is string \| number =>\n typeof content === 'string' \|\| typeof content === 'number';\n\nconst hasContent = (content: React.ReactNode) =>\n content !== null && content !== undefined;\n\nexport const BannerBase: React.FC<BannerBaseProps> = ({\n title,\n titleProps,\n description,\n descriptionProps,\n children,\n childrenWrapperProps,\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps,\n startAccessory,\n onClose,\n closeButtonProps,\n twClassName,\n ...props\n}) => {\n const resolvedActionButtonProps = actionButtonProps ?? {};\n\n const {\n accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n onPress: closeButtonPropsOnPress,\n twClassName: closeButtonTwClassName,\n ...resolvedCloseButtonProps\n } = closeButtonProps ?? {};\n\n const shouldShowCloseButton = Boolean(onClose \|\| closeButtonProps);\n const shouldShowActionButton = Boolean(actionButtonOnPress);\n\n const handleClosePress =\n onClose \|\| closeButtonPropsOnPress\n ? (event: GestureResponderEvent) => {\n if (onClose) {\n onClose();\n return;\n }\n closeButtonPropsOnPress?.(event);\n }\n : undefined;\n\n const mergedCloseButtonTwClassName = closeButtonTwClassName\n ? `ml-3 ${closeButtonTwClassName}`\n : 'ml-3';\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n gap={2}\n backgroundColor={BoxBackgroundColor.BackgroundDefault}\n padding={3}\n twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'}\n {...props}\n >\n {startAccessory}\n\n <Box twClassName=\"flex-1\">\n {hasContent(title) &&\n (isTextContent(title) ? (\n <Text\n variant={TextVariant.BodyMd}\n fontWeight={FontWeight.Medium}\n {...titleProps}\n >\n {title}\n </Text>\n ) : (\n title\n ))}\n\n {hasContent(description) && (\n <Box twClassName={hasContent(title) ? 'mt-1' : undefined}>\n {isTextContent(description) ? (\n <Text variant={TextVariant.BodySm} {...descriptionProps}>\n {description}\n </Text>\n ) : (\n description\n )}\n </Box>\n )}\n\n {hasContent(children) &&\n (isTextContent(children) ? (\n <Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>\n {children}\n </Text>\n ) : (\n children\n ))}\n\n {shouldShowActionButton && (\n <Box twClassName=\"mt-4\">\n <Button\n size={ButtonSize.Md}\n onPress={actionButtonOnPress}\n {...resolvedActionButtonProps}\n >\n {actionButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n\n {shouldShowCloseButton && (\n <ButtonIcon\n twClassName={mergedCloseButtonTwClassName}\n iconName={IconName.Close}\n size={ButtonIconSize.Sm}\n accessibilityLabel={closeButtonAccessibilityLabel}\n onPress={handleClosePress}\n {...resolvedCloseButtonProps}\n />\n )}\n </Box>\n );\n};\n"]}
1	+ {"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FontWeight, TextVariant } from '@metamask/design-system-shared';\nimport React from 'react';\nimport { GestureResponderEvent } from 'react-native';\n\nimport {\n BoxAlignItems,\n BoxBackgroundColor,\n ButtonIconSize,\n ButtonSize,\n BoxFlexDirection,\n IconName,\n} from '../../types';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text } from '../Text';\n\nimport type { BannerBaseProps } from './BannerBase.types';\n\nconst isTextContent = (content: React.ReactNode): content is string \| number =>\n typeof content === 'string' \|\| typeof content === 'number';\n\nconst hasContent = (content: React.ReactNode) =>\n content !== null && content !== undefined;\n\nexport const BannerBase: React.FC<BannerBaseProps> = ({\n title,\n titleProps,\n description,\n descriptionProps,\n children,\n childrenWrapperProps,\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps,\n startAccessory,\n onClose,\n closeButtonProps,\n twClassName,\n ...props\n}) => {\n const resolvedActionButtonProps = actionButtonProps ?? {};\n\n const {\n accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n onPress: closeButtonPropsOnPress,\n twClassName: closeButtonTwClassName,\n ...resolvedCloseButtonProps\n } = closeButtonProps ?? {};\n\n const shouldShowCloseButton = Boolean(onClose \|\| closeButtonProps);\n const shouldShowActionButton = Boolean(actionButtonOnPress);\n\n const handleClosePress =\n onClose \|\| closeButtonPropsOnPress\n ? (event: GestureResponderEvent) => {\n if (onClose) {\n onClose();\n return;\n }\n closeButtonPropsOnPress?.(event);\n }\n : undefined;\n\n const mergedCloseButtonTwClassName = closeButtonTwClassName\n ? `ml-3 ${closeButtonTwClassName}`\n : 'ml-3';\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n gap={2}\n backgroundColor={BoxBackgroundColor.BackgroundDefault}\n padding={3}\n twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'}\n {...props}\n >\n {startAccessory}\n\n <Box twClassName=\"flex-1\">\n {hasContent(title) &&\n (isTextContent(title) ? (\n <Text\n variant={TextVariant.BodyMd}\n fontWeight={FontWeight.Medium}\n {...titleProps}\n >\n {title}\n </Text>\n ) : (\n title\n ))}\n\n {hasContent(description) && (\n <Box twClassName={hasContent(title) ? 'mt-1' : undefined}>\n {isTextContent(description) ? (\n <Text variant={TextVariant.BodySm} {...descriptionProps}>\n {description}\n </Text>\n ) : (\n description\n )}\n </Box>\n )}\n\n {hasContent(children) &&\n (isTextContent(children) ? (\n <Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>\n {children}\n </Text>\n ) : (\n children\n ))}\n\n {shouldShowActionButton && (\n <Box twClassName=\"mt-4\">\n <Button\n size={ButtonSize.Md}\n onPress={actionButtonOnPress}\n {...resolvedActionButtonProps}\n >\n {actionButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n\n {shouldShowCloseButton && (\n <ButtonIcon\n twClassName={mergedCloseButtonTwClassName}\n iconName={IconName.Close}\n size={ButtonIconSize.Sm}\n accessibilityLabel={closeButtonAccessibilityLabel}\n onPress={handleClosePress}\n {...resolvedCloseButtonProps}\n />\n )}\n </Box>\n );\n};\n"]}

package/dist/components/Input/Input.cjs CHANGED Viewed

@@ -1,23 +1,23 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Input = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const design_system_twrnc_preset_1 = require("@metamask/design-system-twrnc-preset");
 const design_tokens_1 = require("@metamask/design-tokens");
 const react_1 = require("react");
 const react_native_1 = require("react-native/index.js");
-const types_1 = require("../../types/index.cjs");
 const Text_constants_1 = require("../Text/Text.constants.cjs");
 const Input_constants_1 = require("./Input.constants.cjs");
-exports.Input = (0, react_1.forwardRef)(({ style, textVariant = types_1.TextVariant.BodyMd, isStateStylesDisabled, isDisabled = false, isReadonly = false, value, placeholder, twClassName, onBlur, onFocus, autoFocus = false, ...props }, ref) => {
+exports.Input = (0, react_1.forwardRef)(({ style, textVariant = design_system_shared_1.TextVariant.BodyMd, isStateStylesDisabled, isDisabled = false, isReadonly = false, value, placeholder, twClassName, onBlur, onFocus, autoFocus = false, ...props }, ref) => {
     const [isFocused, setIsFocused] = (0, react_1.useState)(autoFocus);
     const tw = (0, design_system_twrnc_preset_1.useTailwind)();
     const theme = (0, design_system_twrnc_preset_1.useTheme)();
     const placeholderTextColor = (0, react_1.useMemo)(() => theme === design_system_twrnc_preset_1.Theme.Light
         ? design_tokens_1.lightTheme.colors.text.alternative
         : design_tokens_1.darkTheme.colors.text.alternative, [theme]);
-    const finalFontWeight = Text_constants_1.MAP_TEXT_VARIANT_FONTWEIGHT[textVariant];
+    const finalFontWeight = Text_constants_1.TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant];
     const fontSuffix = Text_constants_1.TWCLASSMAP_TEXT_FONTWEIGHT[finalFontWeight];
-    const fontClass = `font-${types_1.FontFamily.Default}${fontSuffix}`;
+    const fontClass = `font-${design_system_shared_1.FontFamily.Default}${fontSuffix}`;
     const hasPlaceholder = placeholder !== undefined && placeholder !== null && placeholder !== '';
     // Only apply placeholder-mode styling when a placeholder is present and
     // the controlled value is empty. This keeps the iOS lineHeight workaround

package/dist/components/Input/Input.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;AAAA,qFAI8C;AAC9C,2DAAgE;AAChE,iCAAmE;AACnE,wDAAmD;AAEnD~~,iDAAsD;AACtD~~,+DAGgC;AAEhC,2DAAmE;AAGtD,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,KAAK,EACL,WAAW,GAAG,~~mBAAW~~,CAAC,MAAM,EAChC,qBAAqB,EACrB,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,KAAK,EACL,WAAW,EACX,WAAW,EACX,MAAM,EACN,OAAO,EACP,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,SAAS,CAAC,CAAC;IACtD,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IACzB,MAAM,KAAK,GAAG,IAAA,qCAAQ,GAAE,CAAC;IAEzB,MAAM,oBAAoB,GAAG,IAAA,eAAO,EAClC,GAAG,EAAE,CACH,KAAK,KAAK,kCAAK,CAAC,KAAK;QACnB,CAAC,CAAC,0BAAU,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW;QACpC,CAAC,CAAC,yBAAS,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,EACvC,CAAC,KAAK,CAAC,CACR,CAAC;IAEF,MAAM,eAAe,GAAG,~~4CAA2B~~,CAAC,WAAW,CAAC,CAAC;~~IACjE~~,MAAM,UAAU,GAAG,2CAA0B,CAAC,eAAe,CAAC,CAAC;IAC/D,MAAM,SAAS,GAAG,QAAQ,~~kBAAU~~,CAAC,OAAO,GAAG,UAAU,EAAE,CAAC;IAC5D,MAAM,cAAc,GAClB,WAAW,KAAK,SAAS,IAAI,WAAW,KAAK,IAAI,IAAI,WAAW,KAAK,EAAE,CAAC;IAC1E,wEAAwE;IACxE,0EAA0E;IAC1E,wEAAwE;IACxE,MAAM,oBAAoB,GAAG,cAAc,IAAI,KAAK,KAAK,EAAE,CAAC;IAE5D,MAAM,UAAU,GAAG,IAAA,eAAO,EACxB,GAAG,EAAE,CACH,EAAE,CAAC,KAAK,CACN,SAAS,EACT,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,oBAAoB,EACpB,CAAC,qBAAqB,IAAI,UAAU,IAAI,YAAY,EACpD,CAAC,qBAAqB;QACpB,CAAC,UAAU;QACX,SAAS;QACT,wBAAwB,EAC1B,WAAW,CACZ,EACH;QACE,SAAS;QACT,qBAAqB;QACrB,UAAU;QACV,SAAS;QACT,WAAW;QACX,EAAE;KACH,CACF,CAAC;IAEF,MAAM,gBAAgB,GAAG,IAAA,eAAO,EAC9B,GAAG,EAAE,CAAC,gDAA8B,CAAC,WAAW,CAAC,EACjD,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,oEAAoE;IACpE,MAAM,aAAa,GAAG,IAAA,mBAAW,EAC/B,CAAC,CAAmD,EAAE,EAAE;QACtD,IAAI,CAAC,UAAU,EAAE;YACf,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;SACb;IACH,CAAC,EACD,CAAC,UAAU,EAAE,MAAM,CAAC,CACrB,CAAC;IAEF,oEAAoE;IACpE,MAAM,cAAc,GAAG,IAAA,mBAAW,EAChC,CAAC,CAAoD,EAAE,EAAE;QACvD,IAAI,CAAC,UAAU,EAAE;YACf,YAAY,CAAC,IAAI,CAAC,CAAC;YACnB,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;SACd;IACH,CAAC,EACD,CAAC,UAAU,EAAE,OAAO,CAAC,CACtB,CAAC;IACF,MAAM,aAAa,GAAG;QACpB,UAAU;QACV,gBAAgB;QAChB,iEAAiE;QACjE,2DAA2D;QAC3D,yEAAyE;QACzE,uBAAQ,CAAC,EAAE,KAAK,KAAK;YACnB,oBAAoB,IAAI,EAAE,UAAU,EAAE,CAAU,EAAE;QACpD,KAAK;KACN,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IAElB,OAAO,CACL,CAAC,wBAAS,CACR,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,oBAAoB,CAAC,CAAC,oBAAoB,CAAC,CAC3C,IAAI,KAAK,CAAC,CACV,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,KAAK,CAAC,CAAC,aAAa,CAAC,CACrB,QAAQ,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,UAAU,CAAC,CACrC,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,MAAM,CAAC,CAAC,aAAa,CAAC,CACtB,OAAO,CAAC,CAAC,cAAc,CAAC,EACxB,CACH,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["import {\n Theme,\n useTailwind,\n useTheme,\n} from '@metamask/design-system-twrnc-preset';\nimport { darkTheme, lightTheme } from '@metamask/design-tokens';\nimport { forwardRef, useCallback, useMemo, useState } from 'react';\nimport { Platform, TextInput } from 'react-native';\n\nimport { ~~FontFamily, TextVariant } from '../../types';\nimport {~~\n ~~MAP_TEXT_VARIANT_FONTWEIGHT~~,\n TWCLASSMAP_TEXT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport { MAP_TEXT_VARIANT_INPUT_METRICS } from './Input.constants';\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<TextInput, InputProps>(\n (\n {\n style,\n textVariant = TextVariant.BodyMd,\n isStateStylesDisabled,\n isDisabled = false,\n isReadonly = false,\n value,\n placeholder,\n twClassName,\n onBlur,\n onFocus,\n autoFocus = false,\n ...props\n },\n ref,\n ) => {\n const [isFocused, setIsFocused] = useState(autoFocus);\n const tw = useTailwind();\n const theme = useTheme();\n\n const placeholderTextColor = useMemo(\n () =>\n theme === Theme.Light\n ? lightTheme.colors.text.alternative\n : darkTheme.colors.text.alternative,\n [theme],\n );\n\n const finalFontWeight = ~~MAP_TEXT_VARIANT_FONTWEIGHT~~[textVariant];\n const fontSuffix = TWCLASSMAP_TEXT_FONTWEIGHT[finalFontWeight];\n const fontClass = `font-${FontFamily.Default}${fontSuffix}`;\n const hasPlaceholder =\n placeholder !== undefined && placeholder !== null && placeholder !== '';\n // Only apply placeholder-mode styling when a placeholder is present and\n // the controlled value is empty. This keeps the iOS lineHeight workaround\n // scoped to the placeholder-visible state without affecting typed text.\n const isPlaceholderVisible = hasPlaceholder && value === '';\n\n const inputStyle = useMemo(\n () =>\n tw.style(\n fontClass,\n 'text-default',\n 'bg-default',\n 'border',\n 'border-transparent',\n !isStateStylesDisabled && isDisabled && 'opacity-50',\n !isStateStylesDisabled &&\n !isDisabled &&\n isFocused &&\n 'border-primary-default',\n twClassName,\n ),\n [\n fontClass,\n isStateStylesDisabled,\n isDisabled,\n isFocused,\n twClassName,\n tw,\n ],\n );\n\n const variantTextStyle = useMemo(\n () => MAP_TEXT_VARIANT_INPUT_METRICS[textVariant],\n [textVariant],\n );\n\n /* istanbul ignore next: handler body covered by focus/blur tests /\n const onBlurHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onBlur']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(false);\n onBlur?.(e);\n }\n },\n [isDisabled, onBlur],\n );\n\n / istanbul ignore next: handler body covered by focus/blur tests */\n const onFocusHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onFocus']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(true);\n onFocus?.(e);\n }\n },\n [isDisabled, onFocus],\n );\n const resolvedStyle = [\n inputStyle,\n variantTextStyle,\n // iOS-only workaround: when a placeholder is visible, native iOS\n // TextInput can render placeholder text vertically offset.\n // Keep this iOS-only because lineHeight: 0 can collapse text on Android.\n Platform.OS === 'ios' &&\n isPlaceholderVisible && { lineHeight: 0 as const },\n style,\n ].filter(Boolean);\n\n return (\n <TextInput\n ref={ref}\n placeholderTextColor={placeholderTextColor}\n {...props}\n placeholder={placeholder}\n value={value}\n style={resolvedStyle}\n editable={!isDisabled && !isReadonly}\n autoFocus={autoFocus}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n />\n );\n },\n);\n"]}
1	+ {"version":3,"file":"Input.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FontFamily, TextVariant } from '@metamask/design-system-shared';\nimport {\n Theme,\n useTailwind,\n useTheme,\n} from '@metamask/design-system-twrnc-preset';\nimport { darkTheme, lightTheme } from '@metamask/design-tokens';\nimport { forwardRef, useCallback, useMemo, useState } from 'react';\nimport { Platform, TextInput } from 'react-native';\n\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n TWCLASSMAP_TEXT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport { MAP_TEXT_VARIANT_INPUT_METRICS } from './Input.constants';\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<TextInput, InputProps>(\n (\n {\n style,\n textVariant = TextVariant.BodyMd,\n isStateStylesDisabled,\n isDisabled = false,\n isReadonly = false,\n value,\n placeholder,\n twClassName,\n onBlur,\n onFocus,\n autoFocus = false,\n ...props\n },\n ref,\n ) => {\n const [isFocused, setIsFocused] = useState(autoFocus);\n const tw = useTailwind();\n const theme = useTheme();\n\n const placeholderTextColor = useMemo(\n () =>\n theme === Theme.Light\n ? lightTheme.colors.text.alternative\n : darkTheme.colors.text.alternative,\n [theme],\n );\n\n const finalFontWeight = TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant];\n const fontSuffix = TWCLASSMAP_TEXT_FONTWEIGHT[finalFontWeight];\n const fontClass = `font-${FontFamily.Default}${fontSuffix}`;\n const hasPlaceholder =\n placeholder !== undefined && placeholder !== null && placeholder !== '';\n // Only apply placeholder-mode styling when a placeholder is present and\n // the controlled value is empty. This keeps the iOS lineHeight workaround\n // scoped to the placeholder-visible state without affecting typed text.\n const isPlaceholderVisible = hasPlaceholder && value === '';\n\n const inputStyle = useMemo(\n () =>\n tw.style(\n fontClass,\n 'text-default',\n 'bg-default',\n 'border',\n 'border-transparent',\n !isStateStylesDisabled && isDisabled && 'opacity-50',\n !isStateStylesDisabled &&\n !isDisabled &&\n isFocused &&\n 'border-primary-default',\n twClassName,\n ),\n [\n fontClass,\n isStateStylesDisabled,\n isDisabled,\n isFocused,\n twClassName,\n tw,\n ],\n );\n\n const variantTextStyle = useMemo(\n () => MAP_TEXT_VARIANT_INPUT_METRICS[textVariant],\n [textVariant],\n );\n\n /* istanbul ignore next: handler body covered by focus/blur tests /\n const onBlurHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onBlur']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(false);\n onBlur?.(e);\n }\n },\n [isDisabled, onBlur],\n );\n\n / istanbul ignore next: handler body covered by focus/blur tests */\n const onFocusHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onFocus']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(true);\n onFocus?.(e);\n }\n },\n [isDisabled, onFocus],\n );\n const resolvedStyle = [\n inputStyle,\n variantTextStyle,\n // iOS-only workaround: when a placeholder is visible, native iOS\n // TextInput can render placeholder text vertically offset.\n // Keep this iOS-only because lineHeight: 0 can collapse text on Android.\n Platform.OS === 'ios' &&\n isPlaceholderVisible && { lineHeight: 0 as const },\n style,\n ].filter(Boolean);\n\n return (\n <TextInput\n ref={ref}\n placeholderTextColor={placeholderTextColor}\n {...props}\n placeholder={placeholder}\n value={value}\n style={resolvedStyle}\n editable={!isDisabled && !isReadonly}\n autoFocus={autoFocus}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n />\n );\n },\n);\n"]}

package/dist/components/Input/Input.constants.cjs CHANGED Viewed

@@ -1,67 +1,67 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MAP_TEXT_VARIANT_INPUT_METRICS = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const design_tokens_1 = require("@metamask/design-tokens");
-const types_1 = require("../../types/index.cjs");
 /**
  * Typographic metrics for Input: same tokens as `text-*` utilities but **without** `lineHeight`.
  * React Native `TextInput` aligns single-line text more predictably when line height is not set
  * from the design-system paragraph specs (matches legacy / temp Input.styles behavior).
  */
 exports.MAP_TEXT_VARIANT_INPUT_METRICS = {
-    [types_1.TextVariant.DisplayLg]: {
+    [design_system_shared_1.TextVariant.DisplayLg]: {
         fontSize: design_tokens_1.typography.sDisplayLG.fontSize,
         letterSpacing: design_tokens_1.typography.sDisplayLG.letterSpacing,
     },
-    [types_1.TextVariant.DisplayMd]: {
+    [design_system_shared_1.TextVariant.DisplayMd]: {
         fontSize: design_tokens_1.typography.sDisplayMD.fontSize,
         letterSpacing: design_tokens_1.typography.sDisplayMD.letterSpacing,
     },
-    [types_1.TextVariant.HeadingLg]: {
+    [design_system_shared_1.TextVariant.HeadingLg]: {
         fontSize: design_tokens_1.typography.sHeadingLG.fontSize,
         letterSpacing: design_tokens_1.typography.sHeadingLG.letterSpacing,
     },
-    [types_1.TextVariant.HeadingMd]: {
+    [design_system_shared_1.TextVariant.HeadingMd]: {
         fontSize: design_tokens_1.typography.sHeadingMD.fontSize,
         letterSpacing: design_tokens_1.typography.sHeadingMD.letterSpacing,
     },
-    [types_1.TextVariant.HeadingSm]: {
+    [design_system_shared_1.TextVariant.HeadingSm]: {
         fontSize: design_tokens_1.typography.sHeadingSM.fontSize,
         letterSpacing: design_tokens_1.typography.sHeadingSM.letterSpacing,
     },
-    [types_1.TextVariant.BodyLg]: {
+    [design_system_shared_1.TextVariant.BodyLg]: {
         fontSize: design_tokens_1.typography.sBodyLGMedium.fontSize,
         letterSpacing: design_tokens_1.typography.sBodyLGMedium.letterSpacing,
     },
-    [types_1.TextVariant.BodyMd]: {
+    [design_system_shared_1.TextVariant.BodyMd]: {
         fontSize: design_tokens_1.typography.sBodyMD.fontSize,
         letterSpacing: design_tokens_1.typography.sBodyMD.letterSpacing,
     },
-    [types_1.TextVariant.BodySm]: {
+    [design_system_shared_1.TextVariant.BodySm]: {
         fontSize: design_tokens_1.typography.sBodySM.fontSize,
         letterSpacing: design_tokens_1.typography.sBodySM.letterSpacing,
     },
-    [types_1.TextVariant.BodyXs]: {
+    [design_system_shared_1.TextVariant.BodyXs]: {
         fontSize: design_tokens_1.typography.sBodyXS.fontSize,
         letterSpacing: design_tokens_1.typography.sBodyXS.letterSpacing,
     },
-    [types_1.TextVariant.PageHeading]: {
+    [design_system_shared_1.TextVariant.PageHeading]: {
         fontSize: design_tokens_1.typography.sPageHeading.fontSize,
         letterSpacing: design_tokens_1.typography.sPageHeading.letterSpacing,
     },
-    [types_1.TextVariant.SectionHeading]: {
+    [design_system_shared_1.TextVariant.SectionHeading]: {
         fontSize: design_tokens_1.typography.sSectionHeading.fontSize,
         letterSpacing: design_tokens_1.typography.sSectionHeading.letterSpacing,
     },
-    [types_1.TextVariant.ButtonLabelMd]: {
+    [design_system_shared_1.TextVariant.ButtonLabelMd]: {
         fontSize: design_tokens_1.typography.sButtonLabelMd.fontSize,
         letterSpacing: design_tokens_1.typography.sButtonLabelMd.letterSpacing,
     },
-    [types_1.TextVariant.ButtonLabelLg]: {
+    [design_system_shared_1.TextVariant.ButtonLabelLg]: {
         fontSize: design_tokens_1.typography.sButtonLabelLg.fontSize,
         letterSpacing: design_tokens_1.typography.sButtonLabelLg.letterSpacing,
     },
-    [types_1.TextVariant.AmountDisplayLg]: {
+    [design_system_shared_1.TextVariant.AmountDisplayLg]: {
         fontSize: design_tokens_1.typography.sAmountDisplayLg.fontSize,
         letterSpacing: design_tokens_1.typography.sAmountDisplayLg.letterSpacing,
     },

package/dist/components/Input/Input.constants.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.constants.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":";;;AAAA,2DAAqD;AAErD~~,iDAA0C;AAE1C~~;;;;GAIG;AACU,QAAA,8BAA8B,GAGvC;IACF,CAAC,~~mBAAW~~,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,~~mBAAW~~,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,~~mBAAW~~,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,~~mBAAW~~,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,~~mBAAW~~,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,~~mBAAW~~,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,aAAa,CAAC,QAAQ;QAC3C,aAAa,EAAE,0BAAU,CAAC,aAAa,CAAC,aAAa;KACtD;IACD,CAAC,~~mBAAW~~,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,0BAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,~~mBAAW~~,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,0BAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,~~mBAAW~~,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,0BAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,~~mBAAW~~,CAAC,WAAW,CAAC,EAAE;QACzB,QAAQ,EAAE,0BAAU,CAAC,YAAY,CAAC,QAAQ;QAC1C,aAAa,EAAE,0BAAU,CAAC,YAAY,CAAC,aAAa;KACrD;IACD,CAAC,~~mBAAW~~,CAAC,cAAc,CAAC,EAAE;QAC5B,QAAQ,EAAE,0BAAU,CAAC,eAAe,CAAC,QAAQ;QAC7C,aAAa,EAAE,0BAAU,CAAC,eAAe,CAAC,aAAa;KACxD;IACD,CAAC,~~mBAAW~~,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,0BAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,0BAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,~~mBAAW~~,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,0BAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,0BAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,~~mBAAW~~,CAAC,eAAe,CAAC,EAAE;QAC7B,QAAQ,EAAE,0BAAU,CAAC,gBAAgB,CAAC,QAAQ;QAC9C,aAAa,EAAE,0BAAU,CAAC,gBAAgB,CAAC,aAAa;KACzD;CACF,CAAC","sourcesContent":["import { ~~typography~~ } from '@metamask/design-~~tokens~~';\n\nimport { ~~TextVariant~~ } from '~~../../types~~';\n\n/*\n Typographic metrics for Input: same tokens as `text-` utilities but without* `lineHeight`.\n * React Native `TextInput` aligns single-line text more predictably when line height is not set\n * from the design-system paragraph specs (matches legacy / temp Input.styles behavior).\n */\nexport const MAP_TEXT_VARIANT_INPUT_METRICS: Record<\n TextVariant,\n { fontSize: number; letterSpacing: number }\n> = {\n [TextVariant.DisplayLg]: {\n fontSize: typography.sDisplayLG.fontSize,\n letterSpacing: typography.sDisplayLG.letterSpacing,\n },\n [TextVariant.DisplayMd]: {\n fontSize: typography.sDisplayMD.fontSize,\n letterSpacing: typography.sDisplayMD.letterSpacing,\n },\n [TextVariant.HeadingLg]: {\n fontSize: typography.sHeadingLG.fontSize,\n letterSpacing: typography.sHeadingLG.letterSpacing,\n },\n [TextVariant.HeadingMd]: {\n fontSize: typography.sHeadingMD.fontSize,\n letterSpacing: typography.sHeadingMD.letterSpacing,\n },\n [TextVariant.HeadingSm]: {\n fontSize: typography.sHeadingSM.fontSize,\n letterSpacing: typography.sHeadingSM.letterSpacing,\n },\n [TextVariant.BodyLg]: {\n fontSize: typography.sBodyLGMedium.fontSize,\n letterSpacing: typography.sBodyLGMedium.letterSpacing,\n },\n [TextVariant.BodyMd]: {\n fontSize: typography.sBodyMD.fontSize,\n letterSpacing: typography.sBodyMD.letterSpacing,\n },\n [TextVariant.BodySm]: {\n fontSize: typography.sBodySM.fontSize,\n letterSpacing: typography.sBodySM.letterSpacing,\n },\n [TextVariant.BodyXs]: {\n fontSize: typography.sBodyXS.fontSize,\n letterSpacing: typography.sBodyXS.letterSpacing,\n },\n [TextVariant.PageHeading]: {\n fontSize: typography.sPageHeading.fontSize,\n letterSpacing: typography.sPageHeading.letterSpacing,\n },\n [TextVariant.SectionHeading]: {\n fontSize: typography.sSectionHeading.fontSize,\n letterSpacing: typography.sSectionHeading.letterSpacing,\n },\n [TextVariant.ButtonLabelMd]: {\n fontSize: typography.sButtonLabelMd.fontSize,\n letterSpacing: typography.sButtonLabelMd.letterSpacing,\n },\n [TextVariant.ButtonLabelLg]: {\n fontSize: typography.sButtonLabelLg.fontSize,\n letterSpacing: typography.sButtonLabelLg.letterSpacing,\n },\n [TextVariant.AmountDisplayLg]: {\n fontSize: typography.sAmountDisplayLg.fontSize,\n letterSpacing: typography.sAmountDisplayLg.letterSpacing,\n },\n};\n"]}
1	+ {"version":3,"file":"Input.constants.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":";;;AAAA,yEAA6D;AAC7D,2DAAqD;AAErD;;;;GAIG;AACU,QAAA,8BAA8B,GAGvC;IACF,CAAC,kCAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,kCAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,kCAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,kCAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,kCAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,0BAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,0BAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,kCAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,aAAa,CAAC,QAAQ;QAC3C,aAAa,EAAE,0BAAU,CAAC,aAAa,CAAC,aAAa;KACtD;IACD,CAAC,kCAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,0BAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,kCAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,0BAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,kCAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,0BAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,0BAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,kCAAW,CAAC,WAAW,CAAC,EAAE;QACzB,QAAQ,EAAE,0BAAU,CAAC,YAAY,CAAC,QAAQ;QAC1C,aAAa,EAAE,0BAAU,CAAC,YAAY,CAAC,aAAa;KACrD;IACD,CAAC,kCAAW,CAAC,cAAc,CAAC,EAAE;QAC5B,QAAQ,EAAE,0BAAU,CAAC,eAAe,CAAC,QAAQ;QAC7C,aAAa,EAAE,0BAAU,CAAC,eAAe,CAAC,aAAa;KACxD;IACD,CAAC,kCAAW,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,0BAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,0BAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,kCAAW,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,0BAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,0BAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,kCAAW,CAAC,eAAe,CAAC,EAAE;QAC7B,QAAQ,EAAE,0BAAU,CAAC,gBAAgB,CAAC,QAAQ;QAC9C,aAAa,EAAE,0BAAU,CAAC,gBAAgB,CAAC,aAAa;KACzD;CACF,CAAC","sourcesContent":["import { TextVariant } from '@metamask/design-system-shared';\nimport { typography } from '@metamask/design-tokens';\n\n/*\n Typographic metrics for Input: same tokens as `text-` utilities but without* `lineHeight`.\n * React Native `TextInput` aligns single-line text more predictably when line height is not set\n * from the design-system paragraph specs (matches legacy / temp Input.styles behavior).\n */\nexport const MAP_TEXT_VARIANT_INPUT_METRICS: Record<\n TextVariant,\n { fontSize: number; letterSpacing: number }\n> = {\n [TextVariant.DisplayLg]: {\n fontSize: typography.sDisplayLG.fontSize,\n letterSpacing: typography.sDisplayLG.letterSpacing,\n },\n [TextVariant.DisplayMd]: {\n fontSize: typography.sDisplayMD.fontSize,\n letterSpacing: typography.sDisplayMD.letterSpacing,\n },\n [TextVariant.HeadingLg]: {\n fontSize: typography.sHeadingLG.fontSize,\n letterSpacing: typography.sHeadingLG.letterSpacing,\n },\n [TextVariant.HeadingMd]: {\n fontSize: typography.sHeadingMD.fontSize,\n letterSpacing: typography.sHeadingMD.letterSpacing,\n },\n [TextVariant.HeadingSm]: {\n fontSize: typography.sHeadingSM.fontSize,\n letterSpacing: typography.sHeadingSM.letterSpacing,\n },\n [TextVariant.BodyLg]: {\n fontSize: typography.sBodyLGMedium.fontSize,\n letterSpacing: typography.sBodyLGMedium.letterSpacing,\n },\n [TextVariant.BodyMd]: {\n fontSize: typography.sBodyMD.fontSize,\n letterSpacing: typography.sBodyMD.letterSpacing,\n },\n [TextVariant.BodySm]: {\n fontSize: typography.sBodySM.fontSize,\n letterSpacing: typography.sBodySM.letterSpacing,\n },\n [TextVariant.BodyXs]: {\n fontSize: typography.sBodyXS.fontSize,\n letterSpacing: typography.sBodyXS.letterSpacing,\n },\n [TextVariant.PageHeading]: {\n fontSize: typography.sPageHeading.fontSize,\n letterSpacing: typography.sPageHeading.letterSpacing,\n },\n [TextVariant.SectionHeading]: {\n fontSize: typography.sSectionHeading.fontSize,\n letterSpacing: typography.sSectionHeading.letterSpacing,\n },\n [TextVariant.ButtonLabelMd]: {\n fontSize: typography.sButtonLabelMd.fontSize,\n letterSpacing: typography.sButtonLabelMd.letterSpacing,\n },\n [TextVariant.ButtonLabelLg]: {\n fontSize: typography.sButtonLabelLg.fontSize,\n letterSpacing: typography.sButtonLabelLg.letterSpacing,\n },\n [TextVariant.AmountDisplayLg]: {\n fontSize: typography.sAmountDisplayLg.fontSize,\n letterSpacing: typography.sAmountDisplayLg.letterSpacing,\n },\n};\n"]}

package/dist/components/Input/Input.constants.d.cts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { TextVariant } from "../../types/index.cjs";
+import { TextVariant } from "@metamask/design-system-shared";
 /**
  * Typographic metrics for Input: same tokens as `text-*` utilities but **without** `lineHeight`.
  * React Native `TextInput` aligns single-line text more predictably when line height is not set

package/dist/components/Input/Input.constants.d.cts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":"~~AAEA~~,OAAO,EAAE,WAAW,EAAE,~~8BAAoB~~;~~AAE1C~~;;;;GAIG;AACH,eAAO,MAAM,8BAA8B,EAAE,MAAM,CACjD,WAAW,EACX;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,MAAM,CAAA;CAAE,CA0D5C,CAAC"}
1	+ {"version":3,"file":"Input.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,uCAAuC;AAG7D;;;;GAIG;AACH,eAAO,MAAM,8BAA8B,EAAE,MAAM,CACjD,WAAW,EACX;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,MAAM,CAAA;CAAE,CA0D5C,CAAC"}

package/dist/components/Input/Input.constants.d.mts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { TextVariant } from "../../types/index.mjs";
+import { TextVariant } from "@metamask/design-system-shared";
 /**
  * Typographic metrics for Input: same tokens as `text-*` utilities but **without** `lineHeight`.
  * React Native `TextInput` aligns single-line text more predictably when line height is not set

package/dist/components/Input/Input.constants.d.mts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":"~~AAEA~~,OAAO,EAAE,WAAW,EAAE,~~8BAAoB~~;~~AAE1C~~;;;;GAIG;AACH,eAAO,MAAM,8BAA8B,EAAE,MAAM,CACjD,WAAW,EACX;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,MAAM,CAAA;CAAE,CA0D5C,CAAC"}
1	+ {"version":3,"file":"Input.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,uCAAuC;AAG7D;;;;GAIG;AACH,eAAO,MAAM,8BAA8B,EAAE,MAAM,CACjD,WAAW,EACX;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,MAAM,CAAA;CAAE,CA0D5C,CAAC"}

package/dist/components/Input/Input.constants.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
+import { TextVariant } from "@metamask/design-system-shared";
 import { typography } from "@metamask/design-tokens";
-import { TextVariant } from "../../types/index.mjs";
 /**
  * Typographic metrics for Input: same tokens as `text-*` utilities but **without** `lineHeight`.
  * React Native `TextInput` aligns single-line text more predictably when line height is not set

package/dist/components/Input/Input.constants.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.constants.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,~~UAAU~~,EAAE,~~gCAAgC~~;~~AAErD~~,OAAO,EAAE,~~WAAW~~,EAAE,~~8BAAoB~~;~~AAE1C~~;;;;GAIG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAGvC;IACF,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ;QAC3C,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,aAAa;KACtD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,UAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,UAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,UAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,WAAW,CAAC,WAAW,CAAC,EAAE;QACzB,QAAQ,EAAE,UAAU,CAAC,YAAY,CAAC,QAAQ;QAC1C,aAAa,EAAE,UAAU,CAAC,YAAY,CAAC,aAAa;KACrD;IACD,CAAC,WAAW,CAAC,cAAc,CAAC,EAAE;QAC5B,QAAQ,EAAE,UAAU,CAAC,eAAe,CAAC,QAAQ;QAC7C,aAAa,EAAE,UAAU,CAAC,eAAe,CAAC,aAAa;KACxD;IACD,CAAC,WAAW,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,UAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,UAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,WAAW,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,UAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,UAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,WAAW,CAAC,eAAe,CAAC,EAAE;QAC7B,QAAQ,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ;QAC9C,aAAa,EAAE,UAAU,CAAC,gBAAgB,CAAC,aAAa;KACzD;CACF,CAAC","sourcesContent":["import { ~~typography~~ } from '@metamask/design-~~tokens~~';\n\nimport { ~~TextVariant~~ } from '~~../../types~~';\n\n/*\n Typographic metrics for Input: same tokens as `text-` utilities but without* `lineHeight`.\n * React Native `TextInput` aligns single-line text more predictably when line height is not set\n * from the design-system paragraph specs (matches legacy / temp Input.styles behavior).\n */\nexport const MAP_TEXT_VARIANT_INPUT_METRICS: Record<\n TextVariant,\n { fontSize: number; letterSpacing: number }\n> = {\n [TextVariant.DisplayLg]: {\n fontSize: typography.sDisplayLG.fontSize,\n letterSpacing: typography.sDisplayLG.letterSpacing,\n },\n [TextVariant.DisplayMd]: {\n fontSize: typography.sDisplayMD.fontSize,\n letterSpacing: typography.sDisplayMD.letterSpacing,\n },\n [TextVariant.HeadingLg]: {\n fontSize: typography.sHeadingLG.fontSize,\n letterSpacing: typography.sHeadingLG.letterSpacing,\n },\n [TextVariant.HeadingMd]: {\n fontSize: typography.sHeadingMD.fontSize,\n letterSpacing: typography.sHeadingMD.letterSpacing,\n },\n [TextVariant.HeadingSm]: {\n fontSize: typography.sHeadingSM.fontSize,\n letterSpacing: typography.sHeadingSM.letterSpacing,\n },\n [TextVariant.BodyLg]: {\n fontSize: typography.sBodyLGMedium.fontSize,\n letterSpacing: typography.sBodyLGMedium.letterSpacing,\n },\n [TextVariant.BodyMd]: {\n fontSize: typography.sBodyMD.fontSize,\n letterSpacing: typography.sBodyMD.letterSpacing,\n },\n [TextVariant.BodySm]: {\n fontSize: typography.sBodySM.fontSize,\n letterSpacing: typography.sBodySM.letterSpacing,\n },\n [TextVariant.BodyXs]: {\n fontSize: typography.sBodyXS.fontSize,\n letterSpacing: typography.sBodyXS.letterSpacing,\n },\n [TextVariant.PageHeading]: {\n fontSize: typography.sPageHeading.fontSize,\n letterSpacing: typography.sPageHeading.letterSpacing,\n },\n [TextVariant.SectionHeading]: {\n fontSize: typography.sSectionHeading.fontSize,\n letterSpacing: typography.sSectionHeading.letterSpacing,\n },\n [TextVariant.ButtonLabelMd]: {\n fontSize: typography.sButtonLabelMd.fontSize,\n letterSpacing: typography.sButtonLabelMd.letterSpacing,\n },\n [TextVariant.ButtonLabelLg]: {\n fontSize: typography.sButtonLabelLg.fontSize,\n letterSpacing: typography.sButtonLabelLg.letterSpacing,\n },\n [TextVariant.AmountDisplayLg]: {\n fontSize: typography.sAmountDisplayLg.fontSize,\n letterSpacing: typography.sAmountDisplayLg.letterSpacing,\n },\n};\n"]}
1	+ {"version":3,"file":"Input.constants.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,uCAAuC;AAC7D,OAAO,EAAE,UAAU,EAAE,gCAAgC;AAErD;;;;GAIG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAGvC;IACF,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE;QACvB,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,QAAQ;QACxC,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa;KACnD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ;QAC3C,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,aAAa;KACtD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,UAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,UAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE;QACpB,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,QAAQ;QACrC,aAAa,EAAE,UAAU,CAAC,OAAO,CAAC,aAAa;KAChD;IACD,CAAC,WAAW,CAAC,WAAW,CAAC,EAAE;QACzB,QAAQ,EAAE,UAAU,CAAC,YAAY,CAAC,QAAQ;QAC1C,aAAa,EAAE,UAAU,CAAC,YAAY,CAAC,aAAa;KACrD;IACD,CAAC,WAAW,CAAC,cAAc,CAAC,EAAE;QAC5B,QAAQ,EAAE,UAAU,CAAC,eAAe,CAAC,QAAQ;QAC7C,aAAa,EAAE,UAAU,CAAC,eAAe,CAAC,aAAa;KACxD;IACD,CAAC,WAAW,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,UAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,UAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,WAAW,CAAC,aAAa,CAAC,EAAE;QAC3B,QAAQ,EAAE,UAAU,CAAC,cAAc,CAAC,QAAQ;QAC5C,aAAa,EAAE,UAAU,CAAC,cAAc,CAAC,aAAa;KACvD;IACD,CAAC,WAAW,CAAC,eAAe,CAAC,EAAE;QAC7B,QAAQ,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ;QAC9C,aAAa,EAAE,UAAU,CAAC,gBAAgB,CAAC,aAAa;KACzD;CACF,CAAC","sourcesContent":["import { TextVariant } from '@metamask/design-system-shared';\nimport { typography } from '@metamask/design-tokens';\n\n/*\n Typographic metrics for Input: same tokens as `text-` utilities but without* `lineHeight`.\n * React Native `TextInput` aligns single-line text more predictably when line height is not set\n * from the design-system paragraph specs (matches legacy / temp Input.styles behavior).\n */\nexport const MAP_TEXT_VARIANT_INPUT_METRICS: Record<\n TextVariant,\n { fontSize: number; letterSpacing: number }\n> = {\n [TextVariant.DisplayLg]: {\n fontSize: typography.sDisplayLG.fontSize,\n letterSpacing: typography.sDisplayLG.letterSpacing,\n },\n [TextVariant.DisplayMd]: {\n fontSize: typography.sDisplayMD.fontSize,\n letterSpacing: typography.sDisplayMD.letterSpacing,\n },\n [TextVariant.HeadingLg]: {\n fontSize: typography.sHeadingLG.fontSize,\n letterSpacing: typography.sHeadingLG.letterSpacing,\n },\n [TextVariant.HeadingMd]: {\n fontSize: typography.sHeadingMD.fontSize,\n letterSpacing: typography.sHeadingMD.letterSpacing,\n },\n [TextVariant.HeadingSm]: {\n fontSize: typography.sHeadingSM.fontSize,\n letterSpacing: typography.sHeadingSM.letterSpacing,\n },\n [TextVariant.BodyLg]: {\n fontSize: typography.sBodyLGMedium.fontSize,\n letterSpacing: typography.sBodyLGMedium.letterSpacing,\n },\n [TextVariant.BodyMd]: {\n fontSize: typography.sBodyMD.fontSize,\n letterSpacing: typography.sBodyMD.letterSpacing,\n },\n [TextVariant.BodySm]: {\n fontSize: typography.sBodySM.fontSize,\n letterSpacing: typography.sBodySM.letterSpacing,\n },\n [TextVariant.BodyXs]: {\n fontSize: typography.sBodyXS.fontSize,\n letterSpacing: typography.sBodyXS.letterSpacing,\n },\n [TextVariant.PageHeading]: {\n fontSize: typography.sPageHeading.fontSize,\n letterSpacing: typography.sPageHeading.letterSpacing,\n },\n [TextVariant.SectionHeading]: {\n fontSize: typography.sSectionHeading.fontSize,\n letterSpacing: typography.sSectionHeading.letterSpacing,\n },\n [TextVariant.ButtonLabelMd]: {\n fontSize: typography.sButtonLabelMd.fontSize,\n letterSpacing: typography.sButtonLabelMd.letterSpacing,\n },\n [TextVariant.ButtonLabelLg]: {\n fontSize: typography.sButtonLabelLg.fontSize,\n letterSpacing: typography.sButtonLabelLg.letterSpacing,\n },\n [TextVariant.AmountDisplayLg]: {\n fontSize: typography.sAmountDisplayLg.fontSize,\n letterSpacing: typography.sAmountDisplayLg.letterSpacing,\n },\n};\n"]}

package/dist/components/Input/Input.d.cts CHANGED Viewed

@@ -1,5 +1,5 @@
+import { TextVariant } from "@metamask/design-system-shared";
 import { TextInput } from "react-native/index.js";
-import { TextVariant } from "../../types/index.cjs";
 export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("react-native").TextInputProps, "editable" | "value" | "defaultValue"> & {
     value: string;
     textVariant?: TextVariant | undefined;

package/dist/components/Input/Input.d.cts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"~~AAOA~~,OAAO,~~EAAY~~,~~SAAS~~,EAAE,~~8BAAqB~~;~~AAEnD~~,OAAO,~~EAAc~~,~~WAAW~~,EAAE,~~8BAAoB~~;~~AAStD~~,eAAO,MAAM,KAAK;;;;;;;6CAqHjB,CAAC"}
1	+ {"version":3,"file":"Input.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,WAAW,EAAE,uCAAuC;AAQzE,OAAO,EAAY,SAAS,EAAE,8BAAqB;AAUnD,eAAO,MAAM,KAAK;;;;;;;6CAqHjB,CAAC"}

package/dist/components/Input/Input.d.mts CHANGED Viewed

@@ -1,5 +1,5 @@
+import { TextVariant } from "@metamask/design-system-shared";
 import { TextInput } from "react-native/index.js";
-import { TextVariant } from "../../types/index.mjs";
 export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("react-native").TextInputProps, "editable" | "value" | "defaultValue"> & {
     value: string;
     textVariant?: TextVariant | undefined;

package/dist/components/Input/Input.d.mts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"~~AAOA~~,OAAO,~~EAAY~~,~~SAAS~~,EAAE,~~8BAAqB~~;~~AAEnD~~,OAAO,~~EAAc~~,~~WAAW~~,EAAE,~~8BAAoB~~;~~AAStD~~,eAAO,MAAM,KAAK;;;;;;;6CAqHjB,CAAC"}
1	+ {"version":3,"file":"Input.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,WAAW,EAAE,uCAAuC;AAQzE,OAAO,EAAY,SAAS,EAAE,8BAAqB;AAUnD,eAAO,MAAM,KAAK;;;;;;;6CAqHjB,CAAC"}

package/dist/components/Input/Input.mjs CHANGED Viewed

@@ -1,9 +1,9 @@
+import { FontFamily, TextVariant } from "@metamask/design-system-shared";
 import { Theme, useTailwind, useTheme } from "@metamask/design-system-twrnc-preset";
 import { darkTheme, lightTheme } from "@metamask/design-tokens";
 import { forwardRef, useCallback, useMemo, useState } from "react";
 import { Platform, TextInput } from "react-native/index.js";
-import { FontFamily, TextVariant } from "../../types/index.mjs";
-import { MAP_TEXT_VARIANT_FONTWEIGHT, TWCLASSMAP_TEXT_FONTWEIGHT } from "../Text/Text.constants.mjs";
+import { TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT, TWCLASSMAP_TEXT_FONTWEIGHT } from "../Text/Text.constants.mjs";
 import { MAP_TEXT_VARIANT_INPUT_METRICS } from "./Input.constants.mjs";
 export const Input = forwardRef(({ style, textVariant = TextVariant.BodyMd, isStateStylesDisabled, isDisabled = false, isReadonly = false, value, placeholder, twClassName, onBlur, onFocus, autoFocus = false, ...props }, ref) => {
     const [isFocused, setIsFocused] = useState(autoFocus);
@@ -12,7 +12,7 @@ export const Input = forwardRef(({ style, textVariant = TextVariant.BodyMd, isSt
     const placeholderTextColor = useMemo(() => theme === Theme.Light
         ? lightTheme.colors.text.alternative
         : darkTheme.colors.text.alternative, [theme]);
-    const finalFontWeight = MAP_TEXT_VARIANT_FONTWEIGHT[textVariant];
+    const finalFontWeight = TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant];
     const fontSuffix = TWCLASSMAP_TEXT_FONTWEIGHT[finalFontWeight];
     const fontClass = `font-${FontFamily.Default}${fontSuffix}`;
     const hasPlaceholder = placeholder !== undefined && placeholder !== null && placeholder !== '';

package/dist/components/Input/Input.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,EACL,WAAW,EACX,QAAQ,EACT,6CAA6C;AAC9C,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,gCAAgC;AAChE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,cAAc;AACnE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,8BAAqB;AAEnD,OAAO,~~EAAE,UAAU,EAAE,WAAW,EAAE,8BAAoB;AACtD,OAAO,~~EACL,~~2BAA2B~~,~~EAC3B~~,0BAA0B,EAC3B,mCAA+B;AAEhC,OAAO,EAAE,8BAA8B,EAAE,8BAA0B;AAGnE,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EACE,KAAK,EACL,WAAW,GAAG,WAAW,CAAC,MAAM,EAChC,qBAAqB,EACrB,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,KAAK,EACL,WAAW,EACX,WAAW,EACX,MAAM,EACN,OAAO,EACP,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;IACtD,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IACzB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,MAAM,oBAAoB,GAAG,OAAO,CAClC,GAAG,EAAE,CACH,KAAK,KAAK,KAAK,CAAC,KAAK;QACnB,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW;QACpC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,EACvC,CAAC,KAAK,CAAC,CACR,CAAC;IAEF,MAAM,eAAe,GAAG,~~2BAA2B~~,CAAC,WAAW,CAAC,CAAC;~~IACjE~~,MAAM,UAAU,GAAG,0BAA0B,CAAC,eAAe,CAAC,CAAC;IAC/D,MAAM,SAAS,GAAG,QAAQ,UAAU,CAAC,OAAO,GAAG,UAAU,EAAE,CAAC;IAC5D,MAAM,cAAc,GAClB,WAAW,KAAK,SAAS,IAAI,WAAW,KAAK,IAAI,IAAI,WAAW,KAAK,EAAE,CAAC;IAC1E,wEAAwE;IACxE,0EAA0E;IAC1E,wEAAwE;IACxE,MAAM,oBAAoB,GAAG,cAAc,IAAI,KAAK,KAAK,EAAE,CAAC;IAE5D,MAAM,UAAU,GAAG,OAAO,CACxB,GAAG,EAAE,CACH,EAAE,CAAC,KAAK,CACN,SAAS,EACT,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,oBAAoB,EACpB,CAAC,qBAAqB,IAAI,UAAU,IAAI,YAAY,EACpD,CAAC,qBAAqB;QACpB,CAAC,UAAU;QACX,SAAS;QACT,wBAAwB,EAC1B,WAAW,CACZ,EACH;QACE,SAAS;QACT,qBAAqB;QACrB,UAAU;QACV,SAAS;QACT,WAAW;QACX,EAAE;KACH,CACF,CAAC;IAEF,MAAM,gBAAgB,GAAG,OAAO,CAC9B,GAAG,EAAE,CAAC,8BAA8B,CAAC,WAAW,CAAC,EACjD,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,oEAAoE;IACpE,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,CAAmD,EAAE,EAAE;QACtD,IAAI,CAAC,UAAU,EAAE;YACf,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;SACb;IACH,CAAC,EACD,CAAC,UAAU,EAAE,MAAM,CAAC,CACrB,CAAC;IAEF,oEAAoE;IACpE,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,CAAoD,EAAE,EAAE;QACvD,IAAI,CAAC,UAAU,EAAE;YACf,YAAY,CAAC,IAAI,CAAC,CAAC;YACnB,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;SACd;IACH,CAAC,EACD,CAAC,UAAU,EAAE,OAAO,CAAC,CACtB,CAAC;IACF,MAAM,aAAa,GAAG;QACpB,UAAU;QACV,gBAAgB;QAChB,iEAAiE;QACjE,2DAA2D;QAC3D,yEAAyE;QACzE,QAAQ,CAAC,EAAE,KAAK,KAAK;YACnB,oBAAoB,IAAI,EAAE,UAAU,EAAE,CAAU,EAAE;QACpD,KAAK;KACN,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IAElB,OAAO,CACL,CAAC,SAAS,CACR,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,oBAAoB,CAAC,CAAC,oBAAoB,CAAC,CAC3C,IAAI,KAAK,CAAC,CACV,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,KAAK,CAAC,CAAC,aAAa,CAAC,CACrB,QAAQ,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,UAAU,CAAC,CACrC,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,MAAM,CAAC,CAAC,aAAa,CAAC,CACtB,OAAO,CAAC,CAAC,cAAc,CAAC,EACxB,CACH,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["import {\n Theme,\n useTailwind,\n useTheme,\n} from '@metamask/design-system-twrnc-preset';\nimport { darkTheme, lightTheme } from '@metamask/design-tokens';\nimport { forwardRef, useCallback, useMemo, useState } from 'react';\nimport { Platform, TextInput } from 'react-native';\n\nimport { ~~FontFamily, TextVariant } from '../../types';\nimport {~~\n ~~MAP_TEXT_VARIANT_FONTWEIGHT~~,\n TWCLASSMAP_TEXT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport { MAP_TEXT_VARIANT_INPUT_METRICS } from './Input.constants';\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<TextInput, InputProps>(\n (\n {\n style,\n textVariant = TextVariant.BodyMd,\n isStateStylesDisabled,\n isDisabled = false,\n isReadonly = false,\n value,\n placeholder,\n twClassName,\n onBlur,\n onFocus,\n autoFocus = false,\n ...props\n },\n ref,\n ) => {\n const [isFocused, setIsFocused] = useState(autoFocus);\n const tw = useTailwind();\n const theme = useTheme();\n\n const placeholderTextColor = useMemo(\n () =>\n theme === Theme.Light\n ? lightTheme.colors.text.alternative\n : darkTheme.colors.text.alternative,\n [theme],\n );\n\n const finalFontWeight = ~~MAP_TEXT_VARIANT_FONTWEIGHT~~[textVariant];\n const fontSuffix = TWCLASSMAP_TEXT_FONTWEIGHT[finalFontWeight];\n const fontClass = `font-${FontFamily.Default}${fontSuffix}`;\n const hasPlaceholder =\n placeholder !== undefined && placeholder !== null && placeholder !== '';\n // Only apply placeholder-mode styling when a placeholder is present and\n // the controlled value is empty. This keeps the iOS lineHeight workaround\n // scoped to the placeholder-visible state without affecting typed text.\n const isPlaceholderVisible = hasPlaceholder && value === '';\n\n const inputStyle = useMemo(\n () =>\n tw.style(\n fontClass,\n 'text-default',\n 'bg-default',\n 'border',\n 'border-transparent',\n !isStateStylesDisabled && isDisabled && 'opacity-50',\n !isStateStylesDisabled &&\n !isDisabled &&\n isFocused &&\n 'border-primary-default',\n twClassName,\n ),\n [\n fontClass,\n isStateStylesDisabled,\n isDisabled,\n isFocused,\n twClassName,\n tw,\n ],\n );\n\n const variantTextStyle = useMemo(\n () => MAP_TEXT_VARIANT_INPUT_METRICS[textVariant],\n [textVariant],\n );\n\n /* istanbul ignore next: handler body covered by focus/blur tests /\n const onBlurHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onBlur']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(false);\n onBlur?.(e);\n }\n },\n [isDisabled, onBlur],\n );\n\n / istanbul ignore next: handler body covered by focus/blur tests */\n const onFocusHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onFocus']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(true);\n onFocus?.(e);\n }\n },\n [isDisabled, onFocus],\n );\n const resolvedStyle = [\n inputStyle,\n variantTextStyle,\n // iOS-only workaround: when a placeholder is visible, native iOS\n // TextInput can render placeholder text vertically offset.\n // Keep this iOS-only because lineHeight: 0 can collapse text on Android.\n Platform.OS === 'ios' &&\n isPlaceholderVisible && { lineHeight: 0 as const },\n style,\n ].filter(Boolean);\n\n return (\n <TextInput\n ref={ref}\n placeholderTextColor={placeholderTextColor}\n {...props}\n placeholder={placeholder}\n value={value}\n style={resolvedStyle}\n editable={!isDisabled && !isReadonly}\n autoFocus={autoFocus}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n />\n );\n },\n);\n"]}
1	+ {"version":3,"file":"Input.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FontFamily, TextVariant } from '@metamask/design-system-shared';\nimport {\n Theme,\n useTailwind,\n useTheme,\n} from '@metamask/design-system-twrnc-preset';\nimport { darkTheme, lightTheme } from '@metamask/design-tokens';\nimport { forwardRef, useCallback, useMemo, useState } from 'react';\nimport { Platform, TextInput } from 'react-native';\n\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n TWCLASSMAP_TEXT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport { MAP_TEXT_VARIANT_INPUT_METRICS } from './Input.constants';\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<TextInput, InputProps>(\n (\n {\n style,\n textVariant = TextVariant.BodyMd,\n isStateStylesDisabled,\n isDisabled = false,\n isReadonly = false,\n value,\n placeholder,\n twClassName,\n onBlur,\n onFocus,\n autoFocus = false,\n ...props\n },\n ref,\n ) => {\n const [isFocused, setIsFocused] = useState(autoFocus);\n const tw = useTailwind();\n const theme = useTheme();\n\n const placeholderTextColor = useMemo(\n () =>\n theme === Theme.Light\n ? lightTheme.colors.text.alternative\n : darkTheme.colors.text.alternative,\n [theme],\n );\n\n const finalFontWeight = TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant];\n const fontSuffix = TWCLASSMAP_TEXT_FONTWEIGHT[finalFontWeight];\n const fontClass = `font-${FontFamily.Default}${fontSuffix}`;\n const hasPlaceholder =\n placeholder !== undefined && placeholder !== null && placeholder !== '';\n // Only apply placeholder-mode styling when a placeholder is present and\n // the controlled value is empty. This keeps the iOS lineHeight workaround\n // scoped to the placeholder-visible state without affecting typed text.\n const isPlaceholderVisible = hasPlaceholder && value === '';\n\n const inputStyle = useMemo(\n () =>\n tw.style(\n fontClass,\n 'text-default',\n 'bg-default',\n 'border',\n 'border-transparent',\n !isStateStylesDisabled && isDisabled && 'opacity-50',\n !isStateStylesDisabled &&\n !isDisabled &&\n isFocused &&\n 'border-primary-default',\n twClassName,\n ),\n [\n fontClass,\n isStateStylesDisabled,\n isDisabled,\n isFocused,\n twClassName,\n tw,\n ],\n );\n\n const variantTextStyle = useMemo(\n () => MAP_TEXT_VARIANT_INPUT_METRICS[textVariant],\n [textVariant],\n );\n\n /* istanbul ignore next: handler body covered by focus/blur tests /\n const onBlurHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onBlur']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(false);\n onBlur?.(e);\n }\n },\n [isDisabled, onBlur],\n );\n\n / istanbul ignore next: handler body covered by focus/blur tests */\n const onFocusHandler = useCallback(\n (e: Parameters<NonNullable<InputProps['onFocus']>>[0]) => {\n if (!isDisabled) {\n setIsFocused(true);\n onFocus?.(e);\n }\n },\n [isDisabled, onFocus],\n );\n const resolvedStyle = [\n inputStyle,\n variantTextStyle,\n // iOS-only workaround: when a placeholder is visible, native iOS\n // TextInput can render placeholder text vertically offset.\n // Keep this iOS-only because lineHeight: 0 can collapse text on Android.\n Platform.OS === 'ios' &&\n isPlaceholderVisible && { lineHeight: 0 as const },\n style,\n ].filter(Boolean);\n\n return (\n <TextInput\n ref={ref}\n placeholderTextColor={placeholderTextColor}\n {...props}\n placeholder={placeholder}\n value={value}\n style={resolvedStyle}\n editable={!isDisabled && !isReadonly}\n autoFocus={autoFocus}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n />\n );\n },\n);\n"]}

package/dist/components/Input/Input.types.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.types.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ~~TextInputProps~~ } from '~~react~~-~~native~~';\n\nimport type { ~~TextVariant~~ } from '~~../../types~~';\n\nexport type InputProps = Omit<\n TextInputProps,\n 'editable' \| 'value' \| 'defaultValue'\n> & {\n /*\n Controlled value for Input.\n /\n value: string;\n /\n Optional enum to select between Typography variants.\n \n @default 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 boolean to disable state styles.\n \n @default false\n /\n isStateStylesDisabled?: boolean;\n /\n Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n};\n"]}
1	+ {"version":3,"file":"Input.types.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { TextVariant } from '@metamask/design-system-shared';\nimport type { TextInputProps } from 'react-native';\n\nexport type InputProps = Omit<\n TextInputProps,\n 'editable' \| 'value' \| 'defaultValue'\n> & {\n /*\n Controlled value for Input.\n /\n value: string;\n /\n Optional enum to select between Typography variants.\n \n @default 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 boolean to disable state styles.\n \n @default false\n /\n isStateStylesDisabled?: boolean;\n /\n Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n};\n"]}

package/dist/components/Input/Input.types.d.cts CHANGED Viewed

@@ -1,5 +1,5 @@
+import type { TextVariant } from "@metamask/design-system-shared";
 import type { TextInputProps } from "react-native/index.js";
-import type { TextVariant } from "../../types/index.cjs";
 export type InputProps = Omit<TextInputProps, 'editable' | 'value' | 'defaultValue'> & {
     /**
      * Controlled value for Input.

package/dist/components/Input/Input.types.d.cts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.types.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,~~cAAc~~,EAAE,~~8BAAqB~~;~~AAEnD~~,OAAO,KAAK,EAAE,~~WAAW~~,EAAE,~~8BAAoB~~;~~AAE/C~~,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,cAAc,EACd,UAAU,GAAG,OAAO,GAAG,cAAc,CACtC,GAAG;IACF;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}
1	+ {"version":3,"file":"Input.types.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,uCAAuC;AAClE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAqB;AAEnD,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,cAAc,EACd,UAAU,GAAG,OAAO,GAAG,cAAc,CACtC,GAAG;IACF;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}

package/dist/components/Input/Input.types.d.mts CHANGED Viewed

@@ -1,5 +1,5 @@
+import type { TextVariant } from "@metamask/design-system-shared";
 import type { TextInputProps } from "react-native/index.js";
-import type { TextVariant } from "../../types/index.mjs";
 export type InputProps = Omit<TextInputProps, 'editable' | 'value' | 'defaultValue'> & {
     /**
      * Controlled value for Input.

package/dist/components/Input/Input.types.d.mts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.types.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,~~cAAc~~,EAAE,~~8BAAqB~~;~~AAEnD~~,OAAO,KAAK,EAAE,~~WAAW~~,EAAE,~~8BAAoB~~;~~AAE/C~~,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,cAAc,EACd,UAAU,GAAG,OAAO,GAAG,cAAc,CACtC,GAAG;IACF;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}
1	+ {"version":3,"file":"Input.types.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,uCAAuC;AAClE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAqB;AAEnD,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,cAAc,EACd,UAAU,GAAG,OAAO,GAAG,cAAc,CACtC,GAAG;IACF;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}

package/dist/components/Input/Input.types.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.types.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ~~TextInputProps~~ } from '~~react~~-~~native~~';\n\nimport type { ~~TextVariant~~ } from '~~../../types~~';\n\nexport type InputProps = Omit<\n TextInputProps,\n 'editable' \| 'value' \| 'defaultValue'\n> & {\n /*\n Controlled value for Input.\n /\n value: string;\n /\n Optional enum to select between Typography variants.\n \n @default 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 boolean to disable state styles.\n \n @default false\n /\n isStateStylesDisabled?: boolean;\n /\n Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n};\n"]}
1	+ {"version":3,"file":"Input.types.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { TextVariant } from '@metamask/design-system-shared';\nimport type { TextInputProps } from 'react-native';\n\nexport type InputProps = Omit<\n TextInputProps,\n 'editable' \| 'value' \| 'defaultValue'\n> & {\n /*\n Controlled value for Input.\n /\n value: string;\n /\n Optional enum to select between Typography variants.\n \n @default 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 boolean to disable state styles.\n \n @default false\n /\n isStateStylesDisabled?: boolean;\n /\n Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n};\n"]}

package/dist/components/KeyValueColumn/KeyValueColumn.cjs CHANGED Viewed

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.KeyValueColumn = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const react_1 = __importDefault(require("react"));
 const types_1 = require("../../types/index.cjs");
 const BoxColumn_1 = require("../BoxColumn/index.cjs");
@@ -15,9 +16,9 @@ const KeyValueColumn = ({ keyStartAccessory, keyEndAccessory, keyEndButtonIconPr
     const valueEndAccessoryNode = valueEndButtonIconProps?.iconName !== undefined &&
         valueEndButtonIconProps.iconName !== null ? (<ButtonIcon_1.ButtonIcon size={types_1.ButtonIconSize.Sm} iconProps={{ color: types_1.IconColor.IconDefault }} {...valueEndButtonIconProps} iconName={valueEndButtonIconProps.iconName}/>) : (valueEndAccessory);
     const keyBox = (<BoxRow_1.BoxRow startAccessory={keyStartAccessory} endAccessory={keyEndAccessoryNode} textProps={{
-            variant: types_1.TextVariant.BodyMd,
-            fontWeight: types_1.FontWeight.Medium,
-            color: types_1.TextColor.TextAlternative,
+            variant: design_system_shared_1.TextVariant.BodyMd,
+            fontWeight: design_system_shared_1.FontWeight.Medium,
+            color: design_system_shared_1.TextColor.TextAlternative,
             numberOfLines: 1,
             ellipsizeMode: 'tail',
             ...keyTextProps,
@@ -25,9 +26,9 @@ const KeyValueColumn = ({ keyStartAccessory, keyEndAccessory, keyEndButtonIconPr
       {keyContent}
     </BoxRow_1.BoxRow>);
     const valueBox = (<BoxRow_1.BoxRow startAccessory={valueStartAccessory} endAccessory={valueEndAccessoryNode} textProps={{
-            variant: types_1.TextVariant.BodyMd,
-            fontWeight: types_1.FontWeight.Medium,
-            color: types_1.TextColor.TextDefault,
+            variant: design_system_shared_1.TextVariant.BodyMd,
+            fontWeight: design_system_shared_1.FontWeight.Medium,
+            color: design_system_shared_1.TextColor.TextDefault,
             numberOfLines: 1,
             ellipsizeMode: 'tail',
             ...valueTextProps,

package/dist/components/KeyValueColumn/KeyValueColumn.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"KeyValueColumn.cjs","sourceRoot":"","sources":["../../../src/components/KeyValueColumn/KeyValueColumn.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,~~iDAMqB~~;~~AACrB~~,sDAAyC;AACzC,gDAAmC;AACnC,wDAA2C;AAIpC,MAAM,cAAc,GAAG,CAAC,EAC7B,iBAAiB,EACjB,eAAe,EACf,qBAAqB,EACrB,QAAQ,EAAE,UAAU,EACpB,YAAY,EACZ,mBAAmB,EACnB,iBAAiB,EACjB,uBAAuB,EACvB,KAAK,EAAE,YAAY,EACnB,cAAc,EACd,WAAW,EACX,GAAG,SAAS,EACQ,EAAE,EAAE;IACxB,MAAM,mBAAmB,GACvB,qBAAqB,EAAE,QAAQ,KAAK,SAAS;QAC7C,qBAAqB,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CACxC,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,sBAAc,CAAC,EAAE,CAAC,CACxB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,iBAAS,CAAC,eAAe,EAAE,CAAC,CAChD,IAAI,qBAAqB,CAAC,CAC1B,QAAQ,CAAC,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EACzC,CACH,CAAC,CAAC,CAAC,CACF,eAAe,CAChB,CAAC;IAEJ,MAAM,qBAAqB,GACzB,uBAAuB,EAAE,QAAQ,KAAK,SAAS;QAC/C,uBAAuB,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CAC1C,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,sBAAc,CAAC,EAAE,CAAC,CACxB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,iBAAS,CAAC,WAAW,EAAE,CAAC,CAC5C,IAAI,uBAAuB,CAAC,CAC5B,QAAQ,CAAC,CAAC,uBAAuB,CAAC,QAAQ,CAAC,EAC3C,CACH,CAAC,CAAC,CAAC,CACF,iBAAiB,CAClB,CAAC;IAEJ,MAAM,MAAM,GAAG,CACb,CAAC,eAAM,CACL,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAClC,YAAY,CAAC,CAAC,mBAAmB,CAAC,CAClC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,~~mBAAW~~,CAAC,MAAM;YAC3B,UAAU,EAAE,~~kBAAU~~,CAAC,MAAM;YAC7B,KAAK,EAAE,~~iBAAS~~,CAAC,eAAe;YAChC,aAAa,EAAE,CAAC;YAChB,aAAa,EAAE,MAAM;YACrB,GAAG,YAAY;SAChB,CAAC,CACF,WAAW,CAAC,gBAAgB,CAE5B;MAAA,CAAC,UAAU,CACb;IAAA,EAAE,eAAM,CAAC,CACV,CAAC;IAEF,MAAM,QAAQ,GAAG,CACf,CAAC,eAAM,CACL,cAAc,CAAC,CAAC,mBAAmB,CAAC,CACpC,YAAY,CAAC,CAAC,qBAAqB,CAAC,CACpC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,~~mBAAW~~,CAAC,MAAM;YAC3B,UAAU,EAAE,~~kBAAU~~,CAAC,MAAM;YAC7B,KAAK,EAAE,~~iBAAS~~,CAAC,WAAW;YAC5B,aAAa,EAAE,CAAC;YAChB,aAAa,EAAE,MAAM;YACrB,GAAG,cAAc;SAClB,CAAC,CACF,WAAW,CAAC,gBAAgB,CAE5B;MAAA,CAAC,YAAY,CACf;IAAA,EAAE,eAAM,CAAC,CACV,CAAC;IAEF,OAAO,CACL,CAAC,qBAAS,CACR,eAAe,CAAC,CAAC,QAAQ,CAAC,CAC1B,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,SAAS,CAAC,CAEd;MAAA,CAAC,MAAM,CACT;IAAA,EAAE,qBAAS,CAAC,CACb,CAAC;AACJ,CAAC,CAAC;AArFW,QAAA,cAAc,kBAqFzB;AAEF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["import ~~React from 'react';\n\nimport~~ {\n ~~ButtonIconSize,\n~~ FontWeight,\n ~~IconColor,\n~~ TextColor,\n TextVariant,\n} from '../../types';\nimport { BoxColumn } from '../BoxColumn';\nimport { BoxRow } from '../BoxRow';\nimport { ButtonIcon } from '../ButtonIcon';\n\nimport type { KeyValueColumnProps } from './KeyValueColumn.types';\n\nexport const KeyValueColumn = ({\n keyStartAccessory,\n keyEndAccessory,\n keyEndButtonIconProps,\n keyLabel: keyContent,\n keyTextProps,\n valueStartAccessory,\n valueEndAccessory,\n valueEndButtonIconProps,\n value: valueContent,\n valueTextProps,\n twClassName,\n ...viewProps\n}: KeyValueColumnProps) => {\n const keyEndAccessoryNode =\n keyEndButtonIconProps?.iconName !== undefined &&\n keyEndButtonIconProps.iconName !== null ? (\n <ButtonIcon\n size={ButtonIconSize.Sm}\n iconProps={{ color: IconColor.IconAlternative }}\n {...keyEndButtonIconProps}\n iconName={keyEndButtonIconProps.iconName}\n />\n ) : (\n keyEndAccessory\n );\n\n const valueEndAccessoryNode =\n valueEndButtonIconProps?.iconName !== undefined &&\n valueEndButtonIconProps.iconName !== null ? (\n <ButtonIcon\n size={ButtonIconSize.Sm}\n iconProps={{ color: IconColor.IconDefault }}\n {...valueEndButtonIconProps}\n iconName={valueEndButtonIconProps.iconName}\n />\n ) : (\n valueEndAccessory\n );\n\n const keyBox = (\n <BoxRow\n startAccessory={keyStartAccessory}\n endAccessory={keyEndAccessoryNode}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextAlternative,\n numberOfLines: 1,\n ellipsizeMode: 'tail',\n ...keyTextProps,\n }}\n twClassName=\"w-full min-w-0\"\n >\n {keyContent}\n </BoxRow>\n );\n\n const valueBox = (\n <BoxRow\n startAccessory={valueStartAccessory}\n endAccessory={valueEndAccessoryNode}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n numberOfLines: 1,\n ellipsizeMode: 'tail',\n ...valueTextProps,\n }}\n twClassName=\"w-full min-w-0\"\n >\n {valueContent}\n </BoxRow>\n );\n\n return (\n <BoxColumn\n bottomAccessory={valueBox}\n twClassName={twClassName}\n {...viewProps}\n >\n {keyBox}\n </BoxColumn>\n );\n};\n\nKeyValueColumn.displayName = 'KeyValueColumn';\n"]}
1	+ {"version":3,"file":"KeyValueColumn.cjs","sourceRoot":"","sources":["../../../src/components/KeyValueColumn/KeyValueColumn.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAIwC;AACxC,kDAA0B;AAE1B,iDAAwD;AACxD,sDAAyC;AACzC,gDAAmC;AACnC,wDAA2C;AAIpC,MAAM,cAAc,GAAG,CAAC,EAC7B,iBAAiB,EACjB,eAAe,EACf,qBAAqB,EACrB,QAAQ,EAAE,UAAU,EACpB,YAAY,EACZ,mBAAmB,EACnB,iBAAiB,EACjB,uBAAuB,EACvB,KAAK,EAAE,YAAY,EACnB,cAAc,EACd,WAAW,EACX,GAAG,SAAS,EACQ,EAAE,EAAE;IACxB,MAAM,mBAAmB,GACvB,qBAAqB,EAAE,QAAQ,KAAK,SAAS;QAC7C,qBAAqB,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CACxC,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,sBAAc,CAAC,EAAE,CAAC,CACxB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,iBAAS,CAAC,eAAe,EAAE,CAAC,CAChD,IAAI,qBAAqB,CAAC,CAC1B,QAAQ,CAAC,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EACzC,CACH,CAAC,CAAC,CAAC,CACF,eAAe,CAChB,CAAC;IAEJ,MAAM,qBAAqB,GACzB,uBAAuB,EAAE,QAAQ,KAAK,SAAS;QAC/C,uBAAuB,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CAC1C,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,sBAAc,CAAC,EAAE,CAAC,CACxB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,iBAAS,CAAC,WAAW,EAAE,CAAC,CAC5C,IAAI,uBAAuB,CAAC,CAC5B,QAAQ,CAAC,CAAC,uBAAuB,CAAC,QAAQ,CAAC,EAC3C,CACH,CAAC,CAAC,CAAC,CACF,iBAAiB,CAClB,CAAC;IAEJ,MAAM,MAAM,GAAG,CACb,CAAC,eAAM,CACL,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAClC,YAAY,CAAC,CAAC,mBAAmB,CAAC,CAClC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,kCAAW,CAAC,MAAM;YAC3B,UAAU,EAAE,iCAAU,CAAC,MAAM;YAC7B,KAAK,EAAE,gCAAS,CAAC,eAAe;YAChC,aAAa,EAAE,CAAC;YAChB,aAAa,EAAE,MAAM;YACrB,GAAG,YAAY;SAChB,CAAC,CACF,WAAW,CAAC,gBAAgB,CAE5B;MAAA,CAAC,UAAU,CACb;IAAA,EAAE,eAAM,CAAC,CACV,CAAC;IAEF,MAAM,QAAQ,GAAG,CACf,CAAC,eAAM,CACL,cAAc,CAAC,CAAC,mBAAmB,CAAC,CACpC,YAAY,CAAC,CAAC,qBAAqB,CAAC,CACpC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,kCAAW,CAAC,MAAM;YAC3B,UAAU,EAAE,iCAAU,CAAC,MAAM;YAC7B,KAAK,EAAE,gCAAS,CAAC,WAAW;YAC5B,aAAa,EAAE,CAAC;YAChB,aAAa,EAAE,MAAM;YACrB,GAAG,cAAc;SAClB,CAAC,CACF,WAAW,CAAC,gBAAgB,CAE5B;MAAA,CAAC,YAAY,CACf;IAAA,EAAE,eAAM,CAAC,CACV,CAAC;IAEF,OAAO,CACL,CAAC,qBAAS,CACR,eAAe,CAAC,CAAC,QAAQ,CAAC,CAC1B,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,SAAS,CAAC,CAEd;MAAA,CAAC,MAAM,CACT;IAAA,EAAE,qBAAS,CAAC,CACb,CAAC;AACJ,CAAC,CAAC;AArFW,QAAA,cAAc,kBAqFzB;AAEF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["import {\n FontWeight,\n TextColor,\n TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { ButtonIconSize, IconColor } from '../../types';\nimport { BoxColumn } from '../BoxColumn';\nimport { BoxRow } from '../BoxRow';\nimport { ButtonIcon } from '../ButtonIcon';\n\nimport type { KeyValueColumnProps } from './KeyValueColumn.types';\n\nexport const KeyValueColumn = ({\n keyStartAccessory,\n keyEndAccessory,\n keyEndButtonIconProps,\n keyLabel: keyContent,\n keyTextProps,\n valueStartAccessory,\n valueEndAccessory,\n valueEndButtonIconProps,\n value: valueContent,\n valueTextProps,\n twClassName,\n ...viewProps\n}: KeyValueColumnProps) => {\n const keyEndAccessoryNode =\n keyEndButtonIconProps?.iconName !== undefined &&\n keyEndButtonIconProps.iconName !== null ? (\n <ButtonIcon\n size={ButtonIconSize.Sm}\n iconProps={{ color: IconColor.IconAlternative }}\n {...keyEndButtonIconProps}\n iconName={keyEndButtonIconProps.iconName}\n />\n ) : (\n keyEndAccessory\n );\n\n const valueEndAccessoryNode =\n valueEndButtonIconProps?.iconName !== undefined &&\n valueEndButtonIconProps.iconName !== null ? (\n <ButtonIcon\n size={ButtonIconSize.Sm}\n iconProps={{ color: IconColor.IconDefault }}\n {...valueEndButtonIconProps}\n iconName={valueEndButtonIconProps.iconName}\n />\n ) : (\n valueEndAccessory\n );\n\n const keyBox = (\n <BoxRow\n startAccessory={keyStartAccessory}\n endAccessory={keyEndAccessoryNode}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextAlternative,\n numberOfLines: 1,\n ellipsizeMode: 'tail',\n ...keyTextProps,\n }}\n twClassName=\"w-full min-w-0\"\n >\n {keyContent}\n </BoxRow>\n );\n\n const valueBox = (\n <BoxRow\n startAccessory={valueStartAccessory}\n endAccessory={valueEndAccessoryNode}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n numberOfLines: 1,\n ellipsizeMode: 'tail',\n ...valueTextProps,\n }}\n twClassName=\"w-full min-w-0\"\n >\n {valueContent}\n </BoxRow>\n );\n\n return (\n <BoxColumn\n bottomAccessory={valueBox}\n twClassName={twClassName}\n {...viewProps}\n >\n {keyBox}\n </BoxColumn>\n );\n};\n\nKeyValueColumn.displayName = 'KeyValueColumn';\n"]}