@metamask-previews/design-system-react 0.4.0-preview.6197867 → 0.5.0-preview.00974dd

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (69) hide show
  1. package/CHANGELOG.md +19 -1
  2. package/dist/components/AvatarBase/AvatarBase.cjs +1 -1
  3. package/dist/components/AvatarBase/AvatarBase.cjs.map +1 -1
  4. package/dist/components/AvatarBase/AvatarBase.mjs +1 -1
  5. package/dist/components/AvatarBase/AvatarBase.mjs.map +1 -1
  6. package/dist/components/Box/Box.cjs +4 -2
  7. package/dist/components/Box/Box.cjs.map +1 -1
  8. package/dist/components/Box/Box.d.cts.map +1 -1
  9. package/dist/components/Box/Box.d.mts.map +1 -1
  10. package/dist/components/Box/Box.mjs +4 -2
  11. package/dist/components/Box/Box.mjs.map +1 -1
  12. package/dist/components/Box/Box.types.cjs.map +1 -1
  13. package/dist/components/Box/Box.types.d.cts +7 -0
  14. package/dist/components/Box/Box.types.d.cts.map +1 -1
  15. package/dist/components/Box/Box.types.d.mts +7 -0
  16. package/dist/components/Box/Box.types.d.mts.map +1 -1
  17. package/dist/components/Box/Box.types.mjs.map +1 -1
  18. package/dist/components/ButtonHero/ButtonHero.cjs +45 -0
  19. package/dist/components/ButtonHero/ButtonHero.cjs.map +1 -0
  20. package/dist/components/ButtonHero/ButtonHero.d.cts +3 -0
  21. package/dist/components/ButtonHero/ButtonHero.d.cts.map +1 -0
  22. package/dist/components/ButtonHero/ButtonHero.d.mts +3 -0
  23. package/dist/components/ButtonHero/ButtonHero.d.mts.map +1 -0
  24. package/dist/components/ButtonHero/ButtonHero.mjs +26 -0
  25. package/dist/components/ButtonHero/ButtonHero.mjs.map +1 -0
  26. package/dist/{types/make-props-optional.cjs → components/ButtonHero/ButtonHero.types.cjs} +1 -1
  27. package/dist/components/ButtonHero/ButtonHero.types.cjs.map +1 -0
  28. package/dist/components/ButtonHero/ButtonHero.types.d.cts +3 -0
  29. package/dist/components/ButtonHero/ButtonHero.types.d.cts.map +1 -0
  30. package/dist/components/ButtonHero/ButtonHero.types.d.mts +3 -0
  31. package/dist/components/ButtonHero/ButtonHero.types.d.mts.map +1 -0
  32. package/dist/components/ButtonHero/ButtonHero.types.mjs +2 -0
  33. package/dist/components/ButtonHero/ButtonHero.types.mjs.map +1 -0
  34. package/dist/components/ButtonHero/index.cjs +8 -0
  35. package/dist/components/ButtonHero/index.cjs.map +1 -0
  36. package/dist/components/ButtonHero/index.d.cts +4 -0
  37. package/dist/components/ButtonHero/index.d.cts.map +1 -0
  38. package/dist/components/ButtonHero/index.d.mts +4 -0
  39. package/dist/components/ButtonHero/index.d.mts.map +1 -0
  40. package/dist/components/ButtonHero/index.mjs +3 -0
  41. package/dist/components/ButtonHero/index.mjs.map +1 -0
  42. package/dist/components/Text/Text.types.cjs.map +1 -1
  43. package/dist/components/Text/Text.types.d.cts +1 -1
  44. package/dist/components/Text/Text.types.d.mts +1 -1
  45. package/dist/components/Text/Text.types.mjs.map +1 -1
  46. package/dist/components/index.cjs +4 -1
  47. package/dist/components/index.cjs.map +1 -1
  48. package/dist/components/index.d.cts +2 -0
  49. package/dist/components/index.d.cts.map +1 -1
  50. package/dist/components/index.d.mts +2 -0
  51. package/dist/components/index.d.mts.map +1 -1
  52. package/dist/components/index.mjs +1 -0
  53. package/dist/components/index.mjs.map +1 -1
  54. package/dist/types/index.cjs +3 -3
  55. package/dist/types/index.cjs.map +1 -1
  56. package/dist/types/index.d.cts +2 -1
  57. package/dist/types/index.d.cts.map +1 -1
  58. package/dist/types/index.d.mts +2 -1
  59. package/dist/types/index.d.mts.map +1 -1
  60. package/dist/types/index.mjs +2 -1
  61. package/dist/types/index.mjs.map +1 -1
  62. package/package.json +11 -15
  63. package/dist/types/make-props-optional.cjs.map +0 -1
  64. package/dist/types/make-props-optional.d.cts +0 -4
  65. package/dist/types/make-props-optional.d.cts.map +0 -1
  66. package/dist/types/make-props-optional.d.mts +0 -4
  67. package/dist/types/make-props-optional.d.mts.map +0 -1
  68. package/dist/types/make-props-optional.mjs +0 -2
  69. 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.4.0...HEAD
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 flex-shrink-0 items-center justify-center overflow-hidden bg-section', shape === types_1.AvatarBaseShape.Circle
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,kFAAkF,EAClF,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 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"]}
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 flex-shrink-0 items-center justify-center overflow-hidden bg-section', shape === AvatarBaseShape.Circle
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,kFAAkF,EAClF,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 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"]}
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("div", { ref: ref, className: mergedClassName, style: style, ...props }, children));
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":"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","sourcesContent":["import 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 children,\n ...props\n }: BoxProps,\n ref,\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 <div ref={ref} className={mergedClassName} style={style} {...props}>\n {children}\n </div>\n );\n },\n);\n\nBox.displayName = 'Box';\n"]}
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":"AAAA,OAAO,KAAqB,cAAc;AAsB1C,OAAO,KAAK,EAAE,QAAQ,EAAE,wBAAoB;AAE5C,eAAO,MAAM,GAAG,8FA+Ef,CAAC"}
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":"AAAA,OAAO,KAAqB,cAAc;AAsB1C,OAAO,KAAK,EAAE,QAAQ,EAAE,wBAAoB;AAE5C,eAAO,MAAM,GAAG,8FA+Ef,CAAC"}
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("div", { ref: ref, className: mergedClassName, style: style, ...props }, children));
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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","sourcesContent":["import 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 children,\n ...props\n }: BoxProps,\n ref,\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 <div ref={ref} className={mergedClassName} style={style} {...props}>\n {children}\n </div>\n );\n },\n);\n\nBox.displayName = 'Box';\n"]}
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;CACpB,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;CACpB,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"]}
@@ -0,0 +1,45 @@
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.ButtonHero = void 0;
27
+ const react_1 = __importStar(require("react"));
28
+ const tw_merge_1 = require("../../utils/tw-merge.cjs");
29
+ const ButtonBase_1 = require("../ButtonBase/index.cjs");
30
+ exports.ButtonHero = (0, react_1.forwardRef)(({ className, isDisabled, isLoading, ...props }, ref) => {
31
+ const isInteractive = !(isDisabled || isLoading);
32
+ const mergedClassName = (0, tw_merge_1.twMerge)(
33
+ // Base hero styles - locked to light theme primary colors
34
+ 'bg-primary-default text-primary-inverse',
35
+ // Loading state
36
+ isLoading && 'bg-primary-default-pressed',
37
+ // Hover/Active states - only applied when interactive
38
+ isInteractive && [
39
+ 'hover:bg-primary-default-hover',
40
+ 'active:bg-primary-default-pressed',
41
+ ], 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-default', className);
42
+ return (react_1.default.createElement(ButtonBase_1.ButtonBase, { ref: ref, className: mergedClassName, isDisabled: isDisabled, isLoading: isLoading, "data-theme": "light", ...props }));
43
+ });
44
+ exports.ButtonHero.displayName = 'ButtonHero';
45
+ //# sourceMappingURL=ButtonHero.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.cjs","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,uDAA+C;AAC/C,wDAA2C;AAI9B,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACtD,MAAM,aAAa,GAAG,CAAC,CAAC,UAAU,IAAI,SAAS,CAAC,CAAC;IAEjD,MAAM,eAAe,GAAG,IAAA,kBAAO;IAC7B,0DAA0D;IAC1D,yCAAyC;IACzC,gBAAgB;IAChB,SAAS,IAAI,4BAA4B;IACzC,sDAAsD;IACtD,aAAa,IAAI;QACf,gCAAgC;QAChC,mCAAmC;KACpC,EACD,oHAAoH,EACpH,SAAS,CACV,CAAC;IAEF,OAAO,CACL,8BAAC,uBAAU,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,gBACT,OAAO,KACd,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { ButtonBase } from '../ButtonBase';\n\nimport type { ButtonHeroProps } from './ButtonHero.types';\n\nexport const ButtonHero = forwardRef<HTMLButtonElement, ButtonHeroProps>(\n ({ className, isDisabled, isLoading, ...props }, ref) => {\n const isInteractive = !(isDisabled || isLoading);\n\n const mergedClassName = twMerge(\n // Base hero styles - locked to light theme primary colors\n 'bg-primary-default text-primary-inverse',\n // Loading state\n isLoading && 'bg-primary-default-pressed',\n // Hover/Active states - only applied when interactive\n isInteractive && [\n 'hover:bg-primary-default-hover',\n 'active:bg-primary-default-pressed',\n ],\n 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-default',\n className,\n );\n\n return (\n <ButtonBase\n ref={ref}\n className={mergedClassName}\n isDisabled={isDisabled}\n isLoading={isLoading}\n data-theme=\"light\"\n {...props}\n />\n );\n },\n);\n\nButtonHero.displayName = 'ButtonHero';\n"]}
@@ -0,0 +1,3 @@
1
+ import React from "react";
2
+ export declare const ButtonHero: React.ForwardRefExoticComponent<Omit<import("../ButtonBase/index.cjs").ButtonBaseProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
3
+ //# sourceMappingURL=ButtonHero.d.cts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAO1C,eAAO,MAAM,UAAU,gIA6BtB,CAAC"}
@@ -0,0 +1,3 @@
1
+ import React from "react";
2
+ export declare const ButtonHero: React.ForwardRefExoticComponent<Omit<import("../ButtonBase/index.mjs").ButtonBaseProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
3
+ //# sourceMappingURL=ButtonHero.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAO1C,eAAO,MAAM,UAAU,gIA6BtB,CAAC"}
@@ -0,0 +1,26 @@
1
+ function $importDefault(module) {
2
+ if (module?.__esModule) {
3
+ return module.default;
4
+ }
5
+ return module;
6
+ }
7
+ import $React, { forwardRef } from "react";
8
+ const React = $importDefault($React);
9
+ import { twMerge } from "../../utils/tw-merge.mjs";
10
+ import { ButtonBase } from "../ButtonBase/index.mjs";
11
+ export const ButtonHero = forwardRef(({ className, isDisabled, isLoading, ...props }, ref) => {
12
+ const isInteractive = !(isDisabled || isLoading);
13
+ const mergedClassName = twMerge(
14
+ // Base hero styles - locked to light theme primary colors
15
+ 'bg-primary-default text-primary-inverse',
16
+ // Loading state
17
+ isLoading && 'bg-primary-default-pressed',
18
+ // Hover/Active states - only applied when interactive
19
+ isInteractive && [
20
+ 'hover:bg-primary-default-hover',
21
+ 'active:bg-primary-default-pressed',
22
+ ], 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-default', className);
23
+ return (React.createElement(ButtonBase, { ref: ref, className: mergedClassName, isDisabled: isDisabled, isLoading: isLoading, "data-theme": "light", ...props }));
24
+ });
25
+ ButtonHero.displayName = 'ButtonHero';
26
+ //# sourceMappingURL=ButtonHero.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.mjs","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAI3C,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACtD,MAAM,aAAa,GAAG,CAAC,CAAC,UAAU,IAAI,SAAS,CAAC,CAAC;IAEjD,MAAM,eAAe,GAAG,OAAO;IAC7B,0DAA0D;IAC1D,yCAAyC;IACzC,gBAAgB;IAChB,SAAS,IAAI,4BAA4B;IACzC,sDAAsD;IACtD,aAAa,IAAI;QACf,gCAAgC;QAChC,mCAAmC;KACpC,EACD,oHAAoH,EACpH,SAAS,CACV,CAAC;IAEF,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,gBACT,OAAO,KACd,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { ButtonBase } from '../ButtonBase';\n\nimport type { ButtonHeroProps } from './ButtonHero.types';\n\nexport const ButtonHero = forwardRef<HTMLButtonElement, ButtonHeroProps>(\n ({ className, isDisabled, isLoading, ...props }, ref) => {\n const isInteractive = !(isDisabled || isLoading);\n\n const mergedClassName = twMerge(\n // Base hero styles - locked to light theme primary colors\n 'bg-primary-default text-primary-inverse',\n // Loading state\n isLoading && 'bg-primary-default-pressed',\n // Hover/Active states - only applied when interactive\n isInteractive && [\n 'hover:bg-primary-default-hover',\n 'active:bg-primary-default-pressed',\n ],\n 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-default',\n className,\n );\n\n return (\n <ButtonBase\n ref={ref}\n className={mergedClassName}\n isDisabled={isDisabled}\n isLoading={isLoading}\n data-theme=\"light\"\n {...props}\n />\n );\n },\n);\n\nButtonHero.displayName = 'ButtonHero';\n"]}
@@ -1,3 +1,3 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- //# sourceMappingURL=make-props-optional.cjs.map
3
+ //# sourceMappingURL=ButtonHero.types.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.types.cjs","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonBaseProps } from '../ButtonBase';\n\nexport type ButtonHeroProps = ButtonBaseProps;\n"]}
@@ -0,0 +1,3 @@
1
+ import type { ButtonBaseProps } from "../ButtonBase/index.cjs";
2
+ export type ButtonHeroProps = ButtonBaseProps;
3
+ //# sourceMappingURL=ButtonHero.types.d.cts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.types.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AAErD,MAAM,MAAM,eAAe,GAAG,eAAe,CAAC"}
@@ -0,0 +1,3 @@
1
+ import type { ButtonBaseProps } from "../ButtonBase/index.mjs";
2
+ export type ButtonHeroProps = ButtonBaseProps;
3
+ //# sourceMappingURL=ButtonHero.types.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.types.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AAErD,MAAM,MAAM,eAAe,GAAG,eAAe,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=ButtonHero.types.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonHero.types.mjs","sourceRoot":"","sources":["../../../src/components/ButtonHero/ButtonHero.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonBaseProps } from '../ButtonBase';\n\nexport type ButtonHeroProps = ButtonBaseProps;\n"]}
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ButtonHeroSize = exports.ButtonHero = void 0;
4
+ var ButtonHero_1 = require("./ButtonHero.cjs");
5
+ Object.defineProperty(exports, "ButtonHero", { enumerable: true, get: function () { return ButtonHero_1.ButtonHero; } });
6
+ var types_1 = require("../../types/index.cjs");
7
+ Object.defineProperty(exports, "ButtonHeroSize", { enumerable: true, get: function () { return types_1.ButtonHeroSize; } });
8
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ButtonHero/index.ts"],"names":[],"mappings":";;;AAAA,+CAA0C;AAAjC,wGAAA,UAAU,OAAA;AAEnB,+CAA6C;AAApC,uGAAA,cAAc,OAAA","sourcesContent":["export { ButtonHero } from './ButtonHero';\nexport type { ButtonHeroProps } from './ButtonHero.types';\nexport { ButtonHeroSize } from '../../types';\n"]}
@@ -0,0 +1,4 @@
1
+ export { ButtonHero } from "./ButtonHero.cjs";
2
+ export type { ButtonHeroProps } from "./ButtonHero.types.cjs";
3
+ export { ButtonHeroSize } from "../../types/index.cjs";
4
+ //# sourceMappingURL=index.d.cts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonHero/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B;AAC1D,OAAO,EAAE,cAAc,EAAE,8BAAoB"}
@@ -0,0 +1,4 @@
1
+ export { ButtonHero } from "./ButtonHero.mjs";
2
+ export type { ButtonHeroProps } from "./ButtonHero.types.mjs";
3
+ export { ButtonHeroSize } from "../../types/index.mjs";
4
+ //# sourceMappingURL=index.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonHero/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B;AAC1D,OAAO,EAAE,cAAc,EAAE,8BAAoB"}
@@ -0,0 +1,3 @@
1
+ export { ButtonHero } from "./ButtonHero.mjs";
2
+ export { ButtonHeroSize } from "../../types/index.mjs";
3
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ButtonHero/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAE1C,OAAO,EAAE,cAAc,EAAE,8BAAoB","sourcesContent":["export { ButtonHero } from './ButtonHero';\nexport type { ButtonHeroProps } from './ButtonHero.types';\nexport { ButtonHeroSize } from '../../types';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Text.types.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n FontFamily,\n FontStyle,\n FontWeight,\n OverflowWrap,\n TextAlign,\n TextVariant,\n TextTransform,\n TextColor,\n} from '../../types';\n\nexport type TextProps = {\n /**\n * Optional prop for inline styles\n */\n style?: React.CSSProperties;\n /**\n * Optional prop to change the font size of the component. The Text component uses responsive font sizes.\n * Different variants map to specific HTML elements by default.\n *\n * @default TextVariant.BodyMd\n */\n variant?: TextVariant;\n /**\n * The text content or elements to be rendered within the component.\n */\n children: React.ReactNode;\n /**\n * Optional prop for additional CSS classes to be applied to the Text component.\n */\n className?: string;\n /**\n * Optional prop to control the font weight of the text.\n * Regular: 400\n * Medium: 500\n * Bold: 700\n */\n fontWeight?: FontWeight;\n /**\n * Optional prop to adjust the font family.\n * Default: Geist\n * Accent: MM Sans\n * Hero: MM Poly\n */\n fontFamily?: FontFamily;\n /**\n * Optional prop to control the font style of the text.\n * Options: Normal, Italic\n */\n fontStyle?: FontStyle;\n /**\n * Optional prop to apply text transformation to the content.\n * Options: Uppercase, Lowercase, Capitalize, Normal\n */\n textTransform?: TextTransform;\n /**\n * Optional prop to control the text alignment within its container.\n * Options: Left, Center, Right, Justify\n */\n textAlign?: TextAlign;\n /**\n * Optional prop to determine how text should wrap when it reaches the edge of its container.\n * Options: BreakWord, Anywhere, Normal\n */\n overflowWrap?: OverflowWrap;\n /**\n * Optional prop that when true, adds an ellipsis (...) when text overflows its container.\n *\n * @default false\n */\n ellipsis?: boolean;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a default DOM element.\n *\n * @default false\n */\n asChild?: boolean;\n /**\n * Optional prop that sets the color of the text using predefined theme colors.\n *\n * @default TextColor.TextDefault\n */\n color?: TextColor;\n /**\n * Optional prop for testing purposes\n */\n 'data-testid'?: string;\n};\n"]}
1
+ {"version":3,"file":"Text.types.cjs","sourceRoot":"","sources":["../../../src/components/Text/Text.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n FontFamily,\n FontStyle,\n FontWeight,\n OverflowWrap,\n TextAlign,\n TextVariant,\n TextTransform,\n TextColor,\n} from '../../types';\n\nexport type TextProps = {\n /**\n * Optional prop for inline styles\n */\n style?: React.CSSProperties;\n /**\n * Optional prop to change the font size of the component. The Text component uses responsive font sizes.\n * Different variants map to specific HTML elements by default.\n *\n * @default TextVariant.BodyMd\n */\n variant?: TextVariant;\n /**\n * The text content or elements to be rendered within the component.\n */\n children: React.ReactNode;\n /**\n * Optional prop for additional CSS classes to be applied to the Text component.\n */\n className?: string;\n /**\n * Optional prop to control the font weight of the text.\n * Regular: 400\n * Medium: 500\n * Bold: 600\n */\n fontWeight?: FontWeight;\n /**\n * Optional prop to adjust the font family.\n * Default: Geist\n * Accent: MM Sans\n * Hero: MM Poly\n */\n fontFamily?: FontFamily;\n /**\n * Optional prop to control the font style of the text.\n * Options: Normal, Italic\n */\n fontStyle?: FontStyle;\n /**\n * Optional prop to apply text transformation to the content.\n * Options: Uppercase, Lowercase, Capitalize, Normal\n */\n textTransform?: TextTransform;\n /**\n * Optional prop to control the text alignment within its container.\n * Options: Left, Center, Right, Justify\n */\n textAlign?: TextAlign;\n /**\n * Optional prop to determine how text should wrap when it reaches the edge of its container.\n * Options: BreakWord, Anywhere, Normal\n */\n overflowWrap?: OverflowWrap;\n /**\n * Optional prop that when true, adds an ellipsis (...) when text overflows its container.\n *\n * @default false\n */\n ellipsis?: boolean;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a default DOM element.\n *\n * @default false\n */\n asChild?: boolean;\n /**\n * Optional prop that sets the color of the text using predefined theme colors.\n *\n * @default TextColor.TextDefault\n */\n color?: TextColor;\n /**\n * Optional prop for testing purposes\n */\n 'data-testid'?: string;\n};\n"]}
@@ -24,7 +24,7 @@ export type TextProps = {
24
24
  * Optional prop to control the font weight of the text.
25
25
  * Regular: 400
26
26
  * Medium: 500
27
- * Bold: 700
27
+ * Bold: 600
28
28
  */
29
29
  fontWeight?: FontWeight;
30
30
  /**
@@ -24,7 +24,7 @@ export type TextProps = {
24
24
  * Optional prop to control the font weight of the text.
25
25
  * Regular: 400
26
26
  * Medium: 500
27
- * Bold: 700
27
+ * Bold: 600
28
28
  */
29
29
  fontWeight?: FontWeight;
30
30
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"Text.types.mjs","sourceRoot":"","sources":["../../../src/components/Text/Text.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n FontFamily,\n FontStyle,\n FontWeight,\n OverflowWrap,\n TextAlign,\n TextVariant,\n TextTransform,\n TextColor,\n} from '../../types';\n\nexport type TextProps = {\n /**\n * Optional prop for inline styles\n */\n style?: React.CSSProperties;\n /**\n * Optional prop to change the font size of the component. The Text component uses responsive font sizes.\n * Different variants map to specific HTML elements by default.\n *\n * @default TextVariant.BodyMd\n */\n variant?: TextVariant;\n /**\n * The text content or elements to be rendered within the component.\n */\n children: React.ReactNode;\n /**\n * Optional prop for additional CSS classes to be applied to the Text component.\n */\n className?: string;\n /**\n * Optional prop to control the font weight of the text.\n * Regular: 400\n * Medium: 500\n * Bold: 700\n */\n fontWeight?: FontWeight;\n /**\n * Optional prop to adjust the font family.\n * Default: Geist\n * Accent: MM Sans\n * Hero: MM Poly\n */\n fontFamily?: FontFamily;\n /**\n * Optional prop to control the font style of the text.\n * Options: Normal, Italic\n */\n fontStyle?: FontStyle;\n /**\n * Optional prop to apply text transformation to the content.\n * Options: Uppercase, Lowercase, Capitalize, Normal\n */\n textTransform?: TextTransform;\n /**\n * Optional prop to control the text alignment within its container.\n * Options: Left, Center, Right, Justify\n */\n textAlign?: TextAlign;\n /**\n * Optional prop to determine how text should wrap when it reaches the edge of its container.\n * Options: BreakWord, Anywhere, Normal\n */\n overflowWrap?: OverflowWrap;\n /**\n * Optional prop that when true, adds an ellipsis (...) when text overflows its container.\n *\n * @default false\n */\n ellipsis?: boolean;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a default DOM element.\n *\n * @default false\n */\n asChild?: boolean;\n /**\n * Optional prop that sets the color of the text using predefined theme colors.\n *\n * @default TextColor.TextDefault\n */\n color?: TextColor;\n /**\n * Optional prop for testing purposes\n */\n 'data-testid'?: string;\n};\n"]}
1
+ {"version":3,"file":"Text.types.mjs","sourceRoot":"","sources":["../../../src/components/Text/Text.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n FontFamily,\n FontStyle,\n FontWeight,\n OverflowWrap,\n TextAlign,\n TextVariant,\n TextTransform,\n TextColor,\n} from '../../types';\n\nexport type TextProps = {\n /**\n * Optional prop for inline styles\n */\n style?: React.CSSProperties;\n /**\n * Optional prop to change the font size of the component. The Text component uses responsive font sizes.\n * Different variants map to specific HTML elements by default.\n *\n * @default TextVariant.BodyMd\n */\n variant?: TextVariant;\n /**\n * The text content or elements to be rendered within the component.\n */\n children: React.ReactNode;\n /**\n * Optional prop for additional CSS classes to be applied to the Text component.\n */\n className?: string;\n /**\n * Optional prop to control the font weight of the text.\n * Regular: 400\n * Medium: 500\n * Bold: 600\n */\n fontWeight?: FontWeight;\n /**\n * Optional prop to adjust the font family.\n * Default: Geist\n * Accent: MM Sans\n * Hero: MM Poly\n */\n fontFamily?: FontFamily;\n /**\n * Optional prop to control the font style of the text.\n * Options: Normal, Italic\n */\n fontStyle?: FontStyle;\n /**\n * Optional prop to apply text transformation to the content.\n * Options: Uppercase, Lowercase, Capitalize, Normal\n */\n textTransform?: TextTransform;\n /**\n * Optional prop to control the text alignment within its container.\n * Options: Left, Center, Right, Justify\n */\n textAlign?: TextAlign;\n /**\n * Optional prop to determine how text should wrap when it reaches the edge of its container.\n * Options: BreakWord, Anywhere, Normal\n */\n overflowWrap?: OverflowWrap;\n /**\n * Optional prop that when true, adds an ellipsis (...) when text overflows its container.\n *\n * @default false\n */\n ellipsis?: boolean;\n /**\n * Optional boolean that determines if the component should merge its props onto its immediate child\n * instead of rendering a default DOM element.\n *\n * @default false\n */\n asChild?: boolean;\n /**\n * Optional prop that sets the color of the text using predefined theme colors.\n *\n * @default TextColor.TextDefault\n */\n color?: TextColor;\n /**\n * Optional prop for testing purposes\n */\n 'data-testid'?: string;\n};\n"]}
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.Maskicon = exports.Jazzicon = exports.IconColor = exports.IconSize = exports.IconName = exports.Icon = exports.Checkbox = exports.ButtonIconSize = exports.ButtonIcon = exports.ButtonBaseSize = exports.ButtonBase = exports.ButtonVariant = exports.ButtonSize = exports.Button = exports.Box = exports.BoxBorderColor = exports.BoxBackgroundColor = exports.BoxJustifyContent = exports.BoxAlignItems = exports.BoxFlexWrap = exports.BoxFlexDirection = exports.Blockies = exports.BadgeWrapperPositionAnchorShape = exports.BadgeWrapperPosition = exports.BadgeWrapper = exports.BadgeStatusSize = exports.BadgeStatusStatus = exports.BadgeStatus = exports.BadgeNetwork = exports.BadgeIcon = exports.BadgeCountSize = exports.BadgeCount = exports.AvatarTokenSize = exports.AvatarToken = exports.AvatarNetworkSize = exports.AvatarNetwork = exports.AvatarIconSeverity = exports.AvatarIconSize = exports.AvatarIcon = exports.AvatarGroupVariant = exports.AvatarGroupSize = exports.AvatarGroup = exports.AvatarFaviconSize = exports.AvatarFavicon = exports.AvatarBaseShape = exports.AvatarBaseSize = exports.AvatarBase = exports.AvatarAccountVariant = exports.AvatarAccountSize = exports.AvatarAccount = void 0;
4
- exports.TextButtonSize = exports.TextButton = exports.OverflowWrap = exports.TextTransform = exports.FontStyle = exports.FontFamily = exports.FontWeight = exports.TextAlign = exports.TextColor = exports.TextVariant = exports.Text = void 0;
4
+ exports.ButtonHeroSize = exports.ButtonHero = exports.TextButtonSize = exports.TextButton = exports.OverflowWrap = exports.TextTransform = exports.FontStyle = exports.FontFamily = exports.FontWeight = exports.TextAlign = exports.TextColor = exports.TextVariant = exports.Text = void 0;
5
5
  var AvatarAccount_1 = require("./AvatarAccount/index.cjs");
6
6
  Object.defineProperty(exports, "AvatarAccount", { enumerable: true, get: function () { return AvatarAccount_1.AvatarAccount; } });
7
7
  Object.defineProperty(exports, "AvatarAccountSize", { enumerable: true, get: function () { return AvatarAccount_1.AvatarAccountSize; } });
@@ -92,4 +92,7 @@ Object.defineProperty(exports, "OverflowWrap", { enumerable: true, get: function
92
92
  var TextButton_1 = require("./TextButton/index.cjs");
93
93
  Object.defineProperty(exports, "TextButton", { enumerable: true, get: function () { return TextButton_1.TextButton; } });
94
94
  Object.defineProperty(exports, "TextButtonSize", { enumerable: true, get: function () { return TextButton_1.TextButtonSize; } });
95
+ var ButtonHero_1 = require("./ButtonHero/index.cjs");
96
+ Object.defineProperty(exports, "ButtonHero", { enumerable: true, get: function () { return ButtonHero_1.ButtonHero; } });
97
+ Object.defineProperty(exports, "ButtonHeroSize", { enumerable: true, get: function () { return ButtonHero_1.ButtonHeroSize; } });
95
98
  //# sourceMappingURL=index.cjs.map