@telus-uds/components-base 1.66.0 → 1.67.1

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 (486) hide show
  1. package/CHANGELOG.md +23 -3
  2. package/lib/A11yInfoProvider/index.js +5 -20
  3. package/lib/A11yText/index.js +3 -17
  4. package/lib/ActivityIndicator/Spinner.js +2 -9
  5. package/lib/ActivityIndicator/Spinner.native.js +4 -27
  6. package/lib/ActivityIndicator/index.js +1 -13
  7. package/lib/ActivityIndicator/shared.js +0 -3
  8. package/lib/Autocomplete/Autocomplete.js +34 -85
  9. package/lib/Autocomplete/Loading.js +0 -10
  10. package/lib/Autocomplete/Suggestions.js +0 -11
  11. package/lib/Autocomplete/index.js +0 -3
  12. package/lib/BaseProvider/HydrationContext.js +4 -18
  13. package/lib/BaseProvider/index.js +0 -12
  14. package/lib/Box/Box.js +10 -35
  15. package/lib/Box/index.js +0 -3
  16. package/lib/Button/Button.js +4 -13
  17. package/lib/Button/ButtonBase.js +23 -55
  18. package/lib/Button/ButtonDropdown.js +7 -32
  19. package/lib/Button/ButtonGroup.js +15 -48
  20. package/lib/Button/ButtonLink.js +3 -17
  21. package/lib/Button/index.js +0 -5
  22. package/lib/Button/propTypes.js +0 -15
  23. package/lib/Card/Card.js +3 -14
  24. package/lib/Card/CardBase.js +5 -16
  25. package/lib/Card/PressableCardBase.js +7 -30
  26. package/lib/Card/index.js +0 -7
  27. package/lib/Carousel/Carousel.js +22 -115
  28. package/lib/Carousel/CarouselContext.js +0 -14
  29. package/lib/Carousel/CarouselFirstFocus/CarouselFirstFocus.js +6 -18
  30. package/lib/Carousel/CarouselItem/CarouselItem.js +5 -20
  31. package/lib/Carousel/CarouselItem/index.js +0 -3
  32. package/lib/Carousel/CarouselStepTracker/CarouselStepTracker.js +0 -9
  33. package/lib/Carousel/CarouselStepTracker/index.js +0 -3
  34. package/lib/Carousel/CarouselTabs/CarouselTabs.js +5 -15
  35. package/lib/Carousel/CarouselTabs/CarouselTabsPanel.js +7 -16
  36. package/lib/Carousel/CarouselTabs/CarouselTabsPanelItem.js +2 -22
  37. package/lib/Carousel/CarouselTabs/index.js +0 -3
  38. package/lib/Carousel/CarouselThumbnail.js +1 -16
  39. package/lib/Carousel/CarouselThumbnailNavigation.js +0 -15
  40. package/lib/Carousel/index.js +0 -5
  41. package/lib/Checkbox/Checkbox.js +5 -44
  42. package/lib/Checkbox/CheckboxButton.js +7 -33
  43. package/lib/Checkbox/CheckboxGroup.js +14 -45
  44. package/lib/Checkbox/CheckboxInput.js +1 -11
  45. package/lib/Checkbox/CheckboxInput.native.js +0 -2
  46. package/lib/Checkbox/index.js +0 -4
  47. package/lib/CheckboxCard/CheckboxCard.js +4 -37
  48. package/lib/CheckboxCard/index.js +0 -3
  49. package/lib/CheckboxCardGroup/CheckboxCardGroup.js +216 -0
  50. package/lib/CheckboxCardGroup/index.js +10 -0
  51. package/lib/Divider/Divider.js +13 -24
  52. package/lib/Divider/index.js +0 -3
  53. package/lib/ExpandCollapse/Accordion.js +1 -9
  54. package/lib/ExpandCollapse/Control.js +10 -32
  55. package/lib/ExpandCollapse/ExpandCollapse.js +3 -19
  56. package/lib/ExpandCollapse/Panel.js +13 -38
  57. package/lib/ExpandCollapse/index.js +0 -5
  58. package/lib/Feedback/Feedback.js +13 -30
  59. package/lib/Feedback/index.js +0 -3
  60. package/lib/Fieldset/Fieldset.js +6 -37
  61. package/lib/Fieldset/FieldsetContainer.js +1 -10
  62. package/lib/Fieldset/FieldsetContainer.native.js +0 -8
  63. package/lib/Fieldset/Legend.js +1 -10
  64. package/lib/Fieldset/Legend.native.js +1 -13
  65. package/lib/Fieldset/index.js +0 -3
  66. package/lib/FlexGrid/Col/Col.js +10 -53
  67. package/lib/FlexGrid/Col/index.js +0 -3
  68. package/lib/FlexGrid/FlexGrid.js +3 -34
  69. package/lib/FlexGrid/Row/Row.js +0 -38
  70. package/lib/FlexGrid/Row/index.js +0 -3
  71. package/lib/FlexGrid/helpers/index.js +0 -4
  72. package/lib/FlexGrid/index.js +0 -3
  73. package/lib/FlexGrid/providers/GutterContext.js +0 -4
  74. package/lib/HorizontalScroll/HorizontalScroll.js +17 -45
  75. package/lib/HorizontalScroll/HorizontalScrollButton.js +1 -17
  76. package/lib/HorizontalScroll/ScrollViewEnd.js +5 -13
  77. package/lib/HorizontalScroll/ScrollViewEnd.native.js +1 -10
  78. package/lib/HorizontalScroll/index.js +0 -7
  79. package/lib/HorizontalScroll/itemPositions.js +8 -19
  80. package/lib/Icon/Icon.js +4 -17
  81. package/lib/Icon/IconText.js +5 -25
  82. package/lib/Icon/index.js +0 -6
  83. package/lib/IconButton/IconButton.js +5 -37
  84. package/lib/IconButton/index.js +0 -3
  85. package/lib/InputLabel/InputLabel.js +4 -28
  86. package/lib/InputLabel/LabelContent.js +2 -8
  87. package/lib/InputLabel/LabelContent.native.js +0 -8
  88. package/lib/InputLabel/index.js +0 -3
  89. package/lib/InputSupports/InputSupports.js +0 -21
  90. package/lib/InputSupports/index.js +0 -3
  91. package/lib/InputSupports/useInputSupports.js +2 -6
  92. package/lib/Link/ChevronLink.js +7 -18
  93. package/lib/Link/InlinePressable.js +0 -10
  94. package/lib/Link/InlinePressable.native.js +5 -18
  95. package/lib/Link/Link.js +0 -8
  96. package/lib/Link/LinkBase.js +17 -47
  97. package/lib/Link/TextButton.js +3 -16
  98. package/lib/Link/index.js +0 -5
  99. package/lib/List/List.js +5 -21
  100. package/lib/List/ListItem.js +1 -11
  101. package/lib/List/ListItemBase.js +5 -34
  102. package/lib/List/ListItemContent.js +1 -14
  103. package/lib/List/ListItemMark.js +3 -23
  104. package/lib/List/PressableListItemBase.js +2 -28
  105. package/lib/List/index.js +0 -4
  106. package/lib/Listbox/GroupControl.js +0 -14
  107. package/lib/Listbox/Listbox.js +15 -40
  108. package/lib/Listbox/ListboxContext.js +0 -7
  109. package/lib/Listbox/ListboxGroup.js +7 -19
  110. package/lib/Listbox/ListboxItem.js +3 -17
  111. package/lib/Listbox/ListboxOverlay.js +4 -20
  112. package/lib/Listbox/PressableItem.js +3 -18
  113. package/lib/Listbox/index.js +0 -3
  114. package/lib/Modal/Modal.js +94 -45
  115. package/lib/Modal/ModalContent.js +184 -0
  116. package/lib/Modal/index.js +0 -3
  117. package/lib/MultiSelectFilter/ModalOverlay.js +1 -20
  118. package/lib/MultiSelectFilter/MultiSelectFilter.js +20 -69
  119. package/lib/MultiSelectFilter/index.js +0 -3
  120. package/lib/Notification/Notification.js +11 -38
  121. package/lib/Notification/index.js +0 -3
  122. package/lib/Pagination/PageButton.js +2 -22
  123. package/lib/Pagination/Pagination.js +21 -42
  124. package/lib/Pagination/SideButton.js +0 -24
  125. package/lib/Pagination/index.js +0 -3
  126. package/lib/Pagination/usePagination.js +4 -9
  127. package/lib/Progress/Progress.js +3 -17
  128. package/lib/Progress/ProgressBar.js +3 -25
  129. package/lib/Progress/ProgressBarBackground.js +0 -12
  130. package/lib/Progress/index.js +0 -4
  131. package/lib/QuickLinks/QuickLinks.js +1 -18
  132. package/lib/QuickLinks/QuickLinksCard.js +1 -11
  133. package/lib/QuickLinks/QuickLinksItem.js +3 -17
  134. package/lib/QuickLinks/index.js +0 -4
  135. package/lib/QuickLinksFeature/QuickLinksFeature.js +3 -20
  136. package/lib/QuickLinksFeature/QuickLinksFeatureItem.js +7 -30
  137. package/lib/QuickLinksFeature/index.js +0 -4
  138. package/lib/Radio/Radio.js +5 -39
  139. package/lib/Radio/RadioButton.js +7 -26
  140. package/lib/Radio/RadioGroup.js +6 -39
  141. package/lib/Radio/RadioInput.js +1 -11
  142. package/lib/Radio/RadioInput.native.js +0 -2
  143. package/lib/Radio/index.js +0 -4
  144. package/lib/RadioCard/RadioCard.js +5 -38
  145. package/lib/RadioCard/RadioCardGroup.js +25 -40
  146. package/lib/RadioCard/index.js +0 -4
  147. package/lib/Responsive/Responsive.js +1 -14
  148. package/lib/Responsive/index.js +0 -3
  149. package/lib/Search/Search.js +22 -45
  150. package/lib/Search/index.js +0 -3
  151. package/lib/Select/Group.js +0 -8
  152. package/lib/Select/Group.native.js +0 -6
  153. package/lib/Select/Item.js +0 -7
  154. package/lib/Select/Item.native.js +0 -2
  155. package/lib/Select/Picker.js +0 -8
  156. package/lib/Select/Picker.native.js +6 -22
  157. package/lib/Select/Select.js +9 -52
  158. package/lib/Select/index.js +0 -5
  159. package/lib/SideNav/Item.js +5 -29
  160. package/lib/SideNav/ItemContent.js +1 -14
  161. package/lib/SideNav/ItemsGroup.js +9 -31
  162. package/lib/SideNav/SideNav.js +9 -33
  163. package/lib/SideNav/index.js +0 -2
  164. package/lib/Skeleton/Skeleton.js +10 -42
  165. package/lib/Skeleton/index.js +0 -3
  166. package/lib/Skeleton/skeletonWebAnimation.js +0 -2
  167. package/lib/Skeleton/useSkeletonNativeAnimation.js +1 -9
  168. package/lib/SkipLink/SkipLink.js +7 -27
  169. package/lib/SkipLink/index.js +0 -3
  170. package/lib/Spacer/Spacer.js +4 -20
  171. package/lib/Spacer/index.js +0 -3
  172. package/lib/StackView/StackView.js +3 -21
  173. package/lib/StackView/StackWrap.js +11 -21
  174. package/lib/StackView/StackWrap.native.js +0 -3
  175. package/lib/StackView/StackWrapBox.js +5 -21
  176. package/lib/StackView/StackWrapGap.js +1 -14
  177. package/lib/StackView/common.js +0 -6
  178. package/lib/StackView/getStackedContent.js +10 -21
  179. package/lib/StackView/index.js +0 -5
  180. package/lib/StepTracker/Step.js +3 -27
  181. package/lib/StepTracker/StepTracker.js +5 -32
  182. package/lib/StepTracker/index.js +0 -3
  183. package/lib/Tabs/Tabs.js +7 -30
  184. package/lib/Tabs/TabsItem.js +13 -38
  185. package/lib/Tabs/index.js +0 -3
  186. package/lib/Tags/Tags.js +9 -42
  187. package/lib/Tags/index.js +0 -3
  188. package/lib/TextInput/TextArea.js +11 -20
  189. package/lib/TextInput/TextInput.js +7 -16
  190. package/lib/TextInput/TextInputBase.js +12 -58
  191. package/lib/TextInput/index.js +0 -3
  192. package/lib/TextInput/propTypes.js +0 -8
  193. package/lib/ThemeProvider/ThemeProvider.js +10 -18
  194. package/lib/ThemeProvider/index.js +0 -9
  195. package/lib/ThemeProvider/useSetTheme.js +6 -9
  196. package/lib/ThemeProvider/useTheme.js +2 -7
  197. package/lib/ThemeProvider/useThemeTokens.js +1 -9
  198. package/lib/ThemeProvider/utils/index.js +0 -4
  199. package/lib/ThemeProvider/utils/styles.js +14 -35
  200. package/lib/ThemeProvider/utils/theme-tokens.js +15 -43
  201. package/lib/Timeline/Timeline.js +11 -27
  202. package/lib/Timeline/index.js +0 -3
  203. package/lib/ToggleSwitch/ToggleSwitch.js +12 -43
  204. package/lib/ToggleSwitch/ToggleSwitchGroup.js +4 -38
  205. package/lib/ToggleSwitch/index.js +0 -3
  206. package/lib/Tooltip/Backdrop.js +4 -11
  207. package/lib/Tooltip/Backdrop.native.js +1 -14
  208. package/lib/Tooltip/Tooltip.js +9 -37
  209. package/lib/Tooltip/Tooltip.native.js +14 -45
  210. package/lib/Tooltip/getTooltipPosition.js +26 -31
  211. package/lib/Tooltip/index.js +0 -5
  212. package/lib/Tooltip/shared.js +0 -10
  213. package/lib/TooltipButton/TooltipButton.js +5 -20
  214. package/lib/TooltipButton/index.js +0 -3
  215. package/lib/Typography/Typography.js +15 -38
  216. package/lib/Typography/index.js +0 -3
  217. package/lib/Validator/Validator.js +10 -58
  218. package/lib/Validator/index.js +0 -3
  219. package/lib/ViewportProvider/ViewportProvider.js +1 -13
  220. package/lib/ViewportProvider/index.js +0 -5
  221. package/lib/ViewportProvider/useViewport.js +0 -4
  222. package/lib/ViewportProvider/useViewportListener.js +3 -12
  223. package/lib/index.js +8 -71
  224. package/lib/utils/BaseView/BaseView.js +3 -17
  225. package/lib/utils/BaseView/BaseView.native.js +0 -3
  226. package/lib/utils/BaseView/index.js +0 -3
  227. package/lib/utils/a11y/index.js +0 -4
  228. package/lib/utils/a11y/semantics.js +14 -32
  229. package/lib/utils/a11y/textSize.js +1 -8
  230. package/lib/utils/animation/index.js +0 -2
  231. package/lib/utils/animation/useVerticalExpandAnimation.js +5 -18
  232. package/lib/utils/children.js +16 -28
  233. package/lib/utils/containUniqueFields.js +2 -5
  234. package/lib/utils/floating-ui/index.js +0 -1
  235. package/lib/utils/floating-ui/index.native.js +0 -1
  236. package/lib/utils/hasOwnProperty.js +0 -1
  237. package/lib/utils/htmlAttrs.js +2 -4
  238. package/lib/utils/index.js +0 -31
  239. package/lib/utils/info/index.js +0 -4
  240. package/lib/utils/info/platform/index.js +0 -4
  241. package/lib/utils/info/versions.js +0 -3
  242. package/lib/utils/input.js +12 -24
  243. package/lib/utils/pressability.js +7 -21
  244. package/lib/utils/props/a11yProps.js +19 -25
  245. package/lib/utils/props/clickProps.js +0 -4
  246. package/lib/utils/props/componentPropType.js +0 -14
  247. package/lib/utils/props/copyPropTypes.js +0 -4
  248. package/lib/utils/props/getPropSelector.js +11 -12
  249. package/lib/utils/props/handlerProps.js +2 -23
  250. package/lib/utils/props/hrefAttrsProp.js +0 -4
  251. package/lib/utils/props/index.js +0 -22
  252. package/lib/utils/props/inputSupportsProps.js +0 -9
  253. package/lib/utils/props/linkProps.js +2 -12
  254. package/lib/utils/props/paddingProp.js +0 -3
  255. package/lib/utils/props/pressProps.js +2 -8
  256. package/lib/utils/props/rectProp.js +0 -3
  257. package/lib/utils/props/responsiveProps.js +1 -5
  258. package/lib/utils/props/selectSystemProps.js +4 -6
  259. package/lib/utils/props/spacingProps.js +3 -10
  260. package/lib/utils/props/textInputProps.js +10 -31
  261. package/lib/utils/props/textProps.js +6 -11
  262. package/lib/utils/props/tokens.js +7 -26
  263. package/lib/utils/props/variantProp.js +0 -3
  264. package/lib/utils/props/viewProps.js +0 -5
  265. package/lib/utils/ssr.js +13 -33
  266. package/lib/utils/useCopy.js +3 -6
  267. package/lib/utils/useHash.js +5 -10
  268. package/lib/utils/useHash.native.js +0 -2
  269. package/lib/utils/useOverlaidPosition.js +6 -29
  270. package/lib/utils/useResponsiveProp.js +6 -13
  271. package/lib/utils/useSafeLayoutEffect.js +5 -10
  272. package/lib/utils/useScrollBlocking.js +3 -11
  273. package/lib/utils/useScrollBlocking.native.js +0 -2
  274. package/lib/utils/useSpacingScale.js +5 -8
  275. package/lib/utils/useUniqueId.js +0 -4
  276. package/lib/utils/withLinkRouter.js +13 -18
  277. package/lib-module/A11yInfoProvider/index.js +5 -9
  278. package/lib-module/A11yText/index.js +3 -4
  279. package/lib-module/ActivityIndicator/Spinner.js +2 -2
  280. package/lib-module/ActivityIndicator/Spinner.native.js +4 -6
  281. package/lib-module/ActivityIndicator/index.js +1 -5
  282. package/lib-module/ActivityIndicator/shared.js +2 -1
  283. package/lib-module/Autocomplete/Autocomplete.js +34 -59
  284. package/lib-module/Autocomplete/Loading.js +0 -2
  285. package/lib-module/BaseProvider/HydrationContext.js +4 -7
  286. package/lib-module/BaseProvider/index.js +0 -3
  287. package/lib-module/Box/Box.js +10 -24
  288. package/lib-module/Button/Button.js +4 -2
  289. package/lib-module/Button/ButtonBase.js +23 -35
  290. package/lib-module/Button/ButtonDropdown.js +7 -16
  291. package/lib-module/Button/ButtonGroup.js +15 -32
  292. package/lib-module/Button/ButtonLink.js +3 -2
  293. package/lib-module/Button/propTypes.js +0 -7
  294. package/lib-module/Card/Card.js +3 -2
  295. package/lib-module/Card/CardBase.js +5 -4
  296. package/lib-module/Card/PressableCardBase.js +7 -11
  297. package/lib-module/Carousel/Carousel.js +22 -60
  298. package/lib-module/Carousel/CarouselContext.js +0 -5
  299. package/lib-module/Carousel/CarouselFirstFocus/CarouselFirstFocus.js +7 -5
  300. package/lib-module/Carousel/CarouselItem/CarouselItem.js +5 -11
  301. package/lib-module/Carousel/CarouselStepTracker/CarouselStepTracker.js +0 -2
  302. package/lib-module/Carousel/CarouselTabs/CarouselTabs.js +3 -4
  303. package/lib-module/Carousel/CarouselTabs/CarouselTabsPanel.js +7 -6
  304. package/lib-module/Carousel/CarouselTabs/CarouselTabsPanelItem.js +2 -10
  305. package/lib-module/Carousel/CarouselThumbnail.js +1 -7
  306. package/lib-module/Carousel/CarouselThumbnailNavigation.js +0 -2
  307. package/lib-module/Checkbox/Checkbox.js +5 -23
  308. package/lib-module/Checkbox/CheckboxButton.js +7 -17
  309. package/lib-module/Checkbox/CheckboxGroup.js +14 -31
  310. package/lib-module/Checkbox/CheckboxInput.js +1 -3
  311. package/lib-module/Checkbox/CheckboxInput.native.js +0 -1
  312. package/lib-module/CheckboxCard/CheckboxCard.js +4 -21
  313. package/lib-module/CheckboxCardGroup/CheckboxCardGroup.js +206 -0
  314. package/lib-module/CheckboxCardGroup/index.js +2 -0
  315. package/lib-module/Divider/Divider.js +13 -11
  316. package/lib-module/ExpandCollapse/Accordion.js +1 -1
  317. package/lib-module/ExpandCollapse/Control.js +10 -17
  318. package/lib-module/ExpandCollapse/ExpandCollapse.js +3 -9
  319. package/lib-module/ExpandCollapse/Panel.js +13 -23
  320. package/lib-module/Feedback/Feedback.js +13 -16
  321. package/lib-module/Fieldset/Fieldset.js +6 -25
  322. package/lib-module/Fieldset/FieldsetContainer.js +1 -1
  323. package/lib-module/Fieldset/FieldsetContainer.native.js +0 -1
  324. package/lib-module/Fieldset/Legend.js +1 -1
  325. package/lib-module/Fieldset/Legend.native.js +1 -1
  326. package/lib-module/FlexGrid/Col/Col.js +10 -37
  327. package/lib-module/FlexGrid/FlexGrid.js +3 -17
  328. package/lib-module/FlexGrid/Row/Row.js +0 -25
  329. package/lib-module/FlexGrid/helpers/index.js +0 -3
  330. package/lib-module/HorizontalScroll/HorizontalScroll.js +17 -27
  331. package/lib-module/HorizontalScroll/HorizontalScrollButton.js +1 -3
  332. package/lib-module/HorizontalScroll/ScrollViewEnd.js +5 -4
  333. package/lib-module/HorizontalScroll/ScrollViewEnd.native.js +0 -1
  334. package/lib-module/HorizontalScroll/itemPositions.js +11 -10
  335. package/lib-module/Icon/Icon.js +4 -8
  336. package/lib-module/Icon/IconText.js +6 -17
  337. package/lib-module/IconButton/IconButton.js +7 -20
  338. package/lib-module/InputLabel/InputLabel.js +4 -13
  339. package/lib-module/InputLabel/LabelContent.js +2 -1
  340. package/lib-module/InputLabel/LabelContent.native.js +0 -1
  341. package/lib-module/InputSupports/InputSupports.js +0 -9
  342. package/lib-module/InputSupports/useInputSupports.js +2 -4
  343. package/lib-module/Link/ChevronLink.js +7 -7
  344. package/lib-module/Link/InlinePressable.js +0 -2
  345. package/lib-module/Link/InlinePressable.native.js +4 -12
  346. package/lib-module/Link/LinkBase.js +17 -25
  347. package/lib-module/Link/TextButton.js +3 -5
  348. package/lib-module/List/List.js +5 -9
  349. package/lib-module/List/ListItem.js +1 -1
  350. package/lib-module/List/ListItemBase.js +5 -17
  351. package/lib-module/List/ListItemContent.js +1 -4
  352. package/lib-module/List/ListItemMark.js +3 -16
  353. package/lib-module/List/PressableListItemBase.js +2 -6
  354. package/lib-module/Listbox/GroupControl.js +0 -2
  355. package/lib-module/Listbox/Listbox.js +15 -23
  356. package/lib-module/Listbox/ListboxContext.js +0 -2
  357. package/lib-module/Listbox/ListboxGroup.js +6 -4
  358. package/lib-module/Listbox/ListboxItem.js +2 -1
  359. package/lib-module/Listbox/ListboxOverlay.js +3 -4
  360. package/lib-module/Listbox/PressableItem.js +2 -7
  361. package/lib-module/Modal/Modal.js +94 -25
  362. package/lib-module/Modal/ModalContent.js +175 -0
  363. package/lib-module/MultiSelectFilter/ModalOverlay.js +1 -4
  364. package/lib-module/MultiSelectFilter/MultiSelectFilter.js +20 -42
  365. package/lib-module/Notification/Notification.js +11 -22
  366. package/lib-module/Pagination/PageButton.js +2 -6
  367. package/lib-module/Pagination/Pagination.js +21 -21
  368. package/lib-module/Pagination/SideButton.js +3 -8
  369. package/lib-module/Pagination/usePagination.js +4 -8
  370. package/lib-module/Progress/Progress.js +3 -7
  371. package/lib-module/Progress/ProgressBar.js +3 -11
  372. package/lib-module/Progress/ProgressBarBackground.js +0 -2
  373. package/lib-module/QuickLinks/QuickLinks.js +1 -6
  374. package/lib-module/QuickLinks/QuickLinksCard.js +1 -3
  375. package/lib-module/QuickLinks/QuickLinksItem.js +3 -2
  376. package/lib-module/QuickLinksFeature/QuickLinksFeature.js +5 -9
  377. package/lib-module/QuickLinksFeature/QuickLinksFeatureItem.js +9 -13
  378. package/lib-module/Radio/Radio.js +5 -22
  379. package/lib-module/Radio/RadioButton.js +8 -10
  380. package/lib-module/Radio/RadioGroup.js +6 -25
  381. package/lib-module/Radio/RadioInput.js +1 -3
  382. package/lib-module/Radio/RadioInput.native.js +0 -1
  383. package/lib-module/RadioCard/RadioCard.js +5 -21
  384. package/lib-module/RadioCard/RadioCardGroup.js +25 -27
  385. package/lib-module/Responsive/Responsive.js +1 -6
  386. package/lib-module/Search/Search.js +22 -31
  387. package/lib-module/Select/Group.js +0 -3
  388. package/lib-module/Select/Group.native.js +0 -3
  389. package/lib-module/Select/Item.js +0 -3
  390. package/lib-module/Select/Item.native.js +0 -1
  391. package/lib-module/Select/Picker.native.js +8 -10
  392. package/lib-module/Select/Select.js +10 -35
  393. package/lib-module/SideNav/Item.js +5 -16
  394. package/lib-module/SideNav/ItemContent.js +1 -2
  395. package/lib-module/SideNav/ItemsGroup.js +9 -19
  396. package/lib-module/SideNav/SideNav.js +9 -22
  397. package/lib-module/Skeleton/Skeleton.js +10 -25
  398. package/lib-module/Skeleton/skeletonWebAnimation.js +0 -1
  399. package/lib-module/Skeleton/useSkeletonNativeAnimation.js +1 -3
  400. package/lib-module/SkipLink/SkipLink.js +7 -9
  401. package/lib-module/Spacer/Spacer.js +4 -7
  402. package/lib-module/StackView/StackView.js +3 -7
  403. package/lib-module/StackView/StackWrap.js +13 -13
  404. package/lib-module/StackView/StackWrap.native.js +2 -1
  405. package/lib-module/StackView/StackWrapBox.js +5 -8
  406. package/lib-module/StackView/StackWrapGap.js +1 -1
  407. package/lib-module/StackView/getStackedContent.js +10 -10
  408. package/lib-module/StepTracker/Step.js +3 -14
  409. package/lib-module/StepTracker/StepTracker.js +5 -13
  410. package/lib-module/Tabs/Tabs.js +7 -16
  411. package/lib-module/Tabs/TabsItem.js +13 -16
  412. package/lib-module/Tags/Tags.js +9 -26
  413. package/lib-module/TextInput/TextArea.js +11 -8
  414. package/lib-module/TextInput/TextInput.js +7 -5
  415. package/lib-module/TextInput/TextInputBase.js +13 -39
  416. package/lib-module/TextInput/propTypes.js +3 -7
  417. package/lib-module/ThemeProvider/ThemeProvider.js +10 -9
  418. package/lib-module/ThemeProvider/useSetTheme.js +6 -7
  419. package/lib-module/ThemeProvider/useTheme.js +2 -5
  420. package/lib-module/ThemeProvider/useThemeTokens.js +1 -2
  421. package/lib-module/ThemeProvider/utils/styles.js +15 -27
  422. package/lib-module/ThemeProvider/utils/theme-tokens.js +15 -20
  423. package/lib-module/Timeline/Timeline.js +11 -17
  424. package/lib-module/ToggleSwitch/ToggleSwitch.js +13 -26
  425. package/lib-module/ToggleSwitch/ToggleSwitchGroup.js +4 -23
  426. package/lib-module/Tooltip/Backdrop.js +4 -7
  427. package/lib-module/Tooltip/Backdrop.native.js +1 -4
  428. package/lib-module/Tooltip/Tooltip.js +9 -18
  429. package/lib-module/Tooltip/Tooltip.native.js +14 -23
  430. package/lib-module/Tooltip/getTooltipPosition.js +26 -30
  431. package/lib-module/Tooltip/shared.js +0 -6
  432. package/lib-module/TooltipButton/TooltipButton.js +5 -8
  433. package/lib-module/Typography/Typography.js +14 -22
  434. package/lib-module/Validator/Validator.js +10 -42
  435. package/lib-module/ViewportProvider/ViewportProvider.js +1 -3
  436. package/lib-module/ViewportProvider/useViewportListener.js +6 -8
  437. package/lib-module/index.js +1 -0
  438. package/lib-module/utils/BaseView/BaseView.js +3 -4
  439. package/lib-module/utils/BaseView/BaseView.native.js +0 -1
  440. package/lib-module/utils/a11y/semantics.js +14 -27
  441. package/lib-module/utils/a11y/textSize.js +1 -2
  442. package/lib-module/utils/animation/useVerticalExpandAnimation.js +8 -11
  443. package/lib-module/utils/children.js +17 -19
  444. package/lib-module/utils/containUniqueFields.js +2 -4
  445. package/lib-module/utils/htmlAttrs.js +2 -1
  446. package/lib-module/utils/info/index.js +2 -1
  447. package/lib-module/utils/info/platform/index.js +4 -1
  448. package/lib-module/utils/info/versions.js +2 -1
  449. package/lib-module/utils/input.js +11 -19
  450. package/lib-module/utils/pressability.js +8 -7
  451. package/lib-module/utils/props/a11yProps.js +22 -20
  452. package/lib-module/utils/props/clickProps.js +0 -1
  453. package/lib-module/utils/props/componentPropType.js +0 -13
  454. package/lib-module/utils/props/getPropSelector.js +12 -8
  455. package/lib-module/utils/props/handlerProps.js +2 -19
  456. package/lib-module/utils/props/hrefAttrsProp.js +2 -2
  457. package/lib-module/utils/props/inputSupportsProps.js +0 -6
  458. package/lib-module/utils/props/linkProps.js +2 -3
  459. package/lib-module/utils/props/pressProps.js +2 -2
  460. package/lib-module/utils/props/responsiveProps.js +1 -3
  461. package/lib-module/utils/props/selectSystemProps.js +4 -5
  462. package/lib-module/utils/props/spacingProps.js +4 -3
  463. package/lib-module/utils/props/textInputProps.js +13 -27
  464. package/lib-module/utils/props/textProps.js +9 -7
  465. package/lib-module/utils/props/tokens.js +10 -13
  466. package/lib-module/utils/props/variantProp.js +1 -1
  467. package/lib-module/utils/props/viewProps.js +0 -1
  468. package/lib-module/utils/ssr.js +14 -18
  469. package/lib-module/utils/useCopy.js +3 -5
  470. package/lib-module/utils/useHash.js +5 -9
  471. package/lib-module/utils/useHash.native.js +0 -1
  472. package/lib-module/utils/useOverlaidPosition.js +6 -25
  473. package/lib-module/utils/useResponsiveProp.js +6 -7
  474. package/lib-module/utils/useSafeLayoutEffect.js +5 -7
  475. package/lib-module/utils/useScrollBlocking.js +3 -10
  476. package/lib-module/utils/useSpacingScale.js +4 -4
  477. package/lib-module/utils/useUniqueId.js +0 -2
  478. package/lib-module/utils/withLinkRouter.js +13 -10
  479. package/package.json +2 -2
  480. package/src/Checkbox/CheckboxGroup.jsx +10 -8
  481. package/src/CheckboxCardGroup/CheckboxCardGroup.jsx +231 -0
  482. package/src/CheckboxCardGroup/index.js +3 -0
  483. package/src/Modal/Modal.jsx +98 -5
  484. package/src/Modal/ModalContent.jsx +171 -0
  485. package/src/RadioCard/RadioCardGroup.jsx +23 -2
  486. package/src/index.js +1 -0
@@ -4,33 +4,19 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
9
  var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
13
-
14
10
  var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
15
-
16
11
  var _systemConstants = require("@telus-uds/system-constants");
17
-
18
12
  var _GutterContext = _interopRequireDefault(require("../providers/GutterContext"));
19
-
20
13
  var _ViewportProvider = require("../../ViewportProvider");
21
-
22
14
  var _helpers = _interopRequireDefault(require("../helpers"));
23
-
24
15
  var _utils = require("../../utils");
25
-
26
16
  var _jsxRuntime = require("react/jsx-runtime");
27
-
28
17
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
29
-
30
18
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
31
-
32
19
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
33
-
34
20
  const Col = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
35
21
  let {
36
22
  horizontalAlign,
@@ -51,30 +37,23 @@ const Col = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
51
37
  const gutter = (0, _react.useContext)(_GutterContext.default);
52
38
  const viewPort = (0, _ViewportProvider.useViewport)();
53
39
  const hiddenLevels = (0, _helpers.default)([xs, sm, md, lg, xl]);
54
-
55
40
  const getHorizontalAlignLevel = () => {
56
41
  if (typeof horizontalAlign === 'object') {
57
42
  return (0, _helpers.default)([horizontalAlign.xs, horizontalAlign.sm, horizontalAlign.md, horizontalAlign.lg, horizontalAlign.xl]);
58
43
  }
59
-
60
44
  if (typeof horizontalAlign === 'string') {
61
45
  return [horizontalAlign, horizontalAlign, horizontalAlign, horizontalAlign, horizontalAlign];
62
46
  }
63
-
64
47
  return ['inherit', 'inherit', 'inherit', 'inherit', 'inherit'];
65
48
  };
66
-
67
49
  const horizontalAlignLevel = getHorizontalAlignLevel();
68
-
69
50
  const toPercent = num => {
70
51
  return `${num / 12 * 100}%`;
71
52
  };
72
-
73
53
  const calculateWidth = value => {
74
54
  if (typeof value === 'undefined') {
75
55
  return {};
76
56
  }
77
-
78
57
  if (typeof value === 'number') {
79
58
  const percent = toPercent(value);
80
59
  return {
@@ -82,14 +61,12 @@ const Col = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
82
61
  flexBasis: percent
83
62
  };
84
63
  }
85
-
86
64
  return {
87
65
  flexGrow: 1,
88
66
  flexBasis: 0,
89
67
  maxWidth: '100%'
90
68
  };
91
69
  };
92
-
93
70
  const calculateOffset = value => {
94
71
  if (typeof value === 'number') {
95
72
  const percent = toPercent(value);
@@ -97,69 +74,62 @@ const Col = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
97
74
  marginLeft: percent
98
75
  };
99
76
  }
100
-
101
77
  return {};
102
78
  };
103
-
104
79
  const sizeStyles = sizes => {
105
80
  const currViewport = Object.keys(sizes).find(key => key.startsWith(viewPort));
106
81
  const currSize = sizes[currViewport];
107
- return { ...calculateWidth(currSize)
82
+ return {
83
+ ...calculateWidth(currSize)
108
84
  };
109
85
  };
110
-
111
86
  const offsetStyles = offsets => {
112
87
  const currViewport = Object.keys(offsets).find(key => key.startsWith(viewPort));
113
88
  const currOffset = offsets[currViewport];
114
- return { ...calculateOffset(currOffset)
89
+ return {
90
+ ...calculateOffset(currOffset)
115
91
  };
116
92
  };
117
-
118
93
  const gutterPadding = {
119
94
  paddingLeft: gutter ? 16 : 0,
120
95
  paddingRight: gutter ? 16 : 0
121
96
  };
122
- let hidingStyles = {}; // TODO: consider setting this to always 'flex' in a major release.
97
+ let hidingStyles = {};
98
+
99
+ // TODO: consider setting this to always 'flex' in a major release.
123
100
  // `display: block` is invalid in native apps.
124
101
  // See https://telusdigital.atlassian.net/browse/UDS1-92
125
-
126
102
  const shown = !flex && _Platform.default.OS === 'web' ? 'block' : 'flex';
127
-
128
103
  if (viewPort === _systemConstants.viewports.xs) {
129
104
  hidingStyles = {
130
105
  display: hiddenLevels[0] === 0 ? 'none' : shown,
131
106
  textAlign: horizontalAlignLevel[0]
132
107
  };
133
108
  }
134
-
135
109
  if (viewPort === _systemConstants.viewports.sm) {
136
110
  hidingStyles = {
137
111
  display: hiddenLevels[1] === 0 ? 'none' : shown,
138
112
  textAlign: horizontalAlignLevel[1]
139
113
  };
140
114
  }
141
-
142
115
  if (viewPort === _systemConstants.viewports.md) {
143
116
  hidingStyles = {
144
117
  display: hiddenLevels[2] === 0 ? 'none' : shown,
145
118
  textAlign: horizontalAlignLevel[2]
146
119
  };
147
120
  }
148
-
149
121
  if (viewPort === _systemConstants.viewports.lg) {
150
122
  hidingStyles = {
151
123
  display: hiddenLevels[3] === 0 ? 'none' : shown,
152
124
  textAlign: horizontalAlignLevel[3]
153
125
  };
154
126
  }
155
-
156
127
  if (viewPort === _systemConstants.viewports.xl) {
157
128
  hidingStyles = {
158
129
  display: hiddenLevels[4] === 0 ? 'none' : shown,
159
130
  textAlign: horizontalAlignLevel[4]
160
131
  };
161
132
  }
162
-
163
133
  const sizesArray = [xs, sm, md, lg, xl];
164
134
  const offSetsArray = [xsOffset, smOffset, mdOffset, lgOffset, xlOffset];
165
135
  const sizesWithIheritance = (0, _helpers.default)(sizesArray);
@@ -181,13 +151,13 @@ const Col = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
181
151
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.BaseView, {
182
152
  ref: ref,
183
153
  ...viewProps,
184
- style: [styles.col, gutterPadding, offsetStyles(offsets), sizeStyles(sizes), { ...hidingStyles
154
+ style: [styles.col, gutterPadding, offsetStyles(offsets), sizeStyles(sizes), {
155
+ ...hidingStyles
185
156
  }],
186
157
  children: children
187
158
  });
188
159
  });
189
160
  Col.displayName = 'Col';
190
-
191
161
  const styles = _StyleSheet.default.create({
192
162
  col: {
193
163
  flexGrow: 1,
@@ -196,13 +166,12 @@ const styles = _StyleSheet.default.create({
196
166
  maxWidth: '100%'
197
167
  }
198
168
  });
169
+
199
170
  /*
200
171
  * We're disabling default props since passing undefined props to
201
172
  * the react-flexbox-grid component sets up blank classes that may cause
202
173
  * styling issues.
203
174
  */
204
-
205
-
206
175
  Col.propTypes = {
207
176
  /**
208
177
  * Specify number of columns within the 'xs' breakpoint range. `0` hides the column.
@@ -212,7 +181,6 @@ Col.propTypes = {
212
181
  *
213
182
  */
214
183
  xs: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, true, false]),
215
-
216
184
  /**
217
185
  * Specify number of columns within the 'sm' breakpoint range. `0` hides the column.
218
186
  *
@@ -221,7 +189,6 @@ Col.propTypes = {
221
189
  *
222
190
  */
223
191
  sm: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, true, false]),
224
-
225
192
  /**
226
193
  * Specify number of columns within the 'md' breakpoint range. `0` hides the column.
227
194
  *
@@ -230,7 +197,6 @@ Col.propTypes = {
230
197
  *
231
198
  */
232
199
  md: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, true, false]),
233
-
234
200
  /**
235
201
  * Specify number of columns within the 'lg' breakpoint range. `0` hides the column.
236
202
  *
@@ -239,7 +205,6 @@ Col.propTypes = {
239
205
  *
240
206
  */
241
207
  lg: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, true, false]),
242
-
243
208
  /**
244
209
  * Specify number of columns after the 'xl' breakpoint. `0` hides the column.
245
210
  *
@@ -248,41 +213,34 @@ Col.propTypes = {
248
213
  *
249
214
  */
250
215
  xl: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, true, false]),
251
-
252
216
  /**
253
217
  * Offset the specified number of columns within the 'xs' breakpoint range. `0` hides the column.
254
218
  *
255
219
  */
256
220
  xsOffset: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]),
257
-
258
221
  /**
259
222
  * Offset the specified number of columns within the 'sm' breakpoint range.
260
223
  *
261
224
  */
262
225
  smOffset: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]),
263
-
264
226
  /**
265
227
  * Offset the specified number of columns within the 'md' breakpoint range.
266
228
  *
267
229
  */
268
230
  mdOffset: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]),
269
-
270
231
  /**
271
232
  * Offset the specified number of columns within the 'lg' breakpoint range.
272
233
  *
273
234
  */
274
235
  lgOffset: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]),
275
-
276
236
  /**
277
237
  * Offset the specified number of columns within the 'xl' breakpoint range.
278
238
  */
279
239
  xlOffset: _propTypes.default.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]),
280
-
281
240
  /**
282
241
  * The columns of the Grid. Will typically be `FlexGrid.Col` components.
283
242
  */
284
243
  children: _propTypes.default.node.isRequired,
285
-
286
244
  /**
287
245
  *
288
246
  * Align content horizontally within the column.
@@ -290,7 +248,6 @@ Col.propTypes = {
290
248
  * Accepts a `PropType.string` following the [responsive prop](#/Layout?id=responsive) structure.
291
249
  */
292
250
  horizontalAlign: _utils.responsiveProps.getTypeOptionallyByViewport(_propTypes.default.oneOf(['left', 'center', 'right'])),
293
-
294
251
  /**
295
252
  * (web only) Stretches the column to fill vertical space using `display: flex`.
296
253
  * In native apps, FlexGrid.Col behaves as if this is always true (as do all `View`s).
@@ -4,10 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _Col = _interopRequireDefault(require("./Col"));
9
-
10
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
9
  var _default = _Col.default;
13
10
  exports.default = _default;
@@ -4,36 +4,22 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
9
  var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
13
-
14
10
  var _systemConstants = require("@telus-uds/system-constants");
15
-
16
11
  var _utils = require("../utils");
17
-
18
12
  var _Row = _interopRequireDefault(require("./Row"));
19
-
20
13
  var _Col = _interopRequireDefault(require("./Col"));
21
-
22
14
  var _ViewportProvider = require("../ViewportProvider");
23
-
24
15
  var _GutterContext = _interopRequireDefault(require("./providers/GutterContext"));
25
-
26
16
  var _helpers = _interopRequireDefault(require("./helpers"));
27
-
28
17
  var _jsxRuntime = require("react/jsx-runtime");
29
-
30
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
31
-
32
19
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
33
-
34
20
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
35
-
36
21
  const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
22
+
37
23
  /**
38
24
  * A mobile-first flexbox grid.
39
25
  */
@@ -60,32 +46,26 @@ const FlexGrid = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
60
46
  const width = outsideGutter ? '100%' : 'auto';
61
47
  let flexDirection;
62
48
  let maxWidth;
63
-
64
49
  if (viewPort === _systemConstants.viewports.xs) {
65
50
  // no maxWidth for xs
66
51
  flexDirection = reverseLevel[0] ? 'column-reverse' : 'column';
67
52
  }
68
-
69
53
  if (viewPort === _systemConstants.viewports.sm) {
70
54
  maxWidth = limitWidth && _systemConstants.viewports.map.get(_systemConstants.viewports.sm);
71
55
  flexDirection = reverseLevel[1] ? 'column-reverse' : 'column';
72
56
  }
73
-
74
57
  if (viewPort === _systemConstants.viewports.md) {
75
58
  maxWidth = limitWidth && _systemConstants.viewports.map.get(_systemConstants.viewports.md);
76
59
  flexDirection = reverseLevel[2] ? 'column-reverse' : 'column';
77
60
  }
78
-
79
61
  if (viewPort === _systemConstants.viewports.lg) {
80
62
  maxWidth = limitWidth && _systemConstants.viewports.map.get(_systemConstants.viewports.lg);
81
63
  flexDirection = reverseLevel[3] ? 'column-reverse' : 'column';
82
64
  }
83
-
84
65
  if (viewPort === _systemConstants.viewports.xl) {
85
66
  maxWidth = limitWidth && _systemConstants.viewports.map.get(_systemConstants.viewports.xl);
86
67
  flexDirection = reverseLevel[4] ? 'column-reverse' : 'column';
87
68
  }
88
-
89
69
  const props = {
90
70
  accessibilityRole,
91
71
  ...(0, _utils.getA11yPropsFromHtmlTag)(tag, accessibilityRole),
@@ -108,55 +88,45 @@ const FlexGrid = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
108
88
  });
109
89
  });
110
90
  FlexGrid.displayName = 'FlexGrid';
111
-
112
91
  const styles = _StyleSheet.default.create({
113
92
  grid: {
114
93
  flexWrap: 'wrap'
115
94
  }
116
95
  });
117
-
118
- FlexGrid.propTypes = { ...selectedSystemPropTypes,
119
-
96
+ FlexGrid.propTypes = {
97
+ ...selectedSystemPropTypes,
120
98
  /**
121
99
  * Whether or not to give the grid a fixed width. This also centres the grid horizontally.
122
100
  */
123
101
  limitWidth: _propTypes.default.bool,
124
-
125
102
  /**
126
103
  * Whether or not to include gutters in between columns.
127
104
  */
128
105
  gutter: _propTypes.default.bool,
129
-
130
106
  /**
131
107
  * Whether or not to include gutter at the ends to the left and right of the FlexGrid
132
108
  */
133
109
  outsideGutter: _propTypes.default.bool,
134
-
135
110
  /**
136
111
  * Choose if the item order should be reversed from the 'xs' breakpoint. When you pass in false, the order will be normal from the xs breakpoint. By default, it inherits the behaviour set by the preceding prop.
137
112
  */
138
113
  xsReverse: _propTypes.default.bool,
139
-
140
114
  /**
141
115
  * Choose if the item order should be reversed from the 'sm' breakpoint. When you pass in false, the order will be normal from the sm breakpoint. By default, it inherits the behaviour set by the preceding prop.
142
116
  */
143
117
  smReverse: _propTypes.default.bool,
144
-
145
118
  /**
146
119
  * Choose if the item order should be reversed from the 'md' breakpoint. When you pass in false, the order will be normal from the md breakpoint. By default, it inherits the behaviour set by the preceding prop.
147
120
  */
148
121
  mdReverse: _propTypes.default.bool,
149
-
150
122
  /**
151
123
  * Choose if the item order should be reversed from the 'lg' breakpoint. When you pass in false, the order will be normal from the lg breakpoint. By default, it inherits the behaviour set by the preceding prop.
152
124
  */
153
125
  lgReverse: _propTypes.default.bool,
154
-
155
126
  /**
156
127
  * Choose if the item order should be reversed from the 'xl' breakpoint. When you pass in false, the order will be normal from the xl breakpoint. By default, it inherits the behaviour set by the preceding prop.
157
128
  */
158
129
  xlReverse: _propTypes.default.bool,
159
-
160
130
  /**
161
131
  * Optional semantic HTML tag, to apply to the container on web. Does not change styling.
162
132
  *
@@ -164,7 +134,6 @@ FlexGrid.propTypes = { ...selectedSystemPropTypes,
164
134
  * is not defined, the accessibilityRole will default to "heading".
165
135
  */
166
136
  tag: _propTypes.default.oneOf(_utils.layoutTags),
167
-
168
137
  /**
169
138
  * The rows and columns of the Grid. Will typically be `FlexGrid.Row` and `FlexGrid.Col` components.
170
139
  */
@@ -4,29 +4,17 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
11
-
12
9
  var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
13
-
14
10
  var _systemConstants = require("@telus-uds/system-constants");
15
-
16
11
  var _ViewportProvider = require("../../ViewportProvider");
17
-
18
12
  var _helpers = _interopRequireDefault(require("../helpers"));
19
-
20
13
  var _utils = require("../../utils");
21
-
22
14
  var _jsxRuntime = require("react/jsx-runtime");
23
-
24
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
-
26
16
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
-
28
17
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
-
30
18
  const horizontalAlignStyles = horizontalAlign => {
31
19
  switch (horizontalAlign) {
32
20
  case 'start':
@@ -34,63 +22,52 @@ const horizontalAlignStyles = horizontalAlign => {
34
22
  justifyContent: 'flex-start',
35
23
  textAlign: 'left'
36
24
  };
37
-
38
25
  case 'center':
39
26
  return {
40
27
  justifyContent: 'center',
41
28
  textAlign: 'center'
42
29
  };
43
-
44
30
  case 'end':
45
31
  return {
46
32
  justifyContent: 'flex-end',
47
33
  textAlign: 'right'
48
34
  };
49
-
50
35
  default:
51
36
  return {};
52
37
  }
53
38
  };
54
-
55
39
  const verticalAlignStyles = verticalAlign => {
56
40
  switch (verticalAlign) {
57
41
  case 'top':
58
42
  return {
59
43
  alignItems: 'flex-start'
60
44
  };
61
-
62
45
  case 'middle':
63
46
  return {
64
47
  alignItems: 'center'
65
48
  };
66
-
67
49
  case 'bottom':
68
50
  return {
69
51
  alignItems: 'flex-end'
70
52
  };
71
-
72
53
  default:
73
54
  return {};
74
55
  }
75
56
  };
76
-
77
57
  const distributeStyles = distribute => {
78
58
  switch (distribute) {
79
59
  case 'between':
80
60
  return {
81
61
  justifyContent: 'space-between'
82
62
  };
83
-
84
63
  case 'around':
85
64
  return {
86
65
  justifyContent: 'space-around'
87
66
  };
88
-
89
67
  default:
90
68
  return {};
91
69
  }
92
70
  };
93
-
94
71
  const Row = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
95
72
  let {
96
73
  horizontalAlign,
@@ -108,32 +85,26 @@ const Row = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
108
85
  const reverseLevel = (0, _helpers.default)([xsReverse, smReverse, mdReverse, lgReverse, xlReverse]);
109
86
  let flexDirection = '';
110
87
  let flexWrap = '';
111
-
112
88
  if (viewPort === _systemConstants.viewports.xs) {
113
89
  flexDirection = reverseLevel[0] ? 'row-reverse' : 'row';
114
90
  flexWrap = reverseLevel[0] ? 'wrap-reverse' : 'wrap';
115
91
  }
116
-
117
92
  if (viewPort === _systemConstants.viewports.sm) {
118
93
  flexDirection = reverseLevel[1] ? 'row-reverse' : 'row';
119
94
  flexWrap = reverseLevel[1] ? 'wrap-reverse' : 'wrap';
120
95
  }
121
-
122
96
  if (viewPort === _systemConstants.viewports.md) {
123
97
  flexDirection = reverseLevel[2] ? 'row-reverse' : 'row';
124
98
  flexWrap = reverseLevel[2] ? 'wrap-reverse' : 'wrap';
125
99
  }
126
-
127
100
  if (viewPort === _systemConstants.viewports.lg) {
128
101
  flexDirection = reverseLevel[3] ? 'row-reverse' : 'row';
129
102
  flexWrap = reverseLevel[3] ? 'wrap-reverse' : 'wrap';
130
103
  }
131
-
132
104
  if (viewPort === _systemConstants.viewports.xl) {
133
105
  flexDirection = reverseLevel[4] ? 'row-reverse' : 'row';
134
106
  flexWrap = reverseLevel[4] ? 'wrap-reverse' : 'wrap';
135
107
  }
136
-
137
108
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.BaseView, {
138
109
  ref: ref,
139
110
  ...rest,
@@ -148,7 +119,6 @@ const Row = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
148
119
  });
149
120
  });
150
121
  Row.displayName = 'Row';
151
-
152
122
  const styles = _StyleSheet.default.create({
153
123
  row: {
154
124
  width: '100%',
@@ -160,43 +130,35 @@ const styles = _StyleSheet.default.create({
160
130
  flexDirection: 'row'
161
131
  }
162
132
  });
163
-
164
133
  Row.propTypes = {
165
134
  /**
166
135
  * Align columns horizontally within their row.
167
136
  */
168
137
  horizontalAlign: _propTypes.default.oneOf(['start', 'center', 'end']),
169
-
170
138
  /**
171
139
  * Align columns vertically within their row.
172
140
  */
173
141
  verticalAlign: _propTypes.default.oneOf(['top', 'middle', 'bottom']),
174
-
175
142
  /**
176
143
  * Distribute empty space around columns.
177
144
  */
178
145
  distribute: _propTypes.default.oneOf(['around', 'between']),
179
-
180
146
  /**
181
147
  * Choose if the item order should be reversed from the 'xs' breakpoint. When you pass in false, the order will be normal from the xs breakpoint. By default, it inherits the behaviour set by the preceding prop.
182
148
  */
183
149
  xsReverse: _propTypes.default.bool,
184
-
185
150
  /**
186
151
  * Choose if the item order should be reversed from the 'sm' breakpoint. When you pass in false, the order will be normal from the sm breakpoint. By default, it inherits the behaviour set by the preceding prop.
187
152
  */
188
153
  smReverse: _propTypes.default.bool,
189
-
190
154
  /**
191
155
  * Choose if the item order should be reversed from the 'md' breakpoint. When you pass in false, the order will be normal from the md breakpoint. By default, it inherits the behaviour set by the preceding prop.
192
156
  */
193
157
  mdReverse: _propTypes.default.bool,
194
-
195
158
  /**
196
159
  * Choose if the item order should be reversed from the 'lg' breakpoint. When you pass in false, the order will be normal from the lg breakpoint. By default, it inherits the behaviour set by the preceding prop.
197
160
  */
198
161
  lgReverse: _propTypes.default.bool,
199
-
200
162
  /**
201
163
  * Choose if the item order should be reversed from the 'xl' breakpoint. When you pass in false, the order will be normal from the xl breakpoint. By default, it inherits the behaviour set by the preceding prop.
202
164
  */
@@ -4,10 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _Row = _interopRequireDefault(require("./Row"));
9
-
10
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
9
  var _default = _Row.default;
13
10
  exports.default = _default;
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  const applyInheritance = sizes => {
9
8
  let prevSize;
10
9
  return sizes.map((size, index) => {
@@ -12,15 +11,12 @@ const applyInheritance = sizes => {
12
11
  prevSize = size;
13
12
  return size;
14
13
  }
15
-
16
14
  if (index) {
17
15
  const value = prevSize;
18
16
  return value;
19
17
  }
20
-
21
18
  return undefined;
22
19
  });
23
20
  };
24
-
25
21
  var _default = applyInheritance;
26
22
  exports.default = _default;
@@ -4,10 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _FlexGrid = _interopRequireDefault(require("./FlexGrid"));
9
-
10
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
9
  var _default = _FlexGrid.default;
13
10
  exports.default = _default;
@@ -4,12 +4,8 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
-
8
7
  var _react = _interopRequireDefault(require("react"));
9
-
10
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
9
  const GutterContext = /*#__PURE__*/_react.default.createContext(false);
13
-
14
10
  var _default = GutterContext;
15
11
  exports.default = _default;