@metamask-previews/design-system-react-native 0.0.0-preview.ff8ed96 → 0.2.0-preview.a7d80d5

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 (166) hide show
  1. package/CHANGELOG.md +38 -1
  2. package/dist/components/AvatarBase/AvatarBase.types.d.cts +0 -1
  3. package/dist/components/AvatarBase/AvatarBase.types.d.cts.map +1 -1
  4. package/dist/components/AvatarBase/AvatarBase.types.d.mts +0 -1
  5. package/dist/components/AvatarBase/AvatarBase.types.d.mts.map +1 -1
  6. package/dist/components/AvatarFavicon/AvatarFavicon.cjs.map +1 -1
  7. package/dist/components/AvatarFavicon/AvatarFavicon.mjs.map +1 -1
  8. package/dist/components/AvatarGroup/AvatarGroup.cjs +2 -2
  9. package/dist/components/AvatarGroup/AvatarGroup.cjs.map +1 -1
  10. package/dist/components/AvatarGroup/AvatarGroup.mjs +3 -3
  11. package/dist/components/AvatarGroup/AvatarGroup.mjs.map +1 -1
  12. package/dist/components/AvatarNetwork/AvatarNetwork.cjs.map +1 -1
  13. package/dist/components/AvatarNetwork/AvatarNetwork.mjs.map +1 -1
  14. package/dist/components/AvatarToken/AvatarToken.cjs.map +1 -1
  15. package/dist/components/AvatarToken/AvatarToken.mjs.map +1 -1
  16. package/dist/components/BadgeWrapper/BadgeWrapper.cjs +1 -1
  17. package/dist/components/BadgeWrapper/BadgeWrapper.cjs.map +1 -1
  18. package/dist/components/BadgeWrapper/BadgeWrapper.mjs +1 -1
  19. package/dist/components/BadgeWrapper/BadgeWrapper.mjs.map +1 -1
  20. package/dist/components/BadgeWrapper/BadgeWrapper.types.d.cts +0 -1
  21. package/dist/components/BadgeWrapper/BadgeWrapper.types.d.cts.map +1 -1
  22. package/dist/components/BadgeWrapper/BadgeWrapper.types.d.mts +0 -1
  23. package/dist/components/BadgeWrapper/BadgeWrapper.types.d.mts.map +1 -1
  24. package/dist/components/Box/Box.cjs +22 -5
  25. package/dist/components/Box/Box.cjs.map +1 -1
  26. package/dist/components/Box/Box.constants.cjs +218 -1
  27. package/dist/components/Box/Box.constants.cjs.map +1 -1
  28. package/dist/components/Box/Box.constants.d.cts +16 -1
  29. package/dist/components/Box/Box.constants.d.cts.map +1 -1
  30. package/dist/components/Box/Box.constants.d.mts +16 -1
  31. package/dist/components/Box/Box.constants.d.mts.map +1 -1
  32. package/dist/components/Box/Box.constants.mjs +217 -0
  33. package/dist/components/Box/Box.constants.mjs.map +1 -1
  34. package/dist/components/Box/Box.d.cts +1 -1
  35. package/dist/components/Box/Box.d.cts.map +1 -1
  36. package/dist/components/Box/Box.d.mts +1 -1
  37. package/dist/components/Box/Box.d.mts.map +1 -1
  38. package/dist/components/Box/Box.mjs +23 -6
  39. package/dist/components/Box/Box.mjs.map +1 -1
  40. package/dist/components/Box/Box.types.cjs.map +1 -1
  41. package/dist/components/Box/Box.types.d.cts +84 -1
  42. package/dist/components/Box/Box.types.d.cts.map +1 -1
  43. package/dist/components/Box/Box.types.d.mts +84 -1
  44. package/dist/components/Box/Box.types.d.mts.map +1 -1
  45. package/dist/components/Box/Box.types.mjs.map +1 -1
  46. package/dist/components/Box/index.cjs.map +1 -1
  47. package/dist/components/Box/index.d.cts +1 -1
  48. package/dist/components/Box/index.d.cts.map +1 -1
  49. package/dist/components/Box/index.d.mts +1 -1
  50. package/dist/components/Box/index.d.mts.map +1 -1
  51. package/dist/components/Box/index.mjs.map +1 -1
  52. package/dist/components/Button/Button.cjs +1 -1
  53. package/dist/components/Button/Button.cjs.map +1 -1
  54. package/dist/components/Button/Button.mjs +1 -1
  55. package/dist/components/Button/Button.mjs.map +1 -1
  56. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.cjs +29 -57
  57. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.cjs.map +1 -1
  58. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.d.cts +1 -1
  59. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.d.cts.map +1 -1
  60. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.d.mts +1 -1
  61. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.d.mts.map +1 -1
  62. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.mjs +30 -58
  63. package/dist/components/Button/variants/ButtonPrimary/ButtonPrimary.mjs.map +1 -1
  64. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.cjs +46 -53
  65. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.cjs.map +1 -1
  66. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.d.cts +1 -1
  67. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.d.cts.map +1 -1
  68. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.d.mts +1 -1
  69. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.d.mts.map +1 -1
  70. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.mjs +47 -54
  71. package/dist/components/Button/variants/ButtonSecondary/ButtonSecondary.mjs.map +1 -1
  72. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.cjs +53 -59
  73. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.cjs.map +1 -1
  74. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.cts +1 -1
  75. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.cts.map +1 -1
  76. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.mts +1 -1
  77. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.mts.map +1 -1
  78. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.mjs +54 -60
  79. package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.mjs.map +1 -1
  80. package/dist/components/ButtonBase/ButtonBase.cjs +110 -28
  81. package/dist/components/ButtonBase/ButtonBase.cjs.map +1 -1
  82. package/dist/components/ButtonBase/ButtonBase.constants.cjs +10 -0
  83. package/dist/components/ButtonBase/ButtonBase.constants.cjs.map +1 -0
  84. package/dist/components/ButtonBase/ButtonBase.constants.d.cts +3 -0
  85. package/dist/components/ButtonBase/ButtonBase.constants.d.cts.map +1 -0
  86. package/dist/components/ButtonBase/ButtonBase.constants.d.mts +3 -0
  87. package/dist/components/ButtonBase/ButtonBase.constants.d.mts.map +1 -0
  88. package/dist/components/ButtonBase/ButtonBase.constants.mjs +7 -0
  89. package/dist/components/ButtonBase/ButtonBase.constants.mjs.map +1 -0
  90. package/dist/components/ButtonBase/ButtonBase.d.cts +1 -1
  91. package/dist/components/ButtonBase/ButtonBase.d.cts.map +1 -1
  92. package/dist/components/ButtonBase/ButtonBase.d.mts +1 -1
  93. package/dist/components/ButtonBase/ButtonBase.d.mts.map +1 -1
  94. package/dist/components/ButtonBase/ButtonBase.mjs +88 -26
  95. package/dist/components/ButtonBase/ButtonBase.mjs.map +1 -1
  96. package/dist/components/ButtonBase/ButtonBase.types.cjs.map +1 -1
  97. package/dist/components/ButtonBase/ButtonBase.types.d.cts +42 -3
  98. package/dist/components/ButtonBase/ButtonBase.types.d.cts.map +1 -1
  99. package/dist/components/ButtonBase/ButtonBase.types.d.mts +42 -3
  100. package/dist/components/ButtonBase/ButtonBase.types.d.mts.map +1 -1
  101. package/dist/components/ButtonBase/ButtonBase.types.mjs.map +1 -1
  102. package/dist/components/ButtonBase/index.cjs +3 -1
  103. package/dist/components/ButtonBase/index.cjs.map +1 -1
  104. package/dist/components/ButtonBase/index.d.cts +1 -0
  105. package/dist/components/ButtonBase/index.d.cts.map +1 -1
  106. package/dist/components/ButtonBase/index.d.mts +1 -0
  107. package/dist/components/ButtonBase/index.d.mts.map +1 -1
  108. package/dist/components/ButtonBase/index.mjs +1 -0
  109. package/dist/components/ButtonBase/index.mjs.map +1 -1
  110. package/dist/components/ButtonIcon/ButtonIcon.cjs +9 -1
  111. package/dist/components/ButtonIcon/ButtonIcon.cjs.map +1 -1
  112. package/dist/components/ButtonIcon/ButtonIcon.d.cts.map +1 -1
  113. package/dist/components/ButtonIcon/ButtonIcon.d.mts.map +1 -1
  114. package/dist/components/ButtonIcon/ButtonIcon.mjs +9 -1
  115. package/dist/components/ButtonIcon/ButtonIcon.mjs.map +1 -1
  116. package/dist/components/Checkbox/Checkbox.cjs +1 -1
  117. package/dist/components/Checkbox/Checkbox.cjs.map +1 -1
  118. package/dist/components/Checkbox/Checkbox.mjs +1 -1
  119. package/dist/components/Checkbox/Checkbox.mjs.map +1 -1
  120. package/dist/components/Checkbox/Checkbox.types.d.cts +0 -1
  121. package/dist/components/Checkbox/Checkbox.types.d.cts.map +1 -1
  122. package/dist/components/Checkbox/Checkbox.types.d.mts +0 -1
  123. package/dist/components/Checkbox/Checkbox.types.d.mts.map +1 -1
  124. package/dist/components/Icon/Icon.assets.cjs +2 -3
  125. package/dist/components/Icon/Icon.assets.cjs.map +1 -1
  126. package/dist/components/Icon/Icon.assets.mjs +2 -3
  127. package/dist/components/Icon/Icon.assets.mjs.map +1 -1
  128. package/dist/components/Text/Text.constants.cjs +9 -0
  129. package/dist/components/Text/Text.constants.cjs.map +1 -1
  130. package/dist/components/Text/Text.constants.d.cts.map +1 -1
  131. package/dist/components/Text/Text.constants.d.mts.map +1 -1
  132. package/dist/components/Text/Text.constants.mjs +9 -0
  133. package/dist/components/Text/Text.constants.mjs.map +1 -1
  134. package/dist/components/Text/Text.types.cjs.map +1 -1
  135. package/dist/components/Text/Text.types.d.cts +1 -2
  136. package/dist/components/Text/Text.types.d.cts.map +1 -1
  137. package/dist/components/Text/Text.types.d.mts +1 -2
  138. package/dist/components/Text/Text.types.d.mts.map +1 -1
  139. package/dist/components/Text/Text.types.mjs.map +1 -1
  140. package/dist/components/TextButton/TextButton.cjs +1 -0
  141. package/dist/components/TextButton/TextButton.cjs.map +1 -1
  142. package/dist/components/TextButton/TextButton.d.cts.map +1 -1
  143. package/dist/components/TextButton/TextButton.d.mts.map +1 -1
  144. package/dist/components/TextButton/TextButton.mjs +1 -0
  145. package/dist/components/TextButton/TextButton.mjs.map +1 -1
  146. package/dist/components/TextButton/TextButton.types.d.cts +0 -1
  147. package/dist/components/TextButton/TextButton.types.d.cts.map +1 -1
  148. package/dist/components/TextButton/TextButton.types.d.mts +0 -1
  149. package/dist/components/TextButton/TextButton.types.d.mts.map +1 -1
  150. package/dist/components/temp-components/ImageOrSvg/ImageOrSvg.types.d.cts +0 -1
  151. package/dist/components/temp-components/ImageOrSvg/ImageOrSvg.types.d.cts.map +1 -1
  152. package/dist/components/temp-components/ImageOrSvg/ImageOrSvg.types.d.mts +0 -1
  153. package/dist/components/temp-components/ImageOrSvg/ImageOrSvg.types.d.mts.map +1 -1
  154. package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.cts +0 -1
  155. package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.cts.map +1 -1
  156. package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.mts +0 -1
  157. package/dist/components/temp-components/TextOrChildren/TextOrChildren.types.d.mts.map +1 -1
  158. package/dist/types/index.cjs +143 -4
  159. package/dist/types/index.cjs.map +1 -1
  160. package/dist/types/index.d.cts +141 -4
  161. package/dist/types/index.d.cts.map +1 -1
  162. package/dist/types/index.d.mts +141 -4
  163. package/dist/types/index.d.mts.map +1 -1
  164. package/dist/types/index.mjs +142 -3
  165. package/dist/types/index.mjs.map +1 -1
  166. package/package.json +13 -13
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonBase.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport { ButtonBaseSize } from '../../types';\nimport { Icon } from '../Icon';\nimport { IconColor, IconSize } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\nimport { Spinner } from '../temp-components/Spinner';\nimport { TextOrChildren } from '../temp-components/TextOrChildren/TextOrChildren';\nimport { TextVariant, FontWeight, TextColor } from '../Text';\n\nimport type { ButtonBaseProps } from './ButtonBase.types';\n\nexport const ButtonBase = ({\n children,\n textProps,\n size = ButtonBaseSize.Lg,\n isLoading,\n loadingText,\n spinnerProps,\n startIconName,\n startIconProps,\n startAccessory,\n endIconName,\n endIconProps,\n endAccessory,\n isDisabled,\n isFullWidth,\n twClassName = '',\n style,\n ...props\n}: ButtonBaseProps) => {\n const tw = useTailwind();\n const twContainerClassNames = `\n flex-row items-center justify-center rounded-full bg-muted px-4 min-w-[80px] overflow-hidden\n h-[${size}px]\n ${isDisabled ? 'opacity-50' : 'opacity-100'}\n ${isFullWidth ? 'self-stretch' : 'self-start'}\n ${twClassName}\n `;\n\n const finalStartIconName = startIconName ?? startIconProps?.name;\n const finalEndIconName = endIconName ?? endIconProps?.name;\n\n return (\n <ButtonAnimated\n disabled={isDisabled || isLoading}\n accessibilityRole=\"button\"\n accessible\n style={[tw`${twContainerClassNames}`, style]}\n {...props}\n >\n <View\n style={tw`absolute inset-0 flex items-center justify-center ${\n isLoading ? 'opacity-100' : 'opacity-0'\n }`}\n testID=\"spinner-container\"\n >\n <Spinner\n color={IconColor.IconDefault}\n loadingText={loadingText}\n loadingTextProps={{ numberOfLines: 1 }}\n {...spinnerProps}\n />\n </View>\n <View\n style={tw`flex-row items-center justify-center gap-x-2 ${\n isLoading ? 'opacity-0' : 'opacity-100'\n }`}\n testID=\"content-container\"\n >\n {finalStartIconName ? (\n <Icon\n name={finalStartIconName}\n size={IconSize.Sm}\n twClassName=\"shrink-0\"\n {...startIconProps}\n />\n ) : (\n startAccessory\n )}\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n twClassName: 'shrink grow-0 flex-wrap text-center',\n ...textProps,\n }}\n >\n {children}\n </TextOrChildren>\n {finalEndIconName ? (\n <Icon\n name={finalEndIconName}\n size={IconSize.Sm}\n twClassName=\"shrink-0\"\n {...endIconProps}\n />\n ) : (\n endAccessory\n )}\n </View>\n </ButtonAnimated>\n );\n};\n"]}
1
+ {"version":3,"file":"ButtonBase.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useMemo } from 'react';\nimport { View } from 'react-native';\nimport type { StyleProp, ViewStyle } from 'react-native';\n\nimport { ButtonBaseSize } from '../../types';\nimport { Icon } from '../Icon';\nimport { IconColor, IconSize } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\nimport { Spinner } from '../temp-components/Spinner';\nimport { TextOrChildren } from '../temp-components/TextOrChildren/TextOrChildren';\nimport { TextVariant, FontWeight, TextColor } from '../Text';\n\nimport { TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION } from './ButtonBase.constants';\nimport type { ButtonBaseProps } from './ButtonBase.types';\n\nexport const ButtonBase = ({\n children,\n textProps,\n size = ButtonBaseSize.Lg,\n isLoading,\n loadingText,\n spinnerProps,\n startIconName,\n startIconProps,\n startAccessory,\n endIconName,\n endIconProps,\n endAccessory,\n isDisabled,\n isFullWidth,\n twClassName = '',\n textClassName,\n iconClassName,\n style,\n accessibilityLabel,\n accessibilityHint,\n accessibilityRole = 'button',\n accessibilityActions,\n onAccessibilityAction,\n ...props\n}: ButtonBaseProps) => {\n const tw = useTailwind();\n\n const finalStartIconName = startIconName ?? startIconProps?.name;\n const finalEndIconName = endIconName ?? endIconProps?.name;\n\n // Generate accessibility label if not provided\n const finalAccessibilityLabel = useMemo(() => {\n if (accessibilityLabel) {\n return accessibilityLabel;\n }\n\n // For loading state with loadingText, prioritize loadingText\n if (isLoading && loadingText) {\n return loadingText;\n }\n\n // If children is a string, use it as the label\n if (typeof children === 'string') {\n return children;\n }\n\n return undefined;\n }, [accessibilityLabel, children, isLoading, loadingText]);\n\n // Generate accessibility hint for loading state if not provided\n const finalAccessibilityHint = useMemo(() => {\n if (accessibilityHint) {\n return accessibilityHint;\n }\n\n if (isLoading) {\n return 'Button is currently loading, please wait';\n }\n\n return undefined;\n }, [accessibilityHint, isLoading]);\n\n // Create accessibilityState object with only truthy values\n const accessibilityState = useMemo(() => {\n const state: { disabled?: boolean; busy?: boolean } = {};\n\n if (isDisabled || isLoading) {\n state.disabled = true;\n }\n\n if (isLoading) {\n state.busy = true;\n }\n\n return state;\n }, [isDisabled, isLoading]);\n\n return (\n <ButtonAnimated\n disabled={isDisabled || isLoading}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={finalAccessibilityLabel}\n accessibilityHint={finalAccessibilityHint}\n accessibilityActions={accessibilityActions}\n onAccessibilityAction={onAccessibilityAction}\n accessibilityState={accessibilityState}\n accessible\n style={({ pressed }) => {\n const containerClassName =\n typeof twClassName === 'function'\n ? twClassName(pressed)\n : twClassName;\n\n const baseContainerClassNames = `\n flex-row items-center justify-center rounded-xl bg-muted px-4 min-w-[80px] overflow-hidden\n ${TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION[size]}\n ${isDisabled ? 'opacity-50' : 'opacity-100'}\n ${isFullWidth ? 'w-full' : 'w-auto'}\n ${containerClassName}\n `;\n\n const computedStyle: StyleProp<ViewStyle>[] = [\n tw`${baseContainerClassNames}`,\n ];\n if (typeof style === 'function') {\n const additionalStyle = style({ pressed });\n if (additionalStyle) {\n computedStyle.push(additionalStyle);\n }\n } else if (style) {\n computedStyle.push(style);\n }\n\n return computedStyle;\n }}\n {...props}\n >\n {({ pressed }) => (\n <>\n <View\n style={tw`absolute inset-0 flex items-center justify-center ${\n isLoading ? 'opacity-100' : 'opacity-0'\n }`}\n testID=\"spinner-container\"\n >\n <Spinner\n color={\n textClassName\n ? (textClassName(pressed) as IconColor)\n : IconColor.IconDefault\n }\n loadingText={loadingText}\n loadingTextProps={{\n numberOfLines: 1,\n twClassName: textClassName ? textClassName(pressed) : '',\n ...spinnerProps?.loadingTextProps,\n }}\n {...spinnerProps}\n />\n </View>\n <View\n style={tw`flex-row items-center justify-center gap-x-2 ${\n isLoading ? 'opacity-0' : 'opacity-100'\n }`}\n testID=\"content-container\"\n >\n {finalStartIconName ? (\n <Icon\n name={finalStartIconName}\n size={IconSize.Sm}\n twClassName={`shrink-0 ${iconClassName ? iconClassName(pressed) : ''}`}\n {...startIconProps}\n />\n ) : (\n startAccessory\n )}\n <TextOrChildren\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n twClassName: `shrink grow-0 flex-wrap text-center ${textClassName ? textClassName(pressed) : ''}`,\n ...textProps,\n }}\n >\n {children}\n </TextOrChildren>\n {finalEndIconName ? (\n <Icon\n name={finalEndIconName}\n size={IconSize.Sm}\n twClassName={`shrink-0 ${iconClassName ? iconClassName(pressed) : ''}`}\n {...endIconProps}\n />\n ) : (\n endAccessory\n )}\n </View>\n </>\n )}\n </ButtonAnimated>\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonBase.types.cjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { PressableProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { ButtonBaseSize } from '../../types';\nimport type { IconProps, IconName } from '../Icon';\nimport type { SpinnerProps } from '../temp-components/Spinner';\nimport type { TextProps } from '../Text';\n\n/**\n * ButtonBase component props.\n */\nexport type ButtonBaseProps = {\n /**\n * Required prop for the content to be rendered within the ButtonBase\n */\n children: React.ReactNode | string;\n /**\n * Optional props to be passed to the Text component when children is a string\n */\n textProps?: Omit<Partial<TextProps>, 'children'>;\n /**\n * Optional prop to control the size of the ButtonBase\n * Possible values: ButtonBaseSize.Sm (32px), ButtonBaseSize.Md (40px), ButtonBaseSize.Lg (48px)\n *\n * @default ButtonBaseSize.Lg\n */\n size?: ButtonBaseSize;\n /**\n * Optional prop that when true, shows a loading spinner\n *\n * @default false\n */\n isLoading?: boolean;\n /**\n * Optional prop for text to display when button is in loading state\n */\n loadingText?: string;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n spinnerProps?: Partial<SpinnerProps>;\n /**\n * Optional prop to specify an icon to show at the start of the button\n */\n startIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the start icon\n */\n startIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the start of the button\n */\n startAccessory?: React.ReactNode;\n /**\n * Optional prop to specify an icon to show at the end of the button\n */\n endIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n endIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the end of the button\n */\n endAccessory?: React.ReactNode;\n /**\n * Optional prop that when true, disables the button\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional prop that when true, makes the button take up the full width of its container\n *\n * @default false\n */\n isFullWidth?: boolean;\n /**\n * Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n /**\n * Optional prop to control the style.\n */\n style?: StyleProp<ViewStyle>;\n} & PressableProps;\n"]}
1
+ {"version":3,"file":"ButtonBase.types.cjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { PressableProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { ButtonBaseSize } from '../../types';\nimport type { IconProps, IconName } from '../Icon';\nimport type { SpinnerProps } from '../temp-components/Spinner';\nimport type { TextProps } from '../Text';\n\n/**\n * ButtonBase component props.\n */\nexport type ButtonBaseProps = {\n /**\n * Required prop for the content to be rendered within the ButtonBase\n */\n children: React.ReactNode | string;\n /**\n * Optional props to be passed to the Text component when children is a string\n */\n textProps?: Omit<Partial<TextProps>, 'children'>;\n /**\n * Optional prop to control the size of the ButtonBase\n * Possible values: ButtonBaseSize.Sm (32px), ButtonBaseSize.Md (40px), ButtonBaseSize.Lg (48px)\n *\n * @default ButtonBaseSize.Lg\n */\n size?: ButtonBaseSize;\n /**\n * Optional prop that when true, shows a loading spinner\n *\n * @default false\n */\n isLoading?: boolean;\n /**\n * Optional prop for text to display when button is in loading state\n */\n loadingText?: string;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n spinnerProps?: Partial<SpinnerProps>;\n /**\n * Optional prop to specify an icon to show at the start of the button\n */\n startIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the start icon\n */\n startIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the start of the button\n */\n startAccessory?: React.ReactNode;\n /**\n * Optional prop to specify an icon to show at the end of the button\n */\n endIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n endIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the end of the button\n */\n endAccessory?: React.ReactNode;\n /**\n * Optional prop that when true, disables the button\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional prop that when true, makes the button take up the full width of its container\n *\n * @default false\n */\n isFullWidth?: boolean;\n /**\n * Optional prop to add twrnc overriding classNames.\n * Can be a string or a function that receives pressed state and returns a string.\n */\n twClassName?: string | ((pressed: boolean) => string);\n /**\n * Optional prop to control text className based on pressed state.\n */\n textClassName?: (pressed: boolean) => string;\n /**\n * Optional prop to control icon className based on pressed state.\n */\n iconClassName?: (pressed: boolean) => string;\n /**\n * Optional prop to control the style.\n */\n style?: StyleProp<ViewStyle>;\n /**\n * Optional accessibility label to describe the button for screen readers.\n * If not provided, the button content will be used as the label.\n */\n accessibilityLabel?: string;\n /**\n * Optional accessibility hint to provide additional context about the button's action.\n * Should describe what happens when the button is pressed.\n */\n accessibilityHint?: string;\n /**\n * Optional accessibility role. Defaults to 'button'.\n * Can be overridden for specific use cases.\n */\n accessibilityRole?: 'button' | 'link' | 'menuitem' | 'tab' | 'none';\n /**\n * Optional accessibility actions for custom interactions.\n * Use sparingly and only when default button behavior is insufficient.\n */\n accessibilityActions?: {\n name: string;\n label?: string;\n }[];\n /**\n * Optional callback for handling accessibility action events.\n */\n onAccessibilityAction?: (event: {\n nativeEvent: { actionName: string };\n }) => void;\n} & Omit<\n PressableProps,\n | 'accessibilityRole'\n | 'accessibilityLabel'\n | 'accessibilityHint'\n | 'accessibilityActions'\n | 'onAccessibilityAction'\n>;\n"]}
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { PressableProps, StyleProp, ViewStyle } from "react-native/index.js";
3
2
  import type { ButtonBaseSize } from "../../types/index.cjs";
4
3
  import type { IconProps, IconName } from "../Icon/index.cjs";
@@ -75,11 +74,51 @@ export type ButtonBaseProps = {
75
74
  isFullWidth?: boolean;
76
75
  /**
77
76
  * Optional prop to add twrnc overriding classNames.
77
+ * Can be a string or a function that receives pressed state and returns a string.
78
78
  */
79
- twClassName?: string;
79
+ twClassName?: string | ((pressed: boolean) => string);
80
+ /**
81
+ * Optional prop to control text className based on pressed state.
82
+ */
83
+ textClassName?: (pressed: boolean) => string;
84
+ /**
85
+ * Optional prop to control icon className based on pressed state.
86
+ */
87
+ iconClassName?: (pressed: boolean) => string;
80
88
  /**
81
89
  * Optional prop to control the style.
82
90
  */
83
91
  style?: StyleProp<ViewStyle>;
84
- } & PressableProps;
92
+ /**
93
+ * Optional accessibility label to describe the button for screen readers.
94
+ * If not provided, the button content will be used as the label.
95
+ */
96
+ accessibilityLabel?: string;
97
+ /**
98
+ * Optional accessibility hint to provide additional context about the button's action.
99
+ * Should describe what happens when the button is pressed.
100
+ */
101
+ accessibilityHint?: string;
102
+ /**
103
+ * Optional accessibility role. Defaults to 'button'.
104
+ * Can be overridden for specific use cases.
105
+ */
106
+ accessibilityRole?: 'button' | 'link' | 'menuitem' | 'tab' | 'none';
107
+ /**
108
+ * Optional accessibility actions for custom interactions.
109
+ * Use sparingly and only when default button behavior is insufficient.
110
+ */
111
+ accessibilityActions?: {
112
+ name: string;
113
+ label?: string;
114
+ }[];
115
+ /**
116
+ * Optional callback for handling accessibility action events.
117
+ */
118
+ onAccessibilityAction?: (event: {
119
+ nativeEvent: {
120
+ actionName: string;
121
+ };
122
+ }) => void;
123
+ } & Omit<PressableProps, 'accessibilityRole' | 'accessibilityLabel' | 'accessibilityHint' | 'accessibilityActions' | 'onAccessibilityAction'>;
85
124
  //# sourceMappingURL=ButtonBase.types.d.cts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonBase.types.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEzE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,6CAAmC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACnC;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACjD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IACrC;;OAEG;IACH,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,cAAc,CAAC"}
1
+ {"version":3,"file":"ButtonBase.types.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEzE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,6CAAmC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACnC;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACjD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IACrC;;OAEG;IACH,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC,CAAC;IACtD;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC;IAC7C;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC;IAC7C;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,UAAU,GAAG,KAAK,GAAG,MAAM,CAAC;IACpE;;;OAGG;IACH,oBAAoB,CAAC,EAAE;QACrB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,EAAE,CAAC;IACJ;;OAEG;IACH,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC9B,WAAW,EAAE;YAAE,UAAU,EAAE,MAAM,CAAA;SAAE,CAAC;KACrC,KAAK,IAAI,CAAC;CACZ,GAAG,IAAI,CACN,cAAc,EACZ,mBAAmB,GACnB,oBAAoB,GACpB,mBAAmB,GACnB,sBAAsB,GACtB,uBAAuB,CAC1B,CAAC"}
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { PressableProps, StyleProp, ViewStyle } from "react-native/index.js";
3
2
  import type { ButtonBaseSize } from "../../types/index.mjs";
4
3
  import type { IconProps, IconName } from "../Icon/index.mjs";
@@ -75,11 +74,51 @@ export type ButtonBaseProps = {
75
74
  isFullWidth?: boolean;
76
75
  /**
77
76
  * Optional prop to add twrnc overriding classNames.
77
+ * Can be a string or a function that receives pressed state and returns a string.
78
78
  */
79
- twClassName?: string;
79
+ twClassName?: string | ((pressed: boolean) => string);
80
+ /**
81
+ * Optional prop to control text className based on pressed state.
82
+ */
83
+ textClassName?: (pressed: boolean) => string;
84
+ /**
85
+ * Optional prop to control icon className based on pressed state.
86
+ */
87
+ iconClassName?: (pressed: boolean) => string;
80
88
  /**
81
89
  * Optional prop to control the style.
82
90
  */
83
91
  style?: StyleProp<ViewStyle>;
84
- } & PressableProps;
92
+ /**
93
+ * Optional accessibility label to describe the button for screen readers.
94
+ * If not provided, the button content will be used as the label.
95
+ */
96
+ accessibilityLabel?: string;
97
+ /**
98
+ * Optional accessibility hint to provide additional context about the button's action.
99
+ * Should describe what happens when the button is pressed.
100
+ */
101
+ accessibilityHint?: string;
102
+ /**
103
+ * Optional accessibility role. Defaults to 'button'.
104
+ * Can be overridden for specific use cases.
105
+ */
106
+ accessibilityRole?: 'button' | 'link' | 'menuitem' | 'tab' | 'none';
107
+ /**
108
+ * Optional accessibility actions for custom interactions.
109
+ * Use sparingly and only when default button behavior is insufficient.
110
+ */
111
+ accessibilityActions?: {
112
+ name: string;
113
+ label?: string;
114
+ }[];
115
+ /**
116
+ * Optional callback for handling accessibility action events.
117
+ */
118
+ onAccessibilityAction?: (event: {
119
+ nativeEvent: {
120
+ actionName: string;
121
+ };
122
+ }) => void;
123
+ } & Omit<PressableProps, 'accessibilityRole' | 'accessibilityLabel' | 'accessibilityHint' | 'accessibilityActions' | 'onAccessibilityAction'>;
85
124
  //# sourceMappingURL=ButtonBase.types.d.mts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEzE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,6CAAmC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACnC;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACjD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IACrC;;OAEG;IACH,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,cAAc,CAAC"}
1
+ {"version":3,"file":"ButtonBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEzE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,6CAAmC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACnC;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACjD;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IACrC;;OAEG;IACH,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC,CAAC;IACtD;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC;IAC7C;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC;IAC7C;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,UAAU,GAAG,KAAK,GAAG,MAAM,CAAC;IACpE;;;OAGG;IACH,oBAAoB,CAAC,EAAE;QACrB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,EAAE,CAAC;IACJ;;OAEG;IACH,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC9B,WAAW,EAAE;YAAE,UAAU,EAAE,MAAM,CAAA;SAAE,CAAC;KACrC,KAAK,IAAI,CAAC;CACZ,GAAG,IAAI,CACN,cAAc,EACZ,mBAAmB,GACnB,oBAAoB,GACpB,mBAAmB,GACnB,sBAAsB,GACtB,uBAAuB,CAC1B,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonBase.types.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { PressableProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { ButtonBaseSize } from '../../types';\nimport type { IconProps, IconName } from '../Icon';\nimport type { SpinnerProps } from '../temp-components/Spinner';\nimport type { TextProps } from '../Text';\n\n/**\n * ButtonBase component props.\n */\nexport type ButtonBaseProps = {\n /**\n * Required prop for the content to be rendered within the ButtonBase\n */\n children: React.ReactNode | string;\n /**\n * Optional props to be passed to the Text component when children is a string\n */\n textProps?: Omit<Partial<TextProps>, 'children'>;\n /**\n * Optional prop to control the size of the ButtonBase\n * Possible values: ButtonBaseSize.Sm (32px), ButtonBaseSize.Md (40px), ButtonBaseSize.Lg (48px)\n *\n * @default ButtonBaseSize.Lg\n */\n size?: ButtonBaseSize;\n /**\n * Optional prop that when true, shows a loading spinner\n *\n * @default false\n */\n isLoading?: boolean;\n /**\n * Optional prop for text to display when button is in loading state\n */\n loadingText?: string;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n spinnerProps?: Partial<SpinnerProps>;\n /**\n * Optional prop to specify an icon to show at the start of the button\n */\n startIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the start icon\n */\n startIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the start of the button\n */\n startAccessory?: React.ReactNode;\n /**\n * Optional prop to specify an icon to show at the end of the button\n */\n endIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n endIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the end of the button\n */\n endAccessory?: React.ReactNode;\n /**\n * Optional prop that when true, disables the button\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional prop that when true, makes the button take up the full width of its container\n *\n * @default false\n */\n isFullWidth?: boolean;\n /**\n * Optional prop to add twrnc overriding classNames.\n */\n twClassName?: string;\n /**\n * Optional prop to control the style.\n */\n style?: StyleProp<ViewStyle>;\n} & PressableProps;\n"]}
1
+ {"version":3,"file":"ButtonBase.types.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { PressableProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { ButtonBaseSize } from '../../types';\nimport type { IconProps, IconName } from '../Icon';\nimport type { SpinnerProps } from '../temp-components/Spinner';\nimport type { TextProps } from '../Text';\n\n/**\n * ButtonBase component props.\n */\nexport type ButtonBaseProps = {\n /**\n * Required prop for the content to be rendered within the ButtonBase\n */\n children: React.ReactNode | string;\n /**\n * Optional props to be passed to the Text component when children is a string\n */\n textProps?: Omit<Partial<TextProps>, 'children'>;\n /**\n * Optional prop to control the size of the ButtonBase\n * Possible values: ButtonBaseSize.Sm (32px), ButtonBaseSize.Md (40px), ButtonBaseSize.Lg (48px)\n *\n * @default ButtonBaseSize.Lg\n */\n size?: ButtonBaseSize;\n /**\n * Optional prop that when true, shows a loading spinner\n *\n * @default false\n */\n isLoading?: boolean;\n /**\n * Optional prop for text to display when button is in loading state\n */\n loadingText?: string;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n spinnerProps?: Partial<SpinnerProps>;\n /**\n * Optional prop to specify an icon to show at the start of the button\n */\n startIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the start icon\n */\n startIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the start of the button\n */\n startAccessory?: React.ReactNode;\n /**\n * Optional prop to specify an icon to show at the end of the button\n */\n endIconName?: IconName;\n /**\n * Optional prop to pass additional properties to the end icon\n */\n endIconProps?: Partial<IconProps>;\n /**\n * Optional prop for a custom element to show at the end of the button\n */\n endAccessory?: React.ReactNode;\n /**\n * Optional prop that when true, disables the button\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Optional prop that when true, makes the button take up the full width of its container\n *\n * @default false\n */\n isFullWidth?: boolean;\n /**\n * Optional prop to add twrnc overriding classNames.\n * Can be a string or a function that receives pressed state and returns a string.\n */\n twClassName?: string | ((pressed: boolean) => string);\n /**\n * Optional prop to control text className based on pressed state.\n */\n textClassName?: (pressed: boolean) => string;\n /**\n * Optional prop to control icon className based on pressed state.\n */\n iconClassName?: (pressed: boolean) => string;\n /**\n * Optional prop to control the style.\n */\n style?: StyleProp<ViewStyle>;\n /**\n * Optional accessibility label to describe the button for screen readers.\n * If not provided, the button content will be used as the label.\n */\n accessibilityLabel?: string;\n /**\n * Optional accessibility hint to provide additional context about the button's action.\n * Should describe what happens when the button is pressed.\n */\n accessibilityHint?: string;\n /**\n * Optional accessibility role. Defaults to 'button'.\n * Can be overridden for specific use cases.\n */\n accessibilityRole?: 'button' | 'link' | 'menuitem' | 'tab' | 'none';\n /**\n * Optional accessibility actions for custom interactions.\n * Use sparingly and only when default button behavior is insufficient.\n */\n accessibilityActions?: {\n name: string;\n label?: string;\n }[];\n /**\n * Optional callback for handling accessibility action events.\n */\n onAccessibilityAction?: (event: {\n nativeEvent: { actionName: string };\n }) => void;\n} & Omit<\n PressableProps,\n | 'accessibilityRole'\n | 'accessibilityLabel'\n | 'accessibilityHint'\n | 'accessibilityActions'\n | 'onAccessibilityAction'\n>;\n"]}
@@ -1,8 +1,10 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.ButtonBase = exports.ButtonBaseSize = void 0;
3
+ exports.TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION = exports.ButtonBase = exports.ButtonBaseSize = void 0;
4
4
  var types_1 = require("../../types/index.cjs");
5
5
  Object.defineProperty(exports, "ButtonBaseSize", { enumerable: true, get: function () { return types_1.ButtonBaseSize; } });
6
6
  var ButtonBase_1 = require("./ButtonBase.cjs");
7
7
  Object.defineProperty(exports, "ButtonBase", { enumerable: true, get: function () { return ButtonBase_1.ButtonBase; } });
8
+ var ButtonBase_constants_1 = require("./ButtonBase.constants.cjs");
9
+ Object.defineProperty(exports, "TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION", { enumerable: true, get: function () { return ButtonBase_constants_1.TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION; } });
8
10
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":";;;AAAA,+CAA6C;AAApC,uGAAA,cAAc,OAAA;AACvB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { ButtonBaseSize } from '../../types';\nexport { ButtonBase } from './ButtonBase';\nexport type { ButtonBaseProps } from './ButtonBase.types';\n"]}
1
+ {"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":";;;AAAA,+CAA6C;AAApC,uGAAA,cAAc,OAAA;AACvB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA;AACnB,mEAA8E;AAArE,4IAAA,oCAAoC,OAAA","sourcesContent":["export { ButtonBaseSize } from '../../types';\nexport { ButtonBase } from './ButtonBase';\nexport { TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION } from './ButtonBase.constants';\nexport type { ButtonBaseProps } from './ButtonBase.types';\n"]}
@@ -1,4 +1,5 @@
1
1
  export { ButtonBaseSize } from "../../types/index.cjs";
2
2
  export { ButtonBase } from "./ButtonBase.cjs";
3
+ export { TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION } from "./ButtonBase.constants.cjs";
3
4
  export type { ButtonBaseProps } from "./ButtonBase.types.cjs";
4
5
  //# sourceMappingURL=index.d.cts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
1
+ {"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,OAAO,EAAE,oCAAoC,EAAE,mCAA+B;AAC9E,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
@@ -1,4 +1,5 @@
1
1
  export { ButtonBaseSize } from "../../types/index.mjs";
2
2
  export { ButtonBase } from "./ButtonBase.mjs";
3
+ export { TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION } from "./ButtonBase.constants.mjs";
3
4
  export type { ButtonBaseProps } from "./ButtonBase.types.mjs";
4
5
  //# sourceMappingURL=index.d.mts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
1
+ {"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,OAAO,EAAE,oCAAoC,EAAE,mCAA+B;AAC9E,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
@@ -1,3 +1,4 @@
1
1
  export { ButtonBaseSize } from "../../types/index.mjs";
2
2
  export { ButtonBase } from "./ButtonBase.mjs";
3
+ export { TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION } from "./ButtonBase.constants.mjs";
3
4
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export { ButtonBaseSize } from '../../types';\nexport { ButtonBase } from './ButtonBase';\nexport type { ButtonBaseProps } from './ButtonBase.types';\n"]}
1
+ {"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,OAAO,EAAE,oCAAoC,EAAE,mCAA+B","sourcesContent":["export { ButtonBaseSize } from '../../types';\nexport { ButtonBase } from './ButtonBase';\nexport { TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION } from './ButtonBase.constants';\nexport type { ButtonBaseProps } from './ButtonBase.types';\n"]}
@@ -33,11 +33,19 @@ const ButtonIcon_constants_1 = require("./ButtonIcon.constants.cjs");
33
33
  const ButtonIcon = ({ size = types_1.ButtonIconSize.Md, iconName, iconProps, isDisabled = false, isInverse = false, isFloating = false, onPressIn, onPressOut, twClassName = '', style, ...props }) => {
34
34
  const [isPressed, setIsPressed] = (0, react_1.useState)(false);
35
35
  const tw = (0, design_system_twrnc_preset_1.useTailwind)();
36
+ // Determine background color based on state
37
+ let backgroundColor = 'bg-transparent';
38
+ if (isFloating) {
39
+ backgroundColor = 'bg-icon-default';
40
+ }
41
+ else if (isPressed) {
42
+ backgroundColor = 'bg-pressed';
43
+ }
36
44
  const twContainerClassNames = `
37
45
  items-center justify-center
38
46
  ${ButtonIcon_constants_1.TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size]}
39
47
  ${isFloating ? 'rounded-full' : 'rounded-sm'}
40
- ${isFloating ? 'bg-icon-default' : isPressed ? 'bg-pressed' : 'bg-transparent'}
48
+ ${backgroundColor}
41
49
  ${isDisabled ? 'opacity-50' : 'opacity-100'}
42
50
  ${twClassName}`;
43
51
  const twIconColorClassNames = isInverse || isFloating ? 'text-primary-inverse' : 'text-icon-default';
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8FAA4E;AAC5E,+CAAwC;AAGxC,iDAA6C;AAE7C,4CAA+B;AAC/B,gFAAmE;AAEnE,qEAGgC;AAGzB,MAAM,UAAU,GAAG,CAAC,EACzB,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,QAAQ,EACR,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,UAAU,EACV,WAAW,GAAG,EAAE,EAChB,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAClD,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IACzB,MAAM,qBAAqB,GAAG;;MAE1B,2DAAoC,CAAC,IAAI,CAAC;MAC1C,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY;MAC1C,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,gBAAgB;MAC5E,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa;MACzC,WAAW,EAAE,CAAC;IAElB,MAAM,qBAAqB,GACzB,SAAS,IAAI,UAAU,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAEzE,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACxD,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,SAAS,EAAE,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACzD,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,UAAU,EAAE,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,+BAAc,CACb,QAAQ,CAAC,CAAC,UAAU,CAAC,CACrB,SAAS,CAAC,CAAC,gBAAgB,CAAC,CAC5B,UAAU,CAAC,CAAC,iBAAiB,CAAC,CAC9B,UAAU,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA,GAAG,qBAAqB,EAAE,EAAE,KAAK,CAAC,CAAC,CAC7C,MAAM,CAAC,aAAa,CACpB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,WAAI,CACH,IAAI,CAAC,CAAC,QAAQ,CAAC,CACf,KAAK,CAAC,CAAC,qBAAkC,CAAC,CAC1C,IAAI,CAAC,CAAC,mDAA4B,CAAC,IAAI,CAAC,CAAC,CACzC,IAAI,SAAS,CAAC,EAElB;IAAA,EAAE,+BAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC;AAtDW,QAAA,UAAU,cAsDrB","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useState } from 'react';\nimport type { GestureResponderEvent } from 'react-native';\n\nimport { ButtonIconSize } from '../../types';\nimport type { IconColor } from '../Icon';\nimport { Icon } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\n\nimport {\n MAP_BUTTONICON_SIZE_ICONSIZE,\n TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = ({\n size = ButtonIconSize.Md,\n iconName,\n iconProps,\n isDisabled = false,\n isInverse = false,\n isFloating = false,\n onPressIn,\n onPressOut,\n twClassName = '',\n style,\n ...props\n}: ButtonIconProps) => {\n const [isPressed, setIsPressed] = useState(false);\n const tw = useTailwind();\n const twContainerClassNames = `\n items-center justify-center\n ${TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size]}\n ${isFloating ? 'rounded-full' : 'rounded-sm'}\n ${isFloating ? 'bg-icon-default' : isPressed ? 'bg-pressed' : 'bg-transparent'}\n ${isDisabled ? 'opacity-50' : 'opacity-100'}\n ${twClassName}`;\n\n const twIconColorClassNames =\n isInverse || isFloating ? 'text-primary-inverse' : 'text-icon-default';\n\n const onPressInHandler = (event: GestureResponderEvent) => {\n setIsPressed(true);\n onPressIn?.(event);\n };\n\n const onPressOutHandler = (event: GestureResponderEvent) => {\n setIsPressed(false);\n onPressOut?.(event);\n };\n\n return (\n <ButtonAnimated\n disabled={isDisabled}\n onPressIn={onPressInHandler}\n onPressOut={onPressOutHandler}\n accessible\n style={[tw`${twContainerClassNames}`, style]}\n testID=\"button-icon\"\n {...props}\n >\n <Icon\n name={iconName}\n color={twIconColorClassNames as IconColor}\n size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n {...iconProps}\n />\n </ButtonAnimated>\n );\n};\n"]}
1
+ {"version":3,"file":"ButtonIcon.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8FAA4E;AAC5E,+CAAwC;AAGxC,iDAA6C;AAE7C,4CAA+B;AAC/B,gFAAmE;AAEnE,qEAGgC;AAGzB,MAAM,UAAU,GAAG,CAAC,EACzB,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,QAAQ,EACR,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,UAAU,EACV,WAAW,GAAG,EAAE,EAChB,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAClD,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IAEzB,4CAA4C;IAC5C,IAAI,eAAe,GAAG,gBAAgB,CAAC;IACvC,IAAI,UAAU,EAAE;QACd,eAAe,GAAG,iBAAiB,CAAC;KACrC;SAAM,IAAI,SAAS,EAAE;QACpB,eAAe,GAAG,YAAY,CAAC;KAChC;IAED,MAAM,qBAAqB,GAAG;;MAE1B,2DAAoC,CAAC,IAAI,CAAC;MAC1C,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY;MAC1C,eAAe;MACf,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa;MACzC,WAAW,EAAE,CAAC;IAElB,MAAM,qBAAqB,GACzB,SAAS,IAAI,UAAU,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAEzE,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACxD,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,SAAS,EAAE,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACzD,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,UAAU,EAAE,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,+BAAc,CACb,QAAQ,CAAC,CAAC,UAAU,CAAC,CACrB,SAAS,CAAC,CAAC,gBAAgB,CAAC,CAC5B,UAAU,CAAC,CAAC,iBAAiB,CAAC,CAC9B,UAAU,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA,GAAG,qBAAqB,EAAE,EAAE,KAAK,CAAC,CAAC,CAC7C,MAAM,CAAC,aAAa,CACpB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,WAAI,CACH,IAAI,CAAC,CAAC,QAAQ,CAAC,CACf,KAAK,CAAC,CAAC,qBAAkC,CAAC,CAC1C,IAAI,CAAC,CAAC,mDAA4B,CAAC,IAAI,CAAC,CAAC,CACzC,IAAI,SAAS,CAAC,EAElB;IAAA,EAAE,+BAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC;AA/DW,QAAA,UAAU,cA+DrB","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useState } from 'react';\nimport type { GestureResponderEvent } from 'react-native';\n\nimport { ButtonIconSize } from '../../types';\nimport type { IconColor } from '../Icon';\nimport { Icon } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\n\nimport {\n MAP_BUTTONICON_SIZE_ICONSIZE,\n TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = ({\n size = ButtonIconSize.Md,\n iconName,\n iconProps,\n isDisabled = false,\n isInverse = false,\n isFloating = false,\n onPressIn,\n onPressOut,\n twClassName = '',\n style,\n ...props\n}: ButtonIconProps) => {\n const [isPressed, setIsPressed] = useState(false);\n const tw = useTailwind();\n\n // Determine background color based on state\n let backgroundColor = 'bg-transparent';\n if (isFloating) {\n backgroundColor = 'bg-icon-default';\n } else if (isPressed) {\n backgroundColor = 'bg-pressed';\n }\n\n const twContainerClassNames = `\n items-center justify-center\n ${TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size]}\n ${isFloating ? 'rounded-full' : 'rounded-sm'}\n ${backgroundColor}\n ${isDisabled ? 'opacity-50' : 'opacity-100'}\n ${twClassName}`;\n\n const twIconColorClassNames =\n isInverse || isFloating ? 'text-primary-inverse' : 'text-icon-default';\n\n const onPressInHandler = (event: GestureResponderEvent) => {\n setIsPressed(true);\n onPressIn?.(event);\n };\n\n const onPressOutHandler = (event: GestureResponderEvent) => {\n setIsPressed(false);\n onPressOut?.(event);\n };\n\n return (\n <ButtonAnimated\n disabled={isDisabled}\n onPressIn={onPressInHandler}\n onPressOut={onPressOutHandler}\n accessible\n style={[tw`${twContainerClassNames}`, style]}\n testID=\"button-icon\"\n {...props}\n >\n <Icon\n name={iconName}\n color={twIconColorClassNames as IconColor}\n size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n {...iconProps}\n />\n </ButtonAnimated>\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,cAAc;AAYxC,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,0HAYpB,eAAe,sBA0CjB,CAAC"}
1
+ {"version":3,"file":"ButtonIcon.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,cAAc;AAYxC,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,0HAYpB,eAAe,sBAmDjB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,cAAc;AAYxC,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,0HAYpB,eAAe,sBA0CjB,CAAC"}
1
+ {"version":3,"file":"ButtonIcon.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,cAAc;AAYxC,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,0HAYpB,eAAe,sBAmDjB,CAAC"}
@@ -14,11 +14,19 @@ import { MAP_BUTTONICON_SIZE_ICONSIZE, TWCLASSMAP_BUTTONICON_SIZE_DIMENSION } fr
14
14
  export const ButtonIcon = ({ size = ButtonIconSize.Md, iconName, iconProps, isDisabled = false, isInverse = false, isFloating = false, onPressIn, onPressOut, twClassName = '', style, ...props }) => {
15
15
  const [isPressed, setIsPressed] = useState(false);
16
16
  const tw = useTailwind();
17
+ // Determine background color based on state
18
+ let backgroundColor = 'bg-transparent';
19
+ if (isFloating) {
20
+ backgroundColor = 'bg-icon-default';
21
+ }
22
+ else if (isPressed) {
23
+ backgroundColor = 'bg-pressed';
24
+ }
17
25
  const twContainerClassNames = `
18
26
  items-center justify-center
19
27
  ${TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size]}
20
28
  ${isFloating ? 'rounded-full' : 'rounded-sm'}
21
- ${isFloating ? 'bg-icon-default' : isPressed ? 'bg-pressed' : 'bg-transparent'}
29
+ ${backgroundColor}
22
30
  ${isDisabled ? 'opacity-50' : 'opacity-100'}
23
31
  ${twClassName}`;
24
32
  const twIconColorClassNames = isInverse || isFloating ? 'text-primary-inverse' : 'text-icon-default';
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.mjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,QAAO,EAAE,QAAQ,EAAE,cAAc;;AAGxC,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAE7C,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAC/B,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAEnE,OAAO,EACL,4BAA4B,EAC5B,oCAAoC,EACrC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,QAAQ,EACR,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,UAAU,EACV,WAAW,GAAG,EAAE,EAChB,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IACzB,MAAM,qBAAqB,GAAG;;MAE1B,oCAAoC,CAAC,IAAI,CAAC;MAC1C,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY;MAC1C,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,gBAAgB;MAC5E,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa;MACzC,WAAW,EAAE,CAAC;IAElB,MAAM,qBAAqB,GACzB,SAAS,IAAI,UAAU,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAEzE,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACxD,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,SAAS,EAAE,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACzD,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,UAAU,EAAE,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,cAAc,CACb,QAAQ,CAAC,CAAC,UAAU,CAAC,CACrB,SAAS,CAAC,CAAC,gBAAgB,CAAC,CAC5B,UAAU,CAAC,CAAC,iBAAiB,CAAC,CAC9B,UAAU,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA,GAAG,qBAAqB,EAAE,EAAE,KAAK,CAAC,CAAC,CAC7C,MAAM,CAAC,aAAa,CACpB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,IAAI,CACH,IAAI,CAAC,CAAC,QAAQ,CAAC,CACf,KAAK,CAAC,CAAC,qBAAkC,CAAC,CAC1C,IAAI,CAAC,CAAC,4BAA4B,CAAC,IAAI,CAAC,CAAC,CACzC,IAAI,SAAS,CAAC,EAElB;IAAA,EAAE,cAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useState } from 'react';\nimport type { GestureResponderEvent } from 'react-native';\n\nimport { ButtonIconSize } from '../../types';\nimport type { IconColor } from '../Icon';\nimport { Icon } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\n\nimport {\n MAP_BUTTONICON_SIZE_ICONSIZE,\n TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = ({\n size = ButtonIconSize.Md,\n iconName,\n iconProps,\n isDisabled = false,\n isInverse = false,\n isFloating = false,\n onPressIn,\n onPressOut,\n twClassName = '',\n style,\n ...props\n}: ButtonIconProps) => {\n const [isPressed, setIsPressed] = useState(false);\n const tw = useTailwind();\n const twContainerClassNames = `\n items-center justify-center\n ${TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size]}\n ${isFloating ? 'rounded-full' : 'rounded-sm'}\n ${isFloating ? 'bg-icon-default' : isPressed ? 'bg-pressed' : 'bg-transparent'}\n ${isDisabled ? 'opacity-50' : 'opacity-100'}\n ${twClassName}`;\n\n const twIconColorClassNames =\n isInverse || isFloating ? 'text-primary-inverse' : 'text-icon-default';\n\n const onPressInHandler = (event: GestureResponderEvent) => {\n setIsPressed(true);\n onPressIn?.(event);\n };\n\n const onPressOutHandler = (event: GestureResponderEvent) => {\n setIsPressed(false);\n onPressOut?.(event);\n };\n\n return (\n <ButtonAnimated\n disabled={isDisabled}\n onPressIn={onPressInHandler}\n onPressOut={onPressOutHandler}\n accessible\n style={[tw`${twContainerClassNames}`, style]}\n testID=\"button-icon\"\n {...props}\n >\n <Icon\n name={iconName}\n color={twIconColorClassNames as IconColor}\n size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n {...iconProps}\n />\n </ButtonAnimated>\n );\n};\n"]}
1
+ {"version":3,"file":"ButtonIcon.mjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,QAAO,EAAE,QAAQ,EAAE,cAAc;;AAGxC,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAE7C,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAC/B,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAEnE,OAAO,EACL,4BAA4B,EAC5B,oCAAoC,EACrC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,QAAQ,EACR,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,UAAU,EACV,WAAW,GAAG,EAAE,EAChB,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,4CAA4C;IAC5C,IAAI,eAAe,GAAG,gBAAgB,CAAC;IACvC,IAAI,UAAU,EAAE;QACd,eAAe,GAAG,iBAAiB,CAAC;KACrC;SAAM,IAAI,SAAS,EAAE;QACpB,eAAe,GAAG,YAAY,CAAC;KAChC;IAED,MAAM,qBAAqB,GAAG;;MAE1B,oCAAoC,CAAC,IAAI,CAAC;MAC1C,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY;MAC1C,eAAe;MACf,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa;MACzC,WAAW,EAAE,CAAC;IAElB,MAAM,qBAAqB,GACzB,SAAS,IAAI,UAAU,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAEzE,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACxD,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,SAAS,EAAE,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACzD,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,UAAU,EAAE,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,cAAc,CACb,QAAQ,CAAC,CAAC,UAAU,CAAC,CACrB,SAAS,CAAC,CAAC,gBAAgB,CAAC,CAC5B,UAAU,CAAC,CAAC,iBAAiB,CAAC,CAC9B,UAAU,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA,GAAG,qBAAqB,EAAE,EAAE,KAAK,CAAC,CAAC,CAC7C,MAAM,CAAC,aAAa,CACpB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,IAAI,CACH,IAAI,CAAC,CAAC,QAAQ,CAAC,CACf,KAAK,CAAC,CAAC,qBAAkC,CAAC,CAC1C,IAAI,CAAC,CAAC,4BAA4B,CAAC,IAAI,CAAC,CAAC,CACzC,IAAI,SAAS,CAAC,EAElB;IAAA,EAAE,cAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useState } from 'react';\nimport type { GestureResponderEvent } from 'react-native';\n\nimport { ButtonIconSize } from '../../types';\nimport type { IconColor } from '../Icon';\nimport { Icon } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\n\nimport {\n MAP_BUTTONICON_SIZE_ICONSIZE,\n TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = ({\n size = ButtonIconSize.Md,\n iconName,\n iconProps,\n isDisabled = false,\n isInverse = false,\n isFloating = false,\n onPressIn,\n onPressOut,\n twClassName = '',\n style,\n ...props\n}: ButtonIconProps) => {\n const [isPressed, setIsPressed] = useState(false);\n const tw = useTailwind();\n\n // Determine background color based on state\n let backgroundColor = 'bg-transparent';\n if (isFloating) {\n backgroundColor = 'bg-icon-default';\n } else if (isPressed) {\n backgroundColor = 'bg-pressed';\n }\n\n const twContainerClassNames = `\n items-center justify-center\n ${TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size]}\n ${isFloating ? 'rounded-full' : 'rounded-sm'}\n ${backgroundColor}\n ${isDisabled ? 'opacity-50' : 'opacity-100'}\n ${twClassName}`;\n\n const twIconColorClassNames =\n isInverse || isFloating ? 'text-primary-inverse' : 'text-icon-default';\n\n const onPressInHandler = (event: GestureResponderEvent) => {\n setIsPressed(true);\n onPressIn?.(event);\n };\n\n const onPressOutHandler = (event: GestureResponderEvent) => {\n setIsPressed(false);\n onPressOut?.(event);\n };\n\n return (\n <ButtonAnimated\n disabled={isDisabled}\n onPressIn={onPressInHandler}\n onPressOut={onPressOutHandler}\n accessible\n style={[tw`${twContainerClassNames}`, style]}\n testID=\"button-icon\"\n {...props}\n >\n <Icon\n name={iconName}\n color={twIconColorClassNames as IconColor}\n size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n {...iconProps}\n />\n </ButtonAnimated>\n );\n};\n"]}
@@ -103,7 +103,7 @@ exports.Checkbox = (0, react_1.forwardRef)(({ isSelected, isDisabled = false, is
103
103
  ]} disabled={isDisabled} {...props}>
104
104
  {({ pressed }) => (<>
105
105
  <AnimatedView {...checkboxContainerProps} style={[
106
- tw `${getCheckboxContainerStyle(pressed)} flex h-[22px] w-[22px] items-center justify-center rounded border-2`,
106
+ tw `${getCheckboxContainerStyle(pressed)} flex size-[22px] items-center justify-center rounded border-2`,
107
107
  { transform: [{ scale: scaleAnim }] },
108
108
  ]}>
109
109
  {/* Always render icon, opacity driven by iconAnim */}
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.cjs","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useRef,\n useImperativeHandle,\n useCallback,\n useEffect,\n} from 'react';\nimport type { PressableStateCallbackType } from 'react-native';\nimport { Pressable, Animated, Easing } from 'react-native';\n\nimport { Icon, IconName, IconColor, IconSize } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { CheckboxProps } from './Checkbox.types';\n\nconst AnimatedView = Animated.View;\n\nexport const Checkbox = forwardRef<{ toggle: () => void }, CheckboxProps>(\n (\n {\n isSelected,\n isDisabled = false,\n isInvalid = false,\n label = '',\n labelProps,\n onChange,\n checkboxContainerProps,\n checkedIconProps,\n twClassName = '',\n style,\n ...props\n },\n ref,\n ) => {\n // Animation values\n const scaleAnim = useRef(new Animated.Value(1)).current;\n const iconAnim = useRef(new Animated.Value(isSelected ? 1 : 0)).current;\n\n // Sync icon opacity whenever selection changes\n useEffect(() => {\n Animated.timing(iconAnim, {\n toValue: isSelected ? 1 : 0,\n duration: 300,\n easing: Easing.ease,\n useNativeDriver: true,\n }).start();\n }, [isSelected, iconAnim]);\n\n // Bounce effect when toggling\n const animateScale = useCallback(() => {\n Animated.sequence([\n Animated.timing(scaleAnim, {\n toValue: 1.15,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n Animated.timing(scaleAnim, {\n toValue: 1,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n ]).start();\n }, [scaleAnim]);\n\n // Press handler: notify parent, then bounce\n const handlePress = () => {\n if (isDisabled) {\n return;\n }\n onChange?.(!isSelected);\n animateScale();\n };\n\n useImperativeHandle(ref, () => ({ toggle: handlePress }), [handlePress]);\n\n const tw = useTailwind();\n const twContainerClassNames = tw`flex-row items-center ${\n isDisabled ? 'opacity-50' : 'opacity-100'\n } ${twClassName}`;\n\n const getCheckboxContainerStyle = useCallback(\n (pressed: boolean): string => {\n const baseBg = isSelected ? 'bg-primary-default' : 'bg-default';\n let baseBorder = 'border-default';\n if (isSelected) {\n baseBorder = 'border-primary-default';\n } else if (isInvalid) {\n baseBorder = 'border-error-default';\n }\n const pressedBg = isSelected\n ? 'bg-primary-default-pressed'\n : 'bg-default-pressed';\n let pressedBorder = 'border-default';\n if (isSelected) {\n pressedBorder = 'border-primary-default-pressed';\n } else if (isInvalid) {\n pressedBorder = 'border-error-default';\n }\n return pressed\n ? `${pressedBg} ${pressedBorder}`\n : `${baseBg} ${baseBorder}`;\n },\n [isSelected, isInvalid],\n );\n\n return (\n <Pressable\n onPress={handlePress}\n accessible\n accessibilityRole=\"checkbox\"\n accessibilityState={{\n checked: isSelected,\n disabled: isDisabled,\n }}\n accessibilityLabel={typeof label === 'string' ? label : undefined}\n style={(state: PressableStateCallbackType) => [\n twContainerClassNames,\n typeof style === 'function' ? style(state) : style,\n ]}\n disabled={isDisabled}\n {...props}\n >\n {({ pressed }) => (\n <>\n <AnimatedView\n {...checkboxContainerProps}\n style={[\n tw`${getCheckboxContainerStyle(pressed)} flex h-[22px] w-[22px] items-center justify-center rounded border-2`,\n { transform: [{ scale: scaleAnim }] },\n ]}\n >\n {/* Always render icon, opacity driven by iconAnim */}\n <Animated.View style={{ opacity: iconAnim }}>\n <Icon\n name={IconName.Check}\n color={IconColor.PrimaryInverse}\n size={IconSize.Sm}\n {...checkedIconProps}\n />\n </Animated.View>\n </AnimatedView>\n {label ? (\n <TextOrChildren\n textProps={{ ...labelProps, twClassName: 'ml-3' }}\n >\n {label}\n </TextOrChildren>\n ) : null}\n </>\n )}\n </Pressable>\n );\n },\n);\n"]}
1
+ {"version":3,"file":"Checkbox.cjs","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useRef,\n useImperativeHandle,\n useCallback,\n useEffect,\n} from 'react';\nimport type { PressableStateCallbackType } from 'react-native';\nimport { Pressable, Animated, Easing } from 'react-native';\n\nimport { Icon, IconName, IconColor, IconSize } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { CheckboxProps } from './Checkbox.types';\n\nconst AnimatedView = Animated.View;\n\nexport const Checkbox = forwardRef<{ toggle: () => void }, CheckboxProps>(\n (\n {\n isSelected,\n isDisabled = false,\n isInvalid = false,\n label = '',\n labelProps,\n onChange,\n checkboxContainerProps,\n checkedIconProps,\n twClassName = '',\n style,\n ...props\n },\n ref,\n ) => {\n // Animation values\n const scaleAnim = useRef(new Animated.Value(1)).current;\n const iconAnim = useRef(new Animated.Value(isSelected ? 1 : 0)).current;\n\n // Sync icon opacity whenever selection changes\n useEffect(() => {\n Animated.timing(iconAnim, {\n toValue: isSelected ? 1 : 0,\n duration: 300,\n easing: Easing.ease,\n useNativeDriver: true,\n }).start();\n }, [isSelected, iconAnim]);\n\n // Bounce effect when toggling\n const animateScale = useCallback(() => {\n Animated.sequence([\n Animated.timing(scaleAnim, {\n toValue: 1.15,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n Animated.timing(scaleAnim, {\n toValue: 1,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n ]).start();\n }, [scaleAnim]);\n\n // Press handler: notify parent, then bounce\n const handlePress = () => {\n if (isDisabled) {\n return;\n }\n onChange?.(!isSelected);\n animateScale();\n };\n\n useImperativeHandle(ref, () => ({ toggle: handlePress }), [handlePress]);\n\n const tw = useTailwind();\n const twContainerClassNames = tw`flex-row items-center ${\n isDisabled ? 'opacity-50' : 'opacity-100'\n } ${twClassName}`;\n\n const getCheckboxContainerStyle = useCallback(\n (pressed: boolean): string => {\n const baseBg = isSelected ? 'bg-primary-default' : 'bg-default';\n let baseBorder = 'border-default';\n if (isSelected) {\n baseBorder = 'border-primary-default';\n } else if (isInvalid) {\n baseBorder = 'border-error-default';\n }\n const pressedBg = isSelected\n ? 'bg-primary-default-pressed'\n : 'bg-default-pressed';\n let pressedBorder = 'border-default';\n if (isSelected) {\n pressedBorder = 'border-primary-default-pressed';\n } else if (isInvalid) {\n pressedBorder = 'border-error-default';\n }\n return pressed\n ? `${pressedBg} ${pressedBorder}`\n : `${baseBg} ${baseBorder}`;\n },\n [isSelected, isInvalid],\n );\n\n return (\n <Pressable\n onPress={handlePress}\n accessible\n accessibilityRole=\"checkbox\"\n accessibilityState={{\n checked: isSelected,\n disabled: isDisabled,\n }}\n accessibilityLabel={typeof label === 'string' ? label : undefined}\n style={(state: PressableStateCallbackType) => [\n twContainerClassNames,\n typeof style === 'function' ? style(state) : style,\n ]}\n disabled={isDisabled}\n {...props}\n >\n {({ pressed }) => (\n <>\n <AnimatedView\n {...checkboxContainerProps}\n style={[\n tw`${getCheckboxContainerStyle(pressed)} flex size-[22px] items-center justify-center rounded border-2`,\n { transform: [{ scale: scaleAnim }] },\n ]}\n >\n {/* Always render icon, opacity driven by iconAnim */}\n <Animated.View style={{ opacity: iconAnim }}>\n <Icon\n name={IconName.Check}\n color={IconColor.PrimaryInverse}\n size={IconSize.Sm}\n {...checkedIconProps}\n />\n </Animated.View>\n </AnimatedView>\n {label ? (\n <TextOrChildren\n textProps={{ ...labelProps, twClassName: 'ml-3' }}\n >\n {label}\n </TextOrChildren>\n ) : null}\n </>\n )}\n </Pressable>\n );\n },\n);\n"]}
@@ -84,7 +84,7 @@ export const Checkbox = forwardRef(({ isSelected, isDisabled = false, isInvalid
84
84
  ]} disabled={isDisabled} {...props}>
85
85
  {({ pressed }) => (<>
86
86
  <AnimatedView {...checkboxContainerProps} style={[
87
- tw `${getCheckboxContainerStyle(pressed)} flex h-[22px] w-[22px] items-center justify-center rounded border-2`,
87
+ tw `${getCheckboxContainerStyle(pressed)} flex size-[22px] items-center justify-center rounded border-2`,
88
88
  { transform: [{ scale: scaleAnim }] },
89
89
  ]}>
90
90
  {/* Always render icon, opacity driven by iconAnim */}
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.mjs","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useRef,\n useImperativeHandle,\n useCallback,\n useEffect,\n} from 'react';\nimport type { PressableStateCallbackType } from 'react-native';\nimport { Pressable, Animated, Easing } from 'react-native';\n\nimport { Icon, IconName, IconColor, IconSize } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { CheckboxProps } from './Checkbox.types';\n\nconst AnimatedView = Animated.View;\n\nexport const Checkbox = forwardRef<{ toggle: () => void }, CheckboxProps>(\n (\n {\n isSelected,\n isDisabled = false,\n isInvalid = false,\n label = '',\n labelProps,\n onChange,\n checkboxContainerProps,\n checkedIconProps,\n twClassName = '',\n style,\n ...props\n },\n ref,\n ) => {\n // Animation values\n const scaleAnim = useRef(new Animated.Value(1)).current;\n const iconAnim = useRef(new Animated.Value(isSelected ? 1 : 0)).current;\n\n // Sync icon opacity whenever selection changes\n useEffect(() => {\n Animated.timing(iconAnim, {\n toValue: isSelected ? 1 : 0,\n duration: 300,\n easing: Easing.ease,\n useNativeDriver: true,\n }).start();\n }, [isSelected, iconAnim]);\n\n // Bounce effect when toggling\n const animateScale = useCallback(() => {\n Animated.sequence([\n Animated.timing(scaleAnim, {\n toValue: 1.15,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n Animated.timing(scaleAnim, {\n toValue: 1,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n ]).start();\n }, [scaleAnim]);\n\n // Press handler: notify parent, then bounce\n const handlePress = () => {\n if (isDisabled) {\n return;\n }\n onChange?.(!isSelected);\n animateScale();\n };\n\n useImperativeHandle(ref, () => ({ toggle: handlePress }), [handlePress]);\n\n const tw = useTailwind();\n const twContainerClassNames = tw`flex-row items-center ${\n isDisabled ? 'opacity-50' : 'opacity-100'\n } ${twClassName}`;\n\n const getCheckboxContainerStyle = useCallback(\n (pressed: boolean): string => {\n const baseBg = isSelected ? 'bg-primary-default' : 'bg-default';\n let baseBorder = 'border-default';\n if (isSelected) {\n baseBorder = 'border-primary-default';\n } else if (isInvalid) {\n baseBorder = 'border-error-default';\n }\n const pressedBg = isSelected\n ? 'bg-primary-default-pressed'\n : 'bg-default-pressed';\n let pressedBorder = 'border-default';\n if (isSelected) {\n pressedBorder = 'border-primary-default-pressed';\n } else if (isInvalid) {\n pressedBorder = 'border-error-default';\n }\n return pressed\n ? `${pressedBg} ${pressedBorder}`\n : `${baseBg} ${baseBorder}`;\n },\n [isSelected, isInvalid],\n );\n\n return (\n <Pressable\n onPress={handlePress}\n accessible\n accessibilityRole=\"checkbox\"\n accessibilityState={{\n checked: isSelected,\n disabled: isDisabled,\n }}\n accessibilityLabel={typeof label === 'string' ? label : undefined}\n style={(state: PressableStateCallbackType) => [\n twContainerClassNames,\n typeof style === 'function' ? style(state) : style,\n ]}\n disabled={isDisabled}\n {...props}\n >\n {({ pressed }) => (\n <>\n <AnimatedView\n {...checkboxContainerProps}\n style={[\n tw`${getCheckboxContainerStyle(pressed)} flex h-[22px] w-[22px] items-center justify-center rounded border-2`,\n { transform: [{ scale: scaleAnim }] },\n ]}\n >\n {/* Always render icon, opacity driven by iconAnim */}\n <Animated.View style={{ opacity: iconAnim }}>\n <Icon\n name={IconName.Check}\n color={IconColor.PrimaryInverse}\n size={IconSize.Sm}\n {...checkedIconProps}\n />\n </Animated.View>\n </AnimatedView>\n {label ? (\n <TextOrChildren\n textProps={{ ...labelProps, twClassName: 'ml-3' }}\n >\n {label}\n </TextOrChildren>\n ) : null}\n </>\n )}\n </Pressable>\n );\n },\n);\n"]}
1
+ {"version":3,"file":"Checkbox.mjs","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useRef,\n useImperativeHandle,\n useCallback,\n useEffect,\n} from 'react';\nimport type { PressableStateCallbackType } from 'react-native';\nimport { Pressable, Animated, Easing } from 'react-native';\n\nimport { Icon, IconName, IconColor, IconSize } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { CheckboxProps } from './Checkbox.types';\n\nconst AnimatedView = Animated.View;\n\nexport const Checkbox = forwardRef<{ toggle: () => void }, CheckboxProps>(\n (\n {\n isSelected,\n isDisabled = false,\n isInvalid = false,\n label = '',\n labelProps,\n onChange,\n checkboxContainerProps,\n checkedIconProps,\n twClassName = '',\n style,\n ...props\n },\n ref,\n ) => {\n // Animation values\n const scaleAnim = useRef(new Animated.Value(1)).current;\n const iconAnim = useRef(new Animated.Value(isSelected ? 1 : 0)).current;\n\n // Sync icon opacity whenever selection changes\n useEffect(() => {\n Animated.timing(iconAnim, {\n toValue: isSelected ? 1 : 0,\n duration: 300,\n easing: Easing.ease,\n useNativeDriver: true,\n }).start();\n }, [isSelected, iconAnim]);\n\n // Bounce effect when toggling\n const animateScale = useCallback(() => {\n Animated.sequence([\n Animated.timing(scaleAnim, {\n toValue: 1.15,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n Animated.timing(scaleAnim, {\n toValue: 1,\n duration: 100,\n easing: Easing.ease,\n useNativeDriver: true,\n }),\n ]).start();\n }, [scaleAnim]);\n\n // Press handler: notify parent, then bounce\n const handlePress = () => {\n if (isDisabled) {\n return;\n }\n onChange?.(!isSelected);\n animateScale();\n };\n\n useImperativeHandle(ref, () => ({ toggle: handlePress }), [handlePress]);\n\n const tw = useTailwind();\n const twContainerClassNames = tw`flex-row items-center ${\n isDisabled ? 'opacity-50' : 'opacity-100'\n } ${twClassName}`;\n\n const getCheckboxContainerStyle = useCallback(\n (pressed: boolean): string => {\n const baseBg = isSelected ? 'bg-primary-default' : 'bg-default';\n let baseBorder = 'border-default';\n if (isSelected) {\n baseBorder = 'border-primary-default';\n } else if (isInvalid) {\n baseBorder = 'border-error-default';\n }\n const pressedBg = isSelected\n ? 'bg-primary-default-pressed'\n : 'bg-default-pressed';\n let pressedBorder = 'border-default';\n if (isSelected) {\n pressedBorder = 'border-primary-default-pressed';\n } else if (isInvalid) {\n pressedBorder = 'border-error-default';\n }\n return pressed\n ? `${pressedBg} ${pressedBorder}`\n : `${baseBg} ${baseBorder}`;\n },\n [isSelected, isInvalid],\n );\n\n return (\n <Pressable\n onPress={handlePress}\n accessible\n accessibilityRole=\"checkbox\"\n accessibilityState={{\n checked: isSelected,\n disabled: isDisabled,\n }}\n accessibilityLabel={typeof label === 'string' ? label : undefined}\n style={(state: PressableStateCallbackType) => [\n twContainerClassNames,\n typeof style === 'function' ? style(state) : style,\n ]}\n disabled={isDisabled}\n {...props}\n >\n {({ pressed }) => (\n <>\n <AnimatedView\n {...checkboxContainerProps}\n style={[\n tw`${getCheckboxContainerStyle(pressed)} flex size-[22px] items-center justify-center rounded border-2`,\n { transform: [{ scale: scaleAnim }] },\n ]}\n >\n {/* Always render icon, opacity driven by iconAnim */}\n <Animated.View style={{ opacity: iconAnim }}>\n <Icon\n name={IconName.Check}\n color={IconColor.PrimaryInverse}\n size={IconSize.Sm}\n {...checkedIconProps}\n />\n </Animated.View>\n </AnimatedView>\n {label ? (\n <TextOrChildren\n textProps={{ ...labelProps, twClassName: 'ml-3' }}\n >\n {label}\n </TextOrChildren>\n ) : null}\n </>\n )}\n </Pressable>\n );\n },\n);\n"]}
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { PressableProps, ViewProps } from "react-native/index.js";
3
2
  import type { IconProps } from "../Icon/index.cjs";
4
3
  import type { TextProps } from "../Text/index.cjs";
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.types.d.cts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,8BAAqB;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC;;GAEG;AAEH,MAAM,MAAM,aAAa,GAAG;IAC1B;;;;OAIG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IAEjC;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAElD;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;OAEG;IACH,sBAAsB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAE9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAEtC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;CACjC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC"}
1
+ {"version":3,"file":"Checkbox.types.d.cts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,8BAAqB;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC;;GAEG;AAEH,MAAM,MAAM,aAAa,GAAG;IAC1B;;;;OAIG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IAEjC;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAElD;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;OAEG;IACH,sBAAsB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAE9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAEtC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;CACjC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC"}
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { PressableProps, ViewProps } from "react-native/index.js";
3
2
  import type { IconProps } from "../Icon/index.mjs";
4
3
  import type { TextProps } from "../Text/index.mjs";
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.types.d.mts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,8BAAqB;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC;;GAEG;AAEH,MAAM,MAAM,aAAa,GAAG;IAC1B;;;;OAIG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IAEjC;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAElD;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;OAEG;IACH,sBAAsB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAE9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAEtC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;CACjC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC"}
1
+ {"version":3,"file":"Checkbox.types.d.mts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,8BAAqB;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AACzC;;GAEG;AAEH,MAAM,MAAM,aAAa,GAAG;IAC1B;;;;OAIG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IAEjC;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAElD;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;OAEG;IACH,sBAAsB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAE9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAEtC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;CACjC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC"}
@@ -4,11 +4,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.assetByIconName = void 0;
7
- /* eslint-disable import/prefer-default-export */
8
7
  // /////////////////////////////////////////////////////
9
8
  // This is a generated file
10
- // DO NOT EDIT - Use generate-assets.js
9
+ // DO NOT EDIT - Use generate-icons.js
11
10
  // /////////////////////////////////////////////////////
11
+ const types_1 = require("../../types/index.cjs");
12
12
  const accessibility_svg_1 = __importDefault(require("./assets/accessibility.svg"));
13
13
  const activity_svg_1 = __importDefault(require("./assets/activity.svg"));
14
14
  const add_card_svg_1 = __importDefault(require("./assets/add-card.svg"));
@@ -279,7 +279,6 @@ const widgets_svg_1 = __importDefault(require("./assets/widgets.svg"));
279
279
  const wifi_off_svg_1 = __importDefault(require("./assets/wifi-off.svg"));
280
280
  const wifi_svg_1 = __importDefault(require("./assets/wifi.svg"));
281
281
  const x_svg_1 = __importDefault(require("./assets/x.svg"));
282
- const types_1 = require("../../types/index.cjs");
283
282
  /**
284
283
  * Asset stored by icon name
285
284
  */