@metamask/design-system-react-native 0.8.0 → 0.10.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 +30 -1
- package/dist/components/ActionListItem/ActionListItem.cjs +86 -0
- package/dist/components/ActionListItem/ActionListItem.cjs.map +1 -0
- package/dist/components/ActionListItem/ActionListItem.d.cts +4 -0
- package/dist/components/ActionListItem/ActionListItem.d.cts.map +1 -0
- package/dist/components/ActionListItem/ActionListItem.d.mts +4 -0
- package/dist/components/ActionListItem/ActionListItem.d.mts.map +1 -0
- package/dist/components/ActionListItem/ActionListItem.mjs +66 -0
- package/dist/components/ActionListItem/ActionListItem.mjs.map +1 -0
- package/dist/components/ActionListItem/ActionListItem.types.cjs +3 -0
- package/dist/components/ActionListItem/ActionListItem.types.cjs.map +1 -0
- package/dist/components/ActionListItem/ActionListItem.types.d.cts +73 -0
- package/dist/components/ActionListItem/ActionListItem.types.d.cts.map +1 -0
- package/dist/components/ActionListItem/ActionListItem.types.d.mts +73 -0
- package/dist/components/ActionListItem/ActionListItem.types.d.mts.map +1 -0
- package/dist/components/ActionListItem/ActionListItem.types.mjs +2 -0
- package/dist/components/ActionListItem/ActionListItem.types.mjs.map +1 -0
- package/dist/components/ActionListItem/index.cjs +6 -0
- package/dist/components/ActionListItem/index.cjs.map +1 -0
- package/dist/components/ActionListItem/index.d.cts +3 -0
- package/dist/components/ActionListItem/index.d.cts.map +1 -0
- package/dist/components/ActionListItem/index.d.mts +3 -0
- package/dist/components/ActionListItem/index.d.mts.map +1 -0
- package/dist/components/ActionListItem/index.mjs +2 -0
- package/dist/components/ActionListItem/index.mjs.map +1 -0
- package/dist/components/BadgeCount/BadgeCount.cjs +3 -3
- package/dist/components/BadgeCount/BadgeCount.cjs.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.constants.cjs +6 -10
- package/dist/components/BadgeCount/BadgeCount.constants.cjs.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.constants.d.cts +1 -2
- package/dist/components/BadgeCount/BadgeCount.constants.d.cts.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.constants.d.mts +1 -2
- package/dist/components/BadgeCount/BadgeCount.constants.d.mts.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.constants.mjs +3 -7
- package/dist/components/BadgeCount/BadgeCount.constants.mjs.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.d.cts.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.d.mts.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.mjs +3 -3
- package/dist/components/BadgeCount/BadgeCount.mjs.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.types.cjs.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.types.d.cts +5 -22
- package/dist/components/BadgeCount/BadgeCount.types.d.cts.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.types.d.mts +5 -22
- package/dist/components/BadgeCount/BadgeCount.types.d.mts.map +1 -1
- package/dist/components/BadgeCount/BadgeCount.types.mjs.map +1 -1
- package/dist/components/BadgeCount/index.cjs +2 -2
- package/dist/components/BadgeCount/index.cjs.map +1 -1
- package/dist/components/BadgeCount/index.d.cts +1 -1
- package/dist/components/BadgeCount/index.d.cts.map +1 -1
- package/dist/components/BadgeCount/index.d.mts +1 -1
- package/dist/components/BadgeCount/index.d.mts.map +1 -1
- package/dist/components/BadgeCount/index.mjs +1 -1
- package/dist/components/BadgeCount/index.mjs.map +1 -1
- package/dist/components/BottomSheetHeader/BottomSheetHeader.cjs +27 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.cjs.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.cjs +15 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.cjs.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.d.cts +7 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.d.cts.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.d.mts +7 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.d.mts.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.mjs +12 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.constants.mjs.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.d.cts +4 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.d.cts.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.d.mts +4 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.d.mts.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.mjs +27 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.mjs.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.cjs +14 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.cjs.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.d.cts +50 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.d.cts.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.d.mts +50 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.d.mts.map +1 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.mjs +11 -0
- package/dist/components/BottomSheetHeader/BottomSheetHeader.types.mjs.map +1 -0
- package/dist/components/BottomSheetHeader/index.cjs +8 -0
- package/dist/components/BottomSheetHeader/index.cjs.map +1 -0
- package/dist/components/BottomSheetHeader/index.d.cts +4 -0
- package/dist/components/BottomSheetHeader/index.d.cts.map +1 -0
- package/dist/components/BottomSheetHeader/index.d.mts +4 -0
- package/dist/components/BottomSheetHeader/index.d.mts.map +1 -0
- package/dist/components/BottomSheetHeader/index.mjs +3 -0
- package/dist/components/BottomSheetHeader/index.mjs.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.cjs +37 -0
- package/dist/components/ButtonHero/ButtonHero.cjs.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.d.cts +13 -0
- package/dist/components/ButtonHero/ButtonHero.d.cts.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.d.mts +13 -0
- package/dist/components/ButtonHero/ButtonHero.d.mts.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.mjs +37 -0
- package/dist/components/ButtonHero/ButtonHero.mjs.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.types.cjs +3 -0
- package/dist/components/ButtonHero/ButtonHero.types.cjs.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.types.d.cts +3 -0
- package/dist/components/ButtonHero/ButtonHero.types.d.cts.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.types.d.mts +3 -0
- package/dist/components/ButtonHero/ButtonHero.types.d.mts.map +1 -0
- package/dist/components/ButtonHero/ButtonHero.types.mjs +2 -0
- package/dist/components/ButtonHero/ButtonHero.types.mjs.map +1 -0
- package/dist/components/ButtonHero/index.cjs +8 -0
- package/dist/components/ButtonHero/index.cjs.map +1 -0
- package/dist/components/ButtonHero/index.d.cts +4 -0
- package/dist/components/ButtonHero/index.d.cts.map +1 -0
- package/dist/components/ButtonHero/index.d.mts +4 -0
- package/dist/components/ButtonHero/index.d.mts.map +1 -0
- package/dist/components/ButtonHero/index.mjs +3 -0
- package/dist/components/ButtonHero/index.mjs.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.cjs +64 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.cjs.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.cjs +17 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.cjs.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.d.cts +5 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.d.cts.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.d.mts +5 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.d.mts.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.mjs +14 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.constants.mjs.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.d.cts +4 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.d.cts.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.d.mts +4 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.d.mts.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.mjs +44 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.mjs.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.cjs +18 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.cjs.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.d.cts +30 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.d.cts.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.d.mts +30 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.d.mts.map +1 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.mjs +15 -0
- package/dist/components/ButtonSemantic/ButtonSemantic.types.mjs.map +1 -0
- package/dist/components/ButtonSemantic/index.cjs +8 -0
- package/dist/components/ButtonSemantic/index.cjs.map +1 -0
- package/dist/components/ButtonSemantic/index.d.cts +4 -0
- package/dist/components/ButtonSemantic/index.d.cts.map +1 -0
- package/dist/components/ButtonSemantic/index.d.mts +4 -0
- package/dist/components/ButtonSemantic/index.d.mts.map +1 -0
- package/dist/components/ButtonSemantic/index.mjs +3 -0
- package/dist/components/ButtonSemantic/index.mjs.map +1 -0
- package/dist/components/HeaderBase/HeaderBase.cjs +17 -8
- package/dist/components/HeaderBase/HeaderBase.cjs.map +1 -1
- package/dist/components/HeaderBase/HeaderBase.constants.cjs +15 -0
- package/dist/components/HeaderBase/HeaderBase.constants.cjs.map +1 -0
- package/dist/components/HeaderBase/HeaderBase.constants.d.cts +7 -0
- package/dist/components/HeaderBase/HeaderBase.constants.d.cts.map +1 -0
- package/dist/components/HeaderBase/HeaderBase.constants.d.mts +7 -0
- package/dist/components/HeaderBase/HeaderBase.constants.d.mts.map +1 -0
- package/dist/components/HeaderBase/HeaderBase.constants.mjs +12 -0
- package/dist/components/HeaderBase/HeaderBase.constants.mjs.map +1 -0
- package/dist/components/HeaderBase/HeaderBase.d.cts.map +1 -1
- package/dist/components/HeaderBase/HeaderBase.d.mts.map +1 -1
- package/dist/components/HeaderBase/HeaderBase.mjs +18 -9
- package/dist/components/HeaderBase/HeaderBase.mjs.map +1 -1
- package/dist/components/HeaderBase/HeaderBase.types.cjs +12 -0
- package/dist/components/HeaderBase/HeaderBase.types.cjs.map +1 -1
- package/dist/components/HeaderBase/HeaderBase.types.d.cts +16 -0
- package/dist/components/HeaderBase/HeaderBase.types.d.cts.map +1 -1
- package/dist/components/HeaderBase/HeaderBase.types.d.mts +16 -0
- package/dist/components/HeaderBase/HeaderBase.types.d.mts.map +1 -1
- package/dist/components/HeaderBase/HeaderBase.types.mjs +11 -1
- package/dist/components/HeaderBase/HeaderBase.types.mjs.map +1 -1
- package/dist/components/HeaderBase/index.cjs +3 -1
- package/dist/components/HeaderBase/index.cjs.map +1 -1
- package/dist/components/HeaderBase/index.d.cts +1 -0
- package/dist/components/HeaderBase/index.d.cts.map +1 -1
- package/dist/components/HeaderBase/index.d.mts +1 -0
- package/dist/components/HeaderBase/index.d.mts.map +1 -1
- package/dist/components/HeaderBase/index.mjs +1 -0
- package/dist/components/HeaderBase/index.mjs.map +1 -1
- package/dist/components/SensitiveText/SensitiveText.cjs +47 -0
- package/dist/components/SensitiveText/SensitiveText.cjs.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.constants.cjs +14 -0
- package/dist/components/SensitiveText/SensitiveText.constants.cjs.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.constants.d.cts +11 -0
- package/dist/components/SensitiveText/SensitiveText.constants.d.cts.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.constants.d.mts +11 -0
- package/dist/components/SensitiveText/SensitiveText.constants.d.mts.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.constants.mjs +11 -0
- package/dist/components/SensitiveText/SensitiveText.constants.mjs.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.d.cts +4 -0
- package/dist/components/SensitiveText/SensitiveText.d.cts.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.d.mts +4 -0
- package/dist/components/SensitiveText/SensitiveText.d.mts.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.mjs +27 -0
- package/dist/components/SensitiveText/SensitiveText.mjs.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.types.cjs +3 -0
- package/dist/components/SensitiveText/SensitiveText.types.cjs.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.types.d.cts +38 -0
- package/dist/components/SensitiveText/SensitiveText.types.d.cts.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.types.d.mts +38 -0
- package/dist/components/SensitiveText/SensitiveText.types.d.mts.map +1 -0
- package/dist/components/SensitiveText/SensitiveText.types.mjs +2 -0
- package/dist/components/SensitiveText/SensitiveText.types.mjs.map +1 -0
- package/dist/components/SensitiveText/index.cjs +8 -0
- package/dist/components/SensitiveText/index.cjs.map +1 -0
- package/dist/components/SensitiveText/index.d.cts +4 -0
- package/dist/components/SensitiveText/index.d.cts.map +1 -0
- package/dist/components/SensitiveText/index.d.mts +4 -0
- package/dist/components/SensitiveText/index.d.mts.map +1 -0
- package/dist/components/SensitiveText/index.mjs +3 -0
- package/dist/components/SensitiveText/index.mjs.map +1 -0
- package/dist/components/TextField/TextField.cjs +42 -0
- package/dist/components/TextField/TextField.cjs.map +1 -0
- package/dist/components/TextField/TextField.constants.cjs +13 -0
- package/dist/components/TextField/TextField.constants.cjs.map +1 -0
- package/dist/components/TextField/TextField.constants.d.cts +6 -0
- package/dist/components/TextField/TextField.constants.d.cts.map +1 -0
- package/dist/components/TextField/TextField.constants.d.mts +6 -0
- package/dist/components/TextField/TextField.constants.d.mts.map +1 -0
- package/dist/components/TextField/TextField.constants.mjs +10 -0
- package/dist/components/TextField/TextField.constants.mjs.map +1 -0
- package/dist/components/TextField/TextField.d.cts +12 -0
- package/dist/components/TextField/TextField.d.cts.map +1 -0
- package/dist/components/TextField/TextField.d.mts +12 -0
- package/dist/components/TextField/TextField.d.mts.map +1 -0
- package/dist/components/TextField/TextField.mjs +39 -0
- package/dist/components/TextField/TextField.mjs.map +1 -0
- package/dist/components/TextField/TextField.types.cjs +13 -0
- package/dist/components/TextField/TextField.types.cjs.map +1 -0
- package/dist/components/TextField/TextField.types.d.cts +49 -0
- package/dist/components/TextField/TextField.types.d.cts.map +1 -0
- package/dist/components/TextField/TextField.types.d.mts +49 -0
- package/dist/components/TextField/TextField.types.d.mts.map +1 -0
- package/dist/components/TextField/TextField.types.mjs +10 -0
- package/dist/components/TextField/TextField.types.mjs.map +1 -0
- package/dist/components/TextField/index.cjs +8 -0
- package/dist/components/TextField/index.cjs.map +1 -0
- package/dist/components/TextField/index.d.cts +4 -0
- package/dist/components/TextField/index.d.cts.map +1 -0
- package/dist/components/TextField/index.d.mts +4 -0
- package/dist/components/TextField/index.d.mts.map +1 -0
- package/dist/components/TextField/index.mjs +3 -0
- package/dist/components/TextField/index.mjs.map +1 -0
- package/dist/components/index.cjs +17 -2
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.d.cts +11 -1
- package/dist/components/index.d.cts.map +1 -1
- package/dist/components/index.d.mts +11 -1
- package/dist/components/index.d.mts.map +1 -1
- package/dist/components/index.mjs +6 -1
- package/dist/components/index.mjs.map +1 -1
- package/dist/types/index.cjs +2 -16
- package/dist/types/index.cjs.map +1 -1
- package/dist/types/index.d.cts +1 -13
- package/dist/types/index.d.cts.map +1 -1
- package/dist/types/index.d.mts +1 -13
- package/dist/types/index.d.mts.map +1 -1
- package/dist/types/index.mjs +1 -14
- package/dist/types/index.mjs.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,33 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
7
7
|
|
|
8
8
|
## [Unreleased]
|
|
9
9
|
|
|
10
|
+
## [0.10.0]
|
|
11
|
+
|
|
12
|
+
### Added
|
|
13
|
+
|
|
14
|
+
- Added `ActionListItem` component for standardized list row actions ([#951](https://github.com/MetaMask/metamask-design-system/pull/951))
|
|
15
|
+
- Added `SensitiveText` component for sensitive value display and reveal interactions ([#922](https://github.com/MetaMask/metamask-design-system/pull/922))
|
|
16
|
+
- Added `ButtonSemantic` component for semantic intent button variants ([#950](https://github.com/MetaMask/metamask-design-system/pull/950))
|
|
17
|
+
- Added `BottomSheetHeader` component for consistent bottom sheet header layouts ([#927](https://github.com/MetaMask/metamask-design-system/pull/927))
|
|
18
|
+
- Added `ButtonHero` to `@metamask/design-system-react-native` ([#934](https://github.com/MetaMask/metamask-design-system/pull/934))
|
|
19
|
+
|
|
20
|
+
### Changed
|
|
21
|
+
|
|
22
|
+
- **BREAKING:** Updated `BadgeCount` type exports to use the ADR-0003/ADR-0004 const-object + string-union pattern instead of TypeScript enums ([#942](https://github.com/MetaMask/metamask-design-system/pull/942))
|
|
23
|
+
- `BadgeCountSize` is now provided as a const object with a derived union type rather than an enum
|
|
24
|
+
- `BadgeCount` shared prop types are now sourced from `@metamask/design-system-shared`
|
|
25
|
+
- Migration: update any enum-specific usage to const-object/union usage, while continuing to import from `@metamask/design-system-react-native`
|
|
26
|
+
|
|
27
|
+
## [0.9.0]
|
|
28
|
+
|
|
29
|
+
### Added
|
|
30
|
+
|
|
31
|
+
- Added `TextField` component for text input fields ([#910](https://github.com/MetaMask/metamask-design-system/pull/910))
|
|
32
|
+
- Boxed, press-to-focus wrapper around `Input` component
|
|
33
|
+
- Supports configurable sizes, optional start/end accessories
|
|
34
|
+
- Includes error and disabled states with custom styling
|
|
35
|
+
- Full accessibility support and comprehensive test coverage
|
|
36
|
+
|
|
10
37
|
## [0.8.0]
|
|
11
38
|
|
|
12
39
|
### Added
|
|
@@ -177,7 +204,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
177
204
|
- Full TypeScript support with type definitions and enums
|
|
178
205
|
- React Native integration with TWRNC preset support
|
|
179
206
|
|
|
180
|
-
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.
|
|
207
|
+
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.10.0...HEAD
|
|
208
|
+
[0.10.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.9.0...@metamask/design-system-react-native@0.10.0
|
|
209
|
+
[0.9.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.8.0...@metamask/design-system-react-native@0.9.0
|
|
181
210
|
[0.8.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.7.0...@metamask/design-system-react-native@0.8.0
|
|
182
211
|
[0.7.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.6.0...@metamask/design-system-react-native@0.7.0
|
|
183
212
|
[0.6.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.5.1...@metamask/design-system-react-native@0.6.0
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
exports.ActionListItem = void 0;
|
|
27
|
+
const design_system_twrnc_preset_1 = require("@metamask/design-system-twrnc-preset");
|
|
28
|
+
const react_1 = __importStar(require("react"));
|
|
29
|
+
const react_native_1 = require("react-native/index.js");
|
|
30
|
+
const Box_1 = require("../Box/index.cjs");
|
|
31
|
+
const Icon_1 = require("../Icon/index.cjs");
|
|
32
|
+
const Text_1 = require("../Text/index.cjs");
|
|
33
|
+
const ActionListItem = ({ label, description, startAccessory, endAccessory, iconName, labelTextProps, descriptionTextProps, iconProps, isDisabled = false, onPress, pressableProps, twClassName, style, ...props }) => {
|
|
34
|
+
const tw = (0, design_system_twrnc_preset_1.useTailwind)();
|
|
35
|
+
const renderLabel = () => {
|
|
36
|
+
if (typeof label === 'string') {
|
|
37
|
+
return (<Text_1.Text variant={Text_1.TextVariant.BodyMd} {...labelTextProps}>
|
|
38
|
+
{label}
|
|
39
|
+
</Text_1.Text>);
|
|
40
|
+
}
|
|
41
|
+
return label;
|
|
42
|
+
};
|
|
43
|
+
const renderDescription = () => {
|
|
44
|
+
if (!description) {
|
|
45
|
+
return null;
|
|
46
|
+
}
|
|
47
|
+
if (typeof description === 'string') {
|
|
48
|
+
return (<Text_1.Text variant={Text_1.TextVariant.BodySm} color={Text_1.TextColor.TextAlternative} {...descriptionTextProps}>
|
|
49
|
+
{description}
|
|
50
|
+
</Text_1.Text>);
|
|
51
|
+
}
|
|
52
|
+
return description;
|
|
53
|
+
};
|
|
54
|
+
const renderStartContent = () => {
|
|
55
|
+
if (startAccessory) {
|
|
56
|
+
return startAccessory;
|
|
57
|
+
}
|
|
58
|
+
if (iconName) {
|
|
59
|
+
return (<Box_1.Box alignItems={Box_1.BoxAlignItems.Center} justifyContent={Box_1.BoxJustifyContent.Center} twClassName="h-6">
|
|
60
|
+
<Icon_1.Icon name={iconName} size={Icon_1.IconSize.Md} {...iconProps}/>
|
|
61
|
+
</Box_1.Box>);
|
|
62
|
+
}
|
|
63
|
+
return null;
|
|
64
|
+
};
|
|
65
|
+
const getPressableStyle = (0, react_1.useCallback)(({ pressed }) => {
|
|
66
|
+
const baseStyle = tw.style('bg-default px-4 py-3', pressed && !isDisabled && 'bg-default-pressed', isDisabled && 'opacity-50', twClassName);
|
|
67
|
+
return style ? [baseStyle, style] : baseStyle;
|
|
68
|
+
}, [tw, isDisabled, twClassName, style]);
|
|
69
|
+
return (<react_native_1.Pressable onPress={onPress} disabled={isDisabled} style={getPressableStyle} {...pressableProps} {...props}>
|
|
70
|
+
<Box_1.Box flexDirection={Box_1.BoxFlexDirection.Row} alignItems={Box_1.BoxAlignItems.Center} justifyContent={Box_1.BoxJustifyContent.Between} gap={4}>
|
|
71
|
+
{/* Left side content (start accessory/icon + label/description) */}
|
|
72
|
+
<Box_1.Box flexDirection={Box_1.BoxFlexDirection.Row} alignItems={Box_1.BoxAlignItems.Start} twClassName="flex-1" gap={4}>
|
|
73
|
+
{renderStartContent()}
|
|
74
|
+
<Box_1.Box twClassName="flex-1">
|
|
75
|
+
{renderLabel()}
|
|
76
|
+
{renderDescription()}
|
|
77
|
+
</Box_1.Box>
|
|
78
|
+
</Box_1.Box>
|
|
79
|
+
|
|
80
|
+
{/* End accessory */}
|
|
81
|
+
{endAccessory && <Box_1.Box>{endAccessory}</Box_1.Box>}
|
|
82
|
+
</Box_1.Box>
|
|
83
|
+
</react_native_1.Pressable>);
|
|
84
|
+
};
|
|
85
|
+
exports.ActionListItem = ActionListItem;
|
|
86
|
+
//# sourceMappingURL=ActionListItem.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.cjs","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React, { useCallback } from 'react';\nimport { Pressable } from 'react-native';\n\nimport {\n Box,\n BoxAlignItems,\n BoxFlexDirection,\n BoxJustifyContent,\n} from '../Box';\nimport { Icon, IconSize } from '../Icon';\nimport { Text, TextColor, TextVariant } from '../Text';\n\nimport type { ActionListItemProps } from './ActionListItem.types';\n\nexport const ActionListItem: React.FC<ActionListItemProps> = ({\n label,\n description,\n startAccessory,\n endAccessory,\n iconName,\n labelTextProps,\n descriptionTextProps,\n iconProps,\n isDisabled = false,\n onPress,\n pressableProps,\n twClassName,\n style,\n ...props\n}) => {\n const tw = useTailwind();\n\n const renderLabel = () => {\n if (typeof label === 'string') {\n return (\n <Text variant={TextVariant.BodyMd} {...labelTextProps}>\n {label}\n </Text>\n );\n }\n return label;\n };\n\n const renderDescription = () => {\n if (!description) {\n return null;\n }\n\n if (typeof description === 'string') {\n return (\n <Text\n variant={TextVariant.BodySm}\n color={TextColor.TextAlternative}\n {...descriptionTextProps}\n >\n {description}\n </Text>\n );\n }\n return description;\n };\n\n const renderStartContent = () => {\n if (startAccessory) {\n return startAccessory;\n }\n\n if (iconName) {\n return (\n <Box\n alignItems={BoxAlignItems.Center}\n justifyContent={BoxJustifyContent.Center}\n twClassName=\"h-6\"\n >\n <Icon name={iconName} size={IconSize.Md} {...iconProps} />\n </Box>\n );\n }\n\n return null;\n };\n\n const getPressableStyle = useCallback(\n ({ pressed }: { pressed: boolean }) => {\n const baseStyle = tw.style(\n 'bg-default px-4 py-3',\n pressed && !isDisabled && 'bg-default-pressed',\n isDisabled && 'opacity-50',\n twClassName,\n );\n\n return style ? [baseStyle, style] : baseStyle;\n },\n [tw, isDisabled, twClassName, style],\n );\n\n return (\n <Pressable\n onPress={onPress}\n disabled={isDisabled}\n style={getPressableStyle}\n {...pressableProps}\n {...props}\n >\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Center}\n justifyContent={BoxJustifyContent.Between}\n gap={4}\n >\n {/* Left side content (start accessory/icon + label/description) */}\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n twClassName=\"flex-1\"\n gap={4}\n >\n {renderStartContent()}\n <Box twClassName=\"flex-1\">\n {renderLabel()}\n {renderDescription()}\n </Box>\n </Box>\n\n {/* End accessory */}\n {endAccessory && <Box>{endAccessory}</Box>}\n </Box>\n </Pressable>\n );\n};\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.d.cts","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,cAAc;AAY3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,mCAA+B;AAElE,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAmHxD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.d.mts","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,cAAc;AAY3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,mCAA+B;AAElE,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAmHxD,CAAC"}
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
function $importDefault(module) {
|
|
2
|
+
if (module?.__esModule) {
|
|
3
|
+
return module.default;
|
|
4
|
+
}
|
|
5
|
+
return module;
|
|
6
|
+
}
|
|
7
|
+
import { useTailwind } from "@metamask/design-system-twrnc-preset";
|
|
8
|
+
import $React, { useCallback } from "react";
|
|
9
|
+
const React = $importDefault($React);
|
|
10
|
+
import { Pressable } from "react-native/index.js";
|
|
11
|
+
import { Box, BoxAlignItems, BoxFlexDirection, BoxJustifyContent } from "../Box/index.mjs";
|
|
12
|
+
import { Icon, IconSize } from "../Icon/index.mjs";
|
|
13
|
+
import { Text, TextColor, TextVariant } from "../Text/index.mjs";
|
|
14
|
+
export const ActionListItem = ({ label, description, startAccessory, endAccessory, iconName, labelTextProps, descriptionTextProps, iconProps, isDisabled = false, onPress, pressableProps, twClassName, style, ...props }) => {
|
|
15
|
+
const tw = useTailwind();
|
|
16
|
+
const renderLabel = () => {
|
|
17
|
+
if (typeof label === 'string') {
|
|
18
|
+
return (<Text variant={TextVariant.BodyMd} {...labelTextProps}>
|
|
19
|
+
{label}
|
|
20
|
+
</Text>);
|
|
21
|
+
}
|
|
22
|
+
return label;
|
|
23
|
+
};
|
|
24
|
+
const renderDescription = () => {
|
|
25
|
+
if (!description) {
|
|
26
|
+
return null;
|
|
27
|
+
}
|
|
28
|
+
if (typeof description === 'string') {
|
|
29
|
+
return (<Text variant={TextVariant.BodySm} color={TextColor.TextAlternative} {...descriptionTextProps}>
|
|
30
|
+
{description}
|
|
31
|
+
</Text>);
|
|
32
|
+
}
|
|
33
|
+
return description;
|
|
34
|
+
};
|
|
35
|
+
const renderStartContent = () => {
|
|
36
|
+
if (startAccessory) {
|
|
37
|
+
return startAccessory;
|
|
38
|
+
}
|
|
39
|
+
if (iconName) {
|
|
40
|
+
return (<Box alignItems={BoxAlignItems.Center} justifyContent={BoxJustifyContent.Center} twClassName="h-6">
|
|
41
|
+
<Icon name={iconName} size={IconSize.Md} {...iconProps}/>
|
|
42
|
+
</Box>);
|
|
43
|
+
}
|
|
44
|
+
return null;
|
|
45
|
+
};
|
|
46
|
+
const getPressableStyle = useCallback(({ pressed }) => {
|
|
47
|
+
const baseStyle = tw.style('bg-default px-4 py-3', pressed && !isDisabled && 'bg-default-pressed', isDisabled && 'opacity-50', twClassName);
|
|
48
|
+
return style ? [baseStyle, style] : baseStyle;
|
|
49
|
+
}, [tw, isDisabled, twClassName, style]);
|
|
50
|
+
return (<Pressable onPress={onPress} disabled={isDisabled} style={getPressableStyle} {...pressableProps} {...props}>
|
|
51
|
+
<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Center} justifyContent={BoxJustifyContent.Between} gap={4}>
|
|
52
|
+
{/* Left side content (start accessory/icon + label/description) */}
|
|
53
|
+
<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Start} twClassName="flex-1" gap={4}>
|
|
54
|
+
{renderStartContent()}
|
|
55
|
+
<Box twClassName="flex-1">
|
|
56
|
+
{renderLabel()}
|
|
57
|
+
{renderDescription()}
|
|
58
|
+
</Box>
|
|
59
|
+
</Box>
|
|
60
|
+
|
|
61
|
+
{/* End accessory */}
|
|
62
|
+
{endAccessory && <Box>{endAccessory}</Box>}
|
|
63
|
+
</Box>
|
|
64
|
+
</Pressable>);
|
|
65
|
+
};
|
|
66
|
+
//# sourceMappingURL=ActionListItem.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.mjs","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,6CAA6C;AACnE,OAAO,QAAO,EAAE,WAAW,EAAE,cAAc;;AAC3C,OAAO,EAAE,SAAS,EAAE,8BAAqB;AAEzC,OAAO,EACL,GAAG,EACH,aAAa,EACb,gBAAgB,EAChB,iBAAiB,EAClB,yBAAe;AAChB,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,0BAAgB;AACzC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,0BAAgB;AAIvD,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,KAAK,EACL,WAAW,EACX,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,cAAc,EACd,oBAAoB,EACpB,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,OAAO,EACP,cAAc,EACd,WAAW,EACX,KAAK,EACL,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;YAC7B,OAAO,CACL,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,IAAI,cAAc,CAAC,CACpD;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,IAAI,CAAC,CACR,CAAC;SACH;QACD,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC7B,IAAI,CAAC,WAAW,EAAE;YAChB,OAAO,IAAI,CAAC;SACb;QAED,IAAI,OAAO,WAAW,KAAK,QAAQ,EAAE;YACnC,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAC5B,KAAK,CAAC,CAAC,SAAS,CAAC,eAAe,CAAC,CACjC,IAAI,oBAAoB,CAAC,CAEzB;UAAA,CAAC,WAAW,CACd;QAAA,EAAE,IAAI,CAAC,CACR,CAAC;SACH;QACD,OAAO,WAAW,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,IAAI,cAAc,EAAE;YAClB,OAAO,cAAc,CAAC;SACvB;QAED,IAAI,QAAQ,EAAE;YACZ,OAAO,CACL,CAAC,GAAG,CACF,UAAU,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CACjC,cAAc,CAAC,CAAC,iBAAiB,CAAC,MAAM,CAAC,CACzC,WAAW,CAAC,KAAK,CAEjB;UAAA,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,SAAS,CAAC,EACzD;QAAA,EAAE,GAAG,CAAC,CACP,CAAC;SACH;QAED,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,EAAE,OAAO,EAAwB,EAAE,EAAE;QACpC,MAAM,SAAS,GAAG,EAAE,CAAC,KAAK,CACxB,sBAAsB,EACtB,OAAO,IAAI,CAAC,UAAU,IAAI,oBAAoB,EAC9C,UAAU,IAAI,YAAY,EAC1B,WAAW,CACZ,CAAC;QAEF,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAChD,CAAC,EACD,CAAC,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,CAAC,CACrC,CAAC;IAEF,OAAO,CACL,CAAC,SAAS,CACR,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,UAAU,CAAC,CACrB,KAAK,CAAC,CAAC,iBAAiB,CAAC,CACzB,IAAI,cAAc,CAAC,CACnB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CACjC,cAAc,CAAC,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAC1C,GAAG,CAAC,CAAC,CAAC,CAAC,CAEP;QAAA,CAAC,kEAAkE,CACnE;QAAA,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAChC,WAAW,CAAC,QAAQ,CACpB,GAAG,CAAC,CAAC,CAAC,CAAC,CAEP;UAAA,CAAC,kBAAkB,EAAE,CACrB;UAAA,CAAC,GAAG,CAAC,WAAW,CAAC,QAAQ,CACvB;YAAA,CAAC,WAAW,EAAE,CACd;YAAA,CAAC,iBAAiB,EAAE,CACtB;UAAA,EAAE,GAAG,CACP;QAAA,EAAE,GAAG,CAEL;;QAAA,CAAC,mBAAmB,CACpB;QAAA,CAAC,YAAY,IAAI,CAAC,GAAG,CAAC,CAAC,YAAY,CAAC,EAAE,GAAG,CAAC,CAC5C;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,SAAS,CAAC,CACb,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React, { useCallback } from 'react';\nimport { Pressable } from 'react-native';\n\nimport {\n Box,\n BoxAlignItems,\n BoxFlexDirection,\n BoxJustifyContent,\n} from '../Box';\nimport { Icon, IconSize } from '../Icon';\nimport { Text, TextColor, TextVariant } from '../Text';\n\nimport type { ActionListItemProps } from './ActionListItem.types';\n\nexport const ActionListItem: React.FC<ActionListItemProps> = ({\n label,\n description,\n startAccessory,\n endAccessory,\n iconName,\n labelTextProps,\n descriptionTextProps,\n iconProps,\n isDisabled = false,\n onPress,\n pressableProps,\n twClassName,\n style,\n ...props\n}) => {\n const tw = useTailwind();\n\n const renderLabel = () => {\n if (typeof label === 'string') {\n return (\n <Text variant={TextVariant.BodyMd} {...labelTextProps}>\n {label}\n </Text>\n );\n }\n return label;\n };\n\n const renderDescription = () => {\n if (!description) {\n return null;\n }\n\n if (typeof description === 'string') {\n return (\n <Text\n variant={TextVariant.BodySm}\n color={TextColor.TextAlternative}\n {...descriptionTextProps}\n >\n {description}\n </Text>\n );\n }\n return description;\n };\n\n const renderStartContent = () => {\n if (startAccessory) {\n return startAccessory;\n }\n\n if (iconName) {\n return (\n <Box\n alignItems={BoxAlignItems.Center}\n justifyContent={BoxJustifyContent.Center}\n twClassName=\"h-6\"\n >\n <Icon name={iconName} size={IconSize.Md} {...iconProps} />\n </Box>\n );\n }\n\n return null;\n };\n\n const getPressableStyle = useCallback(\n ({ pressed }: { pressed: boolean }) => {\n const baseStyle = tw.style(\n 'bg-default px-4 py-3',\n pressed && !isDisabled && 'bg-default-pressed',\n isDisabled && 'opacity-50',\n twClassName,\n );\n\n return style ? [baseStyle, style] : baseStyle;\n },\n [tw, isDisabled, twClassName, style],\n );\n\n return (\n <Pressable\n onPress={onPress}\n disabled={isDisabled}\n style={getPressableStyle}\n {...pressableProps}\n {...props}\n >\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Center}\n justifyContent={BoxJustifyContent.Between}\n gap={4}\n >\n {/* Left side content (start accessory/icon + label/description) */}\n <Box\n flexDirection={BoxFlexDirection.Row}\n alignItems={BoxAlignItems.Start}\n twClassName=\"flex-1\"\n gap={4}\n >\n {renderStartContent()}\n <Box twClassName=\"flex-1\">\n {renderLabel()}\n {renderDescription()}\n </Box>\n </Box>\n\n {/* End accessory */}\n {endAccessory && <Box>{endAccessory}</Box>}\n </Box>\n </Pressable>\n );\n};\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.types.cjs","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode } from 'react';\nimport type { PressableProps, ViewProps } from 'react-native';\n\nimport type { IconName, IconProps } from '../Icon';\nimport type { TextProps } from '../Text';\n\n/**\n * ActionListItem component props.\n *\n * Extends `ViewProps` so the root Pressable inherits standard React Native\n * props such as `testID` and `accessibilityLabel`. The `onPress` callback\n * is a top-level prop, while `pressableProps` provides additional\n * Pressable-specific overrides.\n */\nexport type ActionListItemProps = {\n /**\n * Label for the list item — can be a string or React node.\n * When a string, it is wrapped in a Text component with default styling.\n * When a ReactNode, it is rendered as-is and `labelTextProps` is ignored.\n */\n label: string | ReactNode;\n /**\n * Optional description for the list item — can be a string or React node.\n * When a string, it is wrapped in a Text component with default styling.\n * When a ReactNode, it is rendered as-is and `descriptionTextProps` is ignored.\n */\n description?: string | ReactNode;\n /**\n * Optional start accessory (left side) — React node.\n * Takes priority over `iconName` when both are provided.\n */\n startAccessory?: ReactNode;\n /**\n * Optional end accessory (right side) — React node.\n */\n endAccessory?: ReactNode;\n /**\n * Optional icon name from the design system icon library.\n * Renders an icon with `IconSize.Md`. Ignored when `startAccessory` is provided.\n */\n iconName?: IconName;\n /**\n * Optional props spread to the label Text component (only when label is a string).\n */\n labelTextProps?: Partial<TextProps>;\n /**\n * Optional props spread to the description Text component (only when description is a string).\n */\n descriptionTextProps?: Partial<TextProps>;\n /**\n * Optional props spread to the Icon component (only when iconName is provided).\n */\n iconProps?: Partial<IconProps>;\n /**\n * Whether the list item is disabled.\n * When true, applies 50% opacity and disables interactions.\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional callback when the list item is pressed.\n */\n onPress?: PressableProps['onPress'];\n /**\n * Optional props to pass to the underlying Pressable.\n * Use this for Pressable-specific props such as testID for the interactive element.\n */\n pressableProps?: Omit<PressableProps, 'onPress' | 'disabled' | 'style'>;\n /**\n * Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n} & Omit<ViewProps, 'children'>;\n"]}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
import type { PressableProps, ViewProps } from "react-native/index.js";
|
|
3
|
+
import type { IconName, IconProps } from "../Icon/index.cjs";
|
|
4
|
+
import type { TextProps } from "../Text/index.cjs";
|
|
5
|
+
/**
|
|
6
|
+
* ActionListItem component props.
|
|
7
|
+
*
|
|
8
|
+
* Extends `ViewProps` so the root Pressable inherits standard React Native
|
|
9
|
+
* props such as `testID` and `accessibilityLabel`. The `onPress` callback
|
|
10
|
+
* is a top-level prop, while `pressableProps` provides additional
|
|
11
|
+
* Pressable-specific overrides.
|
|
12
|
+
*/
|
|
13
|
+
export type ActionListItemProps = {
|
|
14
|
+
/**
|
|
15
|
+
* Label for the list item — can be a string or React node.
|
|
16
|
+
* When a string, it is wrapped in a Text component with default styling.
|
|
17
|
+
* When a ReactNode, it is rendered as-is and `labelTextProps` is ignored.
|
|
18
|
+
*/
|
|
19
|
+
label: string | ReactNode;
|
|
20
|
+
/**
|
|
21
|
+
* Optional description for the list item — can be a string or React node.
|
|
22
|
+
* When a string, it is wrapped in a Text component with default styling.
|
|
23
|
+
* When a ReactNode, it is rendered as-is and `descriptionTextProps` is ignored.
|
|
24
|
+
*/
|
|
25
|
+
description?: string | ReactNode;
|
|
26
|
+
/**
|
|
27
|
+
* Optional start accessory (left side) — React node.
|
|
28
|
+
* Takes priority over `iconName` when both are provided.
|
|
29
|
+
*/
|
|
30
|
+
startAccessory?: ReactNode;
|
|
31
|
+
/**
|
|
32
|
+
* Optional end accessory (right side) — React node.
|
|
33
|
+
*/
|
|
34
|
+
endAccessory?: ReactNode;
|
|
35
|
+
/**
|
|
36
|
+
* Optional icon name from the design system icon library.
|
|
37
|
+
* Renders an icon with `IconSize.Md`. Ignored when `startAccessory` is provided.
|
|
38
|
+
*/
|
|
39
|
+
iconName?: IconName;
|
|
40
|
+
/**
|
|
41
|
+
* Optional props spread to the label Text component (only when label is a string).
|
|
42
|
+
*/
|
|
43
|
+
labelTextProps?: Partial<TextProps>;
|
|
44
|
+
/**
|
|
45
|
+
* Optional props spread to the description Text component (only when description is a string).
|
|
46
|
+
*/
|
|
47
|
+
descriptionTextProps?: Partial<TextProps>;
|
|
48
|
+
/**
|
|
49
|
+
* Optional props spread to the Icon component (only when iconName is provided).
|
|
50
|
+
*/
|
|
51
|
+
iconProps?: Partial<IconProps>;
|
|
52
|
+
/**
|
|
53
|
+
* Whether the list item is disabled.
|
|
54
|
+
* When true, applies 50% opacity and disables interactions.
|
|
55
|
+
*
|
|
56
|
+
* @default false
|
|
57
|
+
*/
|
|
58
|
+
isDisabled?: boolean;
|
|
59
|
+
/**
|
|
60
|
+
* Optional callback when the list item is pressed.
|
|
61
|
+
*/
|
|
62
|
+
onPress?: PressableProps['onPress'];
|
|
63
|
+
/**
|
|
64
|
+
* Optional props to pass to the underlying Pressable.
|
|
65
|
+
* Use this for Pressable-specific props such as testID for the interactive element.
|
|
66
|
+
*/
|
|
67
|
+
pressableProps?: Omit<PressableProps, 'onPress' | 'disabled' | 'style'>;
|
|
68
|
+
/**
|
|
69
|
+
* Optional prop to add twrnc overriding classNames.
|
|
70
|
+
*/
|
|
71
|
+
twClassName?: string;
|
|
72
|
+
} & Omit<ViewProps, 'children'>;
|
|
73
|
+
//# sourceMappingURL=ActionListItem.types.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.types.d.cts","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,8BAAqB;AAE9D,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;;;;;;GAOG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC;;;;OAIG;IACH,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1C;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC;;;OAGG;IACH,cAAc,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC,CAAC;IACxE;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
import type { PressableProps, ViewProps } from "react-native/index.js";
|
|
3
|
+
import type { IconName, IconProps } from "../Icon/index.mjs";
|
|
4
|
+
import type { TextProps } from "../Text/index.mjs";
|
|
5
|
+
/**
|
|
6
|
+
* ActionListItem component props.
|
|
7
|
+
*
|
|
8
|
+
* Extends `ViewProps` so the root Pressable inherits standard React Native
|
|
9
|
+
* props such as `testID` and `accessibilityLabel`. The `onPress` callback
|
|
10
|
+
* is a top-level prop, while `pressableProps` provides additional
|
|
11
|
+
* Pressable-specific overrides.
|
|
12
|
+
*/
|
|
13
|
+
export type ActionListItemProps = {
|
|
14
|
+
/**
|
|
15
|
+
* Label for the list item — can be a string or React node.
|
|
16
|
+
* When a string, it is wrapped in a Text component with default styling.
|
|
17
|
+
* When a ReactNode, it is rendered as-is and `labelTextProps` is ignored.
|
|
18
|
+
*/
|
|
19
|
+
label: string | ReactNode;
|
|
20
|
+
/**
|
|
21
|
+
* Optional description for the list item — can be a string or React node.
|
|
22
|
+
* When a string, it is wrapped in a Text component with default styling.
|
|
23
|
+
* When a ReactNode, it is rendered as-is and `descriptionTextProps` is ignored.
|
|
24
|
+
*/
|
|
25
|
+
description?: string | ReactNode;
|
|
26
|
+
/**
|
|
27
|
+
* Optional start accessory (left side) — React node.
|
|
28
|
+
* Takes priority over `iconName` when both are provided.
|
|
29
|
+
*/
|
|
30
|
+
startAccessory?: ReactNode;
|
|
31
|
+
/**
|
|
32
|
+
* Optional end accessory (right side) — React node.
|
|
33
|
+
*/
|
|
34
|
+
endAccessory?: ReactNode;
|
|
35
|
+
/**
|
|
36
|
+
* Optional icon name from the design system icon library.
|
|
37
|
+
* Renders an icon with `IconSize.Md`. Ignored when `startAccessory` is provided.
|
|
38
|
+
*/
|
|
39
|
+
iconName?: IconName;
|
|
40
|
+
/**
|
|
41
|
+
* Optional props spread to the label Text component (only when label is a string).
|
|
42
|
+
*/
|
|
43
|
+
labelTextProps?: Partial<TextProps>;
|
|
44
|
+
/**
|
|
45
|
+
* Optional props spread to the description Text component (only when description is a string).
|
|
46
|
+
*/
|
|
47
|
+
descriptionTextProps?: Partial<TextProps>;
|
|
48
|
+
/**
|
|
49
|
+
* Optional props spread to the Icon component (only when iconName is provided).
|
|
50
|
+
*/
|
|
51
|
+
iconProps?: Partial<IconProps>;
|
|
52
|
+
/**
|
|
53
|
+
* Whether the list item is disabled.
|
|
54
|
+
* When true, applies 50% opacity and disables interactions.
|
|
55
|
+
*
|
|
56
|
+
* @default false
|
|
57
|
+
*/
|
|
58
|
+
isDisabled?: boolean;
|
|
59
|
+
/**
|
|
60
|
+
* Optional callback when the list item is pressed.
|
|
61
|
+
*/
|
|
62
|
+
onPress?: PressableProps['onPress'];
|
|
63
|
+
/**
|
|
64
|
+
* Optional props to pass to the underlying Pressable.
|
|
65
|
+
* Use this for Pressable-specific props such as testID for the interactive element.
|
|
66
|
+
*/
|
|
67
|
+
pressableProps?: Omit<PressableProps, 'onPress' | 'disabled' | 'style'>;
|
|
68
|
+
/**
|
|
69
|
+
* Optional prop to add twrnc overriding classNames.
|
|
70
|
+
*/
|
|
71
|
+
twClassName?: string;
|
|
72
|
+
} & Omit<ViewProps, 'children'>;
|
|
73
|
+
//# sourceMappingURL=ActionListItem.types.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.types.d.mts","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,8BAAqB;AAE9D,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;;;;;;GAOG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC;;;;OAIG;IACH,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1C;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC;;;OAGG;IACH,cAAc,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC,CAAC;IACxE;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionListItem.types.mjs","sourceRoot":"","sources":["../../../src/components/ActionListItem/ActionListItem.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode } from 'react';\nimport type { PressableProps, ViewProps } from 'react-native';\n\nimport type { IconName, IconProps } from '../Icon';\nimport type { TextProps } from '../Text';\n\n/**\n * ActionListItem component props.\n *\n * Extends `ViewProps` so the root Pressable inherits standard React Native\n * props such as `testID` and `accessibilityLabel`. The `onPress` callback\n * is a top-level prop, while `pressableProps` provides additional\n * Pressable-specific overrides.\n */\nexport type ActionListItemProps = {\n /**\n * Label for the list item — can be a string or React node.\n * When a string, it is wrapped in a Text component with default styling.\n * When a ReactNode, it is rendered as-is and `labelTextProps` is ignored.\n */\n label: string | ReactNode;\n /**\n * Optional description for the list item — can be a string or React node.\n * When a string, it is wrapped in a Text component with default styling.\n * When a ReactNode, it is rendered as-is and `descriptionTextProps` is ignored.\n */\n description?: string | ReactNode;\n /**\n * Optional start accessory (left side) — React node.\n * Takes priority over `iconName` when both are provided.\n */\n startAccessory?: ReactNode;\n /**\n * Optional end accessory (right side) — React node.\n */\n endAccessory?: ReactNode;\n /**\n * Optional icon name from the design system icon library.\n * Renders an icon with `IconSize.Md`. Ignored when `startAccessory` is provided.\n */\n iconName?: IconName;\n /**\n * Optional props spread to the label Text component (only when label is a string).\n */\n labelTextProps?: Partial<TextProps>;\n /**\n * Optional props spread to the description Text component (only when description is a string).\n */\n descriptionTextProps?: Partial<TextProps>;\n /**\n * Optional props spread to the Icon component (only when iconName is provided).\n */\n iconProps?: Partial<IconProps>;\n /**\n * Whether the list item is disabled.\n * When true, applies 50% opacity and disables interactions.\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional callback when the list item is pressed.\n */\n onPress?: PressableProps['onPress'];\n /**\n * Optional props to pass to the underlying Pressable.\n * Use this for Pressable-specific props such as testID for the interactive element.\n */\n pressableProps?: Omit<PressableProps, 'onPress' | 'disabled' | 'style'>;\n /**\n * Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n} & Omit<ViewProps, 'children'>;\n"]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ActionListItem = void 0;
|
|
4
|
+
var ActionListItem_1 = require("./ActionListItem.cjs");
|
|
5
|
+
Object.defineProperty(exports, "ActionListItem", { enumerable: true, get: function () { return ActionListItem_1.ActionListItem; } });
|
|
6
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ActionListItem/index.ts"],"names":[],"mappings":";;;AAAA,uDAAkD;AAAzC,gHAAA,cAAc,OAAA","sourcesContent":["export { ActionListItem } from './ActionListItem';\nexport type { ActionListItemProps } from './ActionListItem.types';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ActionListItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,6BAAyB;AAClD,YAAY,EAAE,mBAAmB,EAAE,mCAA+B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ActionListItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,6BAAyB;AAClD,YAAY,EAAE,mBAAmB,EAAE,mCAA+B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ActionListItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,6BAAyB","sourcesContent":["export { ActionListItem } from './ActionListItem';\nexport type { ActionListItemProps } from './ActionListItem.types';\n"]}
|
|
@@ -4,19 +4,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.BadgeCount = void 0;
|
|
7
|
+
const design_system_shared_1 = require("@metamask/design-system-shared");
|
|
7
8
|
const design_system_twrnc_preset_1 = require("@metamask/design-system-twrnc-preset");
|
|
8
9
|
const react_1 = __importDefault(require("react"));
|
|
9
10
|
const react_native_1 = require("react-native/index.js");
|
|
10
|
-
const types_1 = require("../../types/index.cjs");
|
|
11
11
|
const Text_1 = require("../Text/index.cjs");
|
|
12
12
|
const BadgeCount_constants_1 = require("./BadgeCount.constants.cjs");
|
|
13
|
-
const BadgeCount = ({ size =
|
|
13
|
+
const BadgeCount = ({ size = design_system_shared_1.BadgeCountSize.Md, count, max = 99, textProps, twClassName, style, ...props }) => {
|
|
14
14
|
const tw = (0, design_system_twrnc_preset_1.useTailwind)();
|
|
15
15
|
return (<react_native_1.View {...props} style={[
|
|
16
16
|
tw.style('bg-error-default rounded-lg items-center justify-center self-start', BadgeCount_constants_1.TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER[size], twClassName),
|
|
17
17
|
style,
|
|
18
18
|
]}>
|
|
19
|
-
<Text_1.Text variant={BadgeCount_constants_1.MAP_BADGECOUNT_SIZE_TEXTVARIANT[size]} color={Text_1.TextColor.ErrorInverse} fontWeight={Text_1.FontWeight.Medium} {...textProps} twClassName={
|
|
19
|
+
<Text_1.Text variant={BadgeCount_constants_1.MAP_BADGECOUNT_SIZE_TEXTVARIANT[size]} color={Text_1.TextColor.ErrorInverse} fontWeight={Text_1.FontWeight.Medium} {...textProps} twClassName={`leading-0 ${textProps?.twClassName || ''}`}>
|
|
20
20
|
{count > max ? `${max}+` : `${count}`}
|
|
21
21
|
</Text_1.Text>
|
|
22
22
|
</react_native_1.View>);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BadgeCount.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":";;;;;;AAAA,qFAAmE;AACnE,kDAA0B;AAC1B,wDAAoC;AAEpC,
|
|
1
|
+
{"version":3,"file":"BadgeCount.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAAgE;AAChE,qFAAmE;AACnE,kDAA0B;AAC1B,wDAAoC;AAEpC,4CAAsD;AAEtD,qEAGgC;AAGzB,MAAM,UAAU,GAAG,CAAC,EACzB,IAAI,GAAG,qCAAc,CAAC,EAAE,EACxB,KAAK,EACL,GAAG,GAAG,EAAE,EACR,SAAS,EACT,WAAW,EACX,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IAEzB,OAAO,CACL,CAAC,mBAAI,CACH,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CACN,oEAAoE,EACpE,2DAAoC,CAAC,IAAI,CAAC,EAC1C,WAAW,CACZ;YACD,KAAK;SACN,CAAC,CAEF;MAAA,CAAC,WAAI,CACH,OAAO,CAAC,CAAC,sDAA+B,CAAC,IAAI,CAAC,CAAC,CAC/C,KAAK,CAAC,CAAC,gBAAS,CAAC,YAAY,CAAC,CAC9B,UAAU,CAAC,CAAC,iBAAU,CAAC,MAAM,CAAC,CAC9B,IAAI,SAAS,CAAC,CACd,WAAW,CAAC,CAAC,aAAa,SAAS,EAAE,WAAW,IAAI,EAAE,EAAE,CAAC,CAEzD;QAAA,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,KAAK,EAAE,CACvC;MAAA,EAAE,WAAI,CACR;IAAA,EAAE,mBAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAlCW,QAAA,UAAU,cAkCrB","sourcesContent":["import { BadgeCountSize } from '@metamask/design-system-shared';\nimport { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport { Text, TextColor, FontWeight } from '../Text';\n\nimport {\n MAP_BADGECOUNT_SIZE_TEXTVARIANT,\n TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER,\n} from './BadgeCount.constants';\nimport type { BadgeCountProps } from './BadgeCount.types';\n\nexport const BadgeCount = ({\n size = BadgeCountSize.Md,\n count,\n max = 99,\n textProps,\n twClassName,\n style,\n ...props\n}: BadgeCountProps) => {\n const tw = useTailwind();\n\n return (\n <View\n {...props}\n style={[\n tw.style(\n 'bg-error-default rounded-lg items-center justify-center self-start',\n TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER[size],\n twClassName,\n ),\n style,\n ]}\n >\n <Text\n variant={MAP_BADGECOUNT_SIZE_TEXTVARIANT[size]}\n color={TextColor.ErrorInverse}\n fontWeight={FontWeight.Medium}\n {...textProps}\n twClassName={`leading-0 ${textProps?.twClassName || ''}`}\n >\n {count > max ? `${max}+` : `${count}`}\n </Text>\n </View>\n );\n};\n"]}
|
|
@@ -1,19 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER = exports.
|
|
4
|
-
const
|
|
3
|
+
exports.TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER = exports.MAP_BADGECOUNT_SIZE_TEXTVARIANT = void 0;
|
|
4
|
+
const design_system_shared_1 = require("@metamask/design-system-shared");
|
|
5
5
|
const Text_1 = require("../Text/index.cjs");
|
|
6
6
|
// Mappings
|
|
7
7
|
exports.MAP_BADGECOUNT_SIZE_TEXTVARIANT = {
|
|
8
|
-
[
|
|
9
|
-
[
|
|
10
|
-
};
|
|
11
|
-
exports.MAP_BADGECOUNT_SIZE_LINEHEIGHT = {
|
|
12
|
-
[types_1.BadgeCountSize.Md]: 'leading-[14px]',
|
|
13
|
-
[types_1.BadgeCountSize.Lg]: 'leading-4', // line-height 16px
|
|
8
|
+
[design_system_shared_1.BadgeCountSize.Md]: Text_1.TextVariant.BodyXs,
|
|
9
|
+
[design_system_shared_1.BadgeCountSize.Lg]: Text_1.TextVariant.BodySm,
|
|
14
10
|
};
|
|
15
11
|
exports.TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER = {
|
|
16
|
-
[
|
|
17
|
-
[
|
|
12
|
+
[design_system_shared_1.BadgeCountSize.Md]: 'min-w-4 h-4 px-1',
|
|
13
|
+
[design_system_shared_1.BadgeCountSize.Lg]: 'min-w-6 h-5 px-1.5', // min-width 24px, height 20px, padding-horizontal 6
|
|
18
14
|
};
|
|
19
15
|
//# sourceMappingURL=BadgeCount.constants.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BadgeCount.constants.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":";;;AAAA,
|
|
1
|
+
{"version":3,"file":"BadgeCount.constants.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":";;;AAAA,yEAAgE;AAEhE,4CAAsC;AAEtC,WAAW;AACE,QAAA,+BAA+B,GAGxC;IACF,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,kBAAW,CAAC,MAAM;IACvC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,kBAAW,CAAC,MAAM;CACxC,CAAC;AAEW,QAAA,oCAAoC,GAG7C;IACF,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,kBAAkB;IACvC,CAAC,qCAAc,CAAC,EAAE,CAAC,EAAE,oBAAoB,EAAE,oDAAoD;CAChG,CAAC","sourcesContent":["import { BadgeCountSize } from '@metamask/design-system-shared';\n\nimport { TextVariant } from '../Text';\n\n// Mappings\nexport const MAP_BADGECOUNT_SIZE_TEXTVARIANT: Record<\n BadgeCountSize,\n TextVariant\n> = {\n [BadgeCountSize.Md]: TextVariant.BodyXs,\n [BadgeCountSize.Lg]: TextVariant.BodySm,\n};\n\nexport const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER: Record<\n BadgeCountSize,\n string\n> = {\n [BadgeCountSize.Md]: 'min-w-4 h-4 px-1', // min-width 16px, height 14px, padding-horizontal 4\n [BadgeCountSize.Lg]: 'min-w-6 h-5 px-1.5', // min-width 24px, height 20px, padding-horizontal 6\n};\n"]}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { BadgeCountSize } from "
|
|
1
|
+
import { BadgeCountSize } from "@metamask/design-system-shared";
|
|
2
2
|
import { TextVariant } from "../Text/index.cjs";
|
|
3
3
|
export declare const MAP_BADGECOUNT_SIZE_TEXTVARIANT: Record<BadgeCountSize, TextVariant>;
|
|
4
|
-
export declare const MAP_BADGECOUNT_SIZE_LINEHEIGHT: Record<BadgeCountSize, string>;
|
|
5
4
|
export declare const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER: Record<BadgeCountSize, string>;
|
|
6
5
|
//# sourceMappingURL=BadgeCount.constants.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BadgeCount.constants.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,
|
|
1
|
+
{"version":3,"file":"BadgeCount.constants.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAEhE,OAAO,EAAE,WAAW,EAAE,0BAAgB;AAGtC,eAAO,MAAM,+BAA+B,EAAE,MAAM,CAClD,cAAc,EACd,WAAW,CAIZ,CAAC;AAEF,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,cAAc,EACd,MAAM,CAIP,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { BadgeCountSize } from "
|
|
1
|
+
import { BadgeCountSize } from "@metamask/design-system-shared";
|
|
2
2
|
import { TextVariant } from "../Text/index.mjs";
|
|
3
3
|
export declare const MAP_BADGECOUNT_SIZE_TEXTVARIANT: Record<BadgeCountSize, TextVariant>;
|
|
4
|
-
export declare const MAP_BADGECOUNT_SIZE_LINEHEIGHT: Record<BadgeCountSize, string>;
|
|
5
4
|
export declare const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER: Record<BadgeCountSize, string>;
|
|
6
5
|
//# sourceMappingURL=BadgeCount.constants.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BadgeCount.constants.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,
|
|
1
|
+
{"version":3,"file":"BadgeCount.constants.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAEhE,OAAO,EAAE,WAAW,EAAE,0BAAgB;AAGtC,eAAO,MAAM,+BAA+B,EAAE,MAAM,CAClD,cAAc,EACd,WAAW,CAIZ,CAAC;AAEF,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,cAAc,EACd,MAAM,CAIP,CAAC"}
|
|
@@ -1,16 +1,12 @@
|
|
|
1
|
-
import { BadgeCountSize } from "
|
|
1
|
+
import { BadgeCountSize } from "@metamask/design-system-shared";
|
|
2
2
|
import { TextVariant } from "../Text/index.mjs";
|
|
3
3
|
// Mappings
|
|
4
4
|
export const MAP_BADGECOUNT_SIZE_TEXTVARIANT = {
|
|
5
5
|
[BadgeCountSize.Md]: TextVariant.BodyXs,
|
|
6
6
|
[BadgeCountSize.Lg]: TextVariant.BodySm,
|
|
7
7
|
};
|
|
8
|
-
export const MAP_BADGECOUNT_SIZE_LINEHEIGHT = {
|
|
9
|
-
[BadgeCountSize.Md]: 'leading-[14px]',
|
|
10
|
-
[BadgeCountSize.Lg]: 'leading-4', // line-height 16px
|
|
11
|
-
};
|
|
12
8
|
export const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER = {
|
|
13
|
-
[BadgeCountSize.Md]: 'min-w-4 h-
|
|
14
|
-
[BadgeCountSize.Lg]: 'min-w-6 h-5
|
|
9
|
+
[BadgeCountSize.Md]: 'min-w-4 h-4 px-1',
|
|
10
|
+
[BadgeCountSize.Lg]: 'min-w-6 h-5 px-1.5', // min-width 24px, height 20px, padding-horizontal 6
|
|
15
11
|
};
|
|
16
12
|
//# sourceMappingURL=BadgeCount.constants.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BadgeCount.constants.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,
|
|
1
|
+
{"version":3,"file":"BadgeCount.constants.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAEhE,OAAO,EAAE,WAAW,EAAE,0BAAgB;AAEtC,WAAW;AACX,MAAM,CAAC,MAAM,+BAA+B,GAGxC;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,CAAC,MAAM;IACvC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,CAAC,MAAM;CACxC,CAAC;AAEF,MAAM,CAAC,MAAM,oCAAoC,GAG7C;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,kBAAkB;IACvC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,oBAAoB,EAAE,oDAAoD;CAChG,CAAC","sourcesContent":["import { BadgeCountSize } from '@metamask/design-system-shared';\n\nimport { TextVariant } from '../Text';\n\n// Mappings\nexport const MAP_BADGECOUNT_SIZE_TEXTVARIANT: Record<\n BadgeCountSize,\n TextVariant\n> = {\n [BadgeCountSize.Md]: TextVariant.BodyXs,\n [BadgeCountSize.Lg]: TextVariant.BodySm,\n};\n\nexport const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER: Record<\n BadgeCountSize,\n string\n> = {\n [BadgeCountSize.Md]: 'min-w-4 h-4 px-1', // min-width 16px, height 14px, padding-horizontal 4\n [BadgeCountSize.Lg]: 'min-w-6 h-5 px-1.5', // min-width 24px, height 20px, padding-horizontal 6\n};\n"]}
|