@ankhorage/surface 5.0.1 → 6.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (195) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +1 -2
  3. package/dist/components/field/Field.d.ts +1 -0
  4. package/dist/components/field/Field.d.ts.map +1 -1
  5. package/dist/components/field/Field.js +5 -4
  6. package/dist/components/field/Field.js.map +1 -1
  7. package/dist/components/list-item/ListItem.d.ts +1 -0
  8. package/dist/components/list-item/ListItem.d.ts.map +1 -1
  9. package/dist/components/list-item/ListItem.js +13 -12
  10. package/dist/components/list-item/ListItem.js.map +1 -1
  11. package/dist/components/switch/Switch.d.ts +1 -0
  12. package/dist/components/switch/Switch.d.ts.map +1 -1
  13. package/dist/components/switch/Switch.js +10 -13
  14. package/dist/components/switch/Switch.js.map +1 -1
  15. package/dist/{layout → core/responsive}/Show.d.ts +2 -1
  16. package/dist/core/responsive/Show.d.ts.map +1 -0
  17. package/dist/{layout → core/responsive}/Show.js +3 -1
  18. package/dist/core/responsive/Show.js.map +1 -0
  19. package/dist/core/responsive/index.d.ts +1 -0
  20. package/dist/core/responsive/index.d.ts.map +1 -1
  21. package/dist/core/responsive/index.js +1 -0
  22. package/dist/core/responsive/index.js.map +1 -1
  23. package/dist/features/app-bar/adapters/inbound/AppBar.d.ts +5 -0
  24. package/dist/features/app-bar/adapters/inbound/AppBar.d.ts.map +1 -0
  25. package/dist/features/app-bar/adapters/inbound/AppBar.js +40 -0
  26. package/dist/features/app-bar/adapters/inbound/AppBar.js.map +1 -0
  27. package/dist/features/app-bar/public.d.ts +3 -0
  28. package/dist/features/app-bar/public.d.ts.map +1 -0
  29. package/dist/features/app-bar/public.js +2 -0
  30. package/dist/features/app-bar/public.js.map +1 -0
  31. package/dist/features/badge/adapters/inbound/Badge.js +3 -3
  32. package/dist/features/badge/adapters/inbound/Badge.js.map +1 -1
  33. package/dist/features/button/adapters/inbound/Button.js +8 -8
  34. package/dist/features/button/adapters/inbound/Button.js.map +1 -1
  35. package/dist/features/button/adapters/inbound/IconButton.js +3 -3
  36. package/dist/features/button/adapters/inbound/IconButton.js.map +1 -1
  37. package/dist/features/form/checkbox/adapters/inbound/Checkbox.js +7 -7
  38. package/dist/features/form/checkbox/adapters/inbound/Checkbox.js.map +1 -1
  39. package/dist/features/form/radio/adapters/inbound/Radio.js +8 -8
  40. package/dist/features/form/radio/adapters/inbound/Radio.js.map +1 -1
  41. package/dist/features/layout/adapters/inbound/Divider.js +2 -2
  42. package/dist/features/layout/adapters/inbound/Divider.js.map +1 -1
  43. package/dist/features/layout/adapters/inbound/Grid.d.ts.map +1 -1
  44. package/dist/features/layout/adapters/inbound/Grid.js +7 -9
  45. package/dist/features/layout/adapters/inbound/Grid.js.map +1 -1
  46. package/dist/features/layout/adapters/inbound/ScrollView.d.ts +5 -0
  47. package/dist/features/layout/adapters/inbound/ScrollView.d.ts.map +1 -0
  48. package/dist/features/layout/adapters/inbound/ScrollView.js +69 -0
  49. package/dist/features/layout/adapters/inbound/ScrollView.js.map +1 -0
  50. package/dist/features/layout/adapters/inbound/View.d.ts +5 -0
  51. package/dist/features/layout/adapters/inbound/View.d.ts.map +1 -0
  52. package/dist/features/layout/adapters/inbound/View.js +17 -0
  53. package/dist/features/layout/adapters/inbound/View.js.map +1 -0
  54. package/dist/features/layout/public.d.ts +3 -4
  55. package/dist/features/layout/public.d.ts.map +1 -1
  56. package/dist/features/layout/public.js +2 -3
  57. package/dist/features/layout/public.js.map +1 -1
  58. package/dist/features/modal/adapters/inbound/Modal.d.ts.map +1 -1
  59. package/dist/features/modal/adapters/inbound/Modal.js +8 -8
  60. package/dist/features/modal/adapters/inbound/Modal.js.map +1 -1
  61. package/dist/features/popover-menu/adapters/inbound/PopoverMenu.d.ts.map +1 -1
  62. package/dist/features/popover-menu/adapters/inbound/PopoverMenu.js +11 -12
  63. package/dist/features/popover-menu/adapters/inbound/PopoverMenu.js.map +1 -1
  64. package/dist/features/surface/adapters/inbound/Surface.d.ts +1 -1
  65. package/dist/features/surface/adapters/inbound/Surface.d.ts.map +1 -1
  66. package/dist/features/surface/adapters/inbound/Surface.js +3 -3
  67. package/dist/features/surface/adapters/inbound/Surface.js.map +1 -1
  68. package/dist/features/tabs/adapters/inbound/Tab.js +3 -3
  69. package/dist/features/tabs/adapters/inbound/Tab.js.map +1 -1
  70. package/dist/features/tabs/adapters/inbound/TabList.d.ts.map +1 -1
  71. package/dist/features/tabs/adapters/inbound/TabList.js +3 -5
  72. package/dist/features/tabs/adapters/inbound/TabList.js.map +1 -1
  73. package/dist/features/tabs/adapters/inbound/Tabs.js +2 -2
  74. package/dist/features/tabs/adapters/inbound/Tabs.js.map +1 -1
  75. package/dist/features/toast/adapters/inbound/Toast.js +5 -5
  76. package/dist/features/toast/adapters/inbound/Toast.js.map +1 -1
  77. package/dist/features/toast/adapters/inbound/ToastProvider.js +3 -3
  78. package/dist/features/toast/adapters/inbound/ToastProvider.js.map +1 -1
  79. package/dist/index.d.ts +4 -3
  80. package/dist/index.d.ts.map +1 -1
  81. package/dist/index.js +2 -2
  82. package/dist/index.js.map +1 -1
  83. package/dist/primitives/button-base/ButtonBase.d.ts +1 -0
  84. package/dist/primitives/button-base/ButtonBase.d.ts.map +1 -1
  85. package/dist/primitives/button-base/ButtonBase.js +6 -5
  86. package/dist/primitives/button-base/ButtonBase.js.map +1 -1
  87. package/dist/primitives/button-base/types.d.ts +2 -2
  88. package/dist/primitives/button-base/types.d.ts.map +1 -1
  89. package/dist/primitives/button-base/types.js.map +1 -1
  90. package/dist/types/app-bar.d.ts +12 -0
  91. package/dist/types/app-bar.d.ts.map +1 -0
  92. package/dist/types/app-bar.js +2 -0
  93. package/dist/types/app-bar.js.map +1 -0
  94. package/dist/types/layout.d.ts +15 -17
  95. package/dist/types/layout.d.ts.map +1 -1
  96. package/dist/types/layout.js.map +1 -1
  97. package/dist/types/surface.d.ts +2 -2
  98. package/dist/types/surface.d.ts.map +1 -1
  99. package/dist/types/surface.js.map +1 -1
  100. package/dist/utils/resolveViewStyles.d.ts +7 -0
  101. package/dist/utils/resolveViewStyles.d.ts.map +1 -0
  102. package/dist/utils/{resolveBoxStyles.js → resolveViewStyles.js} +11 -4
  103. package/dist/utils/resolveViewStyles.js.map +1 -0
  104. package/package.json +1 -1
  105. package/src/components/field/Field.tsx +5 -4
  106. package/src/components/list-item/ListItem.tsx +17 -13
  107. package/src/components/switch/Switch.tsx +10 -15
  108. package/src/{layout → core/responsive}/Show.tsx +4 -1
  109. package/src/core/responsive/index.ts +1 -0
  110. package/src/features/app-bar/adapters/inbound/AppBar.tsx +69 -0
  111. package/src/features/app-bar/public.ts +2 -0
  112. package/src/features/badge/adapters/inbound/Badge.tsx +3 -3
  113. package/src/features/button/adapters/inbound/Button.tsx +8 -8
  114. package/src/features/button/adapters/inbound/IconButton.tsx +3 -3
  115. package/src/features/form/checkbox/adapters/inbound/Checkbox.tsx +7 -7
  116. package/src/features/form/radio/adapters/inbound/Radio.tsx +8 -8
  117. package/src/features/layout/adapters/inbound/Divider.tsx +2 -2
  118. package/src/features/layout/adapters/inbound/Grid.tsx +12 -14
  119. package/src/features/layout/adapters/inbound/ScrollView.tsx +102 -0
  120. package/src/features/layout/adapters/inbound/{Box.tsx → View.tsx} +9 -9
  121. package/src/features/layout/public.ts +3 -10
  122. package/src/features/modal/adapters/inbound/Modal.tsx +11 -8
  123. package/src/features/popover-menu/adapters/inbound/PopoverMenu.tsx +11 -14
  124. package/src/features/surface/adapters/inbound/Surface.tsx +3 -3
  125. package/src/features/tabs/adapters/inbound/Tab.tsx +3 -3
  126. package/src/features/tabs/adapters/inbound/TabList.tsx +3 -6
  127. package/src/features/tabs/adapters/inbound/Tabs.tsx +2 -2
  128. package/src/features/toast/adapters/inbound/Toast.tsx +5 -5
  129. package/src/features/toast/adapters/inbound/ToastProvider.tsx +3 -3
  130. package/src/index.test.ts +12 -38
  131. package/src/index.ts +4 -9
  132. package/src/primitives/button-base/ButtonBase.tsx +6 -8
  133. package/src/primitives/button-base/types.ts +2 -2
  134. package/src/types/app-bar.ts +13 -0
  135. package/src/types/layout.ts +25 -20
  136. package/src/types/surface.ts +2 -2
  137. package/src/utils/resolveViewStyles.test.ts +71 -0
  138. package/src/utils/{resolveBoxStyles.ts → resolveViewStyles.ts} +16 -9
  139. package/src/webAcceptance.test.tsx +8 -9
  140. package/dist/features/layout/adapters/inbound/Box.d.ts +0 -5
  141. package/dist/features/layout/adapters/inbound/Box.d.ts.map +0 -1
  142. package/dist/features/layout/adapters/inbound/Box.js +0 -17
  143. package/dist/features/layout/adapters/inbound/Box.js.map +0 -1
  144. package/dist/features/layout/adapters/inbound/Container.d.ts +0 -5
  145. package/dist/features/layout/adapters/inbound/Container.d.ts.map +0 -1
  146. package/dist/features/layout/adapters/inbound/Container.js +0 -28
  147. package/dist/features/layout/adapters/inbound/Container.js.map +0 -1
  148. package/dist/features/layout/adapters/inbound/Stack.d.ts +0 -5
  149. package/dist/features/layout/adapters/inbound/Stack.d.ts.map +0 -1
  150. package/dist/features/layout/adapters/inbound/Stack.js +0 -27
  151. package/dist/features/layout/adapters/inbound/Stack.js.map +0 -1
  152. package/dist/layout/AppBar.d.ts +0 -13
  153. package/dist/layout/AppBar.d.ts.map +0 -1
  154. package/dist/layout/AppBar.js +0 -30
  155. package/dist/layout/AppBar.js.map +0 -1
  156. package/dist/layout/Center.d.ts +0 -7
  157. package/dist/layout/Center.d.ts.map +0 -1
  158. package/dist/layout/Center.js +0 -12
  159. package/dist/layout/Center.js.map +0 -1
  160. package/dist/layout/Inline.d.ts +0 -5
  161. package/dist/layout/Inline.d.ts.map +0 -1
  162. package/dist/layout/Inline.js +0 -6
  163. package/dist/layout/Inline.js.map +0 -1
  164. package/dist/layout/ScrollArea.d.ts +0 -9
  165. package/dist/layout/ScrollArea.d.ts.map +0 -1
  166. package/dist/layout/ScrollArea.js +0 -52
  167. package/dist/layout/ScrollArea.js.map +0 -1
  168. package/dist/layout/Show.d.ts.map +0 -1
  169. package/dist/layout/Show.js.map +0 -1
  170. package/dist/layout/Spacer.d.ts +0 -9
  171. package/dist/layout/Spacer.d.ts.map +0 -1
  172. package/dist/layout/Spacer.js +0 -12
  173. package/dist/layout/Spacer.js.map +0 -1
  174. package/dist/layout/Template.d.ts +0 -18
  175. package/dist/layout/Template.d.ts.map +0 -1
  176. package/dist/layout/Template.js +0 -36
  177. package/dist/layout/Template.js.map +0 -1
  178. package/dist/layout/index.d.ts +0 -15
  179. package/dist/layout/index.d.ts.map +0 -1
  180. package/dist/layout/index.js +0 -8
  181. package/dist/layout/index.js.map +0 -1
  182. package/dist/utils/resolveBoxStyles.d.ts +0 -7
  183. package/dist/utils/resolveBoxStyles.d.ts.map +0 -1
  184. package/dist/utils/resolveBoxStyles.js.map +0 -1
  185. package/src/features/layout/adapters/inbound/Container.tsx +0 -43
  186. package/src/features/layout/adapters/inbound/Stack.test.ts +0 -13
  187. package/src/features/layout/adapters/inbound/Stack.tsx +0 -44
  188. package/src/layout/AppBar.tsx +0 -60
  189. package/src/layout/Center.tsx +0 -22
  190. package/src/layout/Inline.tsx +0 -9
  191. package/src/layout/ScrollArea.tsx +0 -116
  192. package/src/layout/Spacer.tsx +0 -22
  193. package/src/layout/Template.tsx +0 -86
  194. package/src/layout/index.ts +0 -14
  195. package/src/utils/resolveBoxStyles.test.ts +0 -54
@@ -3,7 +3,7 @@ import { resolveButtonColors, resolveControlSize, resolveIconSize, } from '../..
3
3
  import { ButtonBase } from '../../../../primitives/button-base';
4
4
  import { useTheme } from '../../../../theme/ThemeContext';
5
5
  import { Icon } from '../../../icon/public';
6
- import { Box } from '../../../layout/public';
6
+ import { View } from '../../../layout/public';
7
7
  /*** Renders a compact accessible icon-only action control. */
8
8
  export function IconButton({ icon, accessibilityLabel, variant = 'ghost', color = 'primary', size = 'm', disabled = false, onPress, testID, ...props }) {
9
9
  const { theme } = useTheme();
@@ -11,9 +11,9 @@ export function IconButton({ icon, accessibilityLabel, variant = 'ghost', color
11
11
  return (<ButtonBase {...props} accessibilityLabel={accessibilityLabel} disabled={disabled} onPress={onPress} testID={testID}>
12
12
  {(state) => {
13
13
  const colors = resolveButtonColors(theme, { color, state, variant });
14
- return (<Box radius={controlSize.borderRadius} style={resolveIconButtonStyle(controlSize, colors, variant)}>
14
+ return (<View radius={controlSize.borderRadius} style={resolveIconButtonStyle(controlSize, colors, variant)}>
15
15
  <Icon {...icon} color={colors.contentColor} size={resolveIconSize(theme, size)}/>
16
- </Box>);
16
+ </View>);
17
17
  }}
18
18
  </ButtonBase>);
19
19
  }
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../../../src/features/button/adapters/inbound/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EACL,mBAAmB,EACnB,kBAAkB,EAClB,eAAe,GAChB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAE7C,8DAA8D;AAC9D,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,EACJ,kBAAkB,EAClB,OAAO,GAAG,OAAO,EACjB,KAAK,GAAG,SAAS,EACjB,IAAI,GAAG,GAAG,EACV,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,MAAM,EACN,GAAG,KAAK,EACQ;IAChB,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IAEpD,OAAO,CACL,CAAC,UAAU,CACT,IAAI,KAAK,CAAC,CACV,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,CAAC,KAAK,EAAE,EAAE;YACT,MAAM,MAAM,GAAG,mBAAmB,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;YACrE,OAAO,CACL,CAAC,GAAG,CACF,MAAM,CAAC,CAAC,WAAW,CAAC,YAAY,CAAC,CACjC,KAAK,CAAC,CAAC,sBAAsB,CAAC,WAAW,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAE5D;YAAA,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EACjF;UAAA,EAAE,GAAG,CAAC,CACP,CAAC;QACJ,CAAC,CACH;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC;AAED,gFAAgF;AAChF,SAAS,sBAAsB,CAC7B,WAAkD,EAClD,MAA8C,EAC9C,OAAgD;IAEhD,OAAO;QACL,UAAU,EAAE,QAAQ;QACpB,eAAe,EAAE,MAAM,CAAC,eAAe;QACvC,WAAW,EAAE,MAAM,CAAC,WAAW;QAC/B,WAAW,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACxC,cAAc,EAAE,QAAQ;QACxB,SAAS,EAAE,WAAW,CAAC,SAAS;QAChC,QAAQ,EAAE,WAAW,CAAC,SAAS;QAC/B,OAAO,EAAE,MAAM,CAAC,OAAO;KACxB,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport {\n resolveButtonColors,\n resolveControlSize,\n resolveIconSize,\n} from '../../../../internal/resolvers';\nimport { ButtonBase } from '../../../../primitives/button-base';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { IconButtonProps } from '../../../../types/button';\nimport { Icon } from '../../../icon/public';\nimport { Box } from '../../../layout/public';\n\n/*** Renders a compact accessible icon-only action control. */\nexport function IconButton({\n icon,\n accessibilityLabel,\n variant = 'ghost',\n color = 'primary',\n size = 'm',\n disabled = false,\n onPress,\n testID,\n ...props\n}: IconButtonProps) {\n const { theme } = useTheme();\n const controlSize = resolveControlSize(theme, size);\n\n return (\n <ButtonBase\n {...props}\n accessibilityLabel={accessibilityLabel}\n disabled={disabled}\n onPress={onPress}\n testID={testID}\n >\n {(state) => {\n const colors = resolveButtonColors(theme, { color, state, variant });\n return (\n <Box\n radius={controlSize.borderRadius}\n style={resolveIconButtonStyle(controlSize, colors, variant)}\n >\n <Icon {...icon} color={colors.contentColor} size={resolveIconSize(theme, size)} />\n </Box>\n );\n }}\n </ButtonBase>\n );\n}\n\n/*** Resolves the visual container style for an IconButton interaction state. */\nfunction resolveIconButtonStyle(\n controlSize: ReturnType<typeof resolveControlSize>,\n colors: ReturnType<typeof resolveButtonColors>,\n variant: NonNullable<IconButtonProps['variant']>,\n): ViewStyle {\n return {\n alignItems: 'center',\n backgroundColor: colors.backgroundColor,\n borderColor: colors.borderColor,\n borderWidth: variant === 'solid' ? 0 : 1,\n justifyContent: 'center',\n minHeight: controlSize.minHeight,\n minWidth: controlSize.minHeight,\n opacity: colors.opacity,\n };\n}\n"]}
1
+ {"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../../../src/features/button/adapters/inbound/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EACL,mBAAmB,EACnB,kBAAkB,EAClB,eAAe,GAChB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,8DAA8D;AAC9D,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,EACJ,kBAAkB,EAClB,OAAO,GAAG,OAAO,EACjB,KAAK,GAAG,SAAS,EACjB,IAAI,GAAG,GAAG,EACV,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,MAAM,EACN,GAAG,KAAK,EACQ;IAChB,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IAEpD,OAAO,CACL,CAAC,UAAU,CACT,IAAI,KAAK,CAAC,CACV,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,CAAC,KAAK,EAAE,EAAE;YACT,MAAM,MAAM,GAAG,mBAAmB,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;YACrE,OAAO,CACL,CAAC,IAAI,CACH,MAAM,CAAC,CAAC,WAAW,CAAC,YAAY,CAAC,CACjC,KAAK,CAAC,CAAC,sBAAsB,CAAC,WAAW,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAE5D;YAAA,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EACjF;UAAA,EAAE,IAAI,CAAC,CACR,CAAC;QACJ,CAAC,CACH;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC;AAED,gFAAgF;AAChF,SAAS,sBAAsB,CAC7B,WAAkD,EAClD,MAA8C,EAC9C,OAAgD;IAEhD,OAAO;QACL,UAAU,EAAE,QAAQ;QACpB,eAAe,EAAE,MAAM,CAAC,eAAe;QACvC,WAAW,EAAE,MAAM,CAAC,WAAW;QAC/B,WAAW,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACxC,cAAc,EAAE,QAAQ;QACxB,SAAS,EAAE,WAAW,CAAC,SAAS;QAChC,QAAQ,EAAE,WAAW,CAAC,SAAS;QAC/B,OAAO,EAAE,MAAM,CAAC,OAAO;KACxB,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport {\n resolveButtonColors,\n resolveControlSize,\n resolveIconSize,\n} from '../../../../internal/resolvers';\nimport { ButtonBase } from '../../../../primitives/button-base';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { IconButtonProps } from '../../../../types/button';\nimport { Icon } from '../../../icon/public';\nimport { View } from '../../../layout/public';\n\n/*** Renders a compact accessible icon-only action control. */\nexport function IconButton({\n icon,\n accessibilityLabel,\n variant = 'ghost',\n color = 'primary',\n size = 'm',\n disabled = false,\n onPress,\n testID,\n ...props\n}: IconButtonProps) {\n const { theme } = useTheme();\n const controlSize = resolveControlSize(theme, size);\n\n return (\n <ButtonBase\n {...props}\n accessibilityLabel={accessibilityLabel}\n disabled={disabled}\n onPress={onPress}\n testID={testID}\n >\n {(state) => {\n const colors = resolveButtonColors(theme, { color, state, variant });\n return (\n <View\n radius={controlSize.borderRadius}\n style={resolveIconButtonStyle(controlSize, colors, variant)}\n >\n <Icon {...icon} color={colors.contentColor} size={resolveIconSize(theme, size)} />\n </View>\n );\n }}\n </ButtonBase>\n );\n}\n\n/*** Resolves the visual container style for an IconButton interaction state. */\nfunction resolveIconButtonStyle(\n controlSize: ReturnType<typeof resolveControlSize>,\n colors: ReturnType<typeof resolveButtonColors>,\n variant: NonNullable<IconButtonProps['variant']>,\n): ViewStyle {\n return {\n alignItems: 'center',\n backgroundColor: colors.backgroundColor,\n borderColor: colors.borderColor,\n borderWidth: variant === 'solid' ? 0 : 1,\n justifyContent: 'center',\n minHeight: controlSize.minHeight,\n minWidth: controlSize.minHeight,\n opacity: colors.opacity,\n };\n}\n"]}
@@ -3,7 +3,7 @@ import { resolveFieldState, resolveIndicatorSize, resolveSelectionControlColors,
3
3
  import { useControllableState } from '../../../../../internal/useControllableState';
4
4
  import { ButtonBase } from '../../../../../primitives/button-base';
5
5
  import { useTheme } from '../../../../../theme/ThemeContext';
6
- import { Box } from '../../../../layout/public';
6
+ import { View } from '../../../../layout/public';
7
7
  import { Text } from '../../../../typography/public';
8
8
  /*** Renders a controlled or uncontrolled accessible checkbox. */
9
9
  export function Checkbox({ accessibilityLabel, checked, children, color = 'primary', defaultChecked = false, disabled = false, invalid = false, onCheckedChange, readOnly = false, size = 'm', testID, ...buttonProps }) {
@@ -58,16 +58,16 @@ function renderCheckboxContent(input) {
58
58
  const indicatorSize = resolveIndicatorSize(input.size);
59
59
  const labelEmphasis = colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';
60
60
  const indicatorColor = fieldState.invalid ? 'error' : input.color;
61
- return (<Box style={resolveSelectionRowStyle(colors.opacity)}>
62
- <Box radius="s" style={resolveCheckboxIndicatorStyle(colors.backgroundColor, colors.borderColor, indicatorSize.checkbox)}>
61
+ return (<View style={resolveSelectionRowStyle(colors.opacity)}>
62
+ <View radius="s" style={resolveCheckboxIndicatorStyle(colors.backgroundColor, colors.borderColor, indicatorSize.checkbox)}>
63
63
  {input.isChecked ? (<Text color={input.disabled ? undefined : indicatorColor} emphasis={input.disabled ? 'muted' : 'inverse'} variant="caption" weight="bold">
64
64
  ✓
65
65
  </Text>) : null}
66
- </Box>
67
- {input.children ? (<Box ml="s">
66
+ </View>
67
+ {input.children ? (<View ml="s">
68
68
  <Text emphasis={labelEmphasis}>{input.children}</Text>
69
- </Box>) : null}
70
- </Box>);
69
+ </View>) : null}
70
+ </View>);
71
71
  }
72
72
  /*** Resolves the horizontal selection-control row style. */
73
73
  function resolveSelectionRowStyle(opacity) {
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../../../src/features/form/checkbox/adapters/inbound/Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport {\n type InteractionState,\n resolveFieldState,\n resolveIndicatorSize,\n resolveSelectionControlColors,\n resolveSelectionControlNextChecked,\n} from '../../../../../internal/resolvers';\nimport { useControllableState } from '../../../../../internal/useControllableState';\nimport { ButtonBase } from '../../../../../primitives/button-base';\nimport type { ButtonBaseProps } from '../../../../../primitives/button-base/types';\nimport { useTheme } from '../../../../../theme/ThemeContext';\nimport type { SurfaceTheme } from '../../../../../theme/types';\nimport type { CheckboxProps } from '../../../../../types/checkbox';\nimport { Box } from '../../../../layout/public';\nimport { Text } from '../../../../typography/public';\n\n/*** Renders a controlled or uncontrolled accessible checkbox. */\nexport function Checkbox({\n accessibilityLabel,\n checked,\n children,\n color = 'primary',\n defaultChecked = false,\n disabled = false,\n invalid = false,\n onCheckedChange,\n readOnly = false,\n size = 'm',\n testID,\n ...buttonProps\n}: CheckboxProps) {\n const { theme } = useTheme();\n const [isChecked, setChecked] = useControllableState<boolean>({\n value: checked,\n defaultValue: defaultChecked,\n onChange: onCheckedChange,\n });\n\n return (\n <CheckboxControl\n accessibilityLabel={accessibilityLabel}\n buttonProps={buttonProps}\n color={color}\n disabled={disabled}\n invalid={invalid}\n isChecked={isChecked}\n readOnly={readOnly}\n setChecked={setChecked}\n size={size}\n testID={testID}\n theme={theme}\n >\n {children}\n </CheckboxControl>\n );\n}\n\n/*** Owns the checkbox interaction boundary around resolved selection content. */\nfunction CheckboxControl({\n accessibilityLabel,\n buttonProps,\n children,\n color,\n disabled,\n invalid,\n isChecked,\n readOnly,\n setChecked,\n size,\n testID,\n theme,\n}: CheckboxControlProps) {\n const nextChecked = resolveSelectionControlNextChecked({\n checked: isChecked,\n disabled,\n kind: 'checkbox',\n readOnly,\n });\n\n return (\n <ButtonBase\n {...buttonProps}\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"checkbox\"\n accessibilityState={{ checked: isChecked }}\n disabled={disabled}\n onPress={nextChecked === null ? undefined : () => setChecked(nextChecked)}\n testID={testID}\n >\n {(interactionState) =>\n renderCheckboxContent({\n children,\n color,\n disabled,\n interactionState,\n invalid,\n isChecked,\n readOnly,\n size,\n theme,\n })\n }\n </ButtonBase>\n );\n}\n\n/*** Renders the checkbox indicator and optional label for one interaction state. */\nfunction renderCheckboxContent(input: CheckboxContentInput) {\n const { interactionState, theme } = input;\n const fieldState = resolveFieldState({\n disabled: input.disabled,\n focused: interactionState.focused,\n invalid: input.invalid,\n readOnly: input.readOnly,\n });\n const colors = resolveSelectionControlColors(theme, {\n checked: input.isChecked,\n fieldState,\n hovered: interactionState.hovered,\n pressed: interactionState.pressed,\n color: input.color,\n });\n const indicatorSize = resolveIndicatorSize(input.size);\n const labelEmphasis = colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';\n const indicatorColor = fieldState.invalid ? 'error' : input.color;\n\n return (\n <Box style={resolveSelectionRowStyle(colors.opacity)}>\n <Box\n radius=\"s\"\n style={resolveCheckboxIndicatorStyle(\n colors.backgroundColor,\n colors.borderColor,\n indicatorSize.checkbox,\n )}\n >\n {input.isChecked ? (\n <Text\n color={input.disabled ? undefined : indicatorColor}\n emphasis={input.disabled ? 'muted' : 'inverse'}\n variant=\"caption\"\n weight=\"bold\"\n >\n ✓\n </Text>\n ) : null}\n </Box>\n {input.children ? (\n <Box ml=\"s\">\n <Text emphasis={labelEmphasis}>{input.children}</Text>\n </Box>\n ) : null}\n </Box>\n );\n}\n\n/*** Resolves the horizontal selection-control row style. */\nfunction resolveSelectionRowStyle(opacity: number | undefined): ViewStyle {\n return { alignItems: 'center', flexDirection: 'row', opacity };\n}\n\n/*** Resolves checkbox indicator dimensions and interaction colors. */\nfunction resolveCheckboxIndicatorStyle(\n backgroundColor: string,\n borderColor: string,\n size: number,\n): ViewStyle {\n return {\n alignItems: 'center',\n backgroundColor,\n borderColor,\n borderWidth: 1.5,\n height: size,\n justifyContent: 'center',\n width: size,\n };\n}\n\ninterface CheckboxControlProps {\n accessibilityLabel: CheckboxProps['accessibilityLabel'];\n buttonProps: ButtonBaseProps;\n children: CheckboxProps['children'];\n color: NonNullable<CheckboxProps['color']>;\n disabled: boolean;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n setChecked: (checked: boolean) => void;\n size: NonNullable<CheckboxProps['size']>;\n testID: CheckboxProps['testID'];\n theme: SurfaceTheme;\n}\n\ninterface CheckboxContentInput {\n children: CheckboxProps['children'];\n color: NonNullable<CheckboxProps['color']>;\n disabled: boolean;\n interactionState: InteractionState;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n size: NonNullable<CheckboxProps['size']>;\n theme: SurfaceTheme;\n}\n"]}
1
+ {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../../../src/features/form/checkbox/adapters/inbound/Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport {\n type InteractionState,\n resolveFieldState,\n resolveIndicatorSize,\n resolveSelectionControlColors,\n resolveSelectionControlNextChecked,\n} from '../../../../../internal/resolvers';\nimport { useControllableState } from '../../../../../internal/useControllableState';\nimport { ButtonBase } from '../../../../../primitives/button-base';\nimport type { ButtonBaseProps } from '../../../../../primitives/button-base/types';\nimport { useTheme } from '../../../../../theme/ThemeContext';\nimport type { SurfaceTheme } from '../../../../../theme/types';\nimport type { CheckboxProps } from '../../../../../types/checkbox';\nimport { View } from '../../../../layout/public';\nimport { Text } from '../../../../typography/public';\n\n/*** Renders a controlled or uncontrolled accessible checkbox. */\nexport function Checkbox({\n accessibilityLabel,\n checked,\n children,\n color = 'primary',\n defaultChecked = false,\n disabled = false,\n invalid = false,\n onCheckedChange,\n readOnly = false,\n size = 'm',\n testID,\n ...buttonProps\n}: CheckboxProps) {\n const { theme } = useTheme();\n const [isChecked, setChecked] = useControllableState<boolean>({\n value: checked,\n defaultValue: defaultChecked,\n onChange: onCheckedChange,\n });\n\n return (\n <CheckboxControl\n accessibilityLabel={accessibilityLabel}\n buttonProps={buttonProps}\n color={color}\n disabled={disabled}\n invalid={invalid}\n isChecked={isChecked}\n readOnly={readOnly}\n setChecked={setChecked}\n size={size}\n testID={testID}\n theme={theme}\n >\n {children}\n </CheckboxControl>\n );\n}\n\n/*** Owns the checkbox interaction boundary around resolved selection content. */\nfunction CheckboxControl({\n accessibilityLabel,\n buttonProps,\n children,\n color,\n disabled,\n invalid,\n isChecked,\n readOnly,\n setChecked,\n size,\n testID,\n theme,\n}: CheckboxControlProps) {\n const nextChecked = resolveSelectionControlNextChecked({\n checked: isChecked,\n disabled,\n kind: 'checkbox',\n readOnly,\n });\n\n return (\n <ButtonBase\n {...buttonProps}\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"checkbox\"\n accessibilityState={{ checked: isChecked }}\n disabled={disabled}\n onPress={nextChecked === null ? undefined : () => setChecked(nextChecked)}\n testID={testID}\n >\n {(interactionState) =>\n renderCheckboxContent({\n children,\n color,\n disabled,\n interactionState,\n invalid,\n isChecked,\n readOnly,\n size,\n theme,\n })\n }\n </ButtonBase>\n );\n}\n\n/*** Renders the checkbox indicator and optional label for one interaction state. */\nfunction renderCheckboxContent(input: CheckboxContentInput) {\n const { interactionState, theme } = input;\n const fieldState = resolveFieldState({\n disabled: input.disabled,\n focused: interactionState.focused,\n invalid: input.invalid,\n readOnly: input.readOnly,\n });\n const colors = resolveSelectionControlColors(theme, {\n checked: input.isChecked,\n fieldState,\n hovered: interactionState.hovered,\n pressed: interactionState.pressed,\n color: input.color,\n });\n const indicatorSize = resolveIndicatorSize(input.size);\n const labelEmphasis = colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';\n const indicatorColor = fieldState.invalid ? 'error' : input.color;\n\n return (\n <View style={resolveSelectionRowStyle(colors.opacity)}>\n <View\n radius=\"s\"\n style={resolveCheckboxIndicatorStyle(\n colors.backgroundColor,\n colors.borderColor,\n indicatorSize.checkbox,\n )}\n >\n {input.isChecked ? (\n <Text\n color={input.disabled ? undefined : indicatorColor}\n emphasis={input.disabled ? 'muted' : 'inverse'}\n variant=\"caption\"\n weight=\"bold\"\n >\n ✓\n </Text>\n ) : null}\n </View>\n {input.children ? (\n <View ml=\"s\">\n <Text emphasis={labelEmphasis}>{input.children}</Text>\n </View>\n ) : null}\n </View>\n );\n}\n\n/*** Resolves the horizontal selection-control row style. */\nfunction resolveSelectionRowStyle(opacity: number | undefined): ViewStyle {\n return { alignItems: 'center', flexDirection: 'row', opacity };\n}\n\n/*** Resolves checkbox indicator dimensions and interaction colors. */\nfunction resolveCheckboxIndicatorStyle(\n backgroundColor: string,\n borderColor: string,\n size: number,\n): ViewStyle {\n return {\n alignItems: 'center',\n backgroundColor,\n borderColor,\n borderWidth: 1.5,\n height: size,\n justifyContent: 'center',\n width: size,\n };\n}\n\ninterface CheckboxControlProps {\n accessibilityLabel: CheckboxProps['accessibilityLabel'];\n buttonProps: ButtonBaseProps;\n children: CheckboxProps['children'];\n color: NonNullable<CheckboxProps['color']>;\n disabled: boolean;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n setChecked: (checked: boolean) => void;\n size: NonNullable<CheckboxProps['size']>;\n testID: CheckboxProps['testID'];\n theme: SurfaceTheme;\n}\n\ninterface CheckboxContentInput {\n children: CheckboxProps['children'];\n color: NonNullable<CheckboxProps['color']>;\n disabled: boolean;\n interactionState: InteractionState;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n size: NonNullable<CheckboxProps['size']>;\n theme: SurfaceTheme;\n}\n"]}
@@ -3,7 +3,7 @@ import { resolveFieldState, resolveIndicatorSize, resolveSelectionControlColors,
3
3
  import { useControllableState } from '../../../../../internal/useControllableState';
4
4
  import { ButtonBase } from '../../../../../primitives/button-base';
5
5
  import { useTheme } from '../../../../../theme/ThemeContext';
6
- import { Box } from '../../../../layout/public';
6
+ import { View } from '../../../../layout/public';
7
7
  import { Text } from '../../../../typography/public';
8
8
  import { isRadioTextContent } from '../../utils/isRadioTextContent';
9
9
  /*** Renders one accessible radio control with text or structured label content. */
@@ -59,14 +59,14 @@ function renderRadioContent(input) {
59
59
  const indicatorSize = resolveIndicatorSize(input.size);
60
60
  const labelEmphasis = colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';
61
61
  const hasContent = input.children !== undefined && input.children !== null && input.children !== false;
62
- return (<Box style={resolveSelectionRowStyle(colors.opacity)}>
63
- <Box radius="full" style={resolveRadioIndicatorStyle(colors.backgroundColor, colors.borderColor, indicatorSize.radio)}>
64
- {input.isChecked ? (<Box radius="full" style={resolveRadioDotStyle(colors.indicatorColor, indicatorSize.radioDot)}/>) : null}
65
- </Box>
66
- {hasContent ? (<Box flex={1} ml="s">
62
+ return (<View style={resolveSelectionRowStyle(colors.opacity)}>
63
+ <View radius="full" style={resolveRadioIndicatorStyle(colors.backgroundColor, colors.borderColor, indicatorSize.radio)}>
64
+ {input.isChecked ? (<View radius="full" style={resolveRadioDotStyle(colors.indicatorColor, indicatorSize.radioDot)}/>) : null}
65
+ </View>
66
+ {hasContent ? (<View flex={1} ml="s">
67
67
  {isRadioTextContent(input.children) ? (<Text emphasis={labelEmphasis}>{input.children}</Text>) : (input.children)}
68
- </Box>) : null}
69
- </Box>);
68
+ </View>) : null}
69
+ </View>);
70
70
  }
71
71
  /*** Resolves the horizontal selection-control row style. */
72
72
  function resolveSelectionRowStyle(opacity) {
@@ -1 +1 @@
1
- {"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../../../../../src/features/form/radio/adapters/inbound/Radio.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport {\n type InteractionState,\n resolveFieldState,\n resolveIndicatorSize,\n resolveSelectionControlColors,\n resolveSelectionControlNextChecked,\n} from '../../../../../internal/resolvers';\nimport { useControllableState } from '../../../../../internal/useControllableState';\nimport { ButtonBase } from '../../../../../primitives/button-base';\nimport type { ButtonBaseProps } from '../../../../../primitives/button-base/types';\nimport { useTheme } from '../../../../../theme/ThemeContext';\nimport type { SurfaceTheme } from '../../../../../theme/types';\nimport type { RadioProps } from '../../../../../types/radio';\nimport { Box } from '../../../../layout/public';\nimport { Text } from '../../../../typography/public';\nimport { isRadioTextContent } from '../../utils/isRadioTextContent';\n\n/*** Renders one accessible radio control with text or structured label content. */\nexport function Radio({\n accessibilityLabel,\n checked,\n children,\n color = 'primary',\n defaultChecked = false,\n disabled = false,\n invalid = false,\n onCheckedChange,\n readOnly = false,\n size = 'm',\n testID,\n ...buttonProps\n}: RadioProps) {\n const { theme } = useTheme();\n const [isChecked, setChecked] = useControllableState<boolean>({\n value: checked,\n defaultValue: defaultChecked,\n onChange: onCheckedChange,\n });\n\n return (\n <RadioControl\n accessibilityLabel={accessibilityLabel}\n buttonProps={buttonProps}\n color={color}\n disabled={disabled}\n invalid={invalid}\n isChecked={isChecked}\n readOnly={readOnly}\n setChecked={setChecked}\n size={size}\n testID={testID}\n theme={theme}\n >\n {children}\n </RadioControl>\n );\n}\n\n/*** Owns the radio interaction boundary around resolved selection content. */\nfunction RadioControl({\n accessibilityLabel,\n buttonProps,\n children,\n color,\n disabled,\n invalid,\n isChecked,\n readOnly,\n setChecked,\n size,\n testID,\n theme,\n}: RadioControlProps) {\n const nextChecked = resolveSelectionControlNextChecked({\n checked: isChecked,\n disabled,\n kind: 'radio',\n readOnly,\n });\n\n return (\n <ButtonBase\n {...buttonProps}\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"radio\"\n accessibilityState={{ checked: isChecked }}\n disabled={disabled}\n onPress={nextChecked === null ? undefined : () => setChecked(nextChecked)}\n testID={testID}\n >\n {(interactionState) =>\n renderRadioContent({\n children,\n color,\n disabled,\n interactionState,\n invalid,\n isChecked,\n readOnly,\n size,\n theme,\n })\n }\n </ButtonBase>\n );\n}\n\n/*** Renders the radio indicator and optional content for one interaction state. */\nfunction renderRadioContent(input: RadioContentInput) {\n const { interactionState, theme } = input;\n const fieldState = resolveFieldState({\n disabled: input.disabled,\n focused: interactionState.focused,\n invalid: input.invalid,\n readOnly: input.readOnly,\n });\n const colors = resolveSelectionControlColors(theme, {\n checked: input.isChecked,\n fieldState,\n hovered: interactionState.hovered,\n pressed: interactionState.pressed,\n color: input.color,\n });\n const indicatorSize = resolveIndicatorSize(input.size);\n const labelEmphasis = colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';\n const hasContent =\n input.children !== undefined && input.children !== null && input.children !== false;\n\n return (\n <Box style={resolveSelectionRowStyle(colors.opacity)}>\n <Box\n radius=\"full\"\n style={resolveRadioIndicatorStyle(\n colors.backgroundColor,\n colors.borderColor,\n indicatorSize.radio,\n )}\n >\n {input.isChecked ? (\n <Box\n radius=\"full\"\n style={resolveRadioDotStyle(colors.indicatorColor, indicatorSize.radioDot)}\n />\n ) : null}\n </Box>\n {hasContent ? (\n <Box flex={1} ml=\"s\">\n {isRadioTextContent(input.children) ? (\n <Text emphasis={labelEmphasis}>{input.children}</Text>\n ) : (\n input.children\n )}\n </Box>\n ) : null}\n </Box>\n );\n}\n\n/*** Resolves the horizontal selection-control row style. */\nfunction resolveSelectionRowStyle(opacity: number | undefined): ViewStyle {\n return { alignItems: 'center', flexDirection: 'row', opacity };\n}\n\n/*** Resolves radio indicator dimensions and interaction colors. */\nfunction resolveRadioIndicatorStyle(\n backgroundColor: string,\n borderColor: string,\n size: number,\n): ViewStyle {\n return {\n alignItems: 'center',\n backgroundColor,\n borderColor,\n borderWidth: 1.5,\n height: size,\n justifyContent: 'center',\n width: size,\n };\n}\n\n/*** Resolves the checked radio dot style. */\nfunction resolveRadioDotStyle(backgroundColor: string, size: number): ViewStyle {\n return { backgroundColor, height: size, width: size };\n}\n\ninterface RadioControlProps {\n accessibilityLabel: RadioProps['accessibilityLabel'];\n buttonProps: ButtonBaseProps;\n children: RadioProps['children'];\n color: NonNullable<RadioProps['color']>;\n disabled: boolean;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n setChecked: (checked: boolean) => void;\n size: NonNullable<RadioProps['size']>;\n testID: RadioProps['testID'];\n theme: SurfaceTheme;\n}\n\ninterface RadioContentInput {\n children: RadioProps['children'];\n color: NonNullable<RadioProps['color']>;\n disabled: boolean;\n interactionState: InteractionState;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n size: NonNullable<RadioProps['size']>;\n theme: SurfaceTheme;\n}\n"]}
1
+ {"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../../../../../src/features/form/radio/adapters/inbound/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAEL,iBAAiB,EACjB,oBAAoB,EACpB,6BAA6B,EAC7B,kCAAkC,GACnC,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,8CAA8C,CAAC;AACpF,OAAO,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAEnE,OAAO,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAG7D,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,+BAA+B,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEpE,mFAAmF;AACnF,MAAM,UAAU,KAAK,CAAC,EACpB,kBAAkB,EAClB,OAAO,EACP,QAAQ,EACR,KAAK,GAAG,SAAS,EACjB,cAAc,GAAG,KAAK,EACtB,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,eAAe,EACf,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,GAAG,EACV,MAAM,EACN,GAAG,WAAW,EACH;IACX,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG,oBAAoB,CAAU;QAC5D,KAAK,EAAE,OAAO;QACd,YAAY,EAAE,cAAc;QAC5B,QAAQ,EAAE,eAAe;KAC1B,CAAC,CAAC;IAEH,OAAO,CACL,CAAC,YAAY,CACX,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CAEb;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,YAAY,CAAC,CAChB,CAAC;AACJ,CAAC;AAED,8EAA8E;AAC9E,SAAS,YAAY,CAAC,EACpB,kBAAkB,EAClB,WAAW,EACX,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,OAAO,EACP,SAAS,EACT,QAAQ,EACR,UAAU,EACV,IAAI,EACJ,MAAM,EACN,KAAK,GACa;IAClB,MAAM,WAAW,GAAG,kCAAkC,CAAC;QACrD,OAAO,EAAE,SAAS;QAClB,QAAQ;QACR,IAAI,EAAE,OAAO;QACb,QAAQ;KACT,CAAC,CAAC;IAEH,OAAO,CACL,CAAC,UAAU,CACT,IAAI,WAAW,CAAC,CAChB,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,iBAAiB,CAAC,OAAO,CACzB,kBAAkB,CAAC,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAC3C,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,WAAW,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,CAC1E,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,CAAC,gBAAgB,EAAE,EAAE,CACpB,kBAAkB,CAAC;YACjB,QAAQ;YACR,KAAK;YACL,QAAQ;YACR,gBAAgB;YAChB,OAAO;YACP,SAAS;YACT,QAAQ;YACR,IAAI;YACJ,KAAK;SACN,CACH,CACF;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC;AAED,mFAAmF;AACnF,SAAS,kBAAkB,CAAC,KAAwB;IAClD,MAAM,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAC1C,MAAM,UAAU,GAAG,iBAAiB,CAAC;QACnC,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,OAAO,EAAE,gBAAgB,CAAC,OAAO;QACjC,OAAO,EAAE,KAAK,CAAC,OAAO;QACtB,QAAQ,EAAE,KAAK,CAAC,QAAQ;KACzB,CAAC,CAAC;IACH,MAAM,MAAM,GAAG,6BAA6B,CAAC,KAAK,EAAE;QAClD,OAAO,EAAE,KAAK,CAAC,SAAS;QACxB,UAAU;QACV,OAAO,EAAE,gBAAgB,CAAC,OAAO;QACjC,OAAO,EAAE,gBAAgB,CAAC,OAAO;QACjC,KAAK,EAAE,KAAK,CAAC,KAAK;KACnB,CAAC,CAAC;IACH,MAAM,aAAa,GAAG,oBAAoB,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACvD,MAAM,aAAa,GAAG,MAAM,CAAC,UAAU,KAAK,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;IAChG,MAAM,UAAU,GACd,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,KAAK,CAAC,QAAQ,KAAK,IAAI,IAAI,KAAK,CAAC,QAAQ,KAAK,KAAK,CAAC;IAEtF,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CACpD;MAAA,CAAC,IAAI,CACH,MAAM,CAAC,MAAM,CACb,KAAK,CAAC,CAAC,0BAA0B,CAC/B,MAAM,CAAC,eAAe,EACtB,MAAM,CAAC,WAAW,EAClB,aAAa,CAAC,KAAK,CACpB,CAAC,CAEF;QAAA,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CACjB,CAAC,IAAI,CACH,MAAM,CAAC,MAAM,CACb,KAAK,CAAC,CAAC,oBAAoB,CAAC,MAAM,CAAC,cAAc,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC,EAC3E,CACH,CAAC,CAAC,CAAC,IAAI,CACV;MAAA,EAAE,IAAI,CACN;MAAA,CAAC,UAAU,CAAC,CAAC,CAAC,CACZ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CACnB;UAAA,CAAC,kBAAkB,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CACpC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,CACvD,CAAC,CAAC,CAAC,CACF,KAAK,CAAC,QAAQ,CACf,CACH;QAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACV;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,4DAA4D;AAC5D,SAAS,wBAAwB,CAAC,OAA2B;IAC3D,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,aAAa,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC;AACjE,CAAC;AAED,mEAAmE;AACnE,SAAS,0BAA0B,CACjC,eAAuB,EACvB,WAAmB,EACnB,IAAY;IAEZ,OAAO;QACL,UAAU,EAAE,QAAQ;QACpB,eAAe;QACf,WAAW;QACX,WAAW,EAAE,GAAG;QAChB,MAAM,EAAE,IAAI;QACZ,cAAc,EAAE,QAAQ;QACxB,KAAK,EAAE,IAAI;KACZ,CAAC;AACJ,CAAC;AAED,6CAA6C;AAC7C,SAAS,oBAAoB,CAAC,eAAuB,EAAE,IAAY;IACjE,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;AACxD,CAAC","sourcesContent":["import React from 'react';\nimport type { ViewStyle } from 'react-native';\n\nimport {\n type InteractionState,\n resolveFieldState,\n resolveIndicatorSize,\n resolveSelectionControlColors,\n resolveSelectionControlNextChecked,\n} from '../../../../../internal/resolvers';\nimport { useControllableState } from '../../../../../internal/useControllableState';\nimport { ButtonBase } from '../../../../../primitives/button-base';\nimport type { ButtonBaseProps } from '../../../../../primitives/button-base/types';\nimport { useTheme } from '../../../../../theme/ThemeContext';\nimport type { SurfaceTheme } from '../../../../../theme/types';\nimport type { RadioProps } from '../../../../../types/radio';\nimport { View } from '../../../../layout/public';\nimport { Text } from '../../../../typography/public';\nimport { isRadioTextContent } from '../../utils/isRadioTextContent';\n\n/*** Renders one accessible radio control with text or structured label content. */\nexport function Radio({\n accessibilityLabel,\n checked,\n children,\n color = 'primary',\n defaultChecked = false,\n disabled = false,\n invalid = false,\n onCheckedChange,\n readOnly = false,\n size = 'm',\n testID,\n ...buttonProps\n}: RadioProps) {\n const { theme } = useTheme();\n const [isChecked, setChecked] = useControllableState<boolean>({\n value: checked,\n defaultValue: defaultChecked,\n onChange: onCheckedChange,\n });\n\n return (\n <RadioControl\n accessibilityLabel={accessibilityLabel}\n buttonProps={buttonProps}\n color={color}\n disabled={disabled}\n invalid={invalid}\n isChecked={isChecked}\n readOnly={readOnly}\n setChecked={setChecked}\n size={size}\n testID={testID}\n theme={theme}\n >\n {children}\n </RadioControl>\n );\n}\n\n/*** Owns the radio interaction boundary around resolved selection content. */\nfunction RadioControl({\n accessibilityLabel,\n buttonProps,\n children,\n color,\n disabled,\n invalid,\n isChecked,\n readOnly,\n setChecked,\n size,\n testID,\n theme,\n}: RadioControlProps) {\n const nextChecked = resolveSelectionControlNextChecked({\n checked: isChecked,\n disabled,\n kind: 'radio',\n readOnly,\n });\n\n return (\n <ButtonBase\n {...buttonProps}\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"radio\"\n accessibilityState={{ checked: isChecked }}\n disabled={disabled}\n onPress={nextChecked === null ? undefined : () => setChecked(nextChecked)}\n testID={testID}\n >\n {(interactionState) =>\n renderRadioContent({\n children,\n color,\n disabled,\n interactionState,\n invalid,\n isChecked,\n readOnly,\n size,\n theme,\n })\n }\n </ButtonBase>\n );\n}\n\n/*** Renders the radio indicator and optional content for one interaction state. */\nfunction renderRadioContent(input: RadioContentInput) {\n const { interactionState, theme } = input;\n const fieldState = resolveFieldState({\n disabled: input.disabled,\n focused: interactionState.focused,\n invalid: input.invalid,\n readOnly: input.readOnly,\n });\n const colors = resolveSelectionControlColors(theme, {\n checked: input.isChecked,\n fieldState,\n hovered: interactionState.hovered,\n pressed: interactionState.pressed,\n color: input.color,\n });\n const indicatorSize = resolveIndicatorSize(input.size);\n const labelEmphasis = colors.labelColor === theme.semantics.content.muted ? 'muted' : 'default';\n const hasContent =\n input.children !== undefined && input.children !== null && input.children !== false;\n\n return (\n <View style={resolveSelectionRowStyle(colors.opacity)}>\n <View\n radius=\"full\"\n style={resolveRadioIndicatorStyle(\n colors.backgroundColor,\n colors.borderColor,\n indicatorSize.radio,\n )}\n >\n {input.isChecked ? (\n <View\n radius=\"full\"\n style={resolveRadioDotStyle(colors.indicatorColor, indicatorSize.radioDot)}\n />\n ) : null}\n </View>\n {hasContent ? (\n <View flex={1} ml=\"s\">\n {isRadioTextContent(input.children) ? (\n <Text emphasis={labelEmphasis}>{input.children}</Text>\n ) : (\n input.children\n )}\n </View>\n ) : null}\n </View>\n );\n}\n\n/*** Resolves the horizontal selection-control row style. */\nfunction resolveSelectionRowStyle(opacity: number | undefined): ViewStyle {\n return { alignItems: 'center', flexDirection: 'row', opacity };\n}\n\n/*** Resolves radio indicator dimensions and interaction colors. */\nfunction resolveRadioIndicatorStyle(\n backgroundColor: string,\n borderColor: string,\n size: number,\n): ViewStyle {\n return {\n alignItems: 'center',\n backgroundColor,\n borderColor,\n borderWidth: 1.5,\n height: size,\n justifyContent: 'center',\n width: size,\n };\n}\n\n/*** Resolves the checked radio dot style. */\nfunction resolveRadioDotStyle(backgroundColor: string, size: number): ViewStyle {\n return { backgroundColor, height: size, width: size };\n}\n\ninterface RadioControlProps {\n accessibilityLabel: RadioProps['accessibilityLabel'];\n buttonProps: ButtonBaseProps;\n children: RadioProps['children'];\n color: NonNullable<RadioProps['color']>;\n disabled: boolean;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n setChecked: (checked: boolean) => void;\n size: NonNullable<RadioProps['size']>;\n testID: RadioProps['testID'];\n theme: SurfaceTheme;\n}\n\ninterface RadioContentInput {\n children: RadioProps['children'];\n color: NonNullable<RadioProps['color']>;\n disabled: boolean;\n interactionState: InteractionState;\n invalid: boolean;\n isChecked: boolean;\n readOnly: boolean;\n size: NonNullable<RadioProps['size']>;\n theme: SurfaceTheme;\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
- import { Box } from './Box';
2
+ import { View } from './View';
3
3
  /*** Renders a horizontal or vertical separator using layout tokens. */
4
4
  export function Divider({ orientation = 'horizontal', color = 'border', thickness = 1, ...props }) {
5
- return (<Box {...props} bg={color} height={orientation === 'horizontal' ? thickness : '100%'} width={orientation === 'vertical' ? thickness : '100%'}/>);
5
+ return (<View {...props} bg={color} height={orientation === 'horizontal' ? thickness : '100%'} width={orientation === 'vertical' ? thickness : '100%'}/>);
6
6
  }
7
7
  //# sourceMappingURL=Divider.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Divider.js","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/Divider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,uEAAuE;AACvE,MAAM,UAAU,OAAO,CAAC,EACtB,WAAW,GAAG,YAAY,EAC1B,KAAK,GAAG,QAAQ,EAChB,SAAS,GAAG,CAAC,EACb,GAAG,KAAK,EACK;IACb,OAAO,CACL,CAAC,GAAG,CACF,IAAI,KAAK,CAAC,CACV,EAAE,CAAC,CAAC,KAAK,CAAC,CACV,MAAM,CAAC,CAAC,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAC1D,KAAK,CAAC,CAAC,WAAW,KAAK,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,EACvD,CACH,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport type { DividerProps } from '../../../../types/layout';\nimport { Box } from './Box';\n\n/*** Renders a horizontal or vertical separator using layout tokens. */\nexport function Divider({\n orientation = 'horizontal',\n color = 'border',\n thickness = 1,\n ...props\n}: DividerProps) {\n return (\n <Box\n {...props}\n bg={color}\n height={orientation === 'horizontal' ? thickness : '100%'}\n width={orientation === 'vertical' ? thickness : '100%'}\n />\n );\n}\n"]}
1
+ {"version":3,"file":"Divider.js","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/Divider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,uEAAuE;AACvE,MAAM,UAAU,OAAO,CAAC,EACtB,WAAW,GAAG,YAAY,EAC1B,KAAK,GAAG,QAAQ,EAChB,SAAS,GAAG,CAAC,EACb,GAAG,KAAK,EACK;IACb,OAAO,CACL,CAAC,IAAI,CACH,IAAI,KAAK,CAAC,CACV,EAAE,CAAC,CAAC,KAAK,CAAC,CACV,MAAM,CAAC,CAAC,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAC1D,KAAK,CAAC,CAAC,WAAW,KAAK,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,EACvD,CACH,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport type { DividerProps } from '../../../../types/layout';\nimport { View } from './View';\n\n/*** Renders a horizontal or vertical separator using layout tokens. */\nexport function Divider({\n orientation = 'horizontal',\n color = 'border',\n thickness = 1,\n ...props\n}: DividerProps) {\n return (\n <View\n {...props}\n bg={color}\n height={orientation === 'horizontal' ? thickness : '100%'}\n width={orientation === 'vertical' ? thickness : '100%'}\n />\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Grid.d.ts","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/Grid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAI1D,wDAAwD;AACxD,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,GAAO,EACP,MAAM,EACN,MAAM,EACN,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,SAAS,qBA4BX"}
1
+ {"version":3,"file":"Grid.d.ts","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/Grid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAI1D,wDAAwD;AACxD,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,GAAO,EACP,MAAM,EACN,MAAM,EACN,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,SAAS,qBA0BX"}
@@ -1,9 +1,9 @@
1
1
  import React from 'react';
2
- import { View } from 'react-native';
2
+ import { View as ReactNativeView } from 'react-native';
3
3
  import { resolveResponsive, useResponsiveRuntime } from '../../../../core/responsive';
4
4
  import { useTheme } from '../../../../theme/ThemeContext';
5
5
  import { resolveSpacing } from '../../../../utils/resolveSpacing';
6
- import { Box } from './Box';
6
+ import { View } from './View';
7
7
  /*** Lays out children in a responsive wrapping grid. */
8
8
  export function Grid({ children, cols, gap = 0, rowGap, colGap, minItemWidth, ...props }) {
9
9
  const { theme } = useTheme();
@@ -14,13 +14,11 @@ export function Grid({ children, cols, gap = 0, rowGap, colGap, minItemWidth, ..
14
14
  const colSpacing = Number(resolveSpacing(theme, resolveResponsive(colGap, breakpoint) ?? defaultGap) ?? 0);
15
15
  const activeMinItemWidth = resolveResponsive(minItemWidth, breakpoint);
16
16
  const basisPercent = `${100 / activeCols}%`;
17
- return (<Box {...props}>
18
- <View style={resolveGridStyle(rowSpacing, colSpacing)}>
19
- {React.Children.toArray(children).map((node, index) => (<View key={String(index)} style={resolveGridItemStyle(activeMinItemWidth, basisPercent, rowSpacing, colSpacing)}>
20
- {node}
21
- </View>))}
22
- </View>
23
- </Box>);
17
+ return (<View {...props} style={[resolveGridStyle(rowSpacing, colSpacing), props.style]}>
18
+ {React.Children.toArray(children).map((node, index) => (<ReactNativeView key={React.isValidElement(node) && node.key !== null ? String(node.key) : String(index)} style={resolveGridItemStyle(activeMinItemWidth, basisPercent, rowSpacing, colSpacing)}>
19
+ {node}
20
+ </ReactNativeView>))}
21
+ </View>);
24
22
  }
25
23
  /*** Resolves the wrapping Grid container style. */
26
24
  function resolveGridStyle(rowSpacing, colSpacing) {
@@ -1 +1 @@
1
- {"version":3,"file":"Grid.js","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/Grid.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View, type ViewStyle } from 'react-native';\n\nimport { resolveResponsive, useResponsiveRuntime } from '../../../../core/responsive';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { GridProps } from '../../../../types/layout';\nimport { resolveSpacing } from '../../../../utils/resolveSpacing';\nimport { Box } from './Box';\n\n/*** Lays out children in a responsive wrapping grid. */\nexport function Grid({\n children,\n cols,\n gap = 0,\n rowGap,\n colGap,\n minItemWidth,\n ...props\n}: GridProps) {\n const { theme } = useTheme();\n const { breakpoint } = useResponsiveRuntime();\n const activeCols = Math.max(1, Math.floor(resolveResponsive(cols, breakpoint) ?? 1));\n const defaultGap = resolveResponsive(gap, breakpoint) ?? 0;\n const rowSpacing = Number(\n resolveSpacing(theme, resolveResponsive(rowGap, breakpoint) ?? defaultGap) ?? 0,\n );\n const colSpacing = Number(\n resolveSpacing(theme, resolveResponsive(colGap, breakpoint) ?? defaultGap) ?? 0,\n );\n const activeMinItemWidth = resolveResponsive(minItemWidth, breakpoint);\n const basisPercent: `${number}%` = `${100 / activeCols}%`;\n\n return (\n <Box {...props}>\n <View style={resolveGridStyle(rowSpacing, colSpacing)}>\n {React.Children.toArray(children).map((node, index) => (\n <View\n key={String(index)}\n style={resolveGridItemStyle(activeMinItemWidth, basisPercent, rowSpacing, colSpacing)}\n >\n {node}\n </View>\n ))}\n </View>\n </Box>\n );\n}\n\n/*** Resolves the wrapping Grid container style. */\nfunction resolveGridStyle(rowSpacing: number, colSpacing: number): ViewStyle {\n return {\n flexDirection: 'row',\n flexWrap: 'wrap',\n marginLeft: -colSpacing / 2,\n marginRight: -colSpacing / 2,\n marginTop: -rowSpacing / 2,\n };\n}\n\n/*** Resolves a fixed-column or minimum-width grid item style. */\nfunction resolveGridItemStyle(\n minItemWidth: number | undefined,\n basisPercent: `${number}%`,\n rowSpacing: number,\n colSpacing: number,\n): ViewStyle {\n const sizing =\n minItemWidth === undefined\n ? { width: basisPercent, flexBasis: basisPercent }\n : { minWidth: minItemWidth, flexBasis: minItemWidth, flexGrow: 1 };\n return {\n ...sizing,\n paddingBottom: rowSpacing / 2,\n paddingLeft: colSpacing / 2,\n paddingRight: colSpacing / 2,\n paddingTop: rowSpacing / 2,\n };\n}\n"]}
1
+ {"version":3,"file":"Grid.js","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/Grid.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View as ReactNativeView, type ViewStyle } from 'react-native';\n\nimport { resolveResponsive, useResponsiveRuntime } from '../../../../core/responsive';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { GridProps } from '../../../../types/layout';\nimport { resolveSpacing } from '../../../../utils/resolveSpacing';\nimport { View } from './View';\n\n/*** Lays out children in a responsive wrapping grid. */\nexport function Grid({\n children,\n cols,\n gap = 0,\n rowGap,\n colGap,\n minItemWidth,\n ...props\n}: GridProps) {\n const { theme } = useTheme();\n const { breakpoint } = useResponsiveRuntime();\n const activeCols = Math.max(1, Math.floor(resolveResponsive(cols, breakpoint) ?? 1));\n const defaultGap = resolveResponsive(gap, breakpoint) ?? 0;\n const rowSpacing = Number(\n resolveSpacing(theme, resolveResponsive(rowGap, breakpoint) ?? defaultGap) ?? 0,\n );\n const colSpacing = Number(\n resolveSpacing(theme, resolveResponsive(colGap, breakpoint) ?? defaultGap) ?? 0,\n );\n const activeMinItemWidth = resolveResponsive(minItemWidth, breakpoint);\n const basisPercent: `${number}%` = `${100 / activeCols}%`;\n\n return (\n <View {...props} style={[resolveGridStyle(rowSpacing, colSpacing), props.style]}>\n {React.Children.toArray(children).map((node, index) => (\n <ReactNativeView\n key={React.isValidElement(node) && node.key !== null ? String(node.key) : String(index)}\n style={resolveGridItemStyle(activeMinItemWidth, basisPercent, rowSpacing, colSpacing)}\n >\n {node}\n </ReactNativeView>\n ))}\n </View>\n );\n}\n\n/*** Resolves the wrapping Grid container style. */\nfunction resolveGridStyle(rowSpacing: number, colSpacing: number): ViewStyle {\n return {\n flexDirection: 'row',\n flexWrap: 'wrap',\n marginLeft: -colSpacing / 2,\n marginRight: -colSpacing / 2,\n marginTop: -rowSpacing / 2,\n };\n}\n\n/*** Resolves a fixed-column or minimum-width grid item style. */\nfunction resolveGridItemStyle(\n minItemWidth: number | undefined,\n basisPercent: `${number}%`,\n rowSpacing: number,\n colSpacing: number,\n): ViewStyle {\n const sizing =\n minItemWidth === undefined\n ? { width: basisPercent, flexBasis: basisPercent }\n : { minWidth: minItemWidth, flexBasis: minItemWidth, flexGrow: 1 };\n return {\n ...sizing,\n paddingBottom: rowSpacing / 2,\n paddingLeft: colSpacing / 2,\n paddingRight: colSpacing / 2,\n paddingTop: rowSpacing / 2,\n };\n}\n"]}
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import type { ScrollViewProps } from '../../../../types/layout';
3
+ /*** Renders the token-aware responsive Surface adapter for React Native ScrollView. */
4
+ export declare function ScrollView(props: ScrollViewProps): React.JSX.Element;
5
+ //# sourceMappingURL=ScrollView.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ScrollView.d.ts","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/ScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAGhE,uFAAuF;AACvF,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,qBAwBhD"}
@@ -0,0 +1,69 @@
1
+ import React from 'react';
2
+ import { ScrollView as ReactNativeScrollView } from 'react-native';
3
+ import { useResponsiveRuntime } from '../../../../core/responsive';
4
+ import { useTheme } from '../../../../theme/ThemeContext';
5
+ import { resolveViewStyles } from '../../../../utils/resolveViewStyles';
6
+ /*** Renders the token-aware responsive Surface adapter for React Native ScrollView. */
7
+ export function ScrollView(props) {
8
+ const { theme } = useTheme();
9
+ const { breakpoint } = useResponsiveRuntime();
10
+ const spacing = splitSpacingProps(props);
11
+ const visual = splitVisualProps(spacing.rest);
12
+ const dimensions = splitDimensionProps(visual.rest);
13
+ const layout = splitLayoutProps(dimensions.rest);
14
+ const { children, contentContainerStyle, style, ...scrollProps } = layout.rest;
15
+ const resolved = resolveViewStyles(theme, breakpoint, {
16
+ ...spacing.styleProps,
17
+ ...visual.styleProps,
18
+ ...dimensions.styleProps,
19
+ ...layout.styleProps,
20
+ });
21
+ return (<ReactNativeScrollView {...scrollProps} contentContainerStyle={contentContainerStyle} style={[resolved, style]}>
22
+ {children}
23
+ </ReactNativeScrollView>);
24
+ }
25
+ /*** Splits spacing-aware Surface props from native ScrollView props. */
26
+ function splitSpacingProps(props) {
27
+ const { p, px, py, pt, pb, pl, pr, m, mx, my, mt, mb, ml, mr, gap, rowGap, columnGap, ...rest } = props;
28
+ return {
29
+ rest,
30
+ styleProps: { p, px, py, pt, pb, pl, pr, m, mx, my, mt, mb, ml, mr, gap, rowGap, columnGap },
31
+ };
32
+ }
33
+ /*** Splits token-aware visual Surface props from native ScrollView props. */
34
+ function splitVisualProps(props) {
35
+ const { bg, radius, borderWidth, borderColor, ...rest } = props;
36
+ return { rest, styleProps: { bg, radius, borderWidth, borderColor } };
37
+ }
38
+ /*** Splits responsive dimension Surface props from native ScrollView props. */
39
+ function splitDimensionProps(props) {
40
+ const { width, height, minWidth, maxWidth, minHeight, maxHeight, ...rest } = props;
41
+ return { rest, styleProps: { width, height, minWidth, maxWidth, minHeight, maxHeight } };
42
+ }
43
+ /*** Splits responsive flex and positioning Surface props from native ScrollView props. */
44
+ function splitLayoutProps(props) {
45
+ const { flex, flexGrow, flexShrink, flexBasis, direction, align, justify, wrap, alignSelf, position, top, bottom, left, right, overflow, zIndex, opacity, ...rest } = props;
46
+ return {
47
+ rest,
48
+ styleProps: {
49
+ flex,
50
+ flexGrow,
51
+ flexShrink,
52
+ flexBasis,
53
+ direction,
54
+ align,
55
+ justify,
56
+ wrap,
57
+ alignSelf,
58
+ position,
59
+ top,
60
+ bottom,
61
+ left,
62
+ right,
63
+ overflow,
64
+ zIndex,
65
+ opacity,
66
+ },
67
+ };
68
+ }
69
+ //# sourceMappingURL=ScrollView.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ScrollView.js","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/ScrollView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { ScrollView as ReactNativeScrollView } from 'react-native';\n\nimport { useResponsiveRuntime } from '../../../../core/responsive';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { ScrollViewProps } from '../../../../types/layout';\nimport { resolveViewStyles } from '../../../../utils/resolveViewStyles';\n\n/*** Renders the token-aware responsive Surface adapter for React Native ScrollView. */\nexport function ScrollView(props: ScrollViewProps) {\n const { theme } = useTheme();\n const { breakpoint } = useResponsiveRuntime();\n const spacing = splitSpacingProps(props);\n const visual = splitVisualProps(spacing.rest);\n const dimensions = splitDimensionProps(visual.rest);\n const layout = splitLayoutProps(dimensions.rest);\n const { children, contentContainerStyle, style, ...scrollProps } = layout.rest;\n const resolved = resolveViewStyles(theme, breakpoint, {\n ...spacing.styleProps,\n ...visual.styleProps,\n ...dimensions.styleProps,\n ...layout.styleProps,\n });\n\n return (\n <ReactNativeScrollView\n {...scrollProps}\n contentContainerStyle={contentContainerStyle}\n style={[resolved, style]}\n >\n {children}\n </ReactNativeScrollView>\n );\n}\n\n/*** Splits spacing-aware Surface props from native ScrollView props. */\nfunction splitSpacingProps(props: ScrollViewProps) {\n const { p, px, py, pt, pb, pl, pr, m, mx, my, mt, mb, ml, mr, gap, rowGap, columnGap, ...rest } =\n props;\n return {\n rest,\n styleProps: { p, px, py, pt, pb, pl, pr, m, mx, my, mt, mb, ml, mr, gap, rowGap, columnGap },\n };\n}\n\n/*** Splits token-aware visual Surface props from native ScrollView props. */\nfunction splitVisualProps(props: ReturnType<typeof splitSpacingProps>['rest']) {\n const { bg, radius, borderWidth, borderColor, ...rest } = props;\n return { rest, styleProps: { bg, radius, borderWidth, borderColor } };\n}\n\n/*** Splits responsive dimension Surface props from native ScrollView props. */\nfunction splitDimensionProps(props: ReturnType<typeof splitVisualProps>['rest']) {\n const { width, height, minWidth, maxWidth, minHeight, maxHeight, ...rest } = props;\n return { rest, styleProps: { width, height, minWidth, maxWidth, minHeight, maxHeight } };\n}\n\n/*** Splits responsive flex and positioning Surface props from native ScrollView props. */\nfunction splitLayoutProps(props: ReturnType<typeof splitDimensionProps>['rest']) {\n const {\n flex,\n flexGrow,\n flexShrink,\n flexBasis,\n direction,\n align,\n justify,\n wrap,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n overflow,\n zIndex,\n opacity,\n ...rest\n } = props;\n return {\n rest,\n styleProps: {\n flex,\n flexGrow,\n flexShrink,\n flexBasis,\n direction,\n align,\n justify,\n wrap,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n overflow,\n zIndex,\n opacity,\n },\n };\n}\n"]}
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import type { ViewProps } from '../../../../types/layout';
3
+ /*** Renders the token-aware responsive Surface adapter for React Native View. */
4
+ export declare function View({ accessible, accessibilityLabel, accessibilityRole, accessibilityState, children, pointerEvents, style, testID, ...props }: ViewProps): React.JSX.Element;
5
+ //# sourceMappingURL=View.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"View.d.ts","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/View.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAG1D,iFAAiF;AACjF,wBAAgB,IAAI,CAAC,EACnB,UAAU,EACV,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,QAAQ,EACR,aAAa,EACb,KAAK,EACL,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,qBAmBX"}
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ import { View as ReactNativeView } from 'react-native';
3
+ import { useResponsiveRuntime } from '../../../../core/responsive';
4
+ import { resolvePointerEvents } from '../../../../internal/resolvePointerEvents';
5
+ import { useTheme } from '../../../../theme/ThemeContext';
6
+ import { resolveViewStyles } from '../../../../utils/resolveViewStyles';
7
+ /*** Renders the token-aware responsive Surface adapter for React Native View. */
8
+ export function View({ accessible, accessibilityLabel, accessibilityRole, accessibilityState, children, pointerEvents, style, testID, ...props }) {
9
+ const { theme } = useTheme();
10
+ const { breakpoint } = useResponsiveRuntime();
11
+ const resolved = resolveViewStyles(theme, breakpoint, props);
12
+ const resolvedPointerEvents = pointerEvents ? resolvePointerEvents(pointerEvents) : null;
13
+ return (<ReactNativeView {...resolvedPointerEvents?.props} accessible={accessible} accessibilityLabel={accessibilityLabel} accessibilityRole={accessibilityRole} accessibilityState={accessibilityState} testID={testID} style={[resolved, resolvedPointerEvents?.style, style]}>
14
+ {children}
15
+ </ReactNativeView>);
16
+ }
17
+ //# sourceMappingURL=View.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"View.js","sourceRoot":"","sources":["../../../../../src/features/layout/adapters/inbound/View.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,IAAI,eAAe,EAAE,MAAM,cAAc,CAAC;AAEvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAExE,iFAAiF;AACjF,MAAM,UAAU,IAAI,CAAC,EACnB,UAAU,EACV,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,QAAQ,EACR,aAAa,EACb,KAAK,EACL,MAAM,EACN,GAAG,KAAK,EACE;IACV,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,EAAE,UAAU,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAC9C,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;IAC7D,MAAM,qBAAqB,GAAG,aAAa,CAAC,CAAC,CAAC,oBAAoB,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAEzF,OAAO,CACL,CAAC,eAAe,CACd,IAAI,qBAAqB,EAAE,KAAK,CAAC,CACjC,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,kBAAkB,CAAC,CAAC,kBAAkB,CAAC,CACvC,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,CAAC,QAAQ,EAAE,qBAAqB,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAEvD;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,eAAe,CAAC,CACnB,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\nimport { View as ReactNativeView } from 'react-native';\n\nimport { useResponsiveRuntime } from '../../../../core/responsive';\nimport { resolvePointerEvents } from '../../../../internal/resolvePointerEvents';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { ViewProps } from '../../../../types/layout';\nimport { resolveViewStyles } from '../../../../utils/resolveViewStyles';\n\n/*** Renders the token-aware responsive Surface adapter for React Native View. */\nexport function View({\n accessible,\n accessibilityLabel,\n accessibilityRole,\n accessibilityState,\n children,\n pointerEvents,\n style,\n testID,\n ...props\n}: ViewProps) {\n const { theme } = useTheme();\n const { breakpoint } = useResponsiveRuntime();\n const resolved = resolveViewStyles(theme, breakpoint, props);\n const resolvedPointerEvents = pointerEvents ? resolvePointerEvents(pointerEvents) : null;\n\n return (\n <ReactNativeView\n {...resolvedPointerEvents?.props}\n accessible={accessible}\n accessibilityLabel={accessibilityLabel}\n accessibilityRole={accessibilityRole}\n accessibilityState={accessibilityState}\n testID={testID}\n style={[resolved, resolvedPointerEvents?.style, style]}\n >\n {children}\n </ReactNativeView>\n );\n}\n"]}
@@ -1,7 +1,6 @@
1
- export type { BoxProps, ContainerProps, DividerProps, GridProps, StackProps, } from '../../types/layout';
2
- export { Box } from './adapters/inbound/Box';
3
- export { Container } from './adapters/inbound/Container';
1
+ export type { DividerProps, GridProps, ScrollViewProps, ViewProps } from '../../types/layout';
4
2
  export { Divider } from './adapters/inbound/Divider';
5
3
  export { Grid } from './adapters/inbound/Grid';
6
- export { Stack } from './adapters/inbound/Stack';
4
+ export { ScrollView } from './adapters/inbound/ScrollView';
5
+ export { View } from './adapters/inbound/View';
7
6
  //# sourceMappingURL=public.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/features/layout/public.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,QAAQ,EACR,cAAc,EACd,YAAY,EACZ,SAAS,EACT,UAAU,GACX,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC"}
1
+ {"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/features/layout/public.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,SAAS,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC9F,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC"}
@@ -1,6 +1,5 @@
1
- export { Box } from './adapters/inbound/Box';
2
- export { Container } from './adapters/inbound/Container';
3
1
  export { Divider } from './adapters/inbound/Divider';
4
2
  export { Grid } from './adapters/inbound/Grid';
5
- export { Stack } from './adapters/inbound/Stack';
3
+ export { ScrollView } from './adapters/inbound/ScrollView';
4
+ export { View } from './adapters/inbound/View';
6
5
  //# sourceMappingURL=public.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"public.js","sourceRoot":"","sources":["../../../src/features/layout/public.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC","sourcesContent":["export type {\n BoxProps,\n ContainerProps,\n DividerProps,\n GridProps,\n StackProps,\n} from '../../types/layout';\nexport { Box } from './adapters/inbound/Box';\nexport { Container } from './adapters/inbound/Container';\nexport { Divider } from './adapters/inbound/Divider';\nexport { Grid } from './adapters/inbound/Grid';\nexport { Stack } from './adapters/inbound/Stack';\n"]}
1
+ {"version":3,"file":"public.js","sourceRoot":"","sources":["../../../src/features/layout/public.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC","sourcesContent":["export type { DividerProps, GridProps, ScrollViewProps, ViewProps } from '../../types/layout';\nexport { Divider } from './adapters/inbound/Divider';\nexport { Grid } from './adapters/inbound/Grid';\nexport { ScrollView } from './adapters/inbound/ScrollView';\nexport { View } from './adapters/inbound/View';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../../src/features/modal/adapters/inbound/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAK1D,qEAAqE;AACrE,wBAAgB,KAAK,CAAC,EACpB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,eAAsB,EACtB,iBAA6B,EAC7B,MAAM,GACP,EAAE,UAAU,4BAmCZ"}
1
+ {"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../../src/features/modal/adapters/inbound/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAM1D,qEAAqE;AACrE,wBAAgB,KAAK,CAAC,EACpB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,eAAsB,EACtB,iBAA6B,EAC7B,MAAM,GACP,EAAE,UAAU,4BAsCZ"}
@@ -1,11 +1,11 @@
1
1
  import React from 'react';
2
- import { Pressable, StyleSheet, View } from 'react-native';
2
+ import { Pressable, StyleSheet, View as ReactNativeView } from 'react-native';
3
3
  import { FocusScope } from '../../../../internal/focus/FocusScope';
4
4
  import { Portal } from '../../../../internal/overlay/Portal';
5
5
  import { resolvePointerEvents } from '../../../../internal/resolvePointerEvents';
6
6
  import { resolveOverlayAnimation } from '../../../../internal/resolvers';
7
- import { Center } from '../../../../layout';
8
7
  import { useTheme } from '../../../../theme/ThemeContext';
8
+ import { View } from '../../../layout/public';
9
9
  import { Surface } from '../../../surface/public';
10
10
  const boxNonePointerEvents = resolvePointerEvents('box-none');
11
11
  /*** Renders the generic Surface modal overlay and focus boundary. */
@@ -17,21 +17,21 @@ export function Modal({ visible, onDismiss, children, closeOnBackdrop = true, in
17
17
  if (!visible)
18
18
  return null;
19
19
  return (<Portal layer="modal" visible={visible}>
20
- <View {...boxNonePointerEvents.props} style={[boxNonePointerEvents.style, styles.fill]}>
20
+ <ReactNativeView {...boxNonePointerEvents.props} style={[boxNonePointerEvents.style, styles.fill]}>
21
21
  <Pressable onPress={backdropPress} style={[
22
22
  styles.fill,
23
23
  resolveBackdropStyle(theme.semantics.neutral.text, animation.backdropOpacity),
24
24
  ]} testID={testID ? `${testID}-backdrop` : undefined}/>
25
25
  <FocusScope active={visible} onEscape={passive ? undefined : onDismiss} testID={testID ? `${testID}-focus` : undefined}>
26
- <Center p="l" style={styles.center}>
27
- <View accessible accessibilityViewIsModal style={styles.content}>
26
+ <View align="center" justify="center" p="l" style={styles.center}>
27
+ <ReactNativeView accessible accessibilityViewIsModal style={styles.content}>
28
28
  <Surface p="l" style={styles.surface} testID={testID} variant="raised">
29
29
  {children}
30
30
  </Surface>
31
- </View>
32
- </Center>
31
+ </ReactNativeView>
32
+ </View>
33
33
  </FocusScope>
34
- </View>
34
+ </ReactNativeView>
35
35
  </Portal>);
36
36
  }
37
37
  /*** Resolves the runtime backdrop color and opacity without inline JSX styles. */
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../../../src/features/modal/adapters/inbound/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Pressable, StyleSheet, View, type ViewStyle } from 'react-native';\n\nimport { FocusScope } from '../../../../internal/focus/FocusScope';\nimport { Portal } from '../../../../internal/overlay/Portal';\nimport { resolvePointerEvents } from '../../../../internal/resolvePointerEvents';\nimport { resolveOverlayAnimation } from '../../../../internal/resolvers';\nimport { Center } from '../../../../layout';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { ModalProps } from '../../../../types/modal';\nimport { Surface } from '../../../surface/public';\n\nconst boxNonePointerEvents = resolvePointerEvents('box-none');\n\n/*** Renders the generic Surface modal overlay and focus boundary. */\nexport function Modal({\n visible,\n onDismiss,\n children,\n closeOnBackdrop = true,\n interactionPolicy = 'enabled',\n testID,\n}: ModalProps) {\n const { theme } = useTheme();\n const animation = resolveOverlayAnimation('modal');\n const passive = interactionPolicy === 'passive';\n const backdropPress = passive || !closeOnBackdrop ? undefined : onDismiss;\n\n if (!visible) return null;\n\n return (\n <Portal layer=\"modal\" visible={visible}>\n <View {...boxNonePointerEvents.props} style={[boxNonePointerEvents.style, styles.fill]}>\n <Pressable\n onPress={backdropPress}\n style={[\n styles.fill,\n resolveBackdropStyle(theme.semantics.neutral.text, animation.backdropOpacity),\n ]}\n testID={testID ? `${testID}-backdrop` : undefined}\n />\n <FocusScope\n active={visible}\n onEscape={passive ? undefined : onDismiss}\n testID={testID ? `${testID}-focus` : undefined}\n >\n <Center p=\"l\" style={styles.center}>\n <View accessible accessibilityViewIsModal style={styles.content}>\n <Surface p=\"l\" style={styles.surface} testID={testID} variant=\"raised\">\n {children}\n </Surface>\n </View>\n </Center>\n </FocusScope>\n </View>\n </Portal>\n );\n}\n\n/*** Resolves the runtime backdrop color and opacity without inline JSX styles. */\nfunction resolveBackdropStyle(backgroundColor: string, opacity: number): ViewStyle {\n return { backgroundColor, opacity };\n}\n\nconst styles = StyleSheet.create({\n center: { flex: 1 },\n content: { maxWidth: 560, width: '100%' },\n fill: { bottom: 0, left: 0, position: 'absolute', right: 0, top: 0 },\n surface: {\n shadowOffset: { height: 8, width: 0 },\n shadowOpacity: 0.14,\n shadowRadius: 18,\n },\n});\n"]}
1
+ {"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../../../src/features/modal/adapters/inbound/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Pressable, StyleSheet, View as ReactNativeView, type ViewStyle } from 'react-native';\n\nimport { FocusScope } from '../../../../internal/focus/FocusScope';\nimport { Portal } from '../../../../internal/overlay/Portal';\nimport { resolvePointerEvents } from '../../../../internal/resolvePointerEvents';\nimport { resolveOverlayAnimation } from '../../../../internal/resolvers';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { ModalProps } from '../../../../types/modal';\nimport { View } from '../../../layout/public';\nimport { Surface } from '../../../surface/public';\n\nconst boxNonePointerEvents = resolvePointerEvents('box-none');\n\n/*** Renders the generic Surface modal overlay and focus boundary. */\nexport function Modal({\n visible,\n onDismiss,\n children,\n closeOnBackdrop = true,\n interactionPolicy = 'enabled',\n testID,\n}: ModalProps) {\n const { theme } = useTheme();\n const animation = resolveOverlayAnimation('modal');\n const passive = interactionPolicy === 'passive';\n const backdropPress = passive || !closeOnBackdrop ? undefined : onDismiss;\n\n if (!visible) return null;\n\n return (\n <Portal layer=\"modal\" visible={visible}>\n <ReactNativeView\n {...boxNonePointerEvents.props}\n style={[boxNonePointerEvents.style, styles.fill]}\n >\n <Pressable\n onPress={backdropPress}\n style={[\n styles.fill,\n resolveBackdropStyle(theme.semantics.neutral.text, animation.backdropOpacity),\n ]}\n testID={testID ? `${testID}-backdrop` : undefined}\n />\n <FocusScope\n active={visible}\n onEscape={passive ? undefined : onDismiss}\n testID={testID ? `${testID}-focus` : undefined}\n >\n <View align=\"center\" justify=\"center\" p=\"l\" style={styles.center}>\n <ReactNativeView accessible accessibilityViewIsModal style={styles.content}>\n <Surface p=\"l\" style={styles.surface} testID={testID} variant=\"raised\">\n {children}\n </Surface>\n </ReactNativeView>\n </View>\n </FocusScope>\n </ReactNativeView>\n </Portal>\n );\n}\n\n/*** Resolves the runtime backdrop color and opacity without inline JSX styles. */\nfunction resolveBackdropStyle(backgroundColor: string, opacity: number): ViewStyle {\n return { backgroundColor, opacity };\n}\n\nconst styles = StyleSheet.create({\n center: { flex: 1 },\n content: { maxWidth: 560, width: '100%' },\n fill: { bottom: 0, left: 0, position: 'absolute', right: 0, top: 0 },\n surface: {\n shadowOffset: { height: 8, width: 0 },\n shadowOpacity: 0.14,\n shadowRadius: 18,\n },\n});\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"PopoverMenu.d.ts","sourceRoot":"","sources":["../../../../../src/features/popover-menu/adapters/inbound/PopoverMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAAqB,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAQzF,6EAA6E;AAC7E,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,OAAO,EACP,OAAO,EACP,aAAoB,EACpB,iBAA6B,EAC7B,MAAM,GACP,EAAE,gBAAgB,qBAyBlB"}
1
+ {"version":3,"file":"PopoverMenu.d.ts","sourceRoot":"","sources":["../../../../../src/features/popover-menu/adapters/inbound/PopoverMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAqB,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAQzF,6EAA6E;AAC7E,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,OAAO,EACP,OAAO,EACP,aAAoB,EACpB,iBAA6B,EAC7B,MAAM,GACP,EAAE,gBAAgB,qBAyBlB"}