@telus-uds/components-base 1.8.0 → 1.8.3

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 (495) hide show
  1. package/CHANGELOG.md +34 -2
  2. package/component-docs.json +710 -668
  3. package/lib/A11yInfoProvider/index.js +4 -3
  4. package/lib/A11yText/index.js +6 -5
  5. package/lib/ActivityIndicator/Spinner.js +7 -6
  6. package/lib/ActivityIndicator/Spinner.native.js +8 -6
  7. package/lib/ActivityIndicator/index.js +6 -5
  8. package/lib/ActivityIndicator/shared.js +1 -1
  9. package/lib/BaseProvider/index.js +13 -10
  10. package/lib/Box/Box.js +20 -19
  11. package/lib/Button/Button.js +7 -6
  12. package/lib/Button/ButtonBase.js +95 -77
  13. package/lib/Button/ButtonGroup.js +33 -31
  14. package/lib/Button/ButtonLink.js +9 -7
  15. package/lib/Button/index.js +4 -4
  16. package/lib/Button/propTypes.js +1 -1
  17. package/lib/Card/Card.js +8 -7
  18. package/lib/Card/CardBase.js +35 -31
  19. package/lib/Card/PressableCardBase.js +14 -12
  20. package/lib/Checkbox/Checkbox.js +96 -82
  21. package/lib/Checkbox/CheckboxGroup.js +27 -25
  22. package/lib/Checkbox/CheckboxInput.js +12 -10
  23. package/lib/Divider/Divider.js +8 -7
  24. package/lib/ExpandCollapse/Control.js +42 -36
  25. package/lib/ExpandCollapse/ExpandCollapse.js +11 -10
  26. package/lib/ExpandCollapse/Panel.js +27 -23
  27. package/lib/Feedback/Feedback.js +48 -35
  28. package/lib/Fieldset/Fieldset.js +16 -15
  29. package/lib/Fieldset/FieldsetContainer.js +16 -13
  30. package/lib/Fieldset/FieldsetContainer.native.js +11 -8
  31. package/lib/Fieldset/Legend.js +10 -7
  32. package/lib/Fieldset/Legend.native.js +10 -7
  33. package/lib/FlexGrid/Col/Col.js +17 -16
  34. package/lib/FlexGrid/FlexGrid.js +15 -14
  35. package/lib/FlexGrid/Row/Row.js +13 -12
  36. package/lib/HorizontalScroll/HorizontalScroll.js +25 -20
  37. package/lib/HorizontalScroll/HorizontalScrollButton.js +18 -14
  38. package/lib/HorizontalScroll/ScrollViewEnd.js +6 -5
  39. package/lib/HorizontalScroll/ScrollViewEnd.native.js +12 -9
  40. package/lib/HorizontalScroll/itemPositions.js +19 -13
  41. package/lib/Icon/Icon.js +10 -9
  42. package/lib/Icon/IconText.js +8 -7
  43. package/lib/Icon/index.js +5 -5
  44. package/lib/IconButton/IconButton.js +50 -42
  45. package/lib/InputLabel/InputLabel.js +37 -30
  46. package/lib/InputLabel/LabelContent.js +12 -9
  47. package/lib/InputLabel/LabelContent.native.js +9 -6
  48. package/lib/InputSupports/InputSupports.js +11 -10
  49. package/lib/InputSupports/useInputSupports.js +7 -6
  50. package/lib/Link/ChevronLink.js +9 -8
  51. package/lib/Link/InlinePressable.js +13 -10
  52. package/lib/Link/InlinePressable.native.js +20 -16
  53. package/lib/Link/Link.js +10 -9
  54. package/lib/Link/LinkBase.js +96 -78
  55. package/lib/Link/TextButton.js +9 -8
  56. package/lib/List/List.js +12 -11
  57. package/lib/List/ListItem.js +103 -79
  58. package/lib/Modal/Modal.js +74 -60
  59. package/lib/Notification/Notification.js +46 -33
  60. package/lib/Pagination/PageButton.js +11 -10
  61. package/lib/Pagination/Pagination.js +39 -28
  62. package/lib/Pagination/SideButton.js +21 -18
  63. package/lib/Pagination/usePagination.js +5 -4
  64. package/lib/Progress/Progress.js +23 -19
  65. package/lib/Progress/ProgressBar.js +23 -19
  66. package/lib/Progress/ProgressBarBackground.js +4 -3
  67. package/lib/Radio/Radio.js +79 -68
  68. package/lib/Radio/RadioButton.js +63 -53
  69. package/lib/Radio/RadioGroup.js +28 -26
  70. package/lib/Radio/RadioInput.js +12 -10
  71. package/lib/RadioCard/RadioCard.js +15 -14
  72. package/lib/RadioCard/RadioCardGroup.js +28 -26
  73. package/lib/Search/Search.js +51 -31
  74. package/lib/Select/Group.js +5 -4
  75. package/lib/Select/Group.native.js +4 -3
  76. package/lib/Select/Item.js +10 -7
  77. package/lib/Select/Item.native.js +1 -9
  78. package/lib/Select/Picker.js +16 -15
  79. package/lib/Select/Picker.native.js +49 -38
  80. package/lib/Select/Select.js +134 -113
  81. package/lib/SideNav/Item.js +39 -33
  82. package/lib/SideNav/ItemContent.js +15 -12
  83. package/lib/SideNav/ItemsGroup.js +13 -11
  84. package/lib/SideNav/SideNav.js +19 -16
  85. package/lib/Skeleton/Skeleton.js +60 -44
  86. package/lib/Skeleton/skeleton.constant.js +1 -1
  87. package/lib/Spacer/Spacer.js +6 -5
  88. package/lib/StackView/StackView.js +12 -11
  89. package/lib/StackView/StackWrap.js +2 -2
  90. package/lib/StackView/StackWrapBox.js +12 -11
  91. package/lib/StackView/StackWrapGap.js +11 -10
  92. package/lib/StackView/common.js +14 -11
  93. package/lib/StackView/getStackedContent.js +8 -7
  94. package/lib/StackView/index.js +1 -1
  95. package/lib/StepTracker/Step.js +122 -103
  96. package/lib/StepTracker/StepTracker.js +48 -38
  97. package/lib/Tabs/Tabs.js +29 -24
  98. package/lib/Tabs/TabsItem.js +79 -68
  99. package/lib/Tags/Tags.js +67 -61
  100. package/lib/TextInput/TextArea.js +26 -20
  101. package/lib/TextInput/TextInput.js +20 -15
  102. package/lib/TextInput/TextInputBase.js +74 -62
  103. package/lib/TextInput/index.js +4 -4
  104. package/lib/ThemeProvider/ThemeProvider.js +6 -5
  105. package/lib/ThemeProvider/index.js +5 -5
  106. package/lib/ThemeProvider/useSetTheme.js +6 -3
  107. package/lib/ThemeProvider/useThemeTokens.js +7 -2
  108. package/lib/ThemeProvider/utils/styles.js +48 -41
  109. package/lib/ThemeProvider/utils/theme-tokens.js +26 -12
  110. package/lib/ToggleSwitch/ToggleSwitch.js +89 -73
  111. package/lib/ToggleSwitch/ToggleSwitchGroup.js +36 -34
  112. package/lib/Tooltip/Backdrop.js +4 -3
  113. package/lib/Tooltip/Backdrop.native.js +5 -4
  114. package/lib/Tooltip/Tooltip.js +81 -65
  115. package/lib/Tooltip/getTooltipPosition.js +29 -18
  116. package/lib/TooltipButton/TooltipButton.js +28 -21
  117. package/lib/Typography/Typography.js +37 -33
  118. package/lib/ViewportProvider/ViewportProvider.js +4 -3
  119. package/lib/ViewportProvider/useViewportListener.js +6 -3
  120. package/lib/index.js +54 -54
  121. package/lib/utils/a11y/semantics.js +5 -2
  122. package/lib/utils/a11y/textSize.js +8 -6
  123. package/lib/utils/animation/useVerticalExpandAnimation.js +6 -5
  124. package/lib/utils/children.js +2 -1
  125. package/lib/utils/index.js +10 -10
  126. package/lib/utils/input.js +22 -17
  127. package/lib/utils/pressability.js +36 -22
  128. package/lib/utils/props/clickProps.js +2 -1
  129. package/lib/utils/props/getPropSelector.js +6 -3
  130. package/lib/utils/props/handlerProps.js +25 -19
  131. package/lib/utils/props/hrefAttrsProp.js +14 -11
  132. package/lib/utils/props/index.js +12 -12
  133. package/lib/utils/props/inputSupportsProps.js +15 -12
  134. package/lib/utils/props/linkProps.js +7 -6
  135. package/lib/utils/props/pressProps.js +1 -1
  136. package/lib/utils/props/tokens.js +27 -13
  137. package/lib/utils/ssr.js +6 -2
  138. package/lib/utils/useCopy.js +6 -4
  139. package/lib/utils/useHash.js +2 -1
  140. package/lib/utils/useResponsiveProp.js +1 -1
  141. package/lib/utils/useUniqueId.js +2 -1
  142. package/lib/utils/withLinkRouter.js +6 -5
  143. package/package.json +13 -11
  144. package/src/List/List.jsx +30 -19
  145. package/src/List/ListItem.jsx +12 -2
  146. package/src/Modal/Modal.jsx +2 -1
  147. package/src/Pagination/Pagination.jsx +3 -0
  148. package/src/Search/Search.jsx +11 -0
  149. package/src/Select/Item.native.jsx +0 -7
  150. package/.storybook/main.js +0 -11
  151. package/.storybook/preview.js +0 -37
  152. package/.turbo/turbo-build.log +0 -8
  153. package/.turbo/turbo-lint.log +0 -3
  154. package/CHANGELOG.json +0 -311
  155. package/__fixtures__/Accessible.js +0 -34
  156. package/__fixtures__/Accessible.native.js +0 -34
  157. package/__fixtures__/Theme.jsx +0 -13
  158. package/__fixtures__/Viewport.jsx +0 -17
  159. package/__fixtures__/test-utils.js +0 -25
  160. package/__fixtures__/testTheme.js +0 -1830
  161. package/__tests__/A11yText/A11yText.test.jsx +0 -34
  162. package/__tests__/ActivityIndicator/ActivityIndicator.test.jsx +0 -68
  163. package/__tests__/ActivityIndicator/__snapshots__/ActivityIndicator.test.jsx.snap +0 -287
  164. package/__tests__/Box/Box.test.jsx +0 -111
  165. package/__tests__/Button/Button.test.jsx +0 -86
  166. package/__tests__/Button/ButtonBase.test.jsx +0 -82
  167. package/__tests__/Button/ButtonGroup.test.jsx +0 -347
  168. package/__tests__/Button/ButtonLink.test.jsx +0 -61
  169. package/__tests__/Card/Card.test.jsx +0 -63
  170. package/__tests__/Checkbox/Checkbox.test.jsx +0 -94
  171. package/__tests__/Checkbox/CheckboxGroup.test.jsx +0 -246
  172. package/__tests__/Divider/Divider.test.jsx +0 -91
  173. package/__tests__/ExpandCollapse/ExpandCollapse.test.jsx +0 -109
  174. package/__tests__/Feedback/Feedback.test.jsx +0 -42
  175. package/__tests__/FlexGrid/Col.test.jsx +0 -261
  176. package/__tests__/FlexGrid/FlexGrid.test.jsx +0 -136
  177. package/__tests__/FlexGrid/Row.test.jsx +0 -273
  178. package/__tests__/HorizontalScroll/HorizontalScroll.test.jsx +0 -165
  179. package/__tests__/Icon/Icon.test.jsx +0 -61
  180. package/__tests__/IconButton/IconButton.test.jsx +0 -52
  181. package/__tests__/InputLabel/InputLabel.test.jsx +0 -28
  182. package/__tests__/InputLabel/__snapshots__/InputLabel.test.jsx.snap +0 -3
  183. package/__tests__/InputSupports/InputSupports.test.jsx +0 -60
  184. package/__tests__/Link/Link.test.jsx +0 -63
  185. package/__tests__/Link/TextButton.test.jsx +0 -35
  186. package/__tests__/List/List.test.jsx +0 -60
  187. package/__tests__/Modal/Modal.test.jsx +0 -47
  188. package/__tests__/Notification/Notification.test.jsx +0 -20
  189. package/__tests__/Pagination/Pagination.test.jsx +0 -160
  190. package/__tests__/Progress/Progress.test.jsx +0 -79
  191. package/__tests__/Radio/Radio.test.jsx +0 -87
  192. package/__tests__/Radio/RadioGroup.test.jsx +0 -220
  193. package/__tests__/RadioCard/RadioCard.test.jsx +0 -87
  194. package/__tests__/RadioCard/RadioCardGroup.test.jsx +0 -246
  195. package/__tests__/Search/Search.test.jsx +0 -73
  196. package/__tests__/Select/Select.test.jsx +0 -94
  197. package/__tests__/SideNav/SideNav.test.jsx +0 -110
  198. package/__tests__/Skeleton/Skeleton.test.jsx +0 -61
  199. package/__tests__/Spacer/Spacer.test.jsx +0 -63
  200. package/__tests__/StackView/StackView.test.jsx +0 -216
  201. package/__tests__/StackView/StackWrap.test.jsx +0 -47
  202. package/__tests__/StackView/getStackedContent.test.jsx +0 -295
  203. package/__tests__/StepTracker/StepTracker.test.jsx +0 -94
  204. package/__tests__/Tabs/Tabs.test.jsx +0 -40
  205. package/__tests__/Tags/Tags.test.jsx +0 -327
  206. package/__tests__/TextInput/TextArea.test.jsx +0 -35
  207. package/__tests__/TextInput/TextInputBase.test.jsx +0 -125
  208. package/__tests__/ThemeProvider/ThemeProvider.test.jsx +0 -77
  209. package/__tests__/ThemeProvider/useThemeTokens.test.jsx +0 -514
  210. package/__tests__/ThemeProvider/utils/theme-tokens.test.js +0 -41
  211. package/__tests__/ToggleSwitch/ToggleSwitch.test.jsx +0 -82
  212. package/__tests__/ToggleSwitch/ToggleSwitchGroup.test.jsx +0 -192
  213. package/__tests__/Tooltip/Tooltip.test.jsx +0 -65
  214. package/__tests__/Tooltip/getTooltipPosition.test.js +0 -79
  215. package/__tests__/Typography/typography.test.jsx +0 -90
  216. package/__tests__/utils/children.test.jsx +0 -128
  217. package/__tests__/utils/containUniqueFields.test.js +0 -25
  218. package/__tests__/utils/input.test.js +0 -375
  219. package/__tests__/utils/props.test.js +0 -36
  220. package/__tests__/utils/semantics.test.jsx +0 -34
  221. package/__tests__/utils/useCopy.test.js +0 -42
  222. package/__tests__/utils/useResponsiveProp.test.jsx +0 -202
  223. package/__tests__/utils/useSpacingScale.test.jsx +0 -273
  224. package/__tests__/utils/useUniqueId.test.js +0 -31
  225. package/babel.config.js +0 -35
  226. package/generate-component-docs.js +0 -72
  227. package/jest.config.js +0 -32
  228. package/lib-module/A11yInfoProvider/index.js +0 -62
  229. package/lib-module/A11yText/index.js +0 -55
  230. package/lib-module/ActivityIndicator/Spinner.js +0 -76
  231. package/lib-module/ActivityIndicator/Spinner.native.js +0 -143
  232. package/lib-module/ActivityIndicator/index.js +0 -40
  233. package/lib-module/ActivityIndicator/shared.js +0 -12
  234. package/lib-module/BaseProvider/index.js +0 -26
  235. package/lib-module/Box/Box.js +0 -243
  236. package/lib-module/Box/index.js +0 -2
  237. package/lib-module/Button/Button.js +0 -25
  238. package/lib-module/Button/ButtonBase.js +0 -254
  239. package/lib-module/Button/ButtonGroup.js +0 -245
  240. package/lib-module/Button/ButtonLink.js +0 -39
  241. package/lib-module/Button/index.js +0 -4
  242. package/lib-module/Button/propTypes.js +0 -36
  243. package/lib-module/Card/Card.js +0 -83
  244. package/lib-module/Card/CardBase.js +0 -62
  245. package/lib-module/Card/PressableCardBase.js +0 -113
  246. package/lib-module/Card/index.js +0 -4
  247. package/lib-module/Checkbox/Checkbox.js +0 -332
  248. package/lib-module/Checkbox/CheckboxGroup.js +0 -231
  249. package/lib-module/Checkbox/CheckboxInput.js +0 -58
  250. package/lib-module/Checkbox/CheckboxInput.native.js +0 -6
  251. package/lib-module/Checkbox/index.js +0 -3
  252. package/lib-module/Divider/Divider.js +0 -123
  253. package/lib-module/Divider/index.js +0 -2
  254. package/lib-module/ExpandCollapse/Accordion.js +0 -15
  255. package/lib-module/ExpandCollapse/Control.js +0 -130
  256. package/lib-module/ExpandCollapse/ExpandCollapse.js +0 -94
  257. package/lib-module/ExpandCollapse/Panel.js +0 -159
  258. package/lib-module/ExpandCollapse/index.js +0 -7
  259. package/lib-module/Feedback/Feedback.js +0 -144
  260. package/lib-module/Feedback/index.js +0 -2
  261. package/lib-module/Fieldset/Fieldset.js +0 -152
  262. package/lib-module/Fieldset/FieldsetContainer.js +0 -29
  263. package/lib-module/Fieldset/FieldsetContainer.native.js +0 -20
  264. package/lib-module/Fieldset/Legend.js +0 -21
  265. package/lib-module/Fieldset/Legend.native.js +0 -28
  266. package/lib-module/Fieldset/cssReset.js +0 -14
  267. package/lib-module/Fieldset/index.js +0 -2
  268. package/lib-module/FlexGrid/Col/Col.js +0 -275
  269. package/lib-module/FlexGrid/Col/index.js +0 -2
  270. package/lib-module/FlexGrid/FlexGrid.js +0 -147
  271. package/lib-module/FlexGrid/Row/Row.js +0 -183
  272. package/lib-module/FlexGrid/Row/index.js +0 -2
  273. package/lib-module/FlexGrid/helpers/index.js +0 -18
  274. package/lib-module/FlexGrid/index.js +0 -2
  275. package/lib-module/FlexGrid/providers/GutterContext.js +0 -3
  276. package/lib-module/HorizontalScroll/HorizontalScroll.js +0 -170
  277. package/lib-module/HorizontalScroll/HorizontalScrollButton.js +0 -77
  278. package/lib-module/HorizontalScroll/ScrollViewEnd.js +0 -47
  279. package/lib-module/HorizontalScroll/ScrollViewEnd.native.js +0 -24
  280. package/lib-module/HorizontalScroll/dictionary.js +0 -11
  281. package/lib-module/HorizontalScroll/index.js +0 -11
  282. package/lib-module/HorizontalScroll/itemPositions.js +0 -106
  283. package/lib-module/Icon/Icon.js +0 -61
  284. package/lib-module/Icon/IconText.js +0 -81
  285. package/lib-module/Icon/index.js +0 -4
  286. package/lib-module/IconButton/IconButton.js +0 -115
  287. package/lib-module/IconButton/index.js +0 -2
  288. package/lib-module/InputLabel/InputLabel.js +0 -141
  289. package/lib-module/InputLabel/LabelContent.js +0 -24
  290. package/lib-module/InputLabel/LabelContent.native.js +0 -16
  291. package/lib-module/InputLabel/index.js +0 -2
  292. package/lib-module/InputSupports/InputSupports.js +0 -95
  293. package/lib-module/InputSupports/index.js +0 -2
  294. package/lib-module/InputSupports/useInputSupports.js +0 -31
  295. package/lib-module/Link/ChevronLink.js +0 -51
  296. package/lib-module/Link/InlinePressable.js +0 -37
  297. package/lib-module/Link/InlinePressable.native.js +0 -85
  298. package/lib-module/Link/Link.js +0 -27
  299. package/lib-module/Link/LinkBase.js +0 -223
  300. package/lib-module/Link/TextButton.js +0 -34
  301. package/lib-module/Link/index.js +0 -5
  302. package/lib-module/List/List.js +0 -55
  303. package/lib-module/List/ListItem.js +0 -223
  304. package/lib-module/List/index.js +0 -5
  305. package/lib-module/Modal/Modal.js +0 -208
  306. package/lib-module/Modal/dictionary.js +0 -9
  307. package/lib-module/Modal/index.js +0 -2
  308. package/lib-module/Notification/Notification.js +0 -196
  309. package/lib-module/Notification/dictionary.js +0 -8
  310. package/lib-module/Notification/index.js +0 -2
  311. package/lib-module/Pagination/PageButton.js +0 -65
  312. package/lib-module/Pagination/Pagination.js +0 -140
  313. package/lib-module/Pagination/SideButton.js +0 -103
  314. package/lib-module/Pagination/dictionary.js +0 -18
  315. package/lib-module/Pagination/index.js +0 -2
  316. package/lib-module/Pagination/usePagination.js +0 -72
  317. package/lib-module/Progress/Progress.js +0 -85
  318. package/lib-module/Progress/ProgressBar.js +0 -134
  319. package/lib-module/Progress/ProgressBarBackground.js +0 -41
  320. package/lib-module/Progress/index.js +0 -4
  321. package/lib-module/Radio/Radio.js +0 -274
  322. package/lib-module/Radio/RadioButton.js +0 -128
  323. package/lib-module/Radio/RadioGroup.js +0 -241
  324. package/lib-module/Radio/RadioInput.js +0 -60
  325. package/lib-module/Radio/RadioInput.native.js +0 -6
  326. package/lib-module/Radio/index.js +0 -3
  327. package/lib-module/RadioCard/RadioCard.js +0 -218
  328. package/lib-module/RadioCard/RadioCardGroup.js +0 -248
  329. package/lib-module/RadioCard/index.js +0 -3
  330. package/lib-module/Search/Search.js +0 -241
  331. package/lib-module/Search/dictionary.js +0 -12
  332. package/lib-module/Search/index.js +0 -2
  333. package/lib-module/Select/Group.js +0 -20
  334. package/lib-module/Select/Group.native.js +0 -14
  335. package/lib-module/Select/Item.js +0 -17
  336. package/lib-module/Select/Item.native.js +0 -9
  337. package/lib-module/Select/Picker.js +0 -67
  338. package/lib-module/Select/Picker.native.js +0 -110
  339. package/lib-module/Select/Select.js +0 -316
  340. package/lib-module/Select/index.js +0 -6
  341. package/lib-module/SideNav/Item.js +0 -139
  342. package/lib-module/SideNav/ItemContent.js +0 -45
  343. package/lib-module/SideNav/ItemsGroup.js +0 -115
  344. package/lib-module/SideNav/SideNav.js +0 -133
  345. package/lib-module/SideNav/index.js +0 -1
  346. package/lib-module/Skeleton/Skeleton.js +0 -163
  347. package/lib-module/Skeleton/index.js +0 -2
  348. package/lib-module/Skeleton/skeleton.constant.js +0 -3
  349. package/lib-module/Skeleton/skeletonWebAnimation.js +0 -18
  350. package/lib-module/Skeleton/useSkeletonNativeAnimation.js +0 -24
  351. package/lib-module/Spacer/Spacer.js +0 -97
  352. package/lib-module/Spacer/index.js +0 -2
  353. package/lib-module/StackView/StackView.js +0 -124
  354. package/lib-module/StackView/StackWrap.js +0 -48
  355. package/lib-module/StackView/StackWrap.native.js +0 -3
  356. package/lib-module/StackView/StackWrapBox.js +0 -114
  357. package/lib-module/StackView/StackWrapGap.js +0 -58
  358. package/lib-module/StackView/common.js +0 -32
  359. package/lib-module/StackView/getStackedContent.js +0 -123
  360. package/lib-module/StackView/index.js +0 -5
  361. package/lib-module/StepTracker/Step.js +0 -229
  362. package/lib-module/StepTracker/StepTracker.js +0 -175
  363. package/lib-module/StepTracker/dictionary.js +0 -10
  364. package/lib-module/StepTracker/index.js +0 -2
  365. package/lib-module/Tabs/Tabs.js +0 -113
  366. package/lib-module/Tabs/TabsItem.js +0 -215
  367. package/lib-module/Tabs/index.js +0 -2
  368. package/lib-module/Tags/Tags.js +0 -245
  369. package/lib-module/Tags/index.js +0 -2
  370. package/lib-module/TextInput/TextArea.js +0 -88
  371. package/lib-module/TextInput/TextInput.js +0 -68
  372. package/lib-module/TextInput/TextInputBase.js +0 -233
  373. package/lib-module/TextInput/index.js +0 -3
  374. package/lib-module/TextInput/propTypes.js +0 -37
  375. package/lib-module/ThemeProvider/ThemeProvider.js +0 -35
  376. package/lib-module/ThemeProvider/index.js +0 -6
  377. package/lib-module/ThemeProvider/useSetTheme.js +0 -22
  378. package/lib-module/ThemeProvider/useTheme.js +0 -14
  379. package/lib-module/ThemeProvider/useThemeTokens.js +0 -105
  380. package/lib-module/ThemeProvider/utils/index.js +0 -2
  381. package/lib-module/ThemeProvider/utils/styles.js +0 -174
  382. package/lib-module/ThemeProvider/utils/theme-tokens.js +0 -151
  383. package/lib-module/ToggleSwitch/ToggleSwitch.js +0 -234
  384. package/lib-module/ToggleSwitch/ToggleSwitchGroup.js +0 -218
  385. package/lib-module/ToggleSwitch/index.js +0 -3
  386. package/lib-module/Tooltip/Backdrop.js +0 -52
  387. package/lib-module/Tooltip/Backdrop.native.js +0 -43
  388. package/lib-module/Tooltip/Tooltip.js +0 -332
  389. package/lib-module/Tooltip/dictionary.js +0 -8
  390. package/lib-module/Tooltip/getTooltipPosition.js +0 -164
  391. package/lib-module/Tooltip/index.js +0 -2
  392. package/lib-module/TooltipButton/TooltipButton.js +0 -71
  393. package/lib-module/TooltipButton/index.js +0 -2
  394. package/lib-module/Typography/Typography.js +0 -120
  395. package/lib-module/Typography/index.js +0 -2
  396. package/lib-module/ViewportProvider/ViewportProvider.js +0 -28
  397. package/lib-module/ViewportProvider/index.js +0 -3
  398. package/lib-module/ViewportProvider/useViewport.js +0 -3
  399. package/lib-module/ViewportProvider/useViewportListener.js +0 -43
  400. package/lib-module/index.js +0 -48
  401. package/lib-module/utils/a11y/index.js +0 -2
  402. package/lib-module/utils/a11y/semantics.js +0 -154
  403. package/lib-module/utils/a11y/textSize.js +0 -34
  404. package/lib-module/utils/animation/index.js +0 -2
  405. package/lib-module/utils/animation/useVerticalExpandAnimation.js +0 -61
  406. package/lib-module/utils/children.js +0 -118
  407. package/lib-module/utils/containUniqueFields.js +0 -26
  408. package/lib-module/utils/index.js +0 -16
  409. package/lib-module/utils/info/index.js +0 -7
  410. package/lib-module/utils/info/platform/index.js +0 -11
  411. package/lib-module/utils/info/platform/platform.android.js +0 -1
  412. package/lib-module/utils/info/platform/platform.ios.js +0 -1
  413. package/lib-module/utils/info/platform/platform.js +0 -1
  414. package/lib-module/utils/info/platform/platform.native.js +0 -4
  415. package/lib-module/utils/info/versions.js +0 -5
  416. package/lib-module/utils/input.js +0 -180
  417. package/lib-module/utils/pressability.js +0 -97
  418. package/lib-module/utils/props/a11yProps.js +0 -140
  419. package/lib-module/utils/props/clickProps.js +0 -25
  420. package/lib-module/utils/props/componentPropType.js +0 -63
  421. package/lib-module/utils/props/copyPropTypes.js +0 -2
  422. package/lib-module/utils/props/getPropSelector.js +0 -6
  423. package/lib-module/utils/props/handlerProps.js +0 -59
  424. package/lib-module/utils/props/hrefAttrsProp.js +0 -30
  425. package/lib-module/utils/props/index.js +0 -19
  426. package/lib-module/utils/props/inputSupportsProps.js +0 -59
  427. package/lib-module/utils/props/linkProps.js +0 -43
  428. package/lib-module/utils/props/paddingProp.js +0 -9
  429. package/lib-module/utils/props/pressProps.js +0 -42
  430. package/lib-module/utils/props/rectProp.js +0 -9
  431. package/lib-module/utils/props/responsiveProps.js +0 -30
  432. package/lib-module/utils/props/selectSystemProps.js +0 -24
  433. package/lib-module/utils/props/spacingProps.js +0 -56
  434. package/lib-module/utils/props/textInputProps.js +0 -194
  435. package/lib-module/utils/props/textProps.js +0 -59
  436. package/lib-module/utils/props/tokens.js +0 -120
  437. package/lib-module/utils/props/variantProp.js +0 -18
  438. package/lib-module/utils/props/viewProps.js +0 -22
  439. package/lib-module/utils/ssr.js +0 -35
  440. package/lib-module/utils/useCopy.js +0 -42
  441. package/lib-module/utils/useHash.js +0 -44
  442. package/lib-module/utils/useHash.native.js +0 -7
  443. package/lib-module/utils/useResponsiveProp.js +0 -47
  444. package/lib-module/utils/useSpacingScale.js +0 -123
  445. package/lib-module/utils/useUniqueId.js +0 -12
  446. package/lib-module/utils/withLinkRouter.js +0 -82
  447. package/stories/A11yText/A11yText.stories.jsx +0 -71
  448. package/stories/ActivityIndicator/ActivityIndicator.stories.jsx +0 -22
  449. package/stories/Box/Box.stories.jsx +0 -143
  450. package/stories/Button/Button.stories.jsx +0 -72
  451. package/stories/Button/ButtonGroup.stories.jsx +0 -81
  452. package/stories/Button/ButtonLink.stories.jsx +0 -30
  453. package/stories/Card/Card.stories.jsx +0 -62
  454. package/stories/Checkbox/Checkbox.stories.jsx +0 -94
  455. package/stories/Divider/Divider.stories.jsx +0 -68
  456. package/stories/ExpandCollapse/ExpandCollapse.stories.jsx +0 -112
  457. package/stories/Feedback/Feedback.stories.jsx +0 -96
  458. package/stories/FlexGrid/01 FlexGrid.stories.jsx +0 -54
  459. package/stories/FlexGrid/02 Row.stories.jsx +0 -41
  460. package/stories/FlexGrid/03 Col.stories.jsx +0 -141
  461. package/stories/Icon/Icon.stories.jsx +0 -79
  462. package/stories/IconButton/IconButton.stories.jsx +0 -50
  463. package/stories/InputLabel/InputLabel.stories.jsx +0 -39
  464. package/stories/Link/ChevronLink.stories.jsx +0 -48
  465. package/stories/Link/Link.stories.jsx +0 -90
  466. package/stories/Link/TextButton.stories.jsx +0 -79
  467. package/stories/List/List.stories.jsx +0 -117
  468. package/stories/Modal/Modal.stories.jsx +0 -54
  469. package/stories/Notification/Notification.stories.jsx +0 -82
  470. package/stories/Pagination/Pagination.stories.jsx +0 -64
  471. package/stories/Progress/Progress.stories.jsx +0 -93
  472. package/stories/Radio/Radio.stories.jsx +0 -100
  473. package/stories/RadioCard/RadioCard.stories.jsx +0 -98
  474. package/stories/Search/Search.stories.jsx +0 -66
  475. package/stories/Select/Select.stories.jsx +0 -55
  476. package/stories/SideNav/SideNav.stories.jsx +0 -42
  477. package/stories/SideNav/SideNavItem.stories.jsx +0 -9
  478. package/stories/SideNav/SideNavItemsGroup.stories.jsx +0 -17
  479. package/stories/Skeleton/Skeleton.stories.jsx +0 -36
  480. package/stories/Spacer/Spacer.stories.jsx +0 -38
  481. package/stories/StackView/StackView.stories.jsx +0 -75
  482. package/stories/StackView/StackWrap.stories.jsx +0 -64
  483. package/stories/StepTracker/StepTracker.stories.jsx +0 -71
  484. package/stories/Tabs/Tabs.stories.jsx +0 -98
  485. package/stories/Tags/Tags.stories.jsx +0 -69
  486. package/stories/TextInput/TextArea.stories.jsx +0 -101
  487. package/stories/TextInput/TextInput.stories.jsx +0 -141
  488. package/stories/ToggleSwitch/ToggleSwitch.stories.jsx +0 -64
  489. package/stories/ToggleSwitch/ToggleSwitchGroup.stories.jsx +0 -81
  490. package/stories/Tooltip/Tooltip.stories.jsx +0 -81
  491. package/stories/TooltipButton/TooltipButton.stories.jsx +0 -11
  492. package/stories/Typography/Typography.stories.jsx +0 -49
  493. package/stories/platform-supports.jsx +0 -32
  494. package/stories/platform-supports.native.jsx +0 -3
  495. package/stories/supports.jsx +0 -236
@@ -1,2 +0,0 @@
1
- import Typography from './Typography';
2
- export default Typography;
@@ -1,28 +0,0 @@
1
- import React, { useState } from 'react';
2
- import PropTypes from 'prop-types';
3
- import { viewports } from '@telus-uds/system-constants';
4
- import { ViewportContext } from './useViewport';
5
- import useViewportListener from './useViewportListener';
6
- /**
7
- * Provides an up-to-date viewport value from system-constants, available via the `useViewport` hook
8
- */
9
-
10
- import { jsx as _jsx } from "react/jsx-runtime";
11
-
12
- const ViewportProvider = ({
13
- children
14
- }) => {
15
- // Default to the smallest viewport for mobile-first SSR. On client side, this is updated
16
- // by useViewportListener in a layout effect before anything is shown to the user.
17
- const [viewport, setViewport] = useState(viewports.keys[0]);
18
- useViewportListener(setViewport);
19
- return /*#__PURE__*/_jsx(ViewportContext.Provider, {
20
- value: viewport,
21
- children: children
22
- });
23
- };
24
-
25
- ViewportProvider.propTypes = {
26
- children: PropTypes.node.isRequired
27
- };
28
- export default ViewportProvider;
@@ -1,3 +0,0 @@
1
- import ViewportProvider from './ViewportProvider';
2
- export default ViewportProvider;
3
- export * from './useViewport';
@@ -1,3 +0,0 @@
1
- import { createContext, useContext } from 'react';
2
- export const ViewportContext = /*#__PURE__*/createContext({});
3
- export const useViewport = () => useContext(ViewportContext);
@@ -1,43 +0,0 @@
1
- import { useLayoutEffect } from 'react';
2
- import Dimensions from "react-native-web/dist/exports/Dimensions";
3
- import { viewports } from '@telus-uds/system-constants'; // Use Dimensions instead of useWindowDimensions because useWindowDimensions forces context
4
- // to update on every pixel change during window resize; but we only want rerenders to occur
5
- // when a viewport threshold has been crossed.
6
-
7
- const lookupViewport = () => viewports.select(Dimensions.get('window').width);
8
- /**
9
- * In SSR, React gets spooked if it sees `useLayoutEffect` and fires warnings assuming the
10
- * developer doesn't realise the effect won't run: https://reactjs.org/link/uselayouteffect-ssr
11
- *
12
- * To avoid these warnings while still conforming to the rules of hooks, always use this
13
- * explicitly no-op hook, instead of the useLayoutEffect that is implicitly no-op on SSR.
14
- */
15
-
16
-
17
- const useViewportListenerSSR = () => {};
18
- /**
19
- * When client-side rendering, immediately set the viewport to the correct value as a layout effect so
20
- * if the viewport isn't the smallest, any SSR-rendered components rerender correctly before anything
21
- * is shown to the user. Then bind events to update the viewport if it changes.
22
- */
23
-
24
-
25
- const useViewportListenerCSR = setViewport => {
26
- useLayoutEffect(() => {
27
- setViewport(lookupViewport());
28
-
29
- const onChange = ({
30
- window
31
- }) => setViewport(viewports.select(window.width));
32
-
33
- const listener = Dimensions.addEventListener('change', onChange); // From RN 0.65.0, Dimensions.removeEventListener is deprecated for `remove` on addEventListener return value;
34
- // however, that is not available in RN <=0.64.X, therefore not in any Expo release as of 2021 (Expo SDK 43).
35
-
36
- return (listener === null || listener === void 0 ? void 0 : listener.remove) || (() => Dimensions.removeEventListener('change', onChange)); // setViewport is a function from `useState` so it is stable and won't make the effect re-run
37
- }, [setViewport]);
38
- }; // Window is a defined global object in both Web and Native client-side, and undefined in SSR
39
-
40
-
41
- const isSSR = typeof window === 'undefined';
42
- const useViewportListener = isSSR ? useViewportListenerSSR : useViewportListenerCSR;
43
- export default useViewportListener;
@@ -1,48 +0,0 @@
1
- export { default as A11yText } from './A11yText';
2
- export { default as ActivityIndicator } from './ActivityIndicator';
3
- export { default as Box } from './Box';
4
- export * from './Button';
5
- export { default as Card, PressableCardBase } from './Card';
6
- export { default as Checkbox } from './Checkbox';
7
- export * from './Checkbox';
8
- export { default as Divider } from './Divider';
9
- export { default as ExpandCollapse, Accordion } from './ExpandCollapse';
10
- export { default as Feedback } from './Feedback';
11
- export { default as Fieldset } from './Fieldset';
12
- export { default as FlexGrid } from './FlexGrid';
13
- export { default as HorizontalScroll } from './HorizontalScroll';
14
- export * from './HorizontalScroll';
15
- export { default as Icon } from './Icon';
16
- export * from './Icon';
17
- export { default as IconButton } from './IconButton';
18
- export { default as InputLabel } from './InputLabel';
19
- export * from './Link';
20
- export { default as List, ListItem, ListBase } from './List';
21
- export { default as Modal } from './Modal';
22
- export { default as Notification } from './Notification';
23
- export { default as Pagination } from './Pagination';
24
- export { default as Progress } from './Progress';
25
- export { default as Radio } from './Radio';
26
- export * from './Radio';
27
- export { default as RadioCard } from './RadioCard';
28
- export * from './RadioCard';
29
- export { default as Search } from './Search';
30
- export { default as Select } from './Select';
31
- export { default as SideNav } from './SideNav';
32
- export { default as Skeleton } from './Skeleton';
33
- export { default as Spacer } from './Spacer';
34
- export { default as StackView } from './StackView';
35
- export * from './StackView';
36
- export { default as StepTracker } from './StepTracker';
37
- export { default as Tabs } from './Tabs';
38
- export { default as Tags } from './Tags';
39
- export * from './TextInput';
40
- export * from './ToggleSwitch';
41
- export { default as Tooltip } from './Tooltip';
42
- export { default as TooltipButton } from './TooltipButton';
43
- export { default as Typography } from './Typography';
44
- export { default as A11yInfoProvider, useA11yInfo } from './A11yInfoProvider';
45
- export { default as BaseProvider } from './BaseProvider';
46
- export { default as ViewportProvider, useViewport, ViewportContext } from './ViewportProvider';
47
- export { default as ThemeProvider, useTheme, useSetTheme, useThemeTokens, getThemeTokens, applyOuterBorder, applyTextStyles, applyShadowToken } from './ThemeProvider';
48
- export * from './utils';
@@ -1,2 +0,0 @@
1
- export * from './textSize';
2
- export * from './semantics';
@@ -1,154 +0,0 @@
1
- import Platform from "react-native-web/dist/exports/Platform";
2
- /**
3
- * @typedef {import('react-native').AccessibilityRole} AccessibilityRole
4
- */
5
-
6
- /**
7
- * This is based on the role-to-tag mapping that React Native Web uses to set HTML tags.
8
- * It's not exported in any way from RNW, so we need to keep this up-to-date manually.
9
- * https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js
10
- *
11
- * Note: every role in this list is a web-only aria-role. There is no overlap between _these_ web tags
12
- * or roles and native accessibilityRoles. Only h1, h2, h3 etc map to an RN equivalent ("heading").
13
- *
14
- * - RN "summary" native role maps to "region" aria-role, but setting `<section>`/"region" does not
15
- * set React Native's "summary" role, which has a much narrower use case.
16
- * - `<Header>`/"Banner" also do not map to RN's "heading". Only h1 / h2 etc map to RN "heading".
17
- *
18
- * Therefore, all of these tags / roles default to no accessibilityRole in native apps. This is not wrong:
19
- * in general, RN accessibilityRoles tend to be more about interaction and less about semantics than web roles.
20
- *
21
- * RNW's one-way mapping of React Native accessibilityRoles to web aria-roles:
22
- * https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/AccessibilityUtil/propsToAriaRole.js
23
- */
24
- // Adding `/** @type {const} */ ({...})` denotes object content as `readonly` in many IDEs
25
- // eslint-disable-next-line prettier/prettier
26
-
27
- const rolesToTags =
28
- /** @type {const} */
29
- {
30
- article: 'article',
31
- banner: 'header',
32
- blockquote: 'blockquote',
33
- code: 'code',
34
- complementary: 'aside',
35
- contentinfo: 'footer',
36
- deletion: 'del',
37
- emphasis: 'em',
38
- figure: 'figure',
39
- insertion: 'ins',
40
- form: 'form',
41
- list: 'ul',
42
- listitem: 'li',
43
- main: 'main',
44
- navigation: 'nav',
45
- region: 'section',
46
- strong: 'strong',
47
- // Add special cases that are in RNW's function logic but not in its mapping object
48
- label: 'label' // eslint-disable-next-line prettier/prettier
49
-
50
- }; // Invert React Native Web's mapping, so a tag gets the role that gets that tag
51
-
52
- export const tagsToRoles = Object.fromEntries(Object.entries(rolesToTags).map(([key, value]) => [value, key]));
53
- /**
54
- * Heading HTML tags map to the "heading" accessibilityRole in native apps, which is similar
55
- * to headings on web but without the expectation of a hierarchy of headings within one screen.
56
- */
57
- // eslint-disable-next-line prettier/prettier
58
-
59
- export const headingTags =
60
- /** @type {const} */
61
- ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
62
- /**
63
- * @typedef {typeof headingTags[number]} HeadingTag
64
- */
65
-
66
- /**
67
- * All HTML tags that may be set via RNW accesibility props alone and therefore may be set using
68
- * the getA11yPropsFromHtmlTag function without changing other behaviour.
69
- *
70
- * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
71
- */
72
-
73
- export const supportedTags = [...Object.keys(tagsToRoles), ...headingTags];
74
- /**
75
- * Uses readonly mapping keys/values to generate static types for IDEs that support TS in JSDoc.
76
- * @typedef {keyof rolesToTags} RoleWithTag
77
- * @typedef {typeof rolesToTags[RoleWithTag] | typeof headingTags[number]} SupportedTag
78
- */
79
-
80
- /**
81
- * Subset of supported HTML tags that may be used with layout containers like Box.
82
- *
83
- * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
84
- */
85
- // eslint-disable-next-line prettier/prettier
86
-
87
- export const layoutTags =
88
- /** @type {const} */
89
- [...headingTags, 'article', 'aside', 'blockquote', 'footer', 'figure', 'form', 'header', 'ul', 'li', 'main', 'nav', 'section', 'label' // eslint-disable-next-line prettier/prettier
90
- ];
91
- /**
92
- * @typedef {typeof layoutTags[number]} LayoutTag
93
- */
94
-
95
- /**
96
- * Subset of supported HTML tags that may be used with text elements like Typography.
97
- *
98
- * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
99
- */
100
- // eslint-disable-next-line prettier/prettier
101
-
102
- export const textTags =
103
- /** @type {const} */
104
- [...headingTags, 'blockquote', 'code', 'del', 'em', 'ins', 'li', 'strong', 'label' // eslint-disable-next-line prettier/prettier
105
- ];
106
- /**
107
- * @typedef {typeof layoutTags[number]} TextTag
108
- */
109
-
110
- /**
111
- * If passed a heading tag string like 'h1', 'h2' etc, returns the heading number as a number
112
- * ready for use in `accessibilityLevel` props and similar.
113
- *
114
- * @param {string} [tag] - HTML tag string; returns undefined if not a {@link HeadingTag}
115
- * @returns {'1' | '2' | '3' | '4' | '5' | '6' | undefined}
116
- */
117
-
118
- export const getHeadingLevel = tag => headingTags.includes(tag) ? Number(tag[1]) : undefined;
119
- /**
120
- * Takes a supported HTML tag, and returns the accessibility props that, on web, make React Native Web
121
- * render that tag.
122
- *
123
- * For cross-platform apps, a second argument may be passed with an [accessibilityRole](https://reactnative.dev/docs/accessibility#accessibilityrole)
124
- * to use in native apps. Heading tags (h1, h2, ...h5, h6) map to "heading" role by default;
125
- * no other supported semantic HTML tags have an equivalent native accessibilityRole.
126
- *
127
- * @param {SupportedTag} tag - HTML tag to use on web
128
- * @param {AccessibilityRole | null} [nativeRole] - optional accessibilityRole for native apps
129
- * @returns {{ accessibilityRole: string, accessibilityLevel?: string } | undefined}
130
- */
131
-
132
- export const getA11yPropsFromHtmlTag = (tag, nativeRole) => {
133
- // Allow cross-platform apps to set accessibilityRoles alongside a web tag without conflict
134
- if (nativeRole !== undefined && Platform.OS !== 'web') return {
135
- accessibilityRole: nativeRole
136
- };
137
-
138
- if (tag) {
139
- // aria roles don't have native counterparts and RN may throw an error if an unrecognised role is passed
140
- const ariaRole = Platform.OS === 'web' && tagsToRoles[tag];
141
- if (ariaRole) return {
142
- accessibilityRole: ariaRole
143
- };
144
- const accessibilityLevel = getHeadingLevel(tag);
145
- if (accessibilityLevel) return {
146
- accessibilityRole: 'header',
147
- accessibilityLevel
148
- };
149
- } // If nothing matches or no tag supplied, return undefined and let component decide how to fall back.
150
- // Note that return value may always be spread in objects (it is safe to spread undefined like { ...undefined })
151
-
152
-
153
- return undefined;
154
- };
@@ -1,34 +0,0 @@
1
- import PixelRatio from "react-native-web/dist/exports/PixelRatio";
2
- import Platform from "react-native-web/dist/exports/Platform";
3
- /**
4
- * When a user increases text size using device accessibility settings, some elements
5
- * should also scale, such as icons alongside text and space between paragraphs.
6
- *
7
- * @param {number} [value] - the value to multiply; defaults to system default font size
8
- * @param {number} [maxScale] - the maximum multiplier to apply; defaults to no maximum
9
- */
10
-
11
- export const scaleWithText = (value, maxScale = Infinity) => {
12
- if (!value) return value;
13
- const scale = Math.min(PixelRatio.getFontScale(), maxScale) || 1;
14
- return value * scale;
15
- };
16
- /**
17
- * Native only, returns `undefined` on Web.
18
- *
19
- * Enforces `fontScaleCap` theme tokens as the maximum font size text can become
20
- * after iOS or Android font scaling, to give consistent accessible maximum sizes
21
- * that don't make the content unusable.
22
- *
23
- * The return value of this function can be used as a React Native `Text` element's
24
- * `maxFontSizeMultiplier` prop value.
25
- */
26
-
27
- export const getMaxFontMultiplier = ({
28
- fontSize,
29
- fontScaleCap
30
- }) => {
31
- if (Platform.OS === 'web' || !fontScaleCap || !fontSize) return undefined;
32
- if (fontScaleCap <= fontSize) return 1;
33
- return fontScaleCap / fontSize;
34
- };
@@ -1,2 +0,0 @@
1
- /* eslint-disable import/prefer-default-export */
2
- export { default as useVerticalExpandAnimation } from './useVerticalExpandAnimation';
@@ -1,61 +0,0 @@
1
- import { useEffect, useRef, useState } from 'react';
2
- import Animated from "react-native-web/dist/exports/Animated";
3
- import Easing from "react-native-web/dist/exports/Easing";
4
- import Platform from "react-native-web/dist/exports/Platform"; // TODO: systematise animations
5
- // https://github.com/telus/universal-design-system/issues/487
6
-
7
- function useVerticalExpandAnimation({
8
- containerHeight,
9
- isExpanded,
10
- tokens
11
- }) {
12
- const [isAnimating, setIsAnimating] = useState(false);
13
- const expandAnimatedValue = useRef(new Animated.Value(0)).current;
14
- const elementRef = useRef(null);
15
- const {
16
- expandDuration,
17
- collapseDuration
18
- } = tokens; // Treat as animating from when expanded state changes, until animation completes
19
-
20
- useEffect(() => setIsAnimating(true), [isExpanded]);
21
- useEffect(() => {
22
- const onComplete = () => !isExpanded && setIsAnimating(false);
23
-
24
- if (Platform.OS === 'web') {
25
- if (!elementRef.current) return () => {}; // React Native Web does not pass `onTransitionEnd` through, must attach manually.
26
- // https://github.com/necolas/react-native-web/pull/1713
27
-
28
- const element = elementRef.current;
29
- element.addEventListener('transitionend', onComplete);
30
- return () => element.removeEventListener('transitionend', onComplete);
31
- }
32
-
33
- const animationConfig = {
34
- duration: isExpanded ? expandDuration : collapseDuration,
35
- easing: Easing.inOut(Easing.ease),
36
- toValue: isExpanded ? containerHeight : 0,
37
- useNativeDriver: false
38
- };
39
- const animation = Animated.timing(expandAnimatedValue, animationConfig);
40
- animation.start(onComplete);
41
- return () => animation.stop();
42
- }, [isExpanded, expandAnimatedValue, containerHeight, expandDuration, collapseDuration]); // Without `visibility: 'hidden', descendents are focusable on web even when collapsed
43
-
44
- const containerStyles = !isExpanded && !isAnimating ? {
45
- visibility: 'hidden'
46
- } : {}; // don't visually collapse the container until we have it measured
47
-
48
- if (containerHeight !== null) {
49
- if (Platform.OS === 'web') {
50
- const transitionDuration = isExpanded ? expandDuration : collapseDuration;
51
- containerStyles.transition = `height ${transitionDuration}ms ease-in-out`;
52
- containerStyles.height = isExpanded ? containerHeight : 0;
53
- } else {
54
- containerStyles.height = expandAnimatedValue;
55
- }
56
- }
57
-
58
- return [containerStyles, elementRef];
59
- }
60
-
61
- export default useVerticalExpandAnimation;
@@ -1,118 +0,0 @@
1
- import React, { Children, Fragment } from 'react';
2
- import Text from "react-native-web/dist/exports/Text";
3
- import A11yText from '../A11yText';
4
- /**
5
- * Unpacks top-level fragments, so that common compositional patterns such as the following examples
6
- * can be iterated as flat siblings (as if they were `<Child1 /><Child2 /><Child3 />`):
7
- *
8
- * - Setting `children` as a property wrapped in a fragment:
9
- *
10
- * ```jsx
11
- * args.children = <><Child1 /><Child2 /><Child3 /></>
12
- * ```
13
- *
14
- * - Defining `children` as a variable wrapped in a fragment:
15
- *
16
- * ```jsx
17
- * const content = <><Child1 /><Child2 /><Child3 /></>
18
- * if (someCondition) return <SomeWrapper>{content}</SomeWrapper>
19
- * ```
20
- *
21
- * - Using fragments at the top level of a JSX block for conditional rendering:
22
- *
23
- * ```jsx
24
- * <Child1 />
25
- * {someCondition && (
26
- * <>
27
- * <Child2 />
28
- * <Child3 />
29
- * </>
30
- * )}
31
- * ```
32
- *
33
- * @param {ReactChildren} child
34
- * @returns {ReactChildren}
35
- */
36
-
37
- import { jsx as _jsx } from "react/jsx-runtime";
38
- export const unpackFragment = child => {
39
- var _child$props;
40
-
41
- // If this level is a set of top-level siblings rather than one child, check each in turn
42
- if (Children.count(child) > 1) return Children.map(child, unpackFragment); // When a fragment is found, unpack its children to the top level and check them
43
-
44
- if ((child === null || child === void 0 ? void 0 : child.type) === Fragment) return unpackFragment((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.children); // Stop unpacking as soon as any non-fragment child is found
45
-
46
- return child;
47
- };
48
-
49
- const isStringOrNumber = child => typeof child === 'string' || typeof child === 'number'; // Wrap an A11yText with neighouring text strings so it doesn't split them into multiple <Text>s
50
-
51
-
52
- const isWrapable = child => {
53
- var _child$type;
54
-
55
- return isStringOrNumber(child) || child.type === A11yText || ((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.name) === 'FootnoteLink';
56
- };
57
-
58
- const combineKeys = childrenArray => childrenArray.reduce((newKey, child) => `${newKey}${child.key || ''}`, ''); // Group wrappable children for one `<Text>` parent, merging adjacent text nodes
59
-
60
-
61
- const wrapChild = (child, wrappedText) => {
62
- const lastIndex = wrappedText.length - 1; // If possible, simplify content by combining text nodes into one string.
63
- // jest-native's `.toHaveTextContent` is buggy about array of text nodes in <Text> elements.
64
-
65
- if (lastIndex >= 0 && isStringOrNumber(child) && isStringOrNumber(wrappedText[lastIndex])) {
66
- /* eslint-disable-next-line no-param-reassign */
67
- wrappedText[lastIndex] = `${wrappedText[lastIndex]}${child}`;
68
- } else {
69
- wrappedText.push(child);
70
- }
71
- };
72
- /**
73
- * React Native on Native crashes if text content is rendered outside `<Text>`, and on web,
74
- * text style inheritance behaves differently with text compared to regular HTML.
75
- *
76
- * Call this function on children that may contain text (strings or numbers) at the top level,
77
- * and any that are found will be wrapped in a React Native `<Text>` element with supplied props.
78
- *
79
- * Note that this does not wrap strings that are nested children of rendered top level children:
80
- * `wrapStringsInText(<View>Some text</View>)` will not wrap the inner text and will still crash,
81
- * but `wrapStringsInText(<>{someString}{anotherString}</>)` wraps the strings inside the fragment.
82
- *
83
- * @param {ReactChildren} children
84
- * @param {TextProps} props
85
- * @returns {ReactChildren}
86
- */
87
-
88
-
89
- export const wrapStringsInText = (children, textProps = {}) => {
90
- const childrenArray = unpackFragment(Children.toArray(children)); // Group adjacent wrapable children together in one Text element to create as few Text elements
91
- // as possible, e.g. give <X>Text {someString}</X> one Text, same as <X>{`Text ${someString}`}</X>
92
-
93
- const wrapables = [[]];
94
- let wrapablesIndex = 0;
95
- childrenArray.forEach(child => {
96
- if (isWrapable(child)) {
97
- // Make this child a child of the current `Text`
98
- wrapChild(child, wrapables[wrapablesIndex]);
99
- } else {
100
- // Close current `Text` and start a new one after this child
101
- wrapables.push(child, []);
102
- wrapablesIndex += 2;
103
- }
104
- });
105
- const items = wrapables.reduce((flatChildren, group, index) => {
106
- // Skip nullish children and empty arrays
107
- if (!group || Array.isArray(group) && !group.length) return flatChildren;
108
- return [...flatChildren, Array.isArray(group) && group.some(child => isStringOrNumber(child)) ?
109
- /*#__PURE__*/
110
- // Wrap text nodes and their wrappable neighbours in Text with as stable a key as possible.
111
- // Avoid one-item arrays because jest-native's `.toHaveTextContent` is buggy
112
- // and sometimes fails to match text content in arrays.
113
- _jsx(Text, { ...textProps,
114
- children: group.length === 1 ? group[0] : group
115
- }, combineKeys(group) || index) : group];
116
- }, []);
117
- return items.length === 1 ? items[0] : items;
118
- };
@@ -1,26 +0,0 @@
1
- // Returns true if there are no duplicate values of the fields listed
2
- // in the `fields` array across the objects in the `items` array, false
3
- // otherwise.
4
- // Note that if a value of a field in an item is not set, it will be
5
- // excluded from comparison.
6
- const containUniqueFields = (items, fields) => {
7
- const map = [];
8
- const itemsHaveDuplicateFields = items.some(item => fields.some(field => {
9
- if (!map[field]) {
10
- map[field] = [];
11
- }
12
-
13
- if (!item[field]) {
14
- // We exclude empty values from comparison
15
- return false;
16
- } // Duplicate found!
17
-
18
-
19
- if (map[field][item[field]]) return true;
20
- map[field][item[field]] = true;
21
- return false;
22
- }));
23
- return !itemsHaveDuplicateFields;
24
- };
25
-
26
- export default containUniqueFields;
@@ -1,16 +0,0 @@
1
- export * from './a11y';
2
- export * from './animation';
3
- export * from './children';
4
- export * from './input';
5
- export * from './pressability';
6
- export * from './props';
7
- export { default as info } from './info';
8
- export { default as useCopy } from './useCopy';
9
- export { default as useHash } from './useHash';
10
- export { default as useSpacingScale } from './useSpacingScale';
11
- export { default as useResponsiveProp } from './useResponsiveProp';
12
- export * from './useResponsiveProp';
13
- export { default as useUniqueId } from './useUniqueId';
14
- export { default as withLinkRouter } from './withLinkRouter';
15
- export * from './ssr';
16
- export { default as containUniqueFields } from './containUniqueFields';
@@ -1,7 +0,0 @@
1
- import platform from './platform';
2
- import versions from './versions'; // export an object accessed like info.platform.OS, info.version.uds, etc
3
-
4
- export default {
5
- platform,
6
- versions
7
- };
@@ -1,11 +0,0 @@
1
- import Platform from "react-native-web/dist/exports/Platform";
2
- import fileSuffix from './platform'; // Allows consuming libraries that might not have a direct dependency on
3
- // React Native to check what the current platform is.
4
- // Particularly useful for validating Jest config: it is possible for Jest to
5
- // get configured such that Platform.OS returns a different mocked value to the
6
- // OS being used to select files by platform suffix (e.g. .web, .native).
7
-
8
- export default {
9
- OS: Platform.OS,
10
- fileSuffix
11
- };
@@ -1 +0,0 @@
1
- export default '.android';
@@ -1 +0,0 @@
1
- export default '.ios';
@@ -1 +0,0 @@
1
- export default '.web (default)';
@@ -1,4 +0,0 @@
1
- // This shouldn't ever be chosen, as the more specific '.ios' and '.android' are available.
2
- // If this gets picked, either an unsupported React Native platform is being used somehow
3
- // (e.g. a native Windows app), or there's a serious config problem somewhere.
4
- export default '.native';
@@ -1,5 +0,0 @@
1
- import pkgJson from '../../../package.json'; // Add more versions if they are useful e.g. theme schema version
2
-
3
- export default {
4
- uds: pkgJson.version
5
- };