@sproutsocial/racine 12.20.0 → 12.21.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (621) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/README.md +46 -44
  3. package/__flow__/Avatar/index.js +26 -26
  4. package/__flow__/Avatar/index.stories.js +8 -8
  5. package/__flow__/Avatar/index.test.js +13 -13
  6. package/__flow__/Badge/constants.js +14 -14
  7. package/__flow__/Badge/index.js +18 -18
  8. package/__flow__/Badge/index.stories.js +8 -8
  9. package/__flow__/Badge/index.test.js +43 -43
  10. package/__flow__/Badge/styles.js +13 -9
  11. package/__flow__/Banner/index.js +21 -21
  12. package/__flow__/Banner/index.stories.js +56 -68
  13. package/__flow__/Banner/index.test.js +32 -34
  14. package/__flow__/Banner/styles.js +4 -4
  15. package/__flow__/Box/index.js +4 -4
  16. package/__flow__/Box/index.stories.js +58 -51
  17. package/__flow__/Box/index.test.js +7 -7
  18. package/__flow__/Box/styles.js +6 -6
  19. package/__flow__/Breadcrumb/index.js +9 -13
  20. package/__flow__/Breadcrumb/index.stories.js +14 -14
  21. package/__flow__/Breadcrumb/index.test.js +20 -20
  22. package/__flow__/Breadcrumb/styles.js +5 -5
  23. package/__flow__/Button/index.js +23 -23
  24. package/__flow__/Button/index.stories.js +34 -34
  25. package/__flow__/Button/styles.js +11 -11
  26. package/__flow__/Card/index.js +7 -7
  27. package/__flow__/Card/index.stories.js +14 -14
  28. package/__flow__/Card/styles.js +7 -7
  29. package/__flow__/CharacterCounter/index.js +7 -7
  30. package/__flow__/CharacterCounter/index.stories.js +25 -26
  31. package/__flow__/CharacterCounter/index.test.js +11 -11
  32. package/__flow__/CharacterCounter/styles.js +3 -3
  33. package/__flow__/ChartLegend/index.js +7 -7
  34. package/__flow__/ChartLegend/index.stories.js +22 -22
  35. package/__flow__/ChartLegend/index.test.js +27 -27
  36. package/__flow__/ChartLegend/styles.js +7 -7
  37. package/__flow__/Checkbox/index.js +10 -10
  38. package/__flow__/Checkbox/index.stories.js +24 -24
  39. package/__flow__/Checkbox/index.test.js +25 -25
  40. package/__flow__/Checkbox/styles.js +27 -28
  41. package/__flow__/Collapsible/index.js +15 -15
  42. package/__flow__/Collapsible/index.stories.js +13 -13
  43. package/__flow__/Collapsible/index.test.js +27 -27
  44. package/__flow__/Collapsible/styles.js +5 -5
  45. package/__flow__/DatePicker/DateRangePicker.js +5 -8
  46. package/__flow__/DatePicker/DateRangePicker.stories.js +19 -19
  47. package/__flow__/DatePicker/DateRangePicker.test.js +21 -21
  48. package/__flow__/DatePicker/SingleDatePicker.js +6 -9
  49. package/__flow__/DatePicker/SingleDatePicker.stories.js +10 -10
  50. package/__flow__/DatePicker/SingleDatePicker.test.js +21 -23
  51. package/__flow__/DatePicker/StatefulDateRangePicker.js +6 -6
  52. package/__flow__/DatePicker/StatefulSingleDatePicker.js +3 -3
  53. package/__flow__/DatePicker/common.js +13 -13
  54. package/__flow__/DatePicker/index.js +3 -3
  55. package/__flow__/DatePicker/styles.js +42 -42
  56. package/__flow__/Drawer/SlideTransition.js +10 -10
  57. package/__flow__/Drawer/index.js +29 -29
  58. package/__flow__/Drawer/index.stories.js +58 -141
  59. package/__flow__/Drawer/index.test.js +28 -28
  60. package/__flow__/Drawer/styles.js +4 -4
  61. package/__flow__/EmptyState/index.js +5 -5
  62. package/__flow__/EmptyState/index.stories.js +10 -10
  63. package/__flow__/EmptyState/index.test.js +27 -27
  64. package/__flow__/EnumIllustrationNames.js +1 -1
  65. package/__flow__/Fieldset/index.js +14 -14
  66. package/__flow__/Fieldset/index.stories.js +19 -20
  67. package/__flow__/Fieldset/index.test.js +14 -14
  68. package/__flow__/Fieldset/styles.js +5 -5
  69. package/__flow__/FormField/index.js +14 -14
  70. package/__flow__/FormField/index.stories.js +31 -21
  71. package/__flow__/FormField/index.test.js +19 -19
  72. package/__flow__/Icon/deprecatedIcons.js +36 -36
  73. package/__flow__/Icon/index.js +17 -17
  74. package/__flow__/Icon/index.stories.js +30 -30
  75. package/__flow__/Icon/index.test.js +15 -15
  76. package/__flow__/Icon/styles.js +12 -12
  77. package/__flow__/IllustrationViewBoxes.js +1 -1
  78. package/__flow__/Image/index.js +6 -7
  79. package/__flow__/Image/index.stories.js +5 -5
  80. package/__flow__/Image/index.test.js +24 -24
  81. package/__flow__/Image/styles.js +6 -5
  82. package/__flow__/Indicator/index.js +7 -7
  83. package/__flow__/Indicator/index.stories.js +8 -14
  84. package/__flow__/Indicator/index.test.js +6 -6
  85. package/__flow__/Indicator/styles.js +6 -6
  86. package/__flow__/Input/index.js +37 -37
  87. package/__flow__/Input/index.stories.js +96 -189
  88. package/__flow__/Input/index.test.js +117 -117
  89. package/__flow__/Input/styles.js +13 -13
  90. package/__flow__/KeyboardKey/index.js +5 -5
  91. package/__flow__/KeyboardKey/index.stories.js +9 -12
  92. package/__flow__/KeyboardKey/index.test.js +7 -7
  93. package/__flow__/KeyboardKey/styles.js +4 -4
  94. package/__flow__/Label/index.js +6 -6
  95. package/__flow__/Label/index.stories.js +5 -7
  96. package/__flow__/Label/index.test.js +8 -8
  97. package/__flow__/Link/constants.js +4 -4
  98. package/__flow__/Link/index.js +11 -11
  99. package/__flow__/Link/index.stories.js +61 -102
  100. package/__flow__/Link/index.test.js +40 -40
  101. package/__flow__/Link/styles.js +6 -6
  102. package/__flow__/Listbox/index.js +16 -16
  103. package/__flow__/Listbox/index.stories.js +35 -35
  104. package/__flow__/Listbox/index.test.js +63 -65
  105. package/__flow__/Loader/index.js +12 -12
  106. package/__flow__/Loader/index.stories.js +10 -10
  107. package/__flow__/Loader/index.test.js +17 -17
  108. package/__flow__/Loader/styles.js +9 -13
  109. package/__flow__/LoaderButton/index.js +25 -25
  110. package/__flow__/LoaderButton/index.stories.js +7 -7
  111. package/__flow__/LoaderButton/index.test.js +15 -15
  112. package/__flow__/Menu/constants.js +8 -8
  113. package/__flow__/Menu/descendants.js +89 -80
  114. package/__flow__/Menu/hooks.js +22 -22
  115. package/__flow__/Menu/index.flow.js +13 -13
  116. package/__flow__/Menu/index.js +56 -60
  117. package/__flow__/Menu/index.stories.js +19 -19
  118. package/__flow__/Menu/index.test.js +22 -22
  119. package/__flow__/Menu/names.js +4945 -4945
  120. package/__flow__/Menu/styles.js +5 -5
  121. package/__flow__/Message/index.js +33 -33
  122. package/__flow__/Message/index.stories.js +18 -13
  123. package/__flow__/Message/index.test.js +6 -6
  124. package/__flow__/Message/styles.js +15 -15
  125. package/__flow__/Modal/index.js +19 -19
  126. package/__flow__/Modal/index.stories.js +43 -43
  127. package/__flow__/Modal/index.test.js +29 -29
  128. package/__flow__/Modal/styles.js +27 -32
  129. package/__flow__/Numeral/index.js +22 -22
  130. package/__flow__/Numeral/index.stories.js +74 -74
  131. package/__flow__/Numeral/styles.js +3 -3
  132. package/__flow__/Numeral/tests/A11y.test.js +7 -7
  133. package/__flow__/Numeral/tests/abbreviate.test.js +40 -40
  134. package/__flow__/Numeral/tests/currency.test.js +24 -24
  135. package/__flow__/Numeral/tests/defaults.test.js +20 -20
  136. package/__flow__/Numeral/tests/invalid.test.js +9 -9
  137. package/__flow__/Numeral/tests/locale.test.js +38 -38
  138. package/__flow__/Numeral/tests/precision.test.js +76 -76
  139. package/__flow__/Numeral/tests/testNumeral.js +11 -11
  140. package/__flow__/Numeral/tests/zero.test.js +8 -8
  141. package/__flow__/OverflowList/index.flow.js +2 -2
  142. package/__flow__/OverflowList/index.js +12 -12
  143. package/__flow__/OverflowList/index.stories.js +10 -10
  144. package/__flow__/OverflowList/index.test.js +25 -25
  145. package/__flow__/OverflowList/styles.js +5 -5
  146. package/__flow__/PartnerLogo/TypePartnerNames.js +37 -37
  147. package/__flow__/PartnerLogo/index.js +20 -20
  148. package/__flow__/PartnerLogo/index.stories.js +52 -52
  149. package/__flow__/PartnerLogo/styles.js +12 -12
  150. package/__flow__/Popout/index.js +66 -67
  151. package/__flow__/Popout/index.stories.js +101 -82
  152. package/__flow__/Popout/index.test.js +43 -43
  153. package/__flow__/Popout/styles.js +4 -5
  154. package/__flow__/Portal/index.js +9 -9
  155. package/__flow__/Portal/index.stories.js +12 -12
  156. package/__flow__/Radio/index.js +4 -4
  157. package/__flow__/Radio/index.stories.js +11 -11
  158. package/__flow__/Radio/index.test.js +12 -12
  159. package/__flow__/Radio/styles.js +15 -16
  160. package/__flow__/SegmentedControl/index.js +7 -7
  161. package/__flow__/SegmentedControl/index.stories.js +7 -7
  162. package/__flow__/SegmentedControl/index.test.js +29 -29
  163. package/__flow__/SegmentedControl/styles.js +10 -9
  164. package/__flow__/Select/index.js +10 -10
  165. package/__flow__/Select/index.stories.js +33 -69
  166. package/__flow__/Select/index.test.js +14 -14
  167. package/__flow__/Select/styles.js +16 -16
  168. package/__flow__/Skeleton/index.js +4 -4
  169. package/__flow__/Skeleton/index.stories.js +5 -5
  170. package/__flow__/SpotIllustration/illustrationNames.js +118 -117
  171. package/__flow__/SpotIllustration/index.js +15 -11
  172. package/__flow__/SpotIllustration/index.stories.js +18 -18
  173. package/__flow__/SpotIllustration/spotIllustrations/molecule.svg +14 -0
  174. package/__flow__/Stack/index.js +43 -33
  175. package/__flow__/Stack/index.stories.js +41 -91
  176. package/__flow__/Stack/index.test.js +16 -7
  177. package/__flow__/Switch/index.js +8 -8
  178. package/__flow__/Switch/index.stories.js +5 -5
  179. package/__flow__/Switch/index.test.js +25 -29
  180. package/__flow__/Switch/styles.js +13 -9
  181. package/__flow__/Table/index.js +17 -17
  182. package/__flow__/Table/index.stories.js +99 -99
  183. package/__flow__/Table/index.test.js +32 -32
  184. package/__flow__/Table/styles.js +4 -4
  185. package/__flow__/TableCell/index.js +8 -7
  186. package/__flow__/TableCell/index.stories.js +20 -23
  187. package/__flow__/TableCell/index.test.js +11 -11
  188. package/__flow__/TableCell/styles.js +4 -5
  189. package/__flow__/TableHeaderCell/index.js +14 -14
  190. package/__flow__/TableHeaderCell/index.stories.js +35 -30
  191. package/__flow__/TableHeaderCell/index.test.js +11 -11
  192. package/__flow__/TableHeaderCell/styles.js +4 -4
  193. package/__flow__/TableRowAccordion/index.js +8 -8
  194. package/__flow__/TableRowAccordion/index.stories.js +36 -36
  195. package/__flow__/TableRowAccordion/index.test.js +28 -30
  196. package/__flow__/TableRowAccordion/styles.js +11 -7
  197. package/__flow__/Tabs/index.js +11 -11
  198. package/__flow__/Tabs/index.stories.js +28 -54
  199. package/__flow__/Tabs/index.test.js +54 -54
  200. package/__flow__/Tabs/styles.js +6 -7
  201. package/__flow__/Text/index.js +14 -14
  202. package/__flow__/Text/index.stories.js +84 -86
  203. package/__flow__/Text/index.test.js +29 -33
  204. package/__flow__/Text/styles.js +4 -4
  205. package/__flow__/Textarea/index.js +5 -5
  206. package/__flow__/Textarea/index.stories.js +54 -93
  207. package/__flow__/Textarea/index.test.js +30 -30
  208. package/__flow__/Textarea/styles.js +6 -6
  209. package/__flow__/ThemeProvider/index.js +4 -4
  210. package/__flow__/Toast/index.js +23 -23
  211. package/__flow__/Toast/index.stories.js +21 -21
  212. package/__flow__/Toast/styles.js +6 -6
  213. package/__flow__/ToggleHint/index.js +8 -8
  214. package/__flow__/ToggleHint/index.test.js +8 -8
  215. package/__flow__/ToggleHint/styles.js +8 -8
  216. package/__flow__/Token/index.js +10 -10
  217. package/__flow__/Token/index.stories.js +49 -54
  218. package/__flow__/Token/index.test.js +28 -28
  219. package/__flow__/Token/styles.js +11 -11
  220. package/__flow__/TokenInput/index.flow.js +1 -1
  221. package/__flow__/TokenInput/index.js +39 -39
  222. package/__flow__/TokenInput/index.stories.js +121 -128
  223. package/__flow__/TokenInput/styles.js +5 -5
  224. package/__flow__/TokenInput/tests/default/clicking.test.js +13 -13
  225. package/__flow__/TokenInput/tests/default/deleting.test.js +39 -39
  226. package/__flow__/TokenInput/tests/default/focusing.test.js +18 -18
  227. package/__flow__/TokenInput/tests/default/inputting.test.js +23 -23
  228. package/__flow__/TokenInput/tests/default/pasting.test.js +52 -52
  229. package/__flow__/TokenInput/tests/default/rendering.test.js +54 -54
  230. package/__flow__/TokenInput/util.js +4 -4
  231. package/__flow__/Tooltip/index.js +21 -21
  232. package/__flow__/Tooltip/index.stories.js +18 -18
  233. package/__flow__/Tooltip/index.test.js +54 -54
  234. package/__flow__/Tooltip/styles.js +4 -5
  235. package/__flow__/VisuallyHidden/index.js +3 -3
  236. package/__flow__/building-stories.stories.mdx +121 -0
  237. package/__flow__/dataviz/dataviz.stories.js +4 -4
  238. package/__flow__/dataviz/index.js +3 -3
  239. package/__flow__/index.js +72 -72
  240. package/__flow__/overview.stories.js +60 -0
  241. package/__flow__/setupTests.js +5 -5
  242. package/__flow__/systemProps/background.js +3 -3
  243. package/__flow__/systemProps/border.js +3 -3
  244. package/__flow__/systemProps/color.js +3 -3
  245. package/__flow__/systemProps/custom.js +3 -3
  246. package/__flow__/systemProps/flexbox.js +3 -3
  247. package/__flow__/systemProps/grid.js +3 -3
  248. package/__flow__/systemProps/index.js +14 -14
  249. package/__flow__/systemProps/layout.js +3 -3
  250. package/__flow__/systemProps/position.js +3 -3
  251. package/__flow__/systemProps/shadow.js +3 -3
  252. package/__flow__/systemProps/space.js +3 -7
  253. package/__flow__/systemProps/systemProps.js +14 -14
  254. package/__flow__/systemProps/tests/background.test.js +17 -17
  255. package/__flow__/systemProps/tests/border.test.js +61 -61
  256. package/__flow__/systemProps/tests/color.test.js +15 -15
  257. package/__flow__/systemProps/tests/custom.test.js +12 -12
  258. package/__flow__/systemProps/tests/flexbox.test.js +33 -33
  259. package/__flow__/systemProps/tests/grid.test.js +31 -31
  260. package/__flow__/systemProps/tests/layout.test.js +29 -29
  261. package/__flow__/systemProps/tests/position.test.js +19 -19
  262. package/__flow__/systemProps/tests/shadow.test.js +11 -11
  263. package/__flow__/systemProps/tests/space.test.js +11 -11
  264. package/__flow__/systemProps/tests/types.flow.js +18 -18
  265. package/__flow__/systemProps/tests/typography.test.js +21 -21
  266. package/__flow__/systemProps/tests/variant.test.js +9 -9
  267. package/__flow__/systemProps/types.flow.js +2 -2
  268. package/__flow__/systemProps/typography.js +4 -4
  269. package/__flow__/systemProps/variant.js +5 -5
  270. package/__flow__/themes/dark/dataviz-palette.js +21 -21
  271. package/__flow__/themes/dark/decorative-palettes.js +1 -1
  272. package/__flow__/themes/dark/theme.js +16 -16
  273. package/__flow__/themes/extendedThemes/README.md +1 -1
  274. package/__flow__/themes/extendedThemes/sproutTheme/dark/theme.js +4 -4
  275. package/__flow__/themes/extendedThemes/sproutTheme/index.js +2 -2
  276. package/__flow__/themes/extendedThemes/sproutTheme/light/theme.js +4 -4
  277. package/__flow__/themes/light/dataviz-palette.js +21 -21
  278. package/__flow__/themes/light/decorative-palettes.js +1 -1
  279. package/__flow__/themes/light/literal-colors.js +133 -133
  280. package/__flow__/themes/light/theme.js +51 -51
  281. package/__flow__/types/system-props.flow.js +5 -5
  282. package/__flow__/types/theme.colors.flow.js +2 -2
  283. package/__flow__/types/theme.flow.js +5 -5
  284. package/__flow__/utils/a11yTest.js +1 -1
  285. package/__flow__/utils/chartColors.js +1 -1
  286. package/__flow__/utils/constants.js +1 -1
  287. package/__flow__/utils/dataQaLabelQueries.js +2 -2
  288. package/__flow__/utils/hooks.js +17 -17
  289. package/__flow__/utils/index.js +4 -4
  290. package/__flow__/utils/innerText.js +9 -9
  291. package/__flow__/utils/mixins.js +6 -6
  292. package/__flow__/utils/react-testing-library.js +6 -6
  293. package/__flow__/utils/responsiveProps/index.js +3 -3
  294. package/__flow__/utils/responsiveProps/index.test.js +8 -8
  295. package/__flow__/utils/system-props.js +3 -3
  296. package/__flow__/utils/useInteractiveColor.js +5 -5
  297. package/__flow__/writing-good-stories.stories.mdx +3 -0
  298. package/bin/racine-codemod.js +12 -12
  299. package/codemods/__tests__/migrate-2.x-to-3.x.test.js +2 -2
  300. package/codemods/migrate-2.x-to-3.x.js +29 -30
  301. package/commonjs/Avatar/index.js +33 -53
  302. package/commonjs/Badge/constants.js +18 -15
  303. package/commonjs/Badge/index.js +14 -28
  304. package/commonjs/Badge/styles.js +3 -9
  305. package/commonjs/Banner/index.js +16 -37
  306. package/commonjs/Banner/styles.js +0 -5
  307. package/commonjs/Box/index.js +2 -9
  308. package/commonjs/Box/styles.js +0 -4
  309. package/commonjs/Breadcrumb/index.js +13 -29
  310. package/commonjs/Breadcrumb/styles.js +1 -4
  311. package/commonjs/Button/index.js +29 -43
  312. package/commonjs/Button/styles.js +6 -15
  313. package/commonjs/Card/index.js +16 -26
  314. package/commonjs/Card/styles.js +1 -5
  315. package/commonjs/CharacterCounter/index.js +6 -23
  316. package/commonjs/CharacterCounter/styles.js +0 -5
  317. package/commonjs/ChartLegend/index.js +5 -20
  318. package/commonjs/ChartLegend/styles.js +2 -11
  319. package/commonjs/Checkbox/index.js +30 -53
  320. package/commonjs/Checkbox/styles.js +14 -35
  321. package/commonjs/Collapsible/index.js +31 -54
  322. package/commonjs/Collapsible/styles.js +3 -6
  323. package/commonjs/DatePicker/DateRangePicker.js +4 -17
  324. package/commonjs/DatePicker/SingleDatePicker.js +3 -17
  325. package/commonjs/DatePicker/StatefulDateRangePicker.js +16 -31
  326. package/commonjs/DatePicker/StatefulSingleDatePicker.js +7 -20
  327. package/commonjs/DatePicker/common.js +8 -22
  328. package/commonjs/DatePicker/index.js +0 -5
  329. package/commonjs/DatePicker/styles.js +8 -25
  330. package/commonjs/Drawer/SlideTransition.js +8 -18
  331. package/commonjs/Drawer/index.js +51 -90
  332. package/commonjs/Drawer/styles.js +0 -8
  333. package/commonjs/EmptyState/index.js +8 -20
  334. package/commonjs/Fieldset/index.js +15 -32
  335. package/commonjs/Fieldset/styles.js +2 -7
  336. package/commonjs/FormField/index.js +19 -36
  337. package/commonjs/Icon/deprecatedIcons.js +36 -36
  338. package/commonjs/Icon/index.js +19 -37
  339. package/commonjs/Icon/styles.js +7 -16
  340. package/commonjs/IllustrationViewBoxes.js +1 -0
  341. package/commonjs/Image/index.js +13 -41
  342. package/commonjs/Image/styles.js +1 -7
  343. package/commonjs/Indicator/index.js +8 -26
  344. package/commonjs/Indicator/styles.js +1 -7
  345. package/commonjs/Input/index.js +80 -119
  346. package/commonjs/Input/styles.js +9 -19
  347. package/commonjs/KeyboardKey/index.js +3 -20
  348. package/commonjs/KeyboardKey/styles.js +0 -4
  349. package/commonjs/Label/index.js +7 -27
  350. package/commonjs/Link/constants.js +3 -4
  351. package/commonjs/Link/index.js +16 -28
  352. package/commonjs/Link/styles.js +1 -8
  353. package/commonjs/Listbox/index.js +15 -36
  354. package/commonjs/Loader/index.js +15 -31
  355. package/commonjs/Loader/styles.js +2 -13
  356. package/commonjs/LoaderButton/index.js +26 -55
  357. package/commonjs/Menu/constants.js +9 -8
  358. package/commonjs/Menu/descendants.js +70 -105
  359. package/commonjs/Menu/hooks.js +23 -41
  360. package/commonjs/Menu/index.flow.js +0 -7
  361. package/commonjs/Menu/index.js +94 -164
  362. package/commonjs/Menu/names.js +1 -1
  363. package/commonjs/Menu/styles.js +0 -6
  364. package/commonjs/Message/index.js +37 -70
  365. package/commonjs/Message/styles.js +9 -24
  366. package/commonjs/Modal/index.js +31 -54
  367. package/commonjs/Modal/styles.js +17 -36
  368. package/commonjs/Numeral/index.js +39 -67
  369. package/commonjs/Numeral/styles.js +0 -3
  370. package/commonjs/Numeral/tests/testNumeral.js +13 -31
  371. package/commonjs/OverflowList/index.flow.js +0 -2
  372. package/commonjs/OverflowList/index.js +27 -41
  373. package/commonjs/OverflowList/styles.js +0 -7
  374. package/commonjs/PartnerLogo/index.js +19 -33
  375. package/commonjs/PartnerLogo/styles.js +7 -15
  376. package/commonjs/Popout/index.js +95 -127
  377. package/commonjs/Popout/styles.js +0 -5
  378. package/commonjs/Portal/index.js +8 -31
  379. package/commonjs/Radio/index.js +18 -42
  380. package/commonjs/Radio/styles.js +9 -21
  381. package/commonjs/SegmentedControl/index.js +17 -37
  382. package/commonjs/SegmentedControl/styles.js +2 -12
  383. package/commonjs/Select/index.js +24 -47
  384. package/commonjs/Select/styles.js +12 -24
  385. package/commonjs/Skeleton/index.js +0 -5
  386. package/commonjs/SpotIllustration/illustrationNames.js +1 -1
  387. package/commonjs/SpotIllustration/index.js +5 -11
  388. package/commonjs/Stack/index.js +27 -42
  389. package/commonjs/Switch/index.js +17 -42
  390. package/commonjs/Switch/styles.js +3 -11
  391. package/commonjs/Table/index.js +26 -50
  392. package/commonjs/Table/styles.js +0 -4
  393. package/commonjs/TableCell/index.js +12 -30
  394. package/commonjs/TableCell/styles.js +0 -5
  395. package/commonjs/TableHeaderCell/index.js +27 -56
  396. package/commonjs/TableHeaderCell/styles.js +0 -6
  397. package/commonjs/TableRowAccordion/index.js +12 -37
  398. package/commonjs/TableRowAccordion/styles.js +2 -9
  399. package/commonjs/Tabs/index.js +16 -66
  400. package/commonjs/Tabs/styles.js +2 -11
  401. package/commonjs/Text/index.js +12 -25
  402. package/commonjs/Text/styles.js +1 -6
  403. package/commonjs/Textarea/index.js +31 -55
  404. package/commonjs/Textarea/styles.js +2 -9
  405. package/commonjs/ThemeProvider/index.js +1 -10
  406. package/commonjs/Toast/index.js +19 -42
  407. package/commonjs/Toast/styles.js +1 -7
  408. package/commonjs/ToggleHint/index.js +15 -39
  409. package/commonjs/ToggleHint/styles.js +2 -9
  410. package/commonjs/Token/index.js +15 -29
  411. package/commonjs/Token/styles.js +5 -12
  412. package/commonjs/TokenInput/index.js +70 -122
  413. package/commonjs/TokenInput/styles.js +1 -7
  414. package/commonjs/TokenInput/util.js +2 -7
  415. package/commonjs/Tooltip/index.js +40 -63
  416. package/commonjs/Tooltip/styles.js +1 -5
  417. package/commonjs/VisuallyHidden/index.js +0 -4
  418. package/commonjs/dataviz/index.js +0 -4
  419. package/commonjs/index.js +0 -129
  420. package/commonjs/systemProps/background.js +0 -1
  421. package/commonjs/systemProps/border.js +0 -1
  422. package/commonjs/systemProps/color.js +0 -1
  423. package/commonjs/systemProps/custom.js +0 -1
  424. package/commonjs/systemProps/flexbox.js +0 -1
  425. package/commonjs/systemProps/grid.js +0 -1
  426. package/commonjs/systemProps/index.js +0 -28
  427. package/commonjs/systemProps/layout.js +0 -1
  428. package/commonjs/systemProps/position.js +0 -1
  429. package/commonjs/systemProps/shadow.js +0 -1
  430. package/commonjs/systemProps/space.js +1 -2
  431. package/commonjs/systemProps/systemProps.js +0 -13
  432. package/commonjs/systemProps/tests/types.flow.js +25 -22
  433. package/commonjs/systemProps/typography.js +0 -1
  434. package/commonjs/systemProps/variant.js +2 -3
  435. package/commonjs/themes/dark/dataviz-palette.js +20 -22
  436. package/commonjs/themes/dark/decorative-palettes.js +0 -2
  437. package/commonjs/themes/dark/theme.js +13 -27
  438. package/commonjs/themes/extendedThemes/sproutTheme/dark/theme.js +2 -9
  439. package/commonjs/themes/extendedThemes/sproutTheme/index.js +0 -5
  440. package/commonjs/themes/extendedThemes/sproutTheme/light/theme.js +2 -9
  441. package/commonjs/themes/light/dataviz-palette.js +20 -22
  442. package/commonjs/themes/light/decorative-palettes.js +0 -2
  443. package/commonjs/themes/light/literal-colors.js +132 -134
  444. package/commonjs/themes/light/theme.js +43 -59
  445. package/commonjs/types/system-props.flow.js +1 -1
  446. package/commonjs/types/theme.colors.flow.js +0 -2
  447. package/commonjs/types/theme.flow.js +0 -1
  448. package/commonjs/utils/a11yTest.js +3 -10
  449. package/commonjs/utils/chartColors.js +0 -1
  450. package/commonjs/utils/constants.js +1 -1
  451. package/commonjs/utils/dataQaLabelQueries.js +12 -21
  452. package/commonjs/utils/hooks.js +39 -70
  453. package/commonjs/utils/index.js +2 -9
  454. package/commonjs/utils/innerText.js +10 -14
  455. package/commonjs/utils/mixins.js +2 -7
  456. package/commonjs/utils/react-testing-library.js +4 -26
  457. package/commonjs/utils/responsiveProps/index.js +1 -11
  458. package/commonjs/utils/system-props.js +2 -5
  459. package/commonjs/utils/useInteractiveColor.js +6 -8
  460. package/dist/illustration.svg +1 -1
  461. package/dist/illustrationList.js +1 -1
  462. package/lib/Avatar/index.js +40 -47
  463. package/lib/Badge/constants.js +19 -15
  464. package/lib/Badge/index.js +18 -25
  465. package/lib/Badge/styles.js +8 -6
  466. package/lib/Banner/index.js +20 -32
  467. package/lib/Banner/styles.js +3 -2
  468. package/lib/Box/index.js +4 -5
  469. package/lib/Box/styles.js +3 -2
  470. package/lib/Breadcrumb/index.js +19 -27
  471. package/lib/Breadcrumb/styles.js +3 -2
  472. package/lib/Button/index.js +31 -38
  473. package/lib/Button/styles.js +14 -11
  474. package/lib/Card/index.js +18 -24
  475. package/lib/Card/styles.js +5 -4
  476. package/lib/CharacterCounter/index.js +8 -20
  477. package/lib/CharacterCounter/styles.js +3 -2
  478. package/lib/ChartLegend/index.js +9 -17
  479. package/lib/ChartLegend/styles.js +5 -4
  480. package/lib/Checkbox/index.js +32 -51
  481. package/lib/Checkbox/styles.js +21 -26
  482. package/lib/Collapsible/index.js +36 -51
  483. package/lib/Collapsible/styles.js +6 -5
  484. package/lib/DatePicker/DateRangePicker.js +8 -14
  485. package/lib/DatePicker/SingleDatePicker.js +7 -13
  486. package/lib/DatePicker/StatefulDateRangePicker.js +19 -26
  487. package/lib/DatePicker/StatefulSingleDatePicker.js +9 -15
  488. package/lib/DatePicker/common.js +14 -13
  489. package/lib/DatePicker/index.js +2 -2
  490. package/lib/DatePicker/styles.js +12 -22
  491. package/lib/Drawer/SlideTransition.js +11 -14
  492. package/lib/Drawer/index.js +64 -88
  493. package/lib/Drawer/styles.js +4 -3
  494. package/lib/EmptyState/index.js +11 -17
  495. package/lib/Fieldset/index.js +19 -29
  496. package/lib/Fieldset/styles.js +5 -4
  497. package/lib/FormField/index.js +27 -33
  498. package/lib/Icon/deprecatedIcons.js +36 -36
  499. package/lib/Icon/index.js +25 -34
  500. package/lib/Icon/styles.js +11 -13
  501. package/lib/IllustrationViewBoxes.js +1 -0
  502. package/lib/Image/index.js +15 -38
  503. package/lib/Image/styles.js +4 -4
  504. package/lib/Indicator/index.js +11 -23
  505. package/lib/Indicator/styles.js +5 -5
  506. package/lib/Input/index.js +87 -115
  507. package/lib/Input/styles.js +13 -15
  508. package/lib/KeyboardKey/index.js +6 -17
  509. package/lib/KeyboardKey/styles.js +3 -2
  510. package/lib/Label/index.js +10 -24
  511. package/lib/Link/constants.js +5 -4
  512. package/lib/Link/index.js +18 -25
  513. package/lib/Link/styles.js +6 -5
  514. package/lib/Listbox/index.js +21 -29
  515. package/lib/Loader/index.js +17 -29
  516. package/lib/Loader/styles.js +6 -8
  517. package/lib/LoaderButton/index.js +34 -51
  518. package/lib/Menu/constants.js +10 -8
  519. package/lib/Menu/descendants.js +73 -94
  520. package/lib/Menu/hooks.js +28 -39
  521. package/lib/Menu/index.flow.js +6 -5
  522. package/lib/Menu/index.js +113 -150
  523. package/lib/Menu/names.js +1 -1
  524. package/lib/Menu/styles.js +4 -3
  525. package/lib/Message/index.js +42 -66
  526. package/lib/Message/styles.js +15 -23
  527. package/lib/Modal/index.js +38 -51
  528. package/lib/Modal/styles.js +23 -32
  529. package/lib/Numeral/index.js +45 -64
  530. package/lib/Numeral/styles.js +3 -2
  531. package/lib/Numeral/tests/testNumeral.js +17 -27
  532. package/lib/OverflowList/index.flow.js +2 -1
  533. package/lib/OverflowList/index.js +31 -38
  534. package/lib/OverflowList/styles.js +5 -4
  535. package/lib/PartnerLogo/index.js +23 -31
  536. package/lib/PartnerLogo/styles.js +11 -12
  537. package/lib/Popout/index.js +105 -121
  538. package/lib/Popout/styles.js +3 -3
  539. package/lib/Portal/index.js +11 -29
  540. package/lib/Radio/index.js +20 -40
  541. package/lib/Radio/styles.js +14 -14
  542. package/lib/SegmentedControl/index.js +21 -34
  543. package/lib/SegmentedControl/styles.js +7 -9
  544. package/lib/Select/index.js +27 -44
  545. package/lib/Select/styles.js +16 -20
  546. package/lib/Skeleton/index.js +7 -4
  547. package/lib/SpotIllustration/illustrationNames.js +2 -1
  548. package/lib/SpotIllustration/index.js +9 -10
  549. package/lib/Stack/index.js +31 -39
  550. package/lib/Switch/index.js +21 -39
  551. package/lib/Switch/styles.js +8 -7
  552. package/lib/Table/index.js +30 -40
  553. package/lib/Table/styles.js +3 -2
  554. package/lib/TableCell/index.js +14 -27
  555. package/lib/TableCell/styles.js +3 -3
  556. package/lib/TableHeaderCell/index.js +30 -52
  557. package/lib/TableHeaderCell/styles.js +3 -2
  558. package/lib/TableRowAccordion/index.js +16 -34
  559. package/lib/TableRowAccordion/styles.js +5 -3
  560. package/lib/Tabs/index.js +18 -63
  561. package/lib/Tabs/styles.js +6 -6
  562. package/lib/Text/index.js +15 -21
  563. package/lib/Text/styles.js +4 -3
  564. package/lib/Textarea/index.js +33 -53
  565. package/lib/Textarea/styles.js +6 -5
  566. package/lib/ThemeProvider/index.js +4 -7
  567. package/lib/Toast/index.js +26 -37
  568. package/lib/Toast/styles.js +5 -4
  569. package/lib/ToggleHint/index.js +18 -36
  570. package/lib/ToggleHint/styles.js +6 -5
  571. package/lib/Token/index.js +20 -26
  572. package/lib/Token/styles.js +10 -9
  573. package/lib/TokenInput/index.js +78 -118
  574. package/lib/TokenInput/styles.js +5 -4
  575. package/lib/TokenInput/util.js +5 -3
  576. package/lib/Tooltip/index.js +45 -60
  577. package/lib/Tooltip/styles.js +4 -4
  578. package/lib/VisuallyHidden/index.js +3 -2
  579. package/lib/dataviz/index.js +4 -3
  580. package/lib/index.js +66 -64
  581. package/lib/systemProps/background.js +3 -1
  582. package/lib/systemProps/border.js +3 -1
  583. package/lib/systemProps/color.js +3 -1
  584. package/lib/systemProps/custom.js +3 -1
  585. package/lib/systemProps/flexbox.js +3 -1
  586. package/lib/systemProps/grid.js +3 -1
  587. package/lib/systemProps/index.js +16 -14
  588. package/lib/systemProps/layout.js +3 -1
  589. package/lib/systemProps/position.js +3 -1
  590. package/lib/systemProps/shadow.js +3 -1
  591. package/lib/systemProps/space.js +2 -1
  592. package/lib/systemProps/systemProps.js +14 -13
  593. package/lib/systemProps/tests/types.flow.js +27 -22
  594. package/lib/systemProps/typography.js +3 -1
  595. package/lib/systemProps/variant.js +4 -3
  596. package/lib/themes/dark/dataviz-palette.js +23 -21
  597. package/lib/themes/dark/decorative-palettes.js +3 -1
  598. package/lib/themes/dark/theme.js +20 -23
  599. package/lib/themes/extendedThemes/sproutTheme/dark/theme.js +4 -7
  600. package/lib/themes/extendedThemes/sproutTheme/index.js +3 -2
  601. package/lib/themes/extendedThemes/sproutTheme/light/theme.js +4 -7
  602. package/lib/themes/light/dataviz-palette.js +23 -21
  603. package/lib/themes/light/decorative-palettes.js +3 -1
  604. package/lib/themes/light/literal-colors.js +135 -133
  605. package/lib/themes/light/theme.js +54 -55
  606. package/lib/types/system-props.flow.js +1 -1
  607. package/lib/types/theme.colors.flow.js +4 -2
  608. package/lib/types/theme.flow.js +3 -2
  609. package/lib/utils/a11yTest.js +5 -8
  610. package/lib/utils/chartColors.js +3 -1
  611. package/lib/utils/constants.js +3 -1
  612. package/lib/utils/dataQaLabelQueries.js +13 -21
  613. package/lib/utils/hooks.js +41 -64
  614. package/lib/utils/index.js +2 -5
  615. package/lib/utils/innerText.js +12 -14
  616. package/lib/utils/mixins.js +6 -5
  617. package/lib/utils/react-testing-library.js +10 -20
  618. package/lib/utils/responsiveProps/index.js +3 -8
  619. package/lib/utils/system-props.js +4 -3
  620. package/lib/utils/useInteractiveColor.js +10 -9
  621. package/package.json +6 -13
@@ -2,17 +2,11 @@
2
2
 
3
3
  exports.__esModule = true;
4
4
  exports.default = void 0;
5
-
6
5
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
7
-
8
6
  var _systemProps = require("../utils/system-props");
9
-
10
7
  var _mixins = require("../utils/mixins");
11
-
12
8
  var _useInteractiveColor = require("../utils/useInteractiveColor");
13
-
14
9
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
-
16
10
  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; }
17
11
 
18
12
  var Container = _styledComponents.default.button.withConfig({
@@ -23,21 +17,20 @@ var Container = _styledComponents.default.button.withConfig({
23
17
  return (0, _styledComponents.css)(["", " font-family:", ";font-weight:", ";border:1px solid ", ";border-radius:", ";color:", ";background:", ";padding:", " ", ";transition:all ", " ", ";"], theme.typography[200], theme.fontFamily, theme.fontWeights.normal, theme.colors.container.border.base, theme.radii[500], theme.colors.text.body, theme.colors.container.background.base, theme.space[200], theme.space[300], theme.duration.fast, theme.easing.ease_inout);
24
18
  }, _mixins.focusRing, function (_ref2) {
25
19
  var closeable = _ref2.closeable,
26
- theme = _ref2.theme;
20
+ theme = _ref2.theme;
27
21
  return closeable && (0, _styledComponents.css)(["cursor:pointer;&:hover,&:active{box-shadow:", ";border:1px solid ", ";}"], theme.shadows.low, (0, _useInteractiveColor.useInteractiveColor)(theme.colors.container.border.base));
28
22
  }, function (_ref3) {
29
23
  var theme = _ref3.theme,
30
- palette = _ref3.palette;
31
- return palette === "blue" && (0, _styledComponents.css)(["color:", ";background:", ";border:1px solid ", ";&:hover,&:active{cursor:pointer;box-shadow:", ";border:1px solid ", ";}"], theme.colors.text.body, theme.colors.container.background.decorative.blue, theme.colors.container.border.decorative.blue, theme.shadows.low, (0, _useInteractiveColor.useInteractiveColor)(theme.colors.container.border.decorative.blue));
24
+ palette = _ref3.palette;
25
+ return palette === 'blue' && (0, _styledComponents.css)(["color:", ";background:", ";border:1px solid ", ";&:hover,&:active{cursor:pointer;box-shadow:", ";border:1px solid ", ";}"], theme.colors.text.body, theme.colors.container.background.decorative.blue, theme.colors.container.border.decorative.blue, theme.shadows.low, (0, _useInteractiveColor.useInteractiveColor)(theme.colors.container.border.decorative.blue));
32
26
  }, function (_ref4) {
33
27
  var disabled = _ref4.disabled,
34
- theme = _ref4.theme;
28
+ theme = _ref4.theme;
35
29
  return disabled && (0, _styledComponents.css)(["opacity:0.4;cursor:not-allowed;&:hover,&:active{box-shadow:none;border:1px solid ", ";}"], theme.colors.container.border.base);
36
30
  }, function (_ref5) {
37
31
  var valid = _ref5.valid,
38
- theme = _ref5.theme;
32
+ theme = _ref5.theme;
39
33
  return !valid && (0, _styledComponents.css)(["color:", ";background:", ";border:1px solid ", ";&:hover{box-shadow:", ";border:1px solid ", ";}"], theme.colors.text.error, theme.colors.container.background.error, theme.colors.container.border.error, theme.shadows.low, (0, _useInteractiveColor.useInteractiveColor)(theme.colors.container.border.error));
40
34
  }, _systemProps.COMMON);
41
-
42
35
  var _default = Container;
43
36
  exports.default = _default;
@@ -2,151 +2,115 @@
2
2
 
3
3
  exports.__esModule = true;
4
4
  exports.default = void 0;
5
-
6
5
  var React = _interopRequireWildcard(require("react"));
7
-
8
6
  var _styles = _interopRequireDefault(require("./styles"));
9
-
10
7
  var _util = require("./util");
11
-
12
8
  var _styles2 = require("../Input/styles");
13
-
14
9
  var _Box = _interopRequireDefault(require("../Box"));
15
-
16
10
  var _Icon = _interopRequireDefault(require("../Icon"));
17
-
18
11
  var _Token = _interopRequireDefault(require("../Token"));
19
-
20
12
  var _excluded = ["autoFocus", "autocomplete", "disabled", "isInvalid", "hasWarning", "id", "name", "placeholder", "required", "value", "elemBefore", "elemAfter", "maxLength", "ariaDescribedby", "ariaLabel", "innerRef", "onAddToken", "onRemoveToken", "onChangeTokens", "onClickToken", "onBlur", "onChange", "onFocus", "onKeyDown", "onKeyUp", "onPaste", "inputProps", "qa", "tokens"];
21
-
22
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
-
24
14
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
25
-
26
15
  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; }
27
-
28
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
29
-
16
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
30
17
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
31
-
32
18
  function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
33
-
34
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
35
-
36
- var DefaultDelimiters = [",", "Enter"];
37
- var ControlledPropNames = ["value", "hasFocus", "activeToken"];
38
-
19
+ function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
20
+ var DefaultDelimiters = [',', 'Enter'];
21
+ var ControlledPropNames = ['value', 'hasFocus', 'activeToken'];
39
22
  var TokenInput = /*#__PURE__*/function (_React$Component) {
40
23
  _inheritsLoose(TokenInput, _React$Component);
41
-
42
24
  function TokenInput(props) {
43
25
  var _this;
44
-
45
26
  _this = _React$Component.call(this, props) || this;
46
27
  _this.delimiterMatcher = void 0;
47
-
48
28
  _this.handleChangeText = function (e) {
49
29
  var value = e.currentTarget.value;
50
30
  var onChange = _this.props.onChange;
51
-
52
31
  _this.setState({
53
32
  value: value
54
33
  });
55
-
56
34
  onChange == null ? void 0 : onChange(e, value);
57
35
  };
58
-
59
36
  _this.handleFocus = function (e) {
60
37
  var onFocus = _this.props.onFocus;
61
-
62
38
  _this.setState({
63
39
  hasFocus: true
64
40
  });
65
-
66
41
  onFocus == null ? void 0 : onFocus(e);
67
42
  };
68
-
69
43
  _this.handleBlur = function (e) {
70
44
  var onBlur = _this.props.onBlur;
71
45
  if (onBlur) onBlur(e);
72
-
73
46
  _this.setState({
74
47
  hasFocus: false
75
48
  });
76
49
  };
77
-
78
50
  _this.handleKeyUp = function (e) {
79
51
  _this.props.onKeyUp == null ? void 0 : _this.props.onKeyUp(e, e.currentTarget.value);
80
52
  };
81
-
82
53
  _this.handleKeyDown = function (e) {
83
54
  var onKeyDown = _this.props.onKeyDown;
84
55
  var key = e.key,
85
- currentTarget = e.currentTarget;
56
+ currentTarget = e.currentTarget;
86
57
  var text = currentTarget.value;
87
- if (onKeyDown) onKeyDown(e, text); // keyPress event runs before change
58
+ if (onKeyDown) onKeyDown(e, text);
59
+
60
+ // keyPress event runs before change
88
61
  // Prevent event from bubbling up and calling change, which can lead to comma in value
89
62
 
90
63
  if (_this.isDelimiter(key)) {
91
64
  if (text) {
92
65
  _this.spawnNewTokens([text]);
93
-
94
66
  e.preventDefault();
95
67
  }
96
- } else if (key === "Backspace") {
97
- if (text === "") {
68
+ } else if (key === 'Backspace') {
69
+ if (text === '') {
98
70
  _this.deleteToken();
99
71
  }
100
72
  }
101
73
  };
102
-
103
74
  _this.handlePaste = function (e) {
104
- var text = e.clipboardData.getData("text");
75
+ var text = e.clipboardData.getData('text');
105
76
  var onPaste = _this.props.onPaste;
106
77
  if (onPaste) onPaste(e, text);
107
78
  var subtexts = text.split(_this.delimiterMatcher);
108
79
  var texts = subtexts.filter(function (subtext) {
109
80
  return subtext.length;
110
81
  });
111
-
112
82
  if (texts.length > 1) {
113
83
  _this.spawnNewTokens(texts);
114
-
115
84
  e.preventDefault();
116
85
  }
117
86
  };
118
-
119
87
  _this.handleClickToken = function (e, token) {
120
88
  var _this$props = _this.props,
121
- onClickToken = _this$props.onClickToken,
122
- disabled = _this$props.disabled;
89
+ onClickToken = _this$props.onClickToken,
90
+ disabled = _this$props.disabled;
123
91
  if (onClickToken) onClickToken(e, token.id);
124
-
125
92
  if (!disabled) {
126
93
  _this.deleteToken(token.id);
127
94
  }
128
95
  };
129
-
130
96
  var hasFocus = props.hasFocus,
131
- activeToken = props.activeToken,
132
- _value = props.value,
133
- delimiters = props.delimiters;
97
+ activeToken = props.activeToken,
98
+ _value = props.value,
99
+ delimiters = props.delimiters;
134
100
  _this.delimiterMatcher = (0, _util.delimitersAsRegExp)(delimiters || DefaultDelimiters);
135
101
  _this.state = {
136
102
  prevProps: props,
137
103
  hasFocus: hasFocus || false,
138
104
  activeToken: activeToken,
139
- value: _value || ""
105
+ value: _value || ''
140
106
  };
141
107
  return _this;
142
108
  }
143
-
144
109
  TokenInput.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
145
110
  var prevProps = state.prevProps;
146
111
  var modifiedState = {};
147
112
  ControlledPropNames.forEach(function (propName) {
148
113
  var currentProp = props[propName];
149
-
150
114
  if (currentProp !== prevProps[propName]) {
151
115
  modifiedState[propName] = currentProp;
152
116
  }
@@ -154,48 +118,41 @@ var TokenInput = /*#__PURE__*/function (_React$Component) {
154
118
  modifiedState.prevProps = props;
155
119
  return modifiedState;
156
120
  };
157
-
158
121
  var _proto = TokenInput.prototype;
159
-
160
122
  _proto.isDelimiter = function isDelimiter(keyName) {
161
123
  var _this$props$delimiter = this.props.delimiters,
162
- delimiters = _this$props$delimiter === void 0 ? DefaultDelimiters : _this$props$delimiter;
124
+ delimiters = _this$props$delimiter === void 0 ? DefaultDelimiters : _this$props$delimiter;
163
125
  return delimiters.includes(keyName);
164
126
  };
165
-
166
127
  _proto.spawnNewTokens = function spawnNewTokens(texts) {
167
128
  var _this$props2 = this.props,
168
- onAddToken = _this$props2.onAddToken,
169
- onChangeTokens = _this$props2.onChangeTokens,
170
- _this$props2$tokenMax = _this$props2.tokenMaxLength,
171
- max = _this$props2$tokenMax === void 0 ? Infinity : _this$props2$tokenMax,
172
- _this$props2$tokens = _this$props2.tokens,
173
- tokens = _this$props2$tokens === void 0 ? [] : _this$props2$tokens;
129
+ onAddToken = _this$props2.onAddToken,
130
+ onChangeTokens = _this$props2.onChangeTokens,
131
+ _this$props2$tokenMax = _this$props2.tokenMaxLength,
132
+ max = _this$props2$tokenMax === void 0 ? Infinity : _this$props2$tokenMax,
133
+ _this$props2$tokens = _this$props2.tokens,
134
+ tokens = _this$props2$tokens === void 0 ? [] : _this$props2$tokens;
174
135
  var tokenSpecs = texts.map(function (text) {
175
136
  return (0, _util.asTokenSpec)(text.slice(0, max));
176
137
  });
177
-
178
138
  if (onAddToken) {
179
139
  tokenSpecs.forEach(onAddToken);
180
140
  } else if (onChangeTokens) {
181
141
  onChangeTokens(tokens.concat(tokenSpecs));
182
142
  }
183
-
184
143
  this.setState({
185
- value: ""
144
+ value: ''
186
145
  });
187
146
  };
188
-
189
147
  _proto.deleteToken = function deleteToken(tokenId) {
190
148
  var _this$props3 = this.props,
191
- onRemoveToken = _this$props3.onRemoveToken,
192
- onChangeTokens = _this$props3.onChangeTokens,
193
- _this$props3$tokens = _this$props3.tokens,
194
- tokens = _this$props3$tokens === void 0 ? [] : _this$props3$tokens;
149
+ onRemoveToken = _this$props3.onRemoveToken,
150
+ onChangeTokens = _this$props3.onChangeTokens,
151
+ _this$props3$tokens = _this$props3.tokens,
152
+ tokens = _this$props3$tokens === void 0 ? [] : _this$props3$tokens;
195
153
  var count = tokens.length;
196
154
  if (count === 0) return;
197
155
  var id = tokenId != null ? tokenId : tokens[count - 1].id;
198
-
199
156
  if (onRemoveToken) {
200
157
  onRemoveToken(id);
201
158
  } else if (onChangeTokens) {
@@ -203,23 +160,20 @@ var TokenInput = /*#__PURE__*/function (_React$Component) {
203
160
  return tokenSpec.id !== id;
204
161
  }));
205
162
  }
206
-
207
163
  this.setState({
208
- value: ""
164
+ value: ''
209
165
  });
210
166
  };
211
-
212
167
  _proto.renderToken = function renderToken(token) {
213
168
  var _this2 = this;
214
-
215
169
  var _this$props4 = this.props,
216
- defaultIconName = _this$props4.iconName,
217
- disabled = _this$props4.disabled;
170
+ defaultIconName = _this$props4.iconName,
171
+ disabled = _this$props4.disabled;
218
172
  var activeId = this.state.activeToken;
219
173
  var id = token.id,
220
- tokenIconName = token.iconName,
221
- value = token.value,
222
- valid = token.valid;
174
+ tokenIconName = token.iconName,
175
+ value = token.value,
176
+ valid = token.valid;
223
177
  var iconName = tokenIconName || defaultIconName;
224
178
  var isActive = activeId === id;
225
179
  return /*#__PURE__*/React.createElement(_Token.default, {
@@ -239,10 +193,8 @@ var TokenInput = /*#__PURE__*/function (_React$Component) {
239
193
  pr: 300
240
194
  }), value));
241
195
  };
242
-
243
196
  _proto.renderTokens = function renderTokens(tokens) {
244
197
  var _this3 = this;
245
-
246
198
  return tokens.map(function (token) {
247
199
  return /*#__PURE__*/React.createElement("div", {
248
200
  key: token.id,
@@ -250,42 +202,40 @@ var TokenInput = /*#__PURE__*/function (_React$Component) {
250
202
  }, _this3.renderToken(token));
251
203
  });
252
204
  };
253
-
254
205
  _proto.render = function render() {
255
206
  var _this$props5 = this.props,
256
- autoFocus = _this$props5.autoFocus,
257
- autocomplete = _this$props5.autocomplete,
258
- disabled = _this$props5.disabled,
259
- isInvalid = _this$props5.isInvalid,
260
- hasWarning = _this$props5.hasWarning,
261
- id = _this$props5.id,
262
- name = _this$props5.name,
263
- placeholder = _this$props5.placeholder,
264
- required = _this$props5.required,
265
- value = _this$props5.value,
266
- elemBefore = _this$props5.elemBefore,
267
- elemAfter = _this$props5.elemAfter,
268
- maxLength = _this$props5.maxLength,
269
- ariaDescribedby = _this$props5.ariaDescribedby,
270
- ariaLabel = _this$props5.ariaLabel,
271
- innerRef = _this$props5.innerRef,
272
- onAddToken = _this$props5.onAddToken,
273
- onRemoveToken = _this$props5.onRemoveToken,
274
- onChangeTokens = _this$props5.onChangeTokens,
275
- onClickToken = _this$props5.onClickToken,
276
- onBlur = _this$props5.onBlur,
277
- onChange = _this$props5.onChange,
278
- onFocus = _this$props5.onFocus,
279
- onKeyDown = _this$props5.onKeyDown,
280
- onKeyUp = _this$props5.onKeyUp,
281
- onPaste = _this$props5.onPaste,
282
- _this$props5$inputPro = _this$props5.inputProps,
283
- inputProps = _this$props5$inputPro === void 0 ? {} : _this$props5$inputPro,
284
- _this$props5$qa = _this$props5.qa,
285
- qa = _this$props5$qa === void 0 ? {} : _this$props5$qa,
286
- tokens = _this$props5.tokens,
287
- rest = _objectWithoutPropertiesLoose(_this$props5, _excluded);
288
-
207
+ autoFocus = _this$props5.autoFocus,
208
+ autocomplete = _this$props5.autocomplete,
209
+ disabled = _this$props5.disabled,
210
+ isInvalid = _this$props5.isInvalid,
211
+ hasWarning = _this$props5.hasWarning,
212
+ id = _this$props5.id,
213
+ name = _this$props5.name,
214
+ placeholder = _this$props5.placeholder,
215
+ required = _this$props5.required,
216
+ value = _this$props5.value,
217
+ elemBefore = _this$props5.elemBefore,
218
+ elemAfter = _this$props5.elemAfter,
219
+ maxLength = _this$props5.maxLength,
220
+ ariaDescribedby = _this$props5.ariaDescribedby,
221
+ ariaLabel = _this$props5.ariaLabel,
222
+ innerRef = _this$props5.innerRef,
223
+ onAddToken = _this$props5.onAddToken,
224
+ onRemoveToken = _this$props5.onRemoveToken,
225
+ onChangeTokens = _this$props5.onChangeTokens,
226
+ onClickToken = _this$props5.onClickToken,
227
+ onBlur = _this$props5.onBlur,
228
+ onChange = _this$props5.onChange,
229
+ onFocus = _this$props5.onFocus,
230
+ onKeyDown = _this$props5.onKeyDown,
231
+ onKeyUp = _this$props5.onKeyUp,
232
+ onPaste = _this$props5.onPaste,
233
+ _this$props5$inputPro = _this$props5.inputProps,
234
+ inputProps = _this$props5$inputPro === void 0 ? {} : _this$props5$inputPro,
235
+ _this$props5$qa = _this$props5.qa,
236
+ qa = _this$props5$qa === void 0 ? {} : _this$props5$qa,
237
+ tokens = _this$props5.tokens,
238
+ rest = _objectWithoutPropertiesLoose(_this$props5, _excluded);
289
239
  var state = this.state;
290
240
  return /*#__PURE__*/React.createElement(_styles.default, _extends({
291
241
  hasBeforeElement: !!elemBefore,
@@ -293,8 +243,8 @@ var TokenInput = /*#__PURE__*/function (_React$Component) {
293
243
  disabled: disabled,
294
244
  invalid: !!isInvalid,
295
245
  warning: hasWarning,
296
- focused: state.hasFocus // $FlowIssue - upgrade v0.112.0
297
-
246
+ focused: state.hasFocus
247
+ // $FlowIssue - upgrade v0.112.0
298
248
  }, rest), elemBefore && /*#__PURE__*/React.createElement(_styles2.Accessory, {
299
249
  before: true
300
250
  }, elemBefore), tokens && this.renderTokens(tokens), /*#__PURE__*/React.createElement("input", _extends({
@@ -318,15 +268,13 @@ var TokenInput = /*#__PURE__*/function (_React$Component) {
318
268
  onKeyUp: this.handleKeyUp,
319
269
  onPaste: this.handlePaste,
320
270
  ref: innerRef,
321
- "data-qa-input": name || "",
271
+ "data-qa-input": name || '',
322
272
  "data-qa-input-isdisabled": !!disabled,
323
273
  "data-qa-input-isrequired": !!required
324
274
  }, qa, inputProps)), elemAfter && /*#__PURE__*/React.createElement(_styles2.Accessory, {
325
275
  after: true
326
276
  }, elemAfter));
327
277
  };
328
-
329
278
  return TokenInput;
330
279
  }(React.Component);
331
-
332
280
  exports.default = TokenInput;
@@ -2,15 +2,10 @@
2
2
 
3
3
  exports.__esModule = true;
4
4
  exports.default = void 0;
5
-
6
5
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
7
-
8
6
  var _systemProps = require("../utils/system-props");
9
-
10
7
  var _mixins = require("../utils/mixins");
11
-
12
8
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
13
-
14
9
  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; }
15
10
 
16
11
  var Container = _styledComponents.default.div.withConfig({
@@ -81,7 +76,6 @@ var Container = _styledComponents.default.div.withConfig({
81
76
  return props.theme.colors.form.border.warning;
82
77
  });
83
78
  }, _systemProps.COMMON);
84
-
85
- Container.displayName = "TokenInputContainer";
79
+ Container.displayName = 'TokenInputContainer';
86
80
  var _default = Container;
87
81
  exports.default = _default;
@@ -2,9 +2,7 @@
2
2
 
3
3
  exports.__esModule = true;
4
4
  exports.delimitersAsRegExp = exports.asTokenSpec = void 0;
5
-
6
5
  var _lodash = _interopRequireDefault(require("lodash.uniqueid"));
7
-
8
6
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
7
 
10
8
  var asTokenSpec = function asTokenSpec(text) {
@@ -13,18 +11,15 @@ var asTokenSpec = function asTokenSpec(text) {
13
11
  value: text.trim()
14
12
  };
15
13
  };
16
-
17
14
  exports.asTokenSpec = asTokenSpec;
18
15
  var KeyNameToRegExpChar = {
19
- Enter: "\\n"
16
+ Enter: '\\n'
20
17
  };
21
-
22
18
  var delimitersAsRegExp = function delimitersAsRegExp(delimiters) {
23
19
  if (!delimiters) return /[,\n]/;
24
20
  var chars = delimiters.map(function (key) {
25
21
  return KeyNameToRegExpChar[key] || key;
26
- }).join("");
22
+ }).join('');
27
23
  return RegExp("[" + chars + "]");
28
24
  };
29
-
30
25
  exports.delimitersAsRegExp = delimitersAsRegExp;
@@ -2,30 +2,18 @@
2
2
 
3
3
  exports.__esModule = true;
4
4
  exports.default = void 0;
5
-
6
5
  var React = _interopRequireWildcard(require("react"));
7
-
8
6
  var _styles = require("./styles");
9
-
10
7
  var _Popout = _interopRequireDefault(require("../Popout"));
11
-
12
8
  var _seedsMotionUnitless = _interopRequireDefault(require("@sproutsocial/seeds-motion/dist/seeds-motion-unitless"));
13
-
14
9
  var _excluded = ["content", "children", "enterDelay", "placement", "appearance", "zIndex", "qa", "popoutProps", "truncated"],
15
- _excluded2 = ["appearance", "children"];
16
-
10
+ _excluded2 = ["appearance", "children"];
17
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
18
-
19
12
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
20
-
21
13
  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; }
22
-
23
14
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
24
-
25
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
26
-
15
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
16
  var idCounter = 0;
28
-
29
17
  var wrapContent = function wrapContent(content, show, hide, Wrapper, appearance, ariaProps, wrapperStyles) {
30
18
  return /*#__PURE__*/React.createElement(Wrapper, _extends({
31
19
  appearance: appearance,
@@ -36,50 +24,41 @@ var wrapContent = function wrapContent(content, show, hide, Wrapper, appearance,
36
24
  style: Object.keys(wrapperStyles).length === 0 ? undefined : wrapperStyles
37
25
  }, ariaProps), /*#__PURE__*/React.isValidElement(content) ? /*#__PURE__*/React.cloneElement(content) : content);
38
26
  };
39
-
40
27
  var Tooltip = function Tooltip(_ref) {
41
28
  var content = _ref.content,
42
- children = _ref.children,
43
- _ref$enterDelay = _ref.enterDelay,
44
- enterDelay = _ref$enterDelay === void 0 ? _seedsMotionUnitless.default.MOTION_DURATION_FAST * 1000 : _ref$enterDelay,
45
- _ref$placement = _ref.placement,
46
- placement = _ref$placement === void 0 ? "auto" : _ref$placement,
47
- appearance = _ref.appearance,
48
- _ref$zIndex = _ref.zIndex,
49
- zIndex = _ref$zIndex === void 0 ? 7 : _ref$zIndex,
50
- qa = _ref.qa,
51
- popoutProps = _ref.popoutProps,
52
- _ref$truncated = _ref.truncated,
53
- truncated = _ref$truncated === void 0 ? false : _ref$truncated,
54
- rest = _objectWithoutPropertiesLoose(_ref, _excluded);
55
-
29
+ children = _ref.children,
30
+ _ref$enterDelay = _ref.enterDelay,
31
+ enterDelay = _ref$enterDelay === void 0 ? _seedsMotionUnitless.default.MOTION_DURATION_FAST * 1000 : _ref$enterDelay,
32
+ _ref$placement = _ref.placement,
33
+ placement = _ref$placement === void 0 ? 'auto' : _ref$placement,
34
+ appearance = _ref.appearance,
35
+ _ref$zIndex = _ref.zIndex,
36
+ zIndex = _ref$zIndex === void 0 ? 7 : _ref$zIndex,
37
+ qa = _ref.qa,
38
+ popoutProps = _ref.popoutProps,
39
+ _ref$truncated = _ref.truncated,
40
+ truncated = _ref$truncated === void 0 ? false : _ref$truncated,
41
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded);
56
42
  var _useState = (0, React.useState)(false),
57
- shouldShow = _useState[0],
58
- setShouldShow = _useState[1];
59
-
43
+ shouldShow = _useState[0],
44
+ setShouldShow = _useState[1];
60
45
  var _useState2 = (0, React.useState)(false),
61
- isOpen = _useState2[0],
62
- setIsOpen = _useState2[1];
63
-
46
+ isOpen = _useState2[0],
47
+ setIsOpen = _useState2[1];
64
48
  var _useState3 = (0, React.useState)("Racine-tooltip-" + idCounter++),
65
- id = _useState3[0];
66
-
49
+ id = _useState3[0];
67
50
  var isInvalidContent = content === null || content === undefined;
68
-
69
51
  var show = function show() {
70
52
  return setShouldShow(true);
71
53
  };
72
-
73
54
  var hide = function hide() {
74
55
  return setShouldShow(false);
75
56
  };
76
-
77
57
  var exitDelay = _seedsMotionUnitless.default.MOTION_DURATION_FAST * 1000;
78
- var defaultAppearance = appearance || (typeof content === "object" ? "box" : "pill");
79
- var shouldTooltipContentsBeInteractive = defaultAppearance === "box";
58
+ var defaultAppearance = appearance || (typeof content === 'object' ? 'box' : 'pill');
59
+ var shouldTooltipContentsBeInteractive = defaultAppearance === 'box';
80
60
  (0, React.useEffect)(function () {
81
61
  var timeout;
82
-
83
62
  if (shouldShow) {
84
63
  timeout = setTimeout(function () {
85
64
  return setIsOpen(true);
@@ -89,58 +68,56 @@ var Tooltip = function Tooltip(_ref) {
89
68
  return setIsOpen(false);
90
69
  }, exitDelay);
91
70
  }
92
-
93
71
  return function () {
94
72
  return clearTimeout(timeout);
95
73
  };
96
74
  }, [isOpen, shouldShow, enterDelay, exitDelay]);
97
- var wrappedContent = wrapContent( // $FlowIssue - https://github.com/facebook/flow/issues/6392
75
+ var wrappedContent = wrapContent(
76
+ // $FlowIssue - https://github.com/facebook/flow/issues/6392
98
77
  content, shouldTooltipContentsBeInteractive ? show : undefined, shouldTooltipContentsBeInteractive ? hide : undefined, Content, defaultAppearance, _extends({
99
78
  id: id
100
79
  }, rest), {});
101
80
  var ariaPropsForWrappedChildren = isOpen ? {
102
- "aria-describedby": id
81
+ 'aria-describedby': id
103
82
  } : {};
104
83
  var wrapperStylesForWrappedChildren = truncated ? {
105
- overflow: "hidden",
106
- textOverflow: "ellipsis",
107
- whiteSpace: "nowrap"
84
+ overflow: 'hidden',
85
+ textOverflow: 'ellipsis',
86
+ whiteSpace: 'nowrap'
108
87
  } : {};
109
- var wrappedChildren = wrapContent( // $FlowIssue - https://github.com/facebook/flow/issues/6392
110
- children, show, hide, "span", defaultAppearance, ariaPropsForWrappedChildren, wrapperStylesForWrappedChildren);
88
+ var wrappedChildren = wrapContent(
89
+ // $FlowIssue - https://github.com/facebook/flow/issues/6392
90
+ children, show, hide, 'span', defaultAppearance, ariaPropsForWrappedChildren, wrapperStylesForWrappedChildren);
111
91
  return /*#__PURE__*/React.createElement(_Popout.default, _extends({
112
92
  content: !isInvalidContent ? wrappedContent : undefined,
113
93
  isOpen: isOpen,
114
94
  placement: placement,
115
95
  qa: _extends({
116
- "data-qa-tooltip": id
96
+ 'data-qa-tooltip': id
117
97
  }, qa),
118
98
  focusOnContent: false,
119
99
  zIndex: zIndex,
120
- display: truncated ? "flex" : undefined
100
+ display: truncated ? 'flex' : undefined
121
101
  }, popoutProps), wrappedChildren);
122
102
  };
123
-
124
103
  var Content = function Content(_ref2) {
125
104
  var _ref2$appearance = _ref2.appearance,
126
- appearance = _ref2$appearance === void 0 ? "pill" : _ref2$appearance,
127
- children = _ref2.children,
128
- rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
129
-
105
+ appearance = _ref2$appearance === void 0 ? 'pill' : _ref2$appearance,
106
+ children = _ref2.children,
107
+ rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
130
108
  return /*#__PURE__*/React.createElement(_styles.TooltipContent, _extends({
131
109
  appearance: appearance,
132
- borderRadius: appearance === "box" ? 500 : "5000em",
110
+ borderRadius: appearance === 'box' ? 500 : '5000em',
133
111
  px: 400,
134
- py: appearance === "box" ? 400 : 200,
112
+ py: appearance === 'box' ? 400 : 200,
135
113
  m: 200,
136
114
  color: "text.body",
137
115
  bg: "container.background.base",
138
116
  boxShadow: "medium",
139
117
  border: 500,
140
- borderColor: "container.border.base" // $FlowIssue - upgrade v0.112.0
141
-
118
+ borderColor: "container.border.base"
119
+ // $FlowIssue - upgrade v0.112.0
142
120
  }, rest), children);
143
121
  };
144
-
145
122
  var _default = Tooltip;
146
123
  exports.default = _default;