@metamask/design-system-react-native 0.37.0 → 0.38.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.
- package/CHANGELOG.md +24 -1
- package/dist/components/BannerBase/BannerBase.cjs +4 -3
- package/dist/components/BannerBase/BannerBase.cjs.map +1 -1
- package/dist/components/BannerBase/BannerBase.d.cts.map +1 -1
- package/dist/components/BannerBase/BannerBase.d.mts.map +1 -1
- package/dist/components/BannerBase/BannerBase.mjs +4 -3
- package/dist/components/BannerBase/BannerBase.mjs.map +1 -1
- package/dist/components/BoxRow/BoxRow.types.cjs.map +1 -1
- package/dist/components/BoxRow/BoxRow.types.d.cts +4 -3
- package/dist/components/BoxRow/BoxRow.types.d.cts.map +1 -1
- package/dist/components/BoxRow/BoxRow.types.d.mts +4 -3
- package/dist/components/BoxRow/BoxRow.types.d.mts.map +1 -1
- package/dist/components/BoxRow/BoxRow.types.mjs.map +1 -1
- package/dist/components/Content/Content.cjs +1 -1
- package/dist/components/Content/Content.cjs.map +1 -1
- package/dist/components/Content/Content.mjs +1 -1
- package/dist/components/Content/Content.mjs.map +1 -1
- package/dist/components/Content/Content.types.cjs.map +1 -1
- package/dist/components/Content/Content.types.d.cts +10 -6
- package/dist/components/Content/Content.types.d.cts.map +1 -1
- package/dist/components/Content/Content.types.d.mts +10 -6
- package/dist/components/Content/Content.types.d.mts.map +1 -1
- package/dist/components/Content/Content.types.mjs.map +1 -1
- package/dist/components/HelpText/HelpText.cjs +28 -0
- package/dist/components/HelpText/HelpText.cjs.map +1 -0
- package/dist/components/HelpText/HelpText.constants.cjs +11 -0
- package/dist/components/HelpText/HelpText.constants.cjs.map +1 -0
- package/dist/components/HelpText/HelpText.constants.d.cts +3 -0
- package/dist/components/HelpText/HelpText.constants.d.cts.map +1 -0
- package/dist/components/HelpText/HelpText.constants.d.mts +3 -0
- package/dist/components/HelpText/HelpText.constants.d.mts.map +1 -0
- package/dist/components/HelpText/HelpText.constants.mjs +8 -0
- package/dist/components/HelpText/HelpText.constants.mjs.map +1 -0
- package/dist/components/HelpText/HelpText.d.cts +4 -0
- package/dist/components/HelpText/HelpText.d.cts.map +1 -0
- package/dist/components/HelpText/HelpText.d.mts +4 -0
- package/dist/components/HelpText/HelpText.d.mts.map +1 -0
- package/dist/components/HelpText/HelpText.mjs +28 -0
- package/dist/components/HelpText/HelpText.mjs.map +1 -0
- package/dist/components/HelpText/HelpText.types.cjs +3 -0
- package/dist/components/HelpText/HelpText.types.cjs.map +1 -0
- package/dist/components/HelpText/HelpText.types.d.cts +4 -0
- package/dist/components/HelpText/HelpText.types.d.cts.map +1 -0
- package/dist/components/HelpText/HelpText.types.d.mts +4 -0
- package/dist/components/HelpText/HelpText.types.d.mts.map +1 -0
- package/dist/components/HelpText/HelpText.types.mjs +2 -0
- package/dist/components/HelpText/HelpText.types.mjs.map +1 -0
- package/dist/components/HelpText/index.cjs +8 -0
- package/dist/components/HelpText/index.cjs.map +1 -0
- package/dist/components/HelpText/index.d.cts +4 -0
- package/dist/components/HelpText/index.d.cts.map +1 -0
- package/dist/components/HelpText/index.d.mts +4 -0
- package/dist/components/HelpText/index.d.mts.map +1 -0
- package/dist/components/HelpText/index.mjs +3 -0
- package/dist/components/HelpText/index.mjs.map +1 -0
- package/dist/components/KeyValueRow/KeyValueRow.cjs +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.cjs.map +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.d.cts.map +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.d.mts.map +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.mjs +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.mjs.map +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.types.cjs.map +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.types.d.cts +6 -2
- package/dist/components/KeyValueRow/KeyValueRow.types.d.cts.map +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.types.d.mts +6 -2
- package/dist/components/KeyValueRow/KeyValueRow.types.d.mts.map +1 -1
- package/dist/components/KeyValueRow/KeyValueRow.types.mjs.map +1 -1
- package/dist/components/KeyValueSelect/KeyValueSelect.cjs +55 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.cjs.map +1 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.d.cts +11 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.d.cts.map +1 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.d.mts +11 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.d.mts.map +1 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.mjs +36 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.mjs.map +1 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.cjs +3 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.cjs.map +1 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.d.cts +47 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.d.cts.map +1 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.d.mts +47 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.d.mts.map +1 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.mjs +2 -0
- package/dist/components/KeyValueSelect/KeyValueSelect.types.mjs.map +1 -0
- package/dist/components/KeyValueSelect/index.cjs +8 -0
- package/dist/components/KeyValueSelect/index.cjs.map +1 -0
- package/dist/components/KeyValueSelect/index.d.cts +4 -0
- package/dist/components/KeyValueSelect/index.d.cts.map +1 -0
- package/dist/components/KeyValueSelect/index.d.mts +4 -0
- package/dist/components/KeyValueSelect/index.d.mts.map +1 -0
- package/dist/components/KeyValueSelect/index.mjs +3 -0
- package/dist/components/KeyValueSelect/index.mjs.map +1 -0
- package/dist/components/Slider/useSliderGesture.cjs +126 -10
- package/dist/components/Slider/useSliderGesture.cjs.map +1 -1
- package/dist/components/Slider/useSliderGesture.d.cts +11 -1
- package/dist/components/Slider/useSliderGesture.d.cts.map +1 -1
- package/dist/components/Slider/useSliderGesture.d.mts +11 -1
- package/dist/components/Slider/useSliderGesture.d.mts.map +1 -1
- package/dist/components/Slider/useSliderGesture.mjs +126 -10
- package/dist/components/Slider/useSliderGesture.mjs.map +1 -1
- package/dist/components/TitleHub/TitleHub.types.cjs.map +1 -1
- package/dist/components/TitleHub/TitleHub.types.d.cts +5 -2
- package/dist/components/TitleHub/TitleHub.types.d.cts.map +1 -1
- package/dist/components/TitleHub/TitleHub.types.d.mts +5 -2
- package/dist/components/TitleHub/TitleHub.types.d.mts.map +1 -1
- package/dist/components/TitleHub/TitleHub.types.mjs.map +1 -1
- package/dist/components/index.cjs +8 -2
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.d.cts +4 -0
- package/dist/components/index.d.cts.map +1 -1
- package/dist/components/index.d.mts +4 -0
- package/dist/components/index.d.mts.map +1 -1
- package/dist/components/index.mjs +2 -0
- package/dist/components/index.mjs.map +1 -1
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.cjs +2 -2
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.cjs.map +1 -1
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.mjs +2 -2
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.mjs.map +1 -1
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.cjs.map +1 -1
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.cts +4 -3
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.cts.map +1 -1
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.mts +4 -3
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.mts.map +1 -1
- package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.mjs.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,28 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
7
7
|
|
|
8
8
|
## [Unreleased]
|
|
9
9
|
|
|
10
|
+
## [0.38.0]
|
|
11
|
+
|
|
12
|
+
### Added
|
|
13
|
+
|
|
14
|
+
- Added `KeyValueSelect` for pressable key/value rows with a non-interactive `SelectButton` value (opens a picker or bottom sheet via `onPress`) ([#1410](https://github.com/MetaMask/metamask-design-system/pull/1410))
|
|
15
|
+
- Added `HelpText` for field-level helper and validation copy with optional `HelpTextSeverity` coloring ([#1405](https://github.com/MetaMask/metamask-design-system/pull/1405))
|
|
16
|
+
- Added `showIcon` to `HelpText` (default `false`) to render a leading `IconAlert` when `severity` is set ([#1409](https://github.com/MetaMask/metamask-design-system/pull/1409))
|
|
17
|
+
- Added `isHidden` / `length` support on string slots for `Content`, `ListItem`, `TitleHub`, and `KeyValueRow` via `SensitiveText` (e.g. `valueProps`, `amountProps`, `valueTextProps`) ([#1406](https://github.com/MetaMask/metamask-design-system/pull/1406))
|
|
18
|
+
|
|
19
|
+
### Changed
|
|
20
|
+
|
|
21
|
+
- **BREAKING:** `KeyValueRow` now defaults to `px-4` (16px) horizontal padding so rows align with other full-width list surfaces without a parent padding wrapper ([#1410](https://github.com/MetaMask/metamask-design-system/pull/1410))
|
|
22
|
+
- Call sites that already wrap rows in `px-4` / `paddingHorizontal={4}` will double-pad unless that wrapper padding is removed
|
|
23
|
+
- Flush rows can override with `twClassName="px-0"`
|
|
24
|
+
- See [Migration Guide](./MIGRATION.md#from-version-0370-to-0380)
|
|
25
|
+
- Updated `BannerBase` spacing (conditional bottom/right padding and title/description gap) to match Figma; inherited by `BannerAlert` and `Toast` ([#1393](https://github.com/MetaMask/metamask-design-system/pull/1393))
|
|
26
|
+
|
|
27
|
+
### Fixed
|
|
28
|
+
|
|
29
|
+
- Fixed `Slider` thumb rewind on rapid taps and fast pans ([#1397](https://github.com/MetaMask/metamask-design-system/pull/1397))
|
|
30
|
+
- Fixed `Content` description stretching the end accessory when the description wraps ([#1404](https://github.com/MetaMask/metamask-design-system/pull/1404))
|
|
31
|
+
|
|
10
32
|
## [0.37.0]
|
|
11
33
|
|
|
12
34
|
### Changed
|
|
@@ -621,7 +643,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
621
643
|
- Full TypeScript support with type definitions and enums
|
|
622
644
|
- React Native integration with TWRNC preset support
|
|
623
645
|
|
|
624
|
-
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.
|
|
646
|
+
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.38.0...HEAD
|
|
647
|
+
[0.38.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.37.0...@metamask/design-system-react-native@0.38.0
|
|
625
648
|
[0.37.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.36.0...@metamask/design-system-react-native@0.37.0
|
|
626
649
|
[0.36.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.35.0...@metamask/design-system-react-native@0.36.0
|
|
627
650
|
[0.35.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.34.0...@metamask/design-system-react-native@0.35.0
|
|
@@ -18,10 +18,11 @@ const BannerBase = ({ title, titleProps, description, descriptionProps, children
|
|
|
18
18
|
const shouldShowCloseButton = Boolean(onClose);
|
|
19
19
|
const shouldShowActionButton = Boolean(actionButtonOnPress);
|
|
20
20
|
const isActionButtonLayoutEnd = actionButtonLayout === design_system_shared_1.BannerBaseActionButtonLayout.End;
|
|
21
|
+
const hasActionButtonBelow = shouldShowActionButton && !isActionButtonLayoutEnd;
|
|
21
22
|
const actionButton = shouldShowActionButton ? (<Button_1.Button size={design_system_shared_1.ButtonSize.Md} onPress={actionButtonOnPress} {...resolvedActionButtonProps} variant={design_system_shared_1.ButtonVariant.Secondary}>
|
|
22
23
|
{actionButtonLabel}
|
|
23
24
|
</Button_1.Button>) : null;
|
|
24
|
-
return (<Box_1.Box flexDirection={design_system_shared_1.BoxFlexDirection.Row} alignItems={design_system_shared_1.BoxAlignItems.Start} gap={4} backgroundColor={design_system_shared_1.BoxBackgroundColor.BackgroundDefault}
|
|
25
|
+
return (<Box_1.Box flexDirection={design_system_shared_1.BoxFlexDirection.Row} alignItems={design_system_shared_1.BoxAlignItems.Start} gap={4} backgroundColor={design_system_shared_1.BoxBackgroundColor.BackgroundDefault} paddingTop={3} paddingBottom={hasActionButtonBelow ? 4 : 3} paddingLeft={4} paddingRight={shouldShowCloseButton ? 2 : 4} twClassName={(0, design_system_shared_1.mergeTwClassName)('rounded-xl', twClassName)} {...props}>
|
|
25
26
|
{startAccessory}
|
|
26
27
|
|
|
27
28
|
<Box_1.Box twClassName="flex-1">
|
|
@@ -30,7 +31,7 @@ const BannerBase = ({ title, titleProps, description, descriptionProps, children
|
|
|
30
31
|
{title}
|
|
31
32
|
</Text_1.Text>) : (title))}
|
|
32
33
|
|
|
33
|
-
{hasContent(description) && (<Box_1.Box>
|
|
34
|
+
{hasContent(description) && (<Box_1.Box twClassName={hasContent(title) ? 'mt-0.5' : undefined}>
|
|
34
35
|
{isTextContent(description) ? (<Text_1.Text variant={design_system_shared_1.TextVariant.BodySm} {...descriptionProps}>
|
|
35
36
|
{description}
|
|
36
37
|
</Text_1.Text>) : (description)}
|
|
@@ -41,7 +42,7 @@ const BannerBase = ({ title, titleProps, description, descriptionProps, children
|
|
|
41
42
|
{children}
|
|
42
43
|
</Text_1.Text>) : (children))}
|
|
43
44
|
|
|
44
|
-
{
|
|
45
|
+
{hasActionButtonBelow && <Box_1.Box twClassName="mt-2">{actionButton}</Box_1.Box>}
|
|
45
46
|
</Box_1.Box>
|
|
46
47
|
|
|
47
48
|
{shouldShowActionButton && isActionButtonLayoutEnd && actionButton}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerBase.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAYwC;AACxC,kDAA0B;AAE1B,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,kBAAkB,GAAG,mDAA4B,CAAC,KAAK,EACvD,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,WAAW,EAAE,sBAAsB,EACnC,GAAG,wBAAwB,EAC5B,GAAG,gBAAgB,IAAI,EAAE,CAAC;IAE3B,MAAM,qBAAqB,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAC/C,MAAM,sBAAsB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC5D,MAAM,uBAAuB,GAC3B,kBAAkB,KAAK,mDAA4B,CAAC,GAAG,CAAC;
|
|
1
|
+
{"version":3,"file":"BannerBase.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n BannerBaseActionButtonLayout,\n BoxAlignItems,\n BoxBackgroundColor,\n BoxFlexDirection,\n ButtonIconSize,\n ButtonSize,\n ButtonVariant,\n FontWeight,\n IconName,\n mergeTwClassName,\n TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\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 actionButtonLayout = BannerBaseActionButtonLayout.Below,\n startAccessory,\n onClose,\n closeButtonProps,\n twClassName,\n ...props\n}) => {\n const resolvedActionButtonProps = actionButtonProps ?? {};\n\n const {\n accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n twClassName: closeButtonTwClassName,\n ...resolvedCloseButtonProps\n } = closeButtonProps ?? {};\n\n const shouldShowCloseButton = Boolean(onClose);\n const shouldShowActionButton = Boolean(actionButtonOnPress);\n const isActionButtonLayoutEnd =\n actionButtonLayout === BannerBaseActionButtonLayout.End;\n const hasActionButtonBelow =\n shouldShowActionButton && !isActionButtonLayoutEnd;\n\n const actionButton = shouldShowActionButton ? (\n <Button\n size={ButtonSize.Md}\n onPress={actionButtonOnPress}\n {...resolvedActionButtonProps}\n variant={ButtonVariant.Secondary}\n >\n {actionButtonLabel}\n </Button>\n ) : null;\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n gap={4}\n backgroundColor={BoxBackgroundColor.BackgroundDefault}\n paddingTop={3}\n paddingBottom={hasActionButtonBelow ? 4 : 3}\n paddingLeft={4}\n paddingRight={shouldShowCloseButton ? 2 : 4}\n twClassName={mergeTwClassName('rounded-xl', twClassName)}\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-0.5' : 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 {hasActionButtonBelow && <Box twClassName=\"mt-2\">{actionButton}</Box>}\n </Box>\n\n {shouldShowActionButton && isActionButtonLayoutEnd && actionButton}\n\n {shouldShowCloseButton && (\n <ButtonIcon\n twClassName={mergeTwClassName('-mt-1', closeButtonTwClassName)}\n iconName={IconName.Close}\n size={ButtonIconSize.Md}\n accessibilityLabel={closeButtonAccessibilityLabel}\n onPress={onClose}\n {...resolvedCloseButtonProps}\n />\n )}\n </Box>\n );\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerBase.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,
|
|
1
|
+
{"version":3,"file":"BannerBase.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8GhD,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerBase.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,
|
|
1
|
+
{"version":3,"file":"BannerBase.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8GhD,CAAC"}
|
|
@@ -19,10 +19,11 @@ export const BannerBase = ({ title, titleProps, description, descriptionProps, c
|
|
|
19
19
|
const shouldShowCloseButton = Boolean(onClose);
|
|
20
20
|
const shouldShowActionButton = Boolean(actionButtonOnPress);
|
|
21
21
|
const isActionButtonLayoutEnd = actionButtonLayout === BannerBaseActionButtonLayout.End;
|
|
22
|
+
const hasActionButtonBelow = shouldShowActionButton && !isActionButtonLayoutEnd;
|
|
22
23
|
const actionButton = shouldShowActionButton ? (<Button size={ButtonSize.Md} onPress={actionButtonOnPress} {...resolvedActionButtonProps} variant={ButtonVariant.Secondary}>
|
|
23
24
|
{actionButtonLabel}
|
|
24
25
|
</Button>) : null;
|
|
25
|
-
return (<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Start} gap={4} backgroundColor={BoxBackgroundColor.BackgroundDefault}
|
|
26
|
+
return (<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Start} gap={4} backgroundColor={BoxBackgroundColor.BackgroundDefault} paddingTop={3} paddingBottom={hasActionButtonBelow ? 4 : 3} paddingLeft={4} paddingRight={shouldShowCloseButton ? 2 : 4} twClassName={mergeTwClassName('rounded-xl', twClassName)} {...props}>
|
|
26
27
|
{startAccessory}
|
|
27
28
|
|
|
28
29
|
<Box twClassName="flex-1">
|
|
@@ -31,7 +32,7 @@ export const BannerBase = ({ title, titleProps, description, descriptionProps, c
|
|
|
31
32
|
{title}
|
|
32
33
|
</Text>) : (title))}
|
|
33
34
|
|
|
34
|
-
{hasContent(description) && (<Box>
|
|
35
|
+
{hasContent(description) && (<Box twClassName={hasContent(title) ? 'mt-0.5' : undefined}>
|
|
35
36
|
{isTextContent(description) ? (<Text variant={TextVariant.BodySm} {...descriptionProps}>
|
|
36
37
|
{description}
|
|
37
38
|
</Text>) : (description)}
|
|
@@ -42,7 +43,7 @@ export const BannerBase = ({ title, titleProps, description, descriptionProps, c
|
|
|
42
43
|
{children}
|
|
43
44
|
</Text>) : (children))}
|
|
44
45
|
|
|
45
|
-
{
|
|
46
|
+
{hasActionButtonBelow && <Box twClassName="mt-2">{actionButton}</Box>}
|
|
46
47
|
</Box>
|
|
47
48
|
|
|
48
49
|
{shouldShowActionButton && isActionButtonLayoutEnd && actionButton}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,4BAA4B,EAC5B,aAAa,EACb,kBAAkB,EAClB,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,aAAa,EACb,UAAU,EACV,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACZ,uCAAuC;AACxC,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,MAAM,EAAE,4BAAkB;AACnC,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,IAAI,EAAE,0BAAgB;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;AAE5C,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EACpD,KAAK,EACL,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,kBAAkB,GAAG,4BAA4B,CAAC,KAAK,EACvD,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,WAAW,EAAE,sBAAsB,EACnC,GAAG,wBAAwB,EAC5B,GAAG,gBAAgB,IAAI,EAAE,CAAC;IAE3B,MAAM,qBAAqB,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAC/C,MAAM,sBAAsB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC5D,MAAM,uBAAuB,GAC3B,kBAAkB,KAAK,4BAA4B,CAAC,GAAG,CAAC;
|
|
1
|
+
{"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n BannerBaseActionButtonLayout,\n BoxAlignItems,\n BoxBackgroundColor,\n BoxFlexDirection,\n ButtonIconSize,\n ButtonSize,\n ButtonVariant,\n FontWeight,\n IconName,\n mergeTwClassName,\n TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\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 actionButtonLayout = BannerBaseActionButtonLayout.Below,\n startAccessory,\n onClose,\n closeButtonProps,\n twClassName,\n ...props\n}) => {\n const resolvedActionButtonProps = actionButtonProps ?? {};\n\n const {\n accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n twClassName: closeButtonTwClassName,\n ...resolvedCloseButtonProps\n } = closeButtonProps ?? {};\n\n const shouldShowCloseButton = Boolean(onClose);\n const shouldShowActionButton = Boolean(actionButtonOnPress);\n const isActionButtonLayoutEnd =\n actionButtonLayout === BannerBaseActionButtonLayout.End;\n const hasActionButtonBelow =\n shouldShowActionButton && !isActionButtonLayoutEnd;\n\n const actionButton = shouldShowActionButton ? (\n <Button\n size={ButtonSize.Md}\n onPress={actionButtonOnPress}\n {...resolvedActionButtonProps}\n variant={ButtonVariant.Secondary}\n >\n {actionButtonLabel}\n </Button>\n ) : null;\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n gap={4}\n backgroundColor={BoxBackgroundColor.BackgroundDefault}\n paddingTop={3}\n paddingBottom={hasActionButtonBelow ? 4 : 3}\n paddingLeft={4}\n paddingRight={shouldShowCloseButton ? 2 : 4}\n twClassName={mergeTwClassName('rounded-xl', twClassName)}\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-0.5' : 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 {hasActionButtonBelow && <Box twClassName=\"mt-2\">{actionButton}</Box>}\n </Box>\n\n {shouldShowActionButton && isActionButtonLayoutEnd && actionButton}\n\n {shouldShowCloseButton && (\n <ButtonIcon\n twClassName={mergeTwClassName('-mt-1', closeButtonTwClassName)}\n iconName={IconName.Close}\n size={ButtonIconSize.Md}\n accessibilityLabel={closeButtonAccessibilityLabel}\n onPress={onClose}\n {...resolvedCloseButtonProps}\n />\n )}\n </Box>\n );\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BoxRow.types.cjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxRowPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type {
|
|
1
|
+
{"version":3,"file":"BoxRow.types.cjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxRowPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { SensitiveTextProps } from '../SensitiveText';\n\n/**\n * BoxRow component props.\n */\nexport type BoxRowProps = BoxRowPropsShared &\n Omit<BoxProps, 'children' | 'flexDirection'> & {\n /**\n * Optional props passed to `SensitiveText` when `children` is a string.\n * Supports Text props plus `isHidden` / `length`.\n */\n textProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n };\n"]}
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import type { BoxRowPropsShared } from "@metamask/design-system-shared";
|
|
2
2
|
import type { BoxProps } from "../Box/Box.types.cjs";
|
|
3
|
-
import type {
|
|
3
|
+
import type { SensitiveTextProps } from "../SensitiveText/index.cjs";
|
|
4
4
|
/**
|
|
5
5
|
* BoxRow component props.
|
|
6
6
|
*/
|
|
7
7
|
export type BoxRowProps = BoxRowPropsShared & Omit<BoxProps, 'children' | 'flexDirection'> & {
|
|
8
8
|
/**
|
|
9
|
-
* Optional props passed to `
|
|
9
|
+
* Optional props passed to `SensitiveText` when `children` is a string.
|
|
10
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
10
11
|
*/
|
|
11
|
-
textProps?: Omit<
|
|
12
|
+
textProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
12
13
|
};
|
|
13
14
|
//# sourceMappingURL=BoxRow.types.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BoxRow.types.d.cts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,uCAAuC;AAExE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"BoxRow.types.d.cts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,uCAAuC;AAExE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAE3D;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,iBAAiB,GACzC,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,eAAe,CAAC,GAAG;IAC7C;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;CAC3D,CAAC"}
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import type { BoxRowPropsShared } from "@metamask/design-system-shared";
|
|
2
2
|
import type { BoxProps } from "../Box/Box.types.mjs";
|
|
3
|
-
import type {
|
|
3
|
+
import type { SensitiveTextProps } from "../SensitiveText/index.mjs";
|
|
4
4
|
/**
|
|
5
5
|
* BoxRow component props.
|
|
6
6
|
*/
|
|
7
7
|
export type BoxRowProps = BoxRowPropsShared & Omit<BoxProps, 'children' | 'flexDirection'> & {
|
|
8
8
|
/**
|
|
9
|
-
* Optional props passed to `
|
|
9
|
+
* Optional props passed to `SensitiveText` when `children` is a string.
|
|
10
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
10
11
|
*/
|
|
11
|
-
textProps?: Omit<
|
|
12
|
+
textProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
12
13
|
};
|
|
13
14
|
//# sourceMappingURL=BoxRow.types.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BoxRow.types.d.mts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,uCAAuC;AAExE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"BoxRow.types.d.mts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,uCAAuC;AAExE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAE3D;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,iBAAiB,GACzC,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,eAAe,CAAC,GAAG;IAC7C;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;CAC3D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BoxRow.types.mjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxRowPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type {
|
|
1
|
+
{"version":3,"file":"BoxRow.types.mjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxRowPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { SensitiveTextProps } from '../SensitiveText';\n\n/**\n * BoxRow component props.\n */\nexport type BoxRowProps = BoxRowPropsShared &\n Omit<BoxProps, 'children' | 'flexDirection'> & {\n /**\n * Optional props passed to `SensitiveText` when `children` is a string.\n * Supports Text props plus `isHidden` / `length`.\n */\n textProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n };\n"]}
|
|
@@ -27,7 +27,7 @@ const Content = ({ variant = design_system_shared_1.ContentVariant.TwoLines, ava
|
|
|
27
27
|
return (<Box_1.Box flexDirection={design_system_shared_1.BoxFlexDirection.Row} alignItems={alignItems} gap={4} twClassName={twClassName} {...props}>
|
|
28
28
|
{avatar}
|
|
29
29
|
<BoxColumn_1.BoxColumn twClassName="flex-1 min-w-0" bottomAccessory={showDescription ? (<BoxRow_1.BoxRow twClassName="w-full" alignItems={alignItems} startAccessory={descriptionStartAccessory} endAccessory={descriptionEndAccessory} gap={1}>
|
|
30
|
-
<BoxColumn_1.BoxColumn twClassName="
|
|
30
|
+
<BoxColumn_1.BoxColumn twClassName="min-w-0">
|
|
31
31
|
<TextOrChildren_1.TextOrChildren textProps={{
|
|
32
32
|
variant: design_system_shared_1.TextVariant.BodySm,
|
|
33
33
|
fontWeight: design_system_shared_1.FontWeight.Medium,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.cjs","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAOwC;AACxC,kDAA0B;AAE1B,0CAA6B;AAC7B,sDAAyC;AACzC,gDAAmC;AACnC,gFAAmE;AAI5D,MAAM,OAAO,GAA2B,CAAC,EAC9C,OAAO,GAAG,qCAAc,CAAC,QAAQ,EACjC,MAAM,EACN,WAAW,EACX,KAAK,EACL,UAAU,EACV,mBAAmB,EACnB,iBAAiB,EACjB,WAAW,EACX,gBAAgB,EAChB,yBAAyB,EACzB,uBAAuB,EACvB,KAAK,EACL,UAAU,EACV,mBAAmB,EACnB,iBAAiB,EACjB,QAAQ,EACR,aAAa,EACb,sBAAsB,EACtB,oBAAoB,EACpB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,OAAO,KAAK,qCAAc,CAAC,OAAO,CAAC;IACrD,MAAM,WAAW,GAAG,OAAO,KAAK,qCAAc,CAAC,SAAS,CAAC;IACzD,MAAM,eAAe,GAAG,CAAC,SAAS,IAAI,WAAW,CAAC;IAClD,MAAM,YAAY,GAAG,CAAC,SAAS,IAAI,QAAQ,CAAC;IAC5C,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,CAAC,oCAAa,CAAC,KAAK,CAAC,CAAC,CAAC,oCAAa,CAAC,MAAM,CAAC;IAE5E,IAAI,OAAO,EAAE;QACX,IAAI,SAAS,IAAI,WAAW,EAAE;YAC5B,OAAO,CAAC,IAAI,CACV,+EAA+E,CAChF,CAAC;SACH;QACD,IAAI,SAAS,IAAI,QAAQ,EAAE;YACzB,OAAO,CAAC,IAAI,CACV,4EAA4E,CAC7E,CAAC;SACH;KACF;IAED,OAAO,CACL,CAAC,SAAG,CACF,aAAa,CAAC,CAAC,uCAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,MAAM,CACP;MAAA,CAAC,qBAAS,CACR,WAAW,CAAC,gBAAgB,CAC5B,eAAe,CAAC,CACd,eAAe,CAAC,CAAC,CAAC,CAChB,CAAC,eAAM,CACL,WAAW,CAAC,QAAQ,CACpB,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,cAAc,CAAC,CAAC,yBAAyB,CAAC,CAC1C,YAAY,CAAC,CAAC,uBAAuB,CAAC,CACtC,GAAG,CAAC,CAAC,CAAC,CAAC,CAEP;cAAA,CAAC,qBAAS,CAAC,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"Content.cjs","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n BoxAlignItems,\n BoxFlexDirection,\n ContentVariant,\n FontWeight,\n TextColor,\n TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { BoxColumn } from '../BoxColumn';\nimport { BoxRow } from '../BoxRow';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { ContentProps } from './Content.types';\n\nexport const Content: React.FC<ContentProps> = ({\n variant = ContentVariant.TwoLines,\n avatar,\n twClassName,\n title,\n titleProps,\n titleStartAccessory,\n titleEndAccessory,\n description,\n descriptionProps,\n descriptionStartAccessory,\n descriptionEndAccessory,\n value,\n valueProps,\n valueStartAccessory,\n valueEndAccessory,\n subvalue,\n subvalueProps,\n subvalueStartAccessory,\n subvalueEndAccessory,\n ...props\n}) => {\n const isOneLine = variant === ContentVariant.OneLine;\n const isMultiLine = variant === ContentVariant.MultiLine;\n const showDescription = !isOneLine && description;\n const showSubvalue = !isOneLine && subvalue;\n const alignItems = isMultiLine ? BoxAlignItems.Start : BoxAlignItems.Center;\n\n if (__DEV__) {\n if (isOneLine && description) {\n console.warn(\n 'Content: `description` is ignored when `variant` is `ContentVariant.OneLine`.',\n );\n }\n if (isOneLine && subvalue) {\n console.warn(\n 'Content: `subvalue` is ignored when `variant` is `ContentVariant.OneLine`.',\n );\n }\n }\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={alignItems}\n gap={4}\n twClassName={twClassName}\n {...props}\n >\n {avatar}\n <BoxColumn\n twClassName=\"flex-1 min-w-0\"\n bottomAccessory={\n showDescription ? (\n <BoxRow\n twClassName=\"w-full\"\n alignItems={alignItems}\n startAccessory={descriptionStartAccessory}\n endAccessory={descriptionEndAccessory}\n gap={1}\n >\n <BoxColumn twClassName=\"min-w-0\">\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodySm,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextAlternative,\n ...descriptionProps,\n }}\n >\n {description}\n </TextOrChildren>\n </BoxColumn>\n </BoxRow>\n ) : null\n }\n >\n {title ? (\n <BoxRow\n twClassName=\"w-full\"\n startAccessory={titleStartAccessory}\n endAccessory={titleEndAccessory}\n gap={1}\n >\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n ...titleProps,\n }}\n >\n {title}\n </TextOrChildren>\n </BoxRow>\n ) : null}\n </BoxColumn>\n {value || showSubvalue ? (\n <BoxColumn\n alignItems={BoxAlignItems.End}\n twClassName=\"min-w-0\"\n bottomAccessory={\n showSubvalue ? (\n <BoxRow\n alignItems={alignItems}\n startAccessory={subvalueStartAccessory}\n endAccessory={subvalueEndAccessory}\n gap={1}\n >\n <BoxColumn twClassName=\"min-w-0\">\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodySm,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextAlternative,\n ...subvalueProps,\n }}\n >\n {subvalue}\n </TextOrChildren>\n </BoxColumn>\n </BoxRow>\n ) : null\n }\n >\n {value ? (\n <BoxRow\n startAccessory={valueStartAccessory}\n endAccessory={valueEndAccessory}\n gap={1}\n >\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n ...valueProps,\n }}\n >\n {value}\n </TextOrChildren>\n </BoxRow>\n ) : null}\n </BoxColumn>\n ) : null}\n </Box>\n );\n};\n\nContent.displayName = 'Content';\n"]}
|
|
@@ -28,7 +28,7 @@ export const Content = ({ variant = ContentVariant.TwoLines, avatar, twClassName
|
|
|
28
28
|
return (<Box flexDirection={BoxFlexDirection.Row} alignItems={alignItems} gap={4} twClassName={twClassName} {...props}>
|
|
29
29
|
{avatar}
|
|
30
30
|
<BoxColumn twClassName="flex-1 min-w-0" bottomAccessory={showDescription ? (<BoxRow twClassName="w-full" alignItems={alignItems} startAccessory={descriptionStartAccessory} endAccessory={descriptionEndAccessory} gap={1}>
|
|
31
|
-
<BoxColumn twClassName="
|
|
31
|
+
<BoxColumn twClassName="min-w-0">
|
|
32
32
|
<TextOrChildren textProps={{
|
|
33
33
|
variant: TextVariant.BodySm,
|
|
34
34
|
fontWeight: FontWeight.Medium,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.mjs","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,SAAS,EACT,WAAW,EACZ,uCAAuC;AACxC,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,SAAS,EAAE,+BAAqB;AACzC,OAAO,EAAE,MAAM,EAAE,4BAAkB;AACnC,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAInE,MAAM,CAAC,MAAM,OAAO,GAA2B,CAAC,EAC9C,OAAO,GAAG,cAAc,CAAC,QAAQ,EACjC,MAAM,EACN,WAAW,EACX,KAAK,EACL,UAAU,EACV,mBAAmB,EACnB,iBAAiB,EACjB,WAAW,EACX,gBAAgB,EAChB,yBAAyB,EACzB,uBAAuB,EACvB,KAAK,EACL,UAAU,EACV,mBAAmB,EACnB,iBAAiB,EACjB,QAAQ,EACR,aAAa,EACb,sBAAsB,EACtB,oBAAoB,EACpB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,OAAO,KAAK,cAAc,CAAC,OAAO,CAAC;IACrD,MAAM,WAAW,GAAG,OAAO,KAAK,cAAc,CAAC,SAAS,CAAC;IACzD,MAAM,eAAe,GAAG,CAAC,SAAS,IAAI,WAAW,CAAC;IAClD,MAAM,YAAY,GAAG,CAAC,SAAS,IAAI,QAAQ,CAAC;IAC5C,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC;IAE5E,IAAI,OAAO,EAAE;QACX,IAAI,SAAS,IAAI,WAAW,EAAE;YAC5B,OAAO,CAAC,IAAI,CACV,+EAA+E,CAChF,CAAC;SACH;QACD,IAAI,SAAS,IAAI,QAAQ,EAAE;YACzB,OAAO,CAAC,IAAI,CACV,4EAA4E,CAC7E,CAAC;SACH;KACF;IAED,OAAO,CACL,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,MAAM,CACP;MAAA,CAAC,SAAS,CACR,WAAW,CAAC,gBAAgB,CAC5B,eAAe,CAAC,CACd,eAAe,CAAC,CAAC,CAAC,CAChB,CAAC,MAAM,CACL,WAAW,CAAC,QAAQ,CACpB,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,cAAc,CAAC,CAAC,yBAAyB,CAAC,CAC1C,YAAY,CAAC,CAAC,uBAAuB,CAAC,CACtC,GAAG,CAAC,CAAC,CAAC,CAAC,CAEP;cAAA,CAAC,SAAS,CAAC,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"Content.mjs","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n BoxAlignItems,\n BoxFlexDirection,\n ContentVariant,\n FontWeight,\n TextColor,\n TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { BoxColumn } from '../BoxColumn';\nimport { BoxRow } from '../BoxRow';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { ContentProps } from './Content.types';\n\nexport const Content: React.FC<ContentProps> = ({\n variant = ContentVariant.TwoLines,\n avatar,\n twClassName,\n title,\n titleProps,\n titleStartAccessory,\n titleEndAccessory,\n description,\n descriptionProps,\n descriptionStartAccessory,\n descriptionEndAccessory,\n value,\n valueProps,\n valueStartAccessory,\n valueEndAccessory,\n subvalue,\n subvalueProps,\n subvalueStartAccessory,\n subvalueEndAccessory,\n ...props\n}) => {\n const isOneLine = variant === ContentVariant.OneLine;\n const isMultiLine = variant === ContentVariant.MultiLine;\n const showDescription = !isOneLine && description;\n const showSubvalue = !isOneLine && subvalue;\n const alignItems = isMultiLine ? BoxAlignItems.Start : BoxAlignItems.Center;\n\n if (__DEV__) {\n if (isOneLine && description) {\n console.warn(\n 'Content: `description` is ignored when `variant` is `ContentVariant.OneLine`.',\n );\n }\n if (isOneLine && subvalue) {\n console.warn(\n 'Content: `subvalue` is ignored when `variant` is `ContentVariant.OneLine`.',\n );\n }\n }\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={alignItems}\n gap={4}\n twClassName={twClassName}\n {...props}\n >\n {avatar}\n <BoxColumn\n twClassName=\"flex-1 min-w-0\"\n bottomAccessory={\n showDescription ? (\n <BoxRow\n twClassName=\"w-full\"\n alignItems={alignItems}\n startAccessory={descriptionStartAccessory}\n endAccessory={descriptionEndAccessory}\n gap={1}\n >\n <BoxColumn twClassName=\"min-w-0\">\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodySm,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextAlternative,\n ...descriptionProps,\n }}\n >\n {description}\n </TextOrChildren>\n </BoxColumn>\n </BoxRow>\n ) : null\n }\n >\n {title ? (\n <BoxRow\n twClassName=\"w-full\"\n startAccessory={titleStartAccessory}\n endAccessory={titleEndAccessory}\n gap={1}\n >\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n ...titleProps,\n }}\n >\n {title}\n </TextOrChildren>\n </BoxRow>\n ) : null}\n </BoxColumn>\n {value || showSubvalue ? (\n <BoxColumn\n alignItems={BoxAlignItems.End}\n twClassName=\"min-w-0\"\n bottomAccessory={\n showSubvalue ? (\n <BoxRow\n alignItems={alignItems}\n startAccessory={subvalueStartAccessory}\n endAccessory={subvalueEndAccessory}\n gap={1}\n >\n <BoxColumn twClassName=\"min-w-0\">\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodySm,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextAlternative,\n ...subvalueProps,\n }}\n >\n {subvalue}\n </TextOrChildren>\n </BoxColumn>\n </BoxRow>\n ) : null\n }\n >\n {value ? (\n <BoxRow\n startAccessory={valueStartAccessory}\n endAccessory={valueEndAccessory}\n gap={1}\n >\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n ...valueProps,\n }}\n >\n {value}\n </TextOrChildren>\n </BoxRow>\n ) : null}\n </BoxColumn>\n ) : null}\n </Box>\n );\n};\n\nContent.displayName = 'Content';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.types.cjs","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ContentPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { TextProps } from '../Text/Text.types';\n\n/**\n * Content component props.\n *\n * Props-only layout for the inner list row (`title`, `avatar`, inline row accessories, etc.).\n */\nexport type ContentProps = Omit<BoxProps, 'children'> &\n ContentPropsShared & {\n /**\n * Optional props for the title Text when `title` is a string.\n * Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.\n */\n titleProps?: Partial<Omit<TextProps, 'children'>>;\n /**\n * Optional props for the description
|
|
1
|
+
{"version":3,"file":"Content.types.cjs","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ContentPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { SensitiveTextProps } from '../SensitiveText';\nimport type { TextProps } from '../Text/Text.types';\n\n/**\n * Content component props.\n *\n * Props-only layout for the inner list row (`title`, `avatar`, inline row accessories, etc.).\n */\nexport type ContentProps = Omit<BoxProps, 'children'> &\n ContentPropsShared & {\n /**\n * Optional props for the title Text when `title` is a string.\n * Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.\n */\n titleProps?: Partial<Omit<TextProps, 'children'>>;\n /**\n * Optional props for the description SensitiveText when `description` is a string.\n * Supports Text props plus `isHidden` / `length`.\n * Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.\n */\n descriptionProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n /**\n * Optional props for the value SensitiveText when `value` is a string.\n * Supports Text props plus `isHidden` / `length`.\n * Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.\n */\n valueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n /**\n * Optional props for the subvalue SensitiveText when `subvalue` is a string.\n * Supports Text props plus `isHidden` / `length`.\n * Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.\n */\n subvalueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n };\n"]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ContentPropsShared } from "@metamask/design-system-shared";
|
|
2
2
|
import type { BoxProps } from "../Box/Box.types.cjs";
|
|
3
|
+
import type { SensitiveTextProps } from "../SensitiveText/index.cjs";
|
|
3
4
|
import type { TextProps } from "../Text/Text.types.cjs";
|
|
4
5
|
/**
|
|
5
6
|
* Content component props.
|
|
@@ -13,19 +14,22 @@ export type ContentProps = Omit<BoxProps, 'children'> & ContentPropsShared & {
|
|
|
13
14
|
*/
|
|
14
15
|
titleProps?: Partial<Omit<TextProps, 'children'>>;
|
|
15
16
|
/**
|
|
16
|
-
* Optional props for the description
|
|
17
|
+
* Optional props for the description SensitiveText when `description` is a string.
|
|
18
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
17
19
|
* Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.
|
|
18
20
|
*/
|
|
19
|
-
descriptionProps?: Partial<Omit<
|
|
21
|
+
descriptionProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
20
22
|
/**
|
|
21
|
-
* Optional props for the value
|
|
23
|
+
* Optional props for the value SensitiveText when `value` is a string.
|
|
24
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
22
25
|
* Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.
|
|
23
26
|
*/
|
|
24
|
-
valueProps?: Partial<Omit<
|
|
27
|
+
valueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
25
28
|
/**
|
|
26
|
-
* Optional props for the subvalue
|
|
29
|
+
* Optional props for the subvalue SensitiveText when `subvalue` is a string.
|
|
30
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
27
31
|
* Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.
|
|
28
32
|
*/
|
|
29
|
-
subvalueProps?: Partial<Omit<
|
|
33
|
+
subvalueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
30
34
|
};
|
|
31
35
|
//# sourceMappingURL=Content.types.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.types.d.cts","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,uCAAuC;AAEzE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GACnD,kBAAkB,GAAG;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IAClD
|
|
1
|
+
{"version":3,"file":"Content.types.d.cts","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,uCAAuC;AAEzE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAC3D,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GACnD,kBAAkB,GAAG;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IAClD;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;IACjE;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;IAC3D;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;CAC/D,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ContentPropsShared } from "@metamask/design-system-shared";
|
|
2
2
|
import type { BoxProps } from "../Box/Box.types.mjs";
|
|
3
|
+
import type { SensitiveTextProps } from "../SensitiveText/index.mjs";
|
|
3
4
|
import type { TextProps } from "../Text/Text.types.mjs";
|
|
4
5
|
/**
|
|
5
6
|
* Content component props.
|
|
@@ -13,19 +14,22 @@ export type ContentProps = Omit<BoxProps, 'children'> & ContentPropsShared & {
|
|
|
13
14
|
*/
|
|
14
15
|
titleProps?: Partial<Omit<TextProps, 'children'>>;
|
|
15
16
|
/**
|
|
16
|
-
* Optional props for the description
|
|
17
|
+
* Optional props for the description SensitiveText when `description` is a string.
|
|
18
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
17
19
|
* Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.
|
|
18
20
|
*/
|
|
19
|
-
descriptionProps?: Partial<Omit<
|
|
21
|
+
descriptionProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
20
22
|
/**
|
|
21
|
-
* Optional props for the value
|
|
23
|
+
* Optional props for the value SensitiveText when `value` is a string.
|
|
24
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
22
25
|
* Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.
|
|
23
26
|
*/
|
|
24
|
-
valueProps?: Partial<Omit<
|
|
27
|
+
valueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
25
28
|
/**
|
|
26
|
-
* Optional props for the subvalue
|
|
29
|
+
* Optional props for the subvalue SensitiveText when `subvalue` is a string.
|
|
30
|
+
* Supports Text props plus `isHidden` / `length`.
|
|
27
31
|
* Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.
|
|
28
32
|
*/
|
|
29
|
-
subvalueProps?: Partial<Omit<
|
|
33
|
+
subvalueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;
|
|
30
34
|
};
|
|
31
35
|
//# sourceMappingURL=Content.types.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.types.d.mts","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,uCAAuC;AAEzE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GACnD,kBAAkB,GAAG;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IAClD
|
|
1
|
+
{"version":3,"file":"Content.types.d.mts","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,uCAAuC;AAEzE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAC3D,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GACnD,kBAAkB,GAAG;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IAClD;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;IACjE;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;IAC3D;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC,CAAC;CAC/D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.types.mjs","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ContentPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { TextProps } from '../Text/Text.types';\n\n/**\n * Content component props.\n *\n * Props-only layout for the inner list row (`title`, `avatar`, inline row accessories, etc.).\n */\nexport type ContentProps = Omit<BoxProps, 'children'> &\n ContentPropsShared & {\n /**\n * Optional props for the title Text when `title` is a string.\n * Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.\n */\n titleProps?: Partial<Omit<TextProps, 'children'>>;\n /**\n * Optional props for the description
|
|
1
|
+
{"version":3,"file":"Content.types.mjs","sourceRoot":"","sources":["../../../src/components/Content/Content.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ContentPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { SensitiveTextProps } from '../SensitiveText';\nimport type { TextProps } from '../Text/Text.types';\n\n/**\n * Content component props.\n *\n * Props-only layout for the inner list row (`title`, `avatar`, inline row accessories, etc.).\n */\nexport type ContentProps = Omit<BoxProps, 'children'> &\n ContentPropsShared & {\n /**\n * Optional props for the title Text when `title` is a string.\n * Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.\n */\n titleProps?: Partial<Omit<TextProps, 'children'>>;\n /**\n * Optional props for the description SensitiveText when `description` is a string.\n * Supports Text props plus `isHidden` / `length`.\n * Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.\n */\n descriptionProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n /**\n * Optional props for the value SensitiveText when `value` is a string.\n * Supports Text props plus `isHidden` / `length`.\n * Default: TextVariant.BodyMd, FontWeight.Medium, TextColor.TextDefault.\n */\n valueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n /**\n * Optional props for the subvalue SensitiveText when `subvalue` is a string.\n * Supports Text props plus `isHidden` / `length`.\n * Default: TextVariant.BodySm, FontWeight.Medium, TextColor.TextAlternative.\n */\n subvalueProps?: Partial<Omit<SensitiveTextProps, 'children'>>;\n };\n"]}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.HelpText = void 0;
|
|
7
|
+
const design_system_shared_1 = require("@metamask/design-system-shared");
|
|
8
|
+
const react_1 = __importDefault(require("react"));
|
|
9
|
+
const Box_1 = require("../Box/index.cjs");
|
|
10
|
+
const IconAlert_1 = require("../IconAlert/index.cjs");
|
|
11
|
+
const Text_1 = require("../Text/index.cjs");
|
|
12
|
+
const HelpText_constants_1 = require("./HelpText.constants.cjs");
|
|
13
|
+
const HelpText = ({ severity, showIcon = false, color = design_system_shared_1.TextColor.TextDefault, twClassName, style, testID, children, ...props }) => {
|
|
14
|
+
const textColor = severity ? HelpText_constants_1.MAP_HELPTEXT_SEVERITY_COLOR[severity] : color;
|
|
15
|
+
if (!(showIcon && severity)) {
|
|
16
|
+
return (<Text_1.Text variant={design_system_shared_1.TextVariant.BodySm} color={textColor} twClassName={twClassName} style={style} testID={testID} {...props}>
|
|
17
|
+
{children}
|
|
18
|
+
</Text_1.Text>);
|
|
19
|
+
}
|
|
20
|
+
return (<Box_1.Box flexDirection={design_system_shared_1.BoxFlexDirection.Row} alignItems={design_system_shared_1.BoxAlignItems.Center} gap={1} twClassName={twClassName} style={style} testID={testID}>
|
|
21
|
+
<IconAlert_1.IconAlert severity={severity} size={design_system_shared_1.IconSize.Sm} testID="help-text-icon"/>
|
|
22
|
+
<Text_1.Text variant={design_system_shared_1.TextVariant.BodySm} color={textColor} {...props}>
|
|
23
|
+
{children}
|
|
24
|
+
</Text_1.Text>
|
|
25
|
+
</Box_1.Box>);
|
|
26
|
+
};
|
|
27
|
+
exports.HelpText = HelpText;
|
|
28
|
+
//# sourceMappingURL=HelpText.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HelpText.cjs","sourceRoot":"","sources":["../../../src/components/HelpText/HelpText.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAMwC;AACxC,kDAA0B;AAE1B,0CAA6B;AAC7B,sDAAyC;AACzC,4CAA+B;AAE/B,iEAAmE;AAG5D,MAAM,QAAQ,GAA4B,CAAC,EAChD,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,KAAK,GAAG,gCAAS,CAAC,WAAW,EAC7B,WAAW,EACX,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,gDAA2B,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IAE3E,IAAI,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,EAAE;QAC3B,OAAO,CACL,CAAC,WAAI,CACH,OAAO,CAAC,CAAC,kCAAW,CAAC,MAAM,CAAC,CAC5B,KAAK,CAAC,CAAC,SAAS,CAAC,CACjB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,KAAK,CAAC,CAEV;QAAA,CAAC,QAAQ,CACX;MAAA,EAAE,WAAI,CAAC,CACR,CAAC;KACH;IAED,OAAO,CACL,CAAC,SAAG,CACF,aAAa,CAAC,CAAC,uCAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,oCAAa,CAAC,MAAM,CAAC,CACjC,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,qBAAS,CACR,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,IAAI,CAAC,CAAC,+BAAQ,CAAC,EAAE,CAAC,CAClB,MAAM,CAAC,gBAAgB,EAEzB;MAAA,CAAC,WAAI,CAAC,OAAO,CAAC,CAAC,kCAAW,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,KAAK,CAAC,CAC7D;QAAA,CAAC,QAAQ,CACX;MAAA,EAAE,WAAI,CACR;IAAA,EAAE,SAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AA9CW,QAAA,QAAQ,YA8CnB","sourcesContent":["import {\n BoxAlignItems,\n BoxFlexDirection,\n IconSize,\n TextColor,\n TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { IconAlert } from '../IconAlert';\nimport { Text } from '../Text';\n\nimport { MAP_HELPTEXT_SEVERITY_COLOR } from './HelpText.constants';\nimport type { HelpTextProps } from './HelpText.types';\n\nexport const HelpText: React.FC<HelpTextProps> = ({\n severity,\n showIcon = false,\n color = TextColor.TextDefault,\n twClassName,\n style,\n testID,\n children,\n ...props\n}) => {\n const textColor = severity ? MAP_HELPTEXT_SEVERITY_COLOR[severity] : color;\n\n if (!(showIcon && severity)) {\n return (\n <Text\n variant={TextVariant.BodySm}\n color={textColor}\n twClassName={twClassName}\n style={style}\n testID={testID}\n {...props}\n >\n {children}\n </Text>\n );\n }\n\n return (\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Center}\n gap={1}\n twClassName={twClassName}\n style={style}\n testID={testID}\n >\n <IconAlert\n severity={severity}\n size={IconSize.Sm}\n testID=\"help-text-icon\"\n />\n <Text variant={TextVariant.BodySm} color={textColor} {...props}>\n {children}\n </Text>\n </Box>\n );\n};\n"]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.MAP_HELPTEXT_SEVERITY_COLOR = void 0;
|
|
4
|
+
const design_system_shared_1 = require("@metamask/design-system-shared");
|
|
5
|
+
exports.MAP_HELPTEXT_SEVERITY_COLOR = {
|
|
6
|
+
[design_system_shared_1.HelpTextSeverity.Danger]: design_system_shared_1.TextColor.ErrorDefault,
|
|
7
|
+
[design_system_shared_1.HelpTextSeverity.Warning]: design_system_shared_1.TextColor.WarningDefault,
|
|
8
|
+
[design_system_shared_1.HelpTextSeverity.Success]: design_system_shared_1.TextColor.SuccessDefault,
|
|
9
|
+
[design_system_shared_1.HelpTextSeverity.Info]: design_system_shared_1.TextColor.InfoDefault,
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=HelpText.constants.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HelpText.constants.cjs","sourceRoot":"","sources":["../../../src/components/HelpText/HelpText.constants.ts"],"names":[],"mappings":";;;AAAA,yEAA6E;AAEhE,QAAA,2BAA2B,GACtC;IACE,CAAC,uCAAgB,CAAC,MAAM,CAAC,EAAE,gCAAS,CAAC,YAAY;IACjD,CAAC,uCAAgB,CAAC,OAAO,CAAC,EAAE,gCAAS,CAAC,cAAc;IACpD,CAAC,uCAAgB,CAAC,OAAO,CAAC,EAAE,gCAAS,CAAC,cAAc;IACpD,CAAC,uCAAgB,CAAC,IAAI,CAAC,EAAE,gCAAS,CAAC,WAAW;CAC/C,CAAC","sourcesContent":["import { HelpTextSeverity, TextColor } from '@metamask/design-system-shared';\n\nexport const MAP_HELPTEXT_SEVERITY_COLOR: Record<HelpTextSeverity, TextColor> =\n {\n [HelpTextSeverity.Danger]: TextColor.ErrorDefault,\n [HelpTextSeverity.Warning]: TextColor.WarningDefault,\n [HelpTextSeverity.Success]: TextColor.SuccessDefault,\n [HelpTextSeverity.Info]: TextColor.InfoDefault,\n };\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HelpText.constants.d.cts","sourceRoot":"","sources":["../../../src/components/HelpText/HelpText.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,uCAAuC;AAE7E,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAAC,gBAAgB,EAAE,SAAS,CAMzE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HelpText.constants.d.mts","sourceRoot":"","sources":["../../../src/components/HelpText/HelpText.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,uCAAuC;AAE7E,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAAC,gBAAgB,EAAE,SAAS,CAMzE,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { HelpTextSeverity, TextColor } from "@metamask/design-system-shared";
|
|
2
|
+
export const MAP_HELPTEXT_SEVERITY_COLOR = {
|
|
3
|
+
[HelpTextSeverity.Danger]: TextColor.ErrorDefault,
|
|
4
|
+
[HelpTextSeverity.Warning]: TextColor.WarningDefault,
|
|
5
|
+
[HelpTextSeverity.Success]: TextColor.SuccessDefault,
|
|
6
|
+
[HelpTextSeverity.Info]: TextColor.InfoDefault,
|
|
7
|
+
};
|
|
8
|
+
//# sourceMappingURL=HelpText.constants.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HelpText.constants.mjs","sourceRoot":"","sources":["../../../src/components/HelpText/HelpText.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,uCAAuC;AAE7E,MAAM,CAAC,MAAM,2BAA2B,GACtC;IACE,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC,YAAY;IACjD,CAAC,gBAAgB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc;IACpD,CAAC,gBAAgB,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc;IACpD,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,WAAW;CAC/C,CAAC","sourcesContent":["import { HelpTextSeverity, TextColor } from '@metamask/design-system-shared';\n\nexport const MAP_HELPTEXT_SEVERITY_COLOR: Record<HelpTextSeverity, TextColor> =\n {\n [HelpTextSeverity.Danger]: TextColor.ErrorDefault,\n [HelpTextSeverity.Warning]: TextColor.WarningDefault,\n [HelpTextSeverity.Success]: TextColor.SuccessDefault,\n [HelpTextSeverity.Info]: TextColor.InfoDefault,\n };\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HelpText.d.cts","sourceRoot":"","sources":["../../../src/components/HelpText/HelpText.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,aAAa,EAAE,6BAAyB;AAEtD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA8C5C,CAAC"}
|