@metamask-previews/design-system-react 0.4.0-preview.6197867 → 0.5.0-preview.23d2c11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +19 -1
- package/dist/components/AvatarBase/AvatarBase.cjs +1 -1
- package/dist/components/AvatarBase/AvatarBase.cjs.map +1 -1
- package/dist/components/AvatarBase/AvatarBase.mjs +1 -1
- package/dist/components/AvatarBase/AvatarBase.mjs.map +1 -1
- package/dist/components/Box/Box.cjs +4 -2
- package/dist/components/Box/Box.cjs.map +1 -1
- package/dist/components/Box/Box.d.cts.map +1 -1
- package/dist/components/Box/Box.d.mts.map +1 -1
- package/dist/components/Box/Box.mjs +4 -2
- package/dist/components/Box/Box.mjs.map +1 -1
- package/dist/components/Box/Box.types.cjs.map +1 -1
- package/dist/components/Box/Box.types.d.cts +7 -0
- package/dist/components/Box/Box.types.d.cts.map +1 -1
- package/dist/components/Box/Box.types.d.mts +7 -0
- package/dist/components/Box/Box.types.d.mts.map +1 -1
- package/dist/components/Box/Box.types.mjs.map +1 -1
- package/package.json +7 -12
- package/dist/types/make-props-optional.cjs +0 -3
- package/dist/types/make-props-optional.cjs.map +0 -1
- package/dist/types/make-props-optional.d.cts +0 -4
- package/dist/types/make-props-optional.d.cts.map +0 -1
- package/dist/types/make-props-optional.d.mts +0 -4
- package/dist/types/make-props-optional.d.mts.map +0 -1
- package/dist/types/make-props-optional.mjs +0 -2
- package/dist/types/make-props-optional.mjs.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,21 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
7
7
|
|
|
8
8
|
## [Unreleased]
|
|
9
9
|
|
|
10
|
+
## [0.5.0]
|
|
11
|
+
|
|
12
|
+
### Added
|
|
13
|
+
|
|
14
|
+
- Added `asChild` functionality to Box component ([#834](https://github.com/MetaMask/metamask-design-system/pull/834))
|
|
15
|
+
|
|
16
|
+
## [0.4.1]
|
|
17
|
+
|
|
18
|
+
### Fixed
|
|
19
|
+
|
|
20
|
+
- Removed unnecessary peer dependencies ([#828](https://github.com/MetaMask/metamask-design-system/pull/828))
|
|
21
|
+
- Bump @metamask/utils from 11.7.0 to 11.8.0 ([#827](https://github.com/MetaMask/metamask-design-system/pull/827))
|
|
22
|
+
- Bump npm and yarn dependencies ([#829](https://github.com/MetaMask/metamask-design-system/pull/829))
|
|
23
|
+
- Bump vite from 5.4.19 to 5.4.20 ([#826](https://github.com/MetaMask/metamask-design-system/pull/826))
|
|
24
|
+
|
|
10
25
|
## [0.4.0]
|
|
11
26
|
|
|
12
27
|
### Added
|
|
@@ -15,6 +30,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
15
30
|
|
|
16
31
|
### Fixed
|
|
17
32
|
|
|
33
|
+
- Fixed Avatar components shrinking in flex layouts ([#825](https://github.com/MetaMask/metamask-design-system/pull/825))
|
|
18
34
|
- Jazzicon, Blockies and Maskicon icon generation for CAIP-10 addresses ([#816](https://github.com/MetaMask/metamask-design-system/pull/816))
|
|
19
35
|
|
|
20
36
|
## [0.3.1]
|
|
@@ -79,7 +95,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
79
95
|
- Full TypeScript support with type definitions and enums
|
|
80
96
|
- Tailwind CSS integration with design token support
|
|
81
97
|
|
|
82
|
-
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.
|
|
98
|
+
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.5.0...HEAD
|
|
99
|
+
[0.5.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.4.1...@metamask/design-system-react@0.5.0
|
|
100
|
+
[0.4.1]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.4.0...@metamask/design-system-react@0.4.1
|
|
83
101
|
[0.4.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.3.1...@metamask/design-system-react@0.4.0
|
|
84
102
|
[0.3.1]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.3.0...@metamask/design-system-react@0.3.1
|
|
85
103
|
[0.3.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react@0.2.0...@metamask/design-system-react@0.3.0
|
|
@@ -34,7 +34,7 @@ exports.AvatarBase = (0, react_1.forwardRef)(({ children, fallbackText, fallback
|
|
|
34
34
|
const Component = asChild ? react_slot_1.Slot : 'div';
|
|
35
35
|
const mergedClassName = (0, tw_merge_1.twMerge)(
|
|
36
36
|
// Base styles
|
|
37
|
-
'inline-flex
|
|
37
|
+
'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section', shape === types_1.AvatarBaseShape.Circle
|
|
38
38
|
? 'rounded-full'
|
|
39
39
|
: AvatarBase_constants_1.TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE[size],
|
|
40
40
|
// Size
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qDAA4C;AAC5C,+CAA0C;AAE1C,iDAA8D;AAC9D,uDAA+C;AAC/C,4CAAmE;AAEnE,qEAKgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,KAAK,GAAG,uBAAe,CAAC,MAAM,EAC9B,OAAO,EACP,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,MAAM,eAAe,GAAG,IAAA,kBAAO;IAC7B,cAAc;IACd,
|
|
1
|
+
{"version":3,"file":"AvatarBase.cjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qDAA4C;AAC5C,+CAA0C;AAE1C,iDAA8D;AAC9D,uDAA+C;AAC/C,4CAAmE;AAEnE,qEAKgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,KAAK,GAAG,uBAAe,CAAC,MAAM,EAC9B,OAAO,EACP,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,MAAM,eAAe,GAAG,IAAA,kBAAO;IAC7B,cAAc;IACd,6EAA6E,EAC7E,KAAK,KAAK,uBAAe,CAAC,MAAM;QAC9B,CAAC,CAAC,cAAc;QAChB,CAAC,CAAC,sEAA+C,CAAC,IAAI,CAAC;IACzD,OAAO;IACP,SAAS;QACP,CAAC,CAAC,qEAA8C,CAAC,IAAI,CAAC;QACtD,CAAC,CAAC,2DAAoC,CAAC,IAAI,CAAC;IAC9C,SAAS;IACT,SAAS,IAAI,wDAAiC,CAAC,IAAI,CAAC;IACpD,iBAAiB;IACjB,SAAS,CACV,CAAC;IAEF,OAAO,CACL,8BAAC,SAAS,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,IACrE,YAAY,CAAC,CAAC,CAAC,CACd,8BAAC,WAAI,IACH,OAAO,EAAE,kBAAW,CAAC,MAAM,EAC3B,UAAU,EAAE,iBAAU,CAAC,MAAM,EAC7B,KAAK,EAAE,gBAAS,CAAC,SAAS,EAC1B,OAAO,QACP,SAAS,EAAC,WAAW,KACjB,iBAAiB;QAGrB,4CAAO,YAAY,CAAQ,CACtB,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACS,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef } from 'react';\n\nimport { AvatarBaseSize, AvatarBaseShape } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { Text, FontWeight, TextVariant, TextColor } from '../Text';\n\nimport {\n TWCLASSMAP_AVATARBASE_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE,\n TWCLASSMAP_AVATARBASE_SIZE_BORDER,\n} from './AvatarBase.constants';\nimport type { AvatarBaseProps } from './AvatarBase.types';\n\nexport const AvatarBase = forwardRef<HTMLDivElement, AvatarBaseProps>(\n (\n {\n children,\n fallbackText,\n fallbackTextProps,\n className,\n size = AvatarBaseSize.Md,\n shape = AvatarBaseShape.Circle,\n asChild,\n style,\n hasBorder = false,\n ...props\n },\n ref,\n ) => {\n const Component = asChild ? Slot : 'div';\n\n const mergedClassName = twMerge(\n // Base styles\n 'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section',\n shape === AvatarBaseShape.Circle\n ? 'rounded-full'\n : TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE[size],\n // Size\n hasBorder\n ? TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION[size]\n : TWCLASSMAP_AVATARBASE_SIZE_DIMENSION[size],\n // Border\n hasBorder && TWCLASSMAP_AVATARBASE_SIZE_BORDER[size],\n // Custom classes\n className,\n );\n\n return (\n <Component ref={ref} className={mergedClassName} style={style} {...props}>\n {fallbackText ? (\n <Text\n variant={TextVariant.BodySm}\n fontWeight={FontWeight.Medium}\n color={TextColor.TextMuted}\n asChild\n className=\"uppercase\"\n {...fallbackTextProps}\n >\n {/* asChild prop renders Text component as a span, it does not create an additional element */}\n <span>{fallbackText}</span>\n </Text>\n ) : (\n children\n )}\n </Component>\n );\n },\n);\n\nAvatarBase.displayName = 'AvatarBase';\n"]}
|
|
@@ -15,7 +15,7 @@ export const AvatarBase = forwardRef(({ children, fallbackText, fallbackTextProp
|
|
|
15
15
|
const Component = asChild ? Slot : 'div';
|
|
16
16
|
const mergedClassName = twMerge(
|
|
17
17
|
// Base styles
|
|
18
|
-
'inline-flex
|
|
18
|
+
'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section', shape === AvatarBaseShape.Circle
|
|
19
19
|
? 'rounded-full'
|
|
20
20
|
: TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE[size],
|
|
21
21
|
// Size
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarBase.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,6BAA6B;AAC5C,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,8BAAoB;AAC9D,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,SAAS,EAAE,0BAAgB;AAEnE,OAAO,EACL,oCAAoC,EACpC,8CAA8C,EAC9C,+CAA+C,EAC/C,iCAAiC,EAClC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,KAAK,GAAG,eAAe,CAAC,MAAM,EAC9B,OAAO,EACP,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,MAAM,eAAe,GAAG,OAAO;IAC7B,cAAc;IACd,
|
|
1
|
+
{"version":3,"file":"AvatarBase.mjs","sourceRoot":"","sources":["../../../src/components/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,6BAA6B;AAC5C,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,8BAAoB;AAC9D,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,SAAS,EAAE,0BAAgB;AAEnE,OAAO,EACL,oCAAoC,EACpC,8CAA8C,EAC9C,+CAA+C,EAC/C,iCAAiC,EAClC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,KAAK,GAAG,eAAe,CAAC,MAAM,EAC9B,OAAO,EACP,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,MAAM,eAAe,GAAG,OAAO;IAC7B,cAAc;IACd,6EAA6E,EAC7E,KAAK,KAAK,eAAe,CAAC,MAAM;QAC9B,CAAC,CAAC,cAAc;QAChB,CAAC,CAAC,+CAA+C,CAAC,IAAI,CAAC;IACzD,OAAO;IACP,SAAS;QACP,CAAC,CAAC,8CAA8C,CAAC,IAAI,CAAC;QACtD,CAAC,CAAC,oCAAoC,CAAC,IAAI,CAAC;IAC9C,SAAS;IACT,SAAS,IAAI,iCAAiC,CAAC,IAAI,CAAC;IACpD,iBAAiB;IACjB,SAAS,CACV,CAAC;IAEF,OAAO,CACL,oBAAC,SAAS,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,KAAM,KAAK,IACrE,YAAY,CAAC,CAAC,CAAC,CACd,oBAAC,IAAI,IACH,OAAO,EAAE,WAAW,CAAC,MAAM,EAC3B,UAAU,EAAE,UAAU,CAAC,MAAM,EAC7B,KAAK,EAAE,SAAS,CAAC,SAAS,EAC1B,OAAO,QACP,SAAS,EAAC,WAAW,KACjB,iBAAiB;QAGrB,kCAAO,YAAY,CAAQ,CACtB,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACS,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef } from 'react';\n\nimport { AvatarBaseSize, AvatarBaseShape } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { Text, FontWeight, TextVariant, TextColor } from '../Text';\n\nimport {\n TWCLASSMAP_AVATARBASE_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION,\n TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE,\n TWCLASSMAP_AVATARBASE_SIZE_BORDER,\n} from './AvatarBase.constants';\nimport type { AvatarBaseProps } from './AvatarBase.types';\n\nexport const AvatarBase = forwardRef<HTMLDivElement, AvatarBaseProps>(\n (\n {\n children,\n fallbackText,\n fallbackTextProps,\n className,\n size = AvatarBaseSize.Md,\n shape = AvatarBaseShape.Circle,\n asChild,\n style,\n hasBorder = false,\n ...props\n },\n ref,\n ) => {\n const Component = asChild ? Slot : 'div';\n\n const mergedClassName = twMerge(\n // Base styles\n 'inline-flex shrink-0 items-center justify-center overflow-hidden bg-section',\n shape === AvatarBaseShape.Circle\n ? 'rounded-full'\n : TWCLASSMAP_AVATARBASE_SIZE_BORDERRADIUSS_SQUARE[size],\n // Size\n hasBorder\n ? TWCLASSMAP_AVATARBASE_HASBORDER_SIZE_DIMENSION[size]\n : TWCLASSMAP_AVATARBASE_SIZE_DIMENSION[size],\n // Border\n hasBorder && TWCLASSMAP_AVATARBASE_SIZE_BORDER[size],\n // Custom classes\n className,\n );\n\n return (\n <Component ref={ref} className={mergedClassName} style={style} {...props}>\n {fallbackText ? (\n <Text\n variant={TextVariant.BodySm}\n fontWeight={FontWeight.Medium}\n color={TextColor.TextMuted}\n asChild\n className=\"uppercase\"\n {...fallbackTextProps}\n >\n {/* asChild prop renders Text component as a span, it does not create an additional element */}\n <span>{fallbackText}</span>\n </Text>\n ) : (\n children\n )}\n </Component>\n );\n },\n);\n\nAvatarBase.displayName = 'AvatarBase';\n"]}
|
|
@@ -24,10 +24,12 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
24
24
|
};
|
|
25
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
26
|
exports.Box = void 0;
|
|
27
|
+
const react_slot_1 = require("@radix-ui/react-slot");
|
|
27
28
|
const react_1 = __importStar(require("react"));
|
|
28
29
|
const tw_merge_1 = require("../../utils/tw-merge.cjs");
|
|
29
30
|
const Box_constants_1 = require("./Box.constants.cjs");
|
|
30
|
-
exports.Box = (0, react_1.forwardRef)(({ flexDirection, flexWrap, gap, alignItems, justifyContent, margin, marginTop, marginRight, marginBottom, marginLeft, marginHorizontal, marginVertical, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, paddingHorizontal, paddingVertical, borderWidth, borderColor, backgroundColor, className = '', style, children, ...props }, ref) => {
|
|
31
|
+
exports.Box = (0, react_1.forwardRef)(({ flexDirection, flexWrap, gap, alignItems, justifyContent, margin, marginTop, marginRight, marginBottom, marginLeft, marginHorizontal, marginVertical, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, paddingHorizontal, paddingVertical, borderWidth, borderColor, backgroundColor, className = '', style, asChild, children, ...props }, ref) => {
|
|
32
|
+
const Component = asChild ? react_slot_1.Slot : 'div';
|
|
31
33
|
const mergedClassName = (0, tw_merge_1.twMerge)(flexDirection ? 'flex' : '', flexDirection, flexWrap, gap !== undefined ? Box_constants_1.TWCLASSMAP_BOX_GAP[gap] : '', alignItems, justifyContent, margin !== undefined ? Box_constants_1.TWCLASSMAP_BOX_MARGIN[margin] : '', marginTop !== undefined ? Box_constants_1.TWCLASSMAP_BOX_MARGIN_TOP[marginTop] : '', marginRight !== undefined ? Box_constants_1.TWCLASSMAP_BOX_MARGIN_RIGHT[marginRight] : '', marginBottom !== undefined
|
|
32
34
|
? Box_constants_1.TWCLASSMAP_BOX_MARGIN_BOTTOM[marginBottom]
|
|
33
35
|
: '', marginLeft !== undefined ? Box_constants_1.TWCLASSMAP_BOX_MARGIN_LEFT[marginLeft] : '', marginHorizontal !== undefined
|
|
@@ -43,7 +45,7 @@ exports.Box = (0, react_1.forwardRef)(({ flexDirection, flexWrap, gap, alignItem
|
|
|
43
45
|
: '', paddingVertical !== undefined
|
|
44
46
|
? Box_constants_1.TWCLASSMAP_BOX_PADDING_VERTICAL[paddingVertical]
|
|
45
47
|
: '', borderWidth !== undefined ? Box_constants_1.TWCLASSMAP_BOX_BORDER_WIDTH[borderWidth] : '', borderColor, backgroundColor, className);
|
|
46
|
-
return (react_1.default.createElement(
|
|
48
|
+
return (react_1.default.createElement(Component, { ref: ref, className: mergedClassName, style: style, ...props }, children));
|
|
47
49
|
});
|
|
48
50
|
exports.Box.displayName = 'Box';
|
|
49
51
|
//# sourceMappingURL=Box.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.cjs","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,uDAA+C;AAE/C,uDAiByB;AAGZ,QAAA,GAAG,GAAG,IAAA,kBAAU,EAC3B,CACE,EACE,aAAa,EACb,QAAQ,EACR,GAAG,EACH,UAAU,EACV,cAAc,EACd,MAAM,EACN,SAAS,EACT,WAAW,EACX,YAAY,EACZ,UAAU,EACV,gBAAgB,EAChB,cAAc,EACd,OAAO,EACP,UAAU,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,WAAW,EACX,eAAe,EACf,SAAS,GAAG,EAAE,EACd,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACC,EACX,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,IAAA,kBAAO,EAC7B,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAC3B,aAAa,EACb,QAAQ,EACR,GAAG,KAAK,SAAS,CAAC,CAAC,CAAC,kCAAkB,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,EAChD,UAAU,EACV,cAAc,EACd,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,qCAAqB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,EACzD,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,yCAAyB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,EACnE,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,2CAA2B,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,EACzE,YAAY,KAAK,SAAS;QACxB,CAAC,CAAC,4CAA4B,CAAC,YAAY,CAAC;QAC5C,CAAC,CAAC,EAAE,EACN,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,0CAA0B,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,EACtE,gBAAgB,KAAK,SAAS;QAC5B,CAAC,CAAC,gDAAgC,CAAC,gBAAgB,CAAC;QACpD,CAAC,CAAC,EAAE,EACN,cAAc,KAAK,SAAS;QAC1B,CAAC,CAAC,8CAA8B,CAAC,cAAc,CAAC;QAChD,CAAC,CAAC,EAAE,EACN,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,sCAAsB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,EAC5D,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,0CAA0B,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,EACtE,YAAY,KAAK,SAAS;QACxB,CAAC,CAAC,4CAA4B,CAAC,YAAY,CAAC;QAC5C,CAAC,CAAC,EAAE,EACN,aAAa,KAAK,SAAS;QACzB,CAAC,CAAC,6CAA6B,CAAC,aAAa,CAAC;QAC9C,CAAC,CAAC,EAAE,EACN,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,2CAA2B,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,EACzE,iBAAiB,KAAK,SAAS;QAC7B,CAAC,CAAC,iDAAiC,CAAC,iBAAiB,CAAC;QACtD,CAAC,CAAC,EAAE,EACN,eAAe,KAAK,SAAS;QAC3B,CAAC,CAAC,+CAA+B,CAAC,eAAe,CAAC;QAClD,CAAC,CAAC,EAAE,EACN,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,2CAA2B,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,EACzE,WAAW,EACX,eAAe,EACf,SAAS,CACV,CAAC;IAEF,OAAO,CACL,
|
|
1
|
+
{"version":3,"file":"Box.cjs","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\n\nimport {\n TWCLASSMAP_BOX_GAP,\n TWCLASSMAP_BOX_MARGIN,\n TWCLASSMAP_BOX_MARGIN_TOP,\n TWCLASSMAP_BOX_MARGIN_RIGHT,\n TWCLASSMAP_BOX_MARGIN_BOTTOM,\n TWCLASSMAP_BOX_MARGIN_LEFT,\n TWCLASSMAP_BOX_MARGIN_HORIZONTAL,\n TWCLASSMAP_BOX_MARGIN_VERTICAL,\n TWCLASSMAP_BOX_PADDING,\n TWCLASSMAP_BOX_PADDING_TOP,\n TWCLASSMAP_BOX_PADDING_RIGHT,\n TWCLASSMAP_BOX_PADDING_BOTTOM,\n TWCLASSMAP_BOX_PADDING_LEFT,\n TWCLASSMAP_BOX_PADDING_HORIZONTAL,\n TWCLASSMAP_BOX_PADDING_VERTICAL,\n TWCLASSMAP_BOX_BORDER_WIDTH,\n} from './Box.constants';\nimport type { BoxProps } from './Box.types';\n\nexport const Box = forwardRef<HTMLDivElement, BoxProps>(\n (\n {\n flexDirection,\n flexWrap,\n gap,\n alignItems,\n justifyContent,\n margin,\n marginTop,\n marginRight,\n marginBottom,\n marginLeft,\n marginHorizontal,\n marginVertical,\n padding,\n paddingTop,\n paddingRight,\n paddingBottom,\n paddingLeft,\n paddingHorizontal,\n paddingVertical,\n borderWidth,\n borderColor,\n backgroundColor,\n className = '',\n style,\n asChild,\n children,\n ...props\n }: BoxProps,\n ref,\n ) => {\n const Component = asChild ? Slot : 'div';\n\n const mergedClassName = twMerge(\n flexDirection ? 'flex' : '',\n flexDirection,\n flexWrap,\n gap !== undefined ? TWCLASSMAP_BOX_GAP[gap] : '',\n alignItems,\n justifyContent,\n margin !== undefined ? TWCLASSMAP_BOX_MARGIN[margin] : '',\n marginTop !== undefined ? TWCLASSMAP_BOX_MARGIN_TOP[marginTop] : '',\n marginRight !== undefined ? TWCLASSMAP_BOX_MARGIN_RIGHT[marginRight] : '',\n marginBottom !== undefined\n ? TWCLASSMAP_BOX_MARGIN_BOTTOM[marginBottom]\n : '',\n marginLeft !== undefined ? TWCLASSMAP_BOX_MARGIN_LEFT[marginLeft] : '',\n marginHorizontal !== undefined\n ? TWCLASSMAP_BOX_MARGIN_HORIZONTAL[marginHorizontal]\n : '',\n marginVertical !== undefined\n ? TWCLASSMAP_BOX_MARGIN_VERTICAL[marginVertical]\n : '',\n padding !== undefined ? TWCLASSMAP_BOX_PADDING[padding] : '',\n paddingTop !== undefined ? TWCLASSMAP_BOX_PADDING_TOP[paddingTop] : '',\n paddingRight !== undefined\n ? TWCLASSMAP_BOX_PADDING_RIGHT[paddingRight]\n : '',\n paddingBottom !== undefined\n ? TWCLASSMAP_BOX_PADDING_BOTTOM[paddingBottom]\n : '',\n paddingLeft !== undefined ? TWCLASSMAP_BOX_PADDING_LEFT[paddingLeft] : '',\n paddingHorizontal !== undefined\n ? TWCLASSMAP_BOX_PADDING_HORIZONTAL[paddingHorizontal]\n : '',\n paddingVertical !== undefined\n ? TWCLASSMAP_BOX_PADDING_VERTICAL[paddingVertical]\n : '',\n borderWidth !== undefined ? TWCLASSMAP_BOX_BORDER_WIDTH[borderWidth] : '',\n borderColor,\n backgroundColor,\n className,\n );\n\n return (\n <Component ref={ref} className={mergedClassName} style={style} {...props}>\n {children}\n </Component>\n );\n },\n);\n\nBox.displayName = 'Box';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.d.cts","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Box.d.cts","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,cAAc;AAsB1C,OAAO,KAAK,EAAE,QAAQ,EAAE,wBAAoB;AAE5C,eAAO,MAAM,GAAG,8FAkFf,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.d.mts","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Box.d.mts","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,cAAc;AAsB1C,OAAO,KAAK,EAAE,QAAQ,EAAE,wBAAoB;AAE5C,eAAO,MAAM,GAAG,8FAkFf,CAAC"}
|
|
@@ -4,11 +4,13 @@ function $importDefault(module) {
|
|
|
4
4
|
}
|
|
5
5
|
return module;
|
|
6
6
|
}
|
|
7
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
7
8
|
import $React, { forwardRef } from "react";
|
|
8
9
|
const React = $importDefault($React);
|
|
9
10
|
import { twMerge } from "../../utils/tw-merge.mjs";
|
|
10
11
|
import { TWCLASSMAP_BOX_GAP, TWCLASSMAP_BOX_MARGIN, TWCLASSMAP_BOX_MARGIN_TOP, TWCLASSMAP_BOX_MARGIN_RIGHT, TWCLASSMAP_BOX_MARGIN_BOTTOM, TWCLASSMAP_BOX_MARGIN_LEFT, TWCLASSMAP_BOX_MARGIN_HORIZONTAL, TWCLASSMAP_BOX_MARGIN_VERTICAL, TWCLASSMAP_BOX_PADDING, TWCLASSMAP_BOX_PADDING_TOP, TWCLASSMAP_BOX_PADDING_RIGHT, TWCLASSMAP_BOX_PADDING_BOTTOM, TWCLASSMAP_BOX_PADDING_LEFT, TWCLASSMAP_BOX_PADDING_HORIZONTAL, TWCLASSMAP_BOX_PADDING_VERTICAL, TWCLASSMAP_BOX_BORDER_WIDTH } from "./Box.constants.mjs";
|
|
11
|
-
export const Box = forwardRef(({ flexDirection, flexWrap, gap, alignItems, justifyContent, margin, marginTop, marginRight, marginBottom, marginLeft, marginHorizontal, marginVertical, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, paddingHorizontal, paddingVertical, borderWidth, borderColor, backgroundColor, className = '', style, children, ...props }, ref) => {
|
|
12
|
+
export const Box = forwardRef(({ flexDirection, flexWrap, gap, alignItems, justifyContent, margin, marginTop, marginRight, marginBottom, marginLeft, marginHorizontal, marginVertical, padding, paddingTop, paddingRight, paddingBottom, paddingLeft, paddingHorizontal, paddingVertical, borderWidth, borderColor, backgroundColor, className = '', style, asChild, children, ...props }, ref) => {
|
|
13
|
+
const Component = asChild ? Slot : 'div';
|
|
12
14
|
const mergedClassName = twMerge(flexDirection ? 'flex' : '', flexDirection, flexWrap, gap !== undefined ? TWCLASSMAP_BOX_GAP[gap] : '', alignItems, justifyContent, margin !== undefined ? TWCLASSMAP_BOX_MARGIN[margin] : '', marginTop !== undefined ? TWCLASSMAP_BOX_MARGIN_TOP[marginTop] : '', marginRight !== undefined ? TWCLASSMAP_BOX_MARGIN_RIGHT[marginRight] : '', marginBottom !== undefined
|
|
13
15
|
? TWCLASSMAP_BOX_MARGIN_BOTTOM[marginBottom]
|
|
14
16
|
: '', marginLeft !== undefined ? TWCLASSMAP_BOX_MARGIN_LEFT[marginLeft] : '', marginHorizontal !== undefined
|
|
@@ -24,7 +26,7 @@ export const Box = forwardRef(({ flexDirection, flexWrap, gap, alignItems, justi
|
|
|
24
26
|
: '', paddingVertical !== undefined
|
|
25
27
|
? TWCLASSMAP_BOX_PADDING_VERTICAL[paddingVertical]
|
|
26
28
|
: '', borderWidth !== undefined ? TWCLASSMAP_BOX_BORDER_WIDTH[borderWidth] : '', borderColor, backgroundColor, className);
|
|
27
|
-
return (React.createElement(
|
|
29
|
+
return (React.createElement(Component, { ref: ref, className: mergedClassName, style: style, ...props }, children));
|
|
28
30
|
});
|
|
29
31
|
Box.displayName = 'Box';
|
|
30
32
|
//# sourceMappingURL=Box.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Box.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\n\nimport {\n TWCLASSMAP_BOX_GAP,\n TWCLASSMAP_BOX_MARGIN,\n TWCLASSMAP_BOX_MARGIN_TOP,\n TWCLASSMAP_BOX_MARGIN_RIGHT,\n TWCLASSMAP_BOX_MARGIN_BOTTOM,\n TWCLASSMAP_BOX_MARGIN_LEFT,\n TWCLASSMAP_BOX_MARGIN_HORIZONTAL,\n TWCLASSMAP_BOX_MARGIN_VERTICAL,\n TWCLASSMAP_BOX_PADDING,\n TWCLASSMAP_BOX_PADDING_TOP,\n TWCLASSMAP_BOX_PADDING_RIGHT,\n TWCLASSMAP_BOX_PADDING_BOTTOM,\n TWCLASSMAP_BOX_PADDING_LEFT,\n TWCLASSMAP_BOX_PADDING_HORIZONTAL,\n TWCLASSMAP_BOX_PADDING_VERTICAL,\n TWCLASSMAP_BOX_BORDER_WIDTH,\n} from './Box.constants';\nimport type { BoxProps } from './Box.types';\n\nexport const Box = forwardRef<HTMLDivElement, BoxProps>(\n (\n {\n flexDirection,\n flexWrap,\n gap,\n alignItems,\n justifyContent,\n margin,\n marginTop,\n marginRight,\n marginBottom,\n marginLeft,\n marginHorizontal,\n marginVertical,\n padding,\n paddingTop,\n paddingRight,\n paddingBottom,\n paddingLeft,\n paddingHorizontal,\n paddingVertical,\n borderWidth,\n borderColor,\n backgroundColor,\n className = '',\n style,\n asChild,\n children,\n ...props\n }: BoxProps,\n ref,\n ) => {\n const Component = asChild ? Slot : 'div';\n\n const mergedClassName = twMerge(\n flexDirection ? 'flex' : '',\n flexDirection,\n flexWrap,\n gap !== undefined ? TWCLASSMAP_BOX_GAP[gap] : '',\n alignItems,\n justifyContent,\n margin !== undefined ? TWCLASSMAP_BOX_MARGIN[margin] : '',\n marginTop !== undefined ? TWCLASSMAP_BOX_MARGIN_TOP[marginTop] : '',\n marginRight !== undefined ? TWCLASSMAP_BOX_MARGIN_RIGHT[marginRight] : '',\n marginBottom !== undefined\n ? TWCLASSMAP_BOX_MARGIN_BOTTOM[marginBottom]\n : '',\n marginLeft !== undefined ? TWCLASSMAP_BOX_MARGIN_LEFT[marginLeft] : '',\n marginHorizontal !== undefined\n ? TWCLASSMAP_BOX_MARGIN_HORIZONTAL[marginHorizontal]\n : '',\n marginVertical !== undefined\n ? TWCLASSMAP_BOX_MARGIN_VERTICAL[marginVertical]\n : '',\n padding !== undefined ? TWCLASSMAP_BOX_PADDING[padding] : '',\n paddingTop !== undefined ? TWCLASSMAP_BOX_PADDING_TOP[paddingTop] : '',\n paddingRight !== undefined\n ? TWCLASSMAP_BOX_PADDING_RIGHT[paddingRight]\n : '',\n paddingBottom !== undefined\n ? TWCLASSMAP_BOX_PADDING_BOTTOM[paddingBottom]\n : '',\n paddingLeft !== undefined ? TWCLASSMAP_BOX_PADDING_LEFT[paddingLeft] : '',\n paddingHorizontal !== undefined\n ? TWCLASSMAP_BOX_PADDING_HORIZONTAL[paddingHorizontal]\n : '',\n paddingVertical !== undefined\n ? TWCLASSMAP_BOX_PADDING_VERTICAL[paddingVertical]\n : '',\n borderWidth !== undefined ? TWCLASSMAP_BOX_BORDER_WIDTH[borderWidth] : '',\n borderColor,\n backgroundColor,\n className,\n );\n\n return (\n <Component ref={ref} className={mergedClassName} style={style} {...props}>\n {children}\n </Component>\n );\n },\n);\n\nBox.displayName = 'Box';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.types.cjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type {\n BoxFlexDirection,\n BoxFlexWrap,\n BoxSpacing,\n BoxBorderWidth,\n BoxAlignItems,\n BoxJustifyContent,\n BoxBackgroundColor,\n BoxBorderColor,\n} from '../../types';\n\nexport type BoxProps = ComponentProps<'div'> & {\n /**\n * The flex-direction style of the component.\n */\n flexDirection?: BoxFlexDirection;\n /**\n * The flex-wrap style of the component.\n */\n flexWrap?: BoxFlexWrap;\n /**\n * The gap between the component's children.\n * Use 0-12 for a gap of 0px-48px.\n */\n gap?: BoxSpacing;\n /**\n * The align-items style of the component.\n */\n alignItems?: BoxAlignItems;\n /**\n * The justify-content style of the component.\n */\n justifyContent?: BoxJustifyContent;\n /**\n * The margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n margin?: BoxSpacing;\n /**\n * The top margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginTop?: BoxSpacing;\n /**\n * The right margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginRight?: BoxSpacing;\n /**\n * The bottom margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginBottom?: BoxSpacing;\n /**\n * The left margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginLeft?: BoxSpacing;\n /**\n * The horizontal margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginHorizontal?: BoxSpacing;\n /**\n * The vertical margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginVertical?: BoxSpacing;\n /**\n * The padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n padding?: BoxSpacing;\n /**\n * The top padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingTop?: BoxSpacing;\n /**\n * The right padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingRight?: BoxSpacing;\n /**\n * The bottom padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingBottom?: BoxSpacing;\n /**\n * The left padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingLeft?: BoxSpacing;\n /**\n * The horizontal padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingHorizontal?: BoxSpacing;\n /**\n * The vertical padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingVertical?: BoxSpacing;\n /**\n * The border width of the component.\n * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.\n */\n borderWidth?: BoxBorderWidth;\n /**\n * The border color of the component.\n */\n borderColor?: BoxBorderColor;\n /**\n * The background color of the component.\n */\n backgroundColor?: BoxBackgroundColor;\n /**\n * Optional prop for additional CSS classes to be applied to the Box component.\n */\n className?: string;\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Box.types.cjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type {\n BoxFlexDirection,\n BoxFlexWrap,\n BoxSpacing,\n BoxBorderWidth,\n BoxAlignItems,\n BoxJustifyContent,\n BoxBackgroundColor,\n BoxBorderColor,\n} from '../../types';\n\nexport type BoxProps = ComponentProps<'div'> & {\n /**\n * The flex-direction style of the component.\n */\n flexDirection?: BoxFlexDirection;\n /**\n * The flex-wrap style of the component.\n */\n flexWrap?: BoxFlexWrap;\n /**\n * The gap between the component's children.\n * Use 0-12 for a gap of 0px-48px.\n */\n gap?: BoxSpacing;\n /**\n * The align-items style of the component.\n */\n alignItems?: BoxAlignItems;\n /**\n * The justify-content style of the component.\n */\n justifyContent?: BoxJustifyContent;\n /**\n * The margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n margin?: BoxSpacing;\n /**\n * The top margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginTop?: BoxSpacing;\n /**\n * The right margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginRight?: BoxSpacing;\n /**\n * The bottom margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginBottom?: BoxSpacing;\n /**\n * The left margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginLeft?: BoxSpacing;\n /**\n * The horizontal margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginHorizontal?: BoxSpacing;\n /**\n * The vertical margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginVertical?: BoxSpacing;\n /**\n * The padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n padding?: BoxSpacing;\n /**\n * The top padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingTop?: BoxSpacing;\n /**\n * The right padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingRight?: BoxSpacing;\n /**\n * The bottom padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingBottom?: BoxSpacing;\n /**\n * The left padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingLeft?: BoxSpacing;\n /**\n * The horizontal padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingHorizontal?: BoxSpacing;\n /**\n * The vertical padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingVertical?: BoxSpacing;\n /**\n * The border width of the component.\n * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.\n */\n borderWidth?: BoxBorderWidth;\n /**\n * The border color of the component.\n */\n borderColor?: BoxBorderColor;\n /**\n * The background color of the component.\n */\n backgroundColor?: BoxBackgroundColor;\n /**\n * Optional prop for additional CSS classes to be applied to the Box component.\n */\n className?: string;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a div element\n *\n * @default false\n */\n asChild?: boolean;\n};\n"]}
|
|
@@ -109,5 +109,12 @@ export type BoxProps = ComponentProps<'div'> & {
|
|
|
109
109
|
* Optional prop for additional CSS classes to be applied to the Box component.
|
|
110
110
|
*/
|
|
111
111
|
className?: string;
|
|
112
|
+
/**
|
|
113
|
+
* Optional boolean that determines if the component should merge its props onto its immediate child
|
|
114
|
+
* instead of rendering a div element
|
|
115
|
+
*
|
|
116
|
+
* @default false
|
|
117
|
+
*/
|
|
118
|
+
asChild?: boolean;
|
|
112
119
|
};
|
|
113
120
|
//# sourceMappingURL=Box.types.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.types.d.cts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,cAAc,EACd,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACf,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7C;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC/B;;;OAGG;IACH,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"Box.types.d.cts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,cAAc,EACd,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACf,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7C;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC/B;;;OAGG;IACH,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC"}
|
|
@@ -109,5 +109,12 @@ export type BoxProps = ComponentProps<'div'> & {
|
|
|
109
109
|
* Optional prop for additional CSS classes to be applied to the Box component.
|
|
110
110
|
*/
|
|
111
111
|
className?: string;
|
|
112
|
+
/**
|
|
113
|
+
* Optional boolean that determines if the component should merge its props onto its immediate child
|
|
114
|
+
* instead of rendering a div element
|
|
115
|
+
*
|
|
116
|
+
* @default false
|
|
117
|
+
*/
|
|
118
|
+
asChild?: boolean;
|
|
112
119
|
};
|
|
113
120
|
//# sourceMappingURL=Box.types.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.types.d.mts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,cAAc,EACd,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACf,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7C;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC/B;;;OAGG;IACH,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"Box.types.d.mts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,cAAc,EACd,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACf,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7C;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC/B;;;OAGG;IACH,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.types.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type {\n BoxFlexDirection,\n BoxFlexWrap,\n BoxSpacing,\n BoxBorderWidth,\n BoxAlignItems,\n BoxJustifyContent,\n BoxBackgroundColor,\n BoxBorderColor,\n} from '../../types';\n\nexport type BoxProps = ComponentProps<'div'> & {\n /**\n * The flex-direction style of the component.\n */\n flexDirection?: BoxFlexDirection;\n /**\n * The flex-wrap style of the component.\n */\n flexWrap?: BoxFlexWrap;\n /**\n * The gap between the component's children.\n * Use 0-12 for a gap of 0px-48px.\n */\n gap?: BoxSpacing;\n /**\n * The align-items style of the component.\n */\n alignItems?: BoxAlignItems;\n /**\n * The justify-content style of the component.\n */\n justifyContent?: BoxJustifyContent;\n /**\n * The margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n margin?: BoxSpacing;\n /**\n * The top margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginTop?: BoxSpacing;\n /**\n * The right margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginRight?: BoxSpacing;\n /**\n * The bottom margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginBottom?: BoxSpacing;\n /**\n * The left margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginLeft?: BoxSpacing;\n /**\n * The horizontal margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginHorizontal?: BoxSpacing;\n /**\n * The vertical margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginVertical?: BoxSpacing;\n /**\n * The padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n padding?: BoxSpacing;\n /**\n * The top padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingTop?: BoxSpacing;\n /**\n * The right padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingRight?: BoxSpacing;\n /**\n * The bottom padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingBottom?: BoxSpacing;\n /**\n * The left padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingLeft?: BoxSpacing;\n /**\n * The horizontal padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingHorizontal?: BoxSpacing;\n /**\n * The vertical padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingVertical?: BoxSpacing;\n /**\n * The border width of the component.\n * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.\n */\n borderWidth?: BoxBorderWidth;\n /**\n * The border color of the component.\n */\n borderColor?: BoxBorderColor;\n /**\n * The background color of the component.\n */\n backgroundColor?: BoxBackgroundColor;\n /**\n * Optional prop for additional CSS classes to be applied to the Box component.\n */\n className?: string;\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Box.types.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type {\n BoxFlexDirection,\n BoxFlexWrap,\n BoxSpacing,\n BoxBorderWidth,\n BoxAlignItems,\n BoxJustifyContent,\n BoxBackgroundColor,\n BoxBorderColor,\n} from '../../types';\n\nexport type BoxProps = ComponentProps<'div'> & {\n /**\n * The flex-direction style of the component.\n */\n flexDirection?: BoxFlexDirection;\n /**\n * The flex-wrap style of the component.\n */\n flexWrap?: BoxFlexWrap;\n /**\n * The gap between the component's children.\n * Use 0-12 for a gap of 0px-48px.\n */\n gap?: BoxSpacing;\n /**\n * The align-items style of the component.\n */\n alignItems?: BoxAlignItems;\n /**\n * The justify-content style of the component.\n */\n justifyContent?: BoxJustifyContent;\n /**\n * The margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n margin?: BoxSpacing;\n /**\n * The top margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginTop?: BoxSpacing;\n /**\n * The right margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginRight?: BoxSpacing;\n /**\n * The bottom margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginBottom?: BoxSpacing;\n /**\n * The left margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginLeft?: BoxSpacing;\n /**\n * The horizontal margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginHorizontal?: BoxSpacing;\n /**\n * The vertical margin of the component.\n * Use 0-12 for margin of 0px-48px.\n */\n marginVertical?: BoxSpacing;\n /**\n * The padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n padding?: BoxSpacing;\n /**\n * The top padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingTop?: BoxSpacing;\n /**\n * The right padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingRight?: BoxSpacing;\n /**\n * The bottom padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingBottom?: BoxSpacing;\n /**\n * The left padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingLeft?: BoxSpacing;\n /**\n * The horizontal padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingHorizontal?: BoxSpacing;\n /**\n * The vertical padding of the component.\n * Use 0-12 for padding of 0px-48px.\n */\n paddingVertical?: BoxSpacing;\n /**\n * The border width of the component.\n * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.\n */\n borderWidth?: BoxBorderWidth;\n /**\n * The border color of the component.\n */\n borderColor?: BoxBorderColor;\n /**\n * The background color of the component.\n */\n backgroundColor?: BoxBackgroundColor;\n /**\n * Optional prop for additional CSS classes to be applied to the Box component.\n */\n className?: string;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a div element\n *\n * @default false\n */\n asChild?: boolean;\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@metamask-previews/design-system-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.0-preview.23d2c11",
|
|
4
4
|
"description": "Design system react ui components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"MetaMask",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"test:watch": "NODE_OPTIONS=--experimental-vm-modules jest --watch"
|
|
51
51
|
},
|
|
52
52
|
"dependencies": {
|
|
53
|
-
"@metamask-previews/design-system-shared": "0.1.
|
|
53
|
+
"@metamask-previews/design-system-shared": "0.1.1-preview.23d2c11",
|
|
54
54
|
"@metamask/jazzicon": "^2.0.0",
|
|
55
55
|
"@radix-ui/react-slot": "^1.1.0",
|
|
56
56
|
"blo": "^2.0.0",
|
|
@@ -59,10 +59,9 @@
|
|
|
59
59
|
"devDependencies": {
|
|
60
60
|
"@figma/code-connect": "^1.0.0",
|
|
61
61
|
"@jest/globals": "^29.7.0",
|
|
62
|
-
"@metamask-previews/design-system-tailwind-preset": "0.6.1-preview.
|
|
63
|
-
"@metamask/auto-changelog": "^5.0
|
|
64
|
-
"@metamask/utils": "^11.
|
|
65
|
-
"@solana/addresses": "^2.0.0",
|
|
62
|
+
"@metamask-previews/design-system-tailwind-preset": "0.6.1-preview.23d2c11",
|
|
63
|
+
"@metamask/auto-changelog": "^5.1.0",
|
|
64
|
+
"@metamask/utils": "^11.8.0",
|
|
66
65
|
"@storybook/react": "^9.0.17",
|
|
67
66
|
"@svgr/cli": "^8.1.0",
|
|
68
67
|
"@testing-library/jest-dom": "^6.6.3",
|
|
@@ -72,7 +71,6 @@
|
|
|
72
71
|
"@types/node": "^16.18.54",
|
|
73
72
|
"@types/react": "^18.2.0",
|
|
74
73
|
"@types/react-dom": "^18.2.0",
|
|
75
|
-
"bitcoin-address-validation": ">=2.0.0",
|
|
76
74
|
"deepmerge": "^4.2.2",
|
|
77
75
|
"jest": "^29.7.0",
|
|
78
76
|
"jest-environment-jsdom": "^29.7.0",
|
|
@@ -84,12 +82,9 @@
|
|
|
84
82
|
"peerDependencies": {
|
|
85
83
|
"@metamask/design-system-tailwind-preset": "^0.6.0",
|
|
86
84
|
"@metamask/design-tokens": "^8.1.0",
|
|
87
|
-
"@metamask/utils": "^11.
|
|
88
|
-
"@solana/addresses": "^2.0.0",
|
|
89
|
-
"bitcoin-address-validation": ">=2.0.0",
|
|
85
|
+
"@metamask/utils": "^11.8.0",
|
|
90
86
|
"react": "^17.0.0 || ^18.0.0",
|
|
91
|
-
"react-dom": "^17.0.0 || ^18.0.0"
|
|
92
|
-
"tailwindcss": "^3.0.0"
|
|
87
|
+
"react-dom": "^17.0.0 || ^18.0.0"
|
|
93
88
|
},
|
|
94
89
|
"engines": {
|
|
95
90
|
"node": "^18.18 || >=20"
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"make-props-optional.cjs","sourceRoot":"","sources":["../../src/types/make-props-optional.ts"],"names":[],"mappings":"","sourcesContent":["export type MakePropsOptional<Props> = {\n [K in keyof Props]?: Props[K];\n};\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"make-props-optional.d.cts","sourceRoot":"","sources":["../../src/types/make-props-optional.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,CAAC,KAAK,IAAI;KACpC,CAAC,IAAI,MAAM,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;CAC9B,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"make-props-optional.d.mts","sourceRoot":"","sources":["../../src/types/make-props-optional.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,CAAC,KAAK,IAAI;KACpC,CAAC,IAAI,MAAM,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;CAC9B,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"make-props-optional.mjs","sourceRoot":"","sources":["../../src/types/make-props-optional.ts"],"names":[],"mappings":"","sourcesContent":["export type MakePropsOptional<Props> = {\n [K in keyof Props]?: Props[K];\n};\n"]}
|