@coinbase/cds-mobile 9.1.2 → 9.2.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 (245) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dts/alpha/select/DefaultSelectControl.d.ts +9 -9
  3. package/dts/alpha/select/DefaultSelectControl.d.ts.map +1 -1
  4. package/dts/alpha/select/Select.d.ts.map +1 -1
  5. package/dts/alpha/select/types.d.ts +25 -8
  6. package/dts/alpha/select/types.d.ts.map +1 -1
  7. package/dts/sticky-footer/StickyFooter.d.ts +8 -0
  8. package/dts/sticky-footer/StickyFooter.d.ts.map +1 -1
  9. package/dts/visualizations/chart/bar/PercentageBarChart.d.ts +2 -2
  10. package/esm/alpha/select/DefaultSelectControl.js +34 -17
  11. package/esm/alpha/select/Select.js +59 -47
  12. package/esm/dates/DatePicker.js +0 -2
  13. package/esm/overlays/__stories__/TrayAction.stories.js +0 -1
  14. package/esm/overlays/__stories__/TrayInformational.stories.js +0 -2
  15. package/esm/overlays/__stories__/TrayMessaging.stories.js +0 -1
  16. package/esm/overlays/__stories__/TrayPromotional.stories.js +0 -1
  17. package/esm/overlays/__stories__/TrayRedesign.stories.js +0 -7
  18. package/esm/sticky-footer/StickyFooter.js +6 -3
  19. package/esm/system/__stories__/componentConfigStickerSheet/customComponentConfig.js +17 -11
  20. package/esm/system/__stories__/componentConfigStickerSheet/examples/Select.js +7 -0
  21. package/package.json +3 -3
  22. package/dts/accordion/__figma__/Accordion.figma.d.ts +0 -2
  23. package/dts/accordion/__figma__/Accordion.figma.d.ts.map +0 -1
  24. package/dts/alpha/__figma__/Select.figma.d.ts +0 -2
  25. package/dts/alpha/__figma__/Select.figma.d.ts.map +0 -1
  26. package/dts/alpha/data-card/__figma__/DataCard.figma.d.ts +0 -2
  27. package/dts/alpha/data-card/__figma__/DataCard.figma.d.ts.map +0 -1
  28. package/dts/buttons/__figma__/AvatarButton.figma.d.ts +0 -2
  29. package/dts/buttons/__figma__/AvatarButton.figma.d.ts.map +0 -1
  30. package/dts/buttons/__figma__/Button.figma.d.ts +0 -2
  31. package/dts/buttons/__figma__/Button.figma.d.ts.map +0 -1
  32. package/dts/buttons/__figma__/ButtonGroup.figma.d.ts +0 -2
  33. package/dts/buttons/__figma__/ButtonGroup.figma.d.ts.map +0 -1
  34. package/dts/buttons/__figma__/IconButton.figma.d.ts +0 -2
  35. package/dts/buttons/__figma__/IconButton.figma.d.ts.map +0 -1
  36. package/dts/buttons/__figma__/SlideButton.figma.d.ts +0 -2
  37. package/dts/buttons/__figma__/SlideButton.figma.d.ts.map +0 -1
  38. package/dts/cards/ContentCard/__figma__/ContentCard.figma.d.ts +0 -2
  39. package/dts/cards/ContentCard/__figma__/ContentCard.figma.d.ts.map +0 -1
  40. package/dts/cards/MediaCard/__figma__/MediaCard.figma.d.ts +0 -2
  41. package/dts/cards/MediaCard/__figma__/MediaCard.figma.d.ts.map +0 -1
  42. package/dts/cards/MessagingCard/__figma__/MessagingCard.figma.d.ts +0 -2
  43. package/dts/cards/MessagingCard/__figma__/MessagingCard.figma.d.ts.map +0 -1
  44. package/dts/cards/__figma__/AnnouncementCard.figma.d.ts +0 -2
  45. package/dts/cards/__figma__/AnnouncementCard.figma.d.ts.map +0 -1
  46. package/dts/cards/__figma__/ContainedAssetCard.figma.d.ts +0 -2
  47. package/dts/cards/__figma__/ContainedAssetCard.figma.d.ts.map +0 -1
  48. package/dts/cards/__figma__/FloatingAssetCard.figma.d.ts +0 -2
  49. package/dts/cards/__figma__/FloatingAssetCard.figma.d.ts.map +0 -1
  50. package/dts/cards/__figma__/NudgeCard.figma.d.ts +0 -2
  51. package/dts/cards/__figma__/NudgeCard.figma.d.ts.map +0 -1
  52. package/dts/cards/__figma__/UpsellCard.figma.d.ts +0 -2
  53. package/dts/cards/__figma__/UpsellCard.figma.d.ts.map +0 -1
  54. package/dts/carousel/__figma__/Carousel.figma.d.ts +0 -2
  55. package/dts/carousel/__figma__/Carousel.figma.d.ts.map +0 -1
  56. package/dts/cells/__figma__/ContentCell.figma.d.ts +0 -2
  57. package/dts/cells/__figma__/ContentCell.figma.d.ts.map +0 -1
  58. package/dts/cells/__figma__/ListCell.figma.d.ts +0 -2
  59. package/dts/cells/__figma__/ListCell.figma.d.ts.map +0 -1
  60. package/dts/chips/__figma__/InputChip.figma.d.ts +0 -2
  61. package/dts/chips/__figma__/InputChip.figma.d.ts.map +0 -1
  62. package/dts/chips/__figma__/SelectChip.figma.d.ts +0 -2
  63. package/dts/chips/__figma__/SelectChip.figma.d.ts.map +0 -1
  64. package/dts/chips/__figma__/TabbedChips.figma.d.ts +0 -2
  65. package/dts/chips/__figma__/TabbedChips.figma.d.ts.map +0 -1
  66. package/dts/coachmark/__figma__/Coachmark.figma.d.ts +0 -2
  67. package/dts/coachmark/__figma__/Coachmark.figma.d.ts.map +0 -1
  68. package/dts/controls/__figma__/Checkbox.figma.d.ts +0 -2
  69. package/dts/controls/__figma__/Checkbox.figma.d.ts.map +0 -1
  70. package/dts/controls/__figma__/CheckboxCell.figma.d.ts +0 -2
  71. package/dts/controls/__figma__/CheckboxCell.figma.d.ts.map +0 -1
  72. package/dts/controls/__figma__/CheckboxGroup.figma.d.ts +0 -2
  73. package/dts/controls/__figma__/CheckboxGroup.figma.d.ts.map +0 -1
  74. package/dts/controls/__figma__/RadioCell.figma.d.ts +0 -2
  75. package/dts/controls/__figma__/RadioCell.figma.d.ts.map +0 -1
  76. package/dts/controls/__figma__/RadioGroup.figma.d.ts +0 -2
  77. package/dts/controls/__figma__/RadioGroup.figma.d.ts.map +0 -1
  78. package/dts/controls/__figma__/SearchInput.figma.d.ts +0 -2
  79. package/dts/controls/__figma__/SearchInput.figma.d.ts.map +0 -1
  80. package/dts/controls/__figma__/SelectOption.figma.d.ts +0 -2
  81. package/dts/controls/__figma__/SelectOption.figma.d.ts.map +0 -1
  82. package/dts/controls/__figma__/Switch.figma.d.ts +0 -2
  83. package/dts/controls/__figma__/Switch.figma.d.ts.map +0 -1
  84. package/dts/controls/__figma__/TextInput.figma.d.ts +0 -2
  85. package/dts/controls/__figma__/TextInput.figma.d.ts.map +0 -1
  86. package/dts/dates/__figma__/DatePicker.figma.d.ts +0 -2
  87. package/dts/dates/__figma__/DatePicker.figma.d.ts.map +0 -1
  88. package/dts/dots/__figma__/DotCount.figma.d.ts +0 -2
  89. package/dts/dots/__figma__/DotCount.figma.d.ts.map +0 -1
  90. package/dts/dots/__figma__/DotStatusColor.figma.d.ts +0 -2
  91. package/dts/dots/__figma__/DotStatusColor.figma.d.ts.map +0 -1
  92. package/dts/dots/__figma__/DotSymbol.figma.d.ts +0 -2
  93. package/dts/dots/__figma__/DotSymbol.figma.d.ts.map +0 -1
  94. package/dts/icons/__figma__/Icon.figma.d.ts +0 -2
  95. package/dts/icons/__figma__/Icon.figma.d.ts.map +0 -1
  96. package/dts/icons/__figma__/LogoMark.figma.d.ts +0 -2
  97. package/dts/icons/__figma__/LogoMark.figma.d.ts.map +0 -1
  98. package/dts/icons/__figma__/LogoWordmark.figma.d.ts +0 -2
  99. package/dts/icons/__figma__/LogoWordmark.figma.d.ts.map +0 -1
  100. package/dts/icons/__figma__/SubBrandLogoMark.figma.d.ts +0 -2
  101. package/dts/icons/__figma__/SubBrandLogoMark.figma.d.ts.map +0 -1
  102. package/dts/icons/__figma__/SubBrandLogoWordmark.figma.d.ts +0 -2
  103. package/dts/icons/__figma__/SubBrandLogoWordmark.figma.d.ts.map +0 -1
  104. package/dts/illustrations/__figma__/HeroSquare.figma.d.ts +0 -2
  105. package/dts/illustrations/__figma__/HeroSquare.figma.d.ts.map +0 -1
  106. package/dts/illustrations/__figma__/Pictogram.figma.d.ts +0 -2
  107. package/dts/illustrations/__figma__/Pictogram.figma.d.ts.map +0 -1
  108. package/dts/illustrations/__figma__/SpotIcon.figma.d.ts +0 -2
  109. package/dts/illustrations/__figma__/SpotIcon.figma.d.ts.map +0 -1
  110. package/dts/illustrations/__figma__/SpotRectangle.figma.d.ts +0 -2
  111. package/dts/illustrations/__figma__/SpotRectangle.figma.d.ts.map +0 -1
  112. package/dts/illustrations/__figma__/SpotSquare.figma.d.ts +0 -2
  113. package/dts/illustrations/__figma__/SpotSquare.figma.d.ts.map +0 -1
  114. package/dts/layout/__figma__/Divider.figma.d.ts +0 -2
  115. package/dts/layout/__figma__/Divider.figma.d.ts.map +0 -1
  116. package/dts/layout/__figma__/Fallback.figma.d.ts +0 -2
  117. package/dts/layout/__figma__/Fallback.figma.d.ts.map +0 -1
  118. package/dts/media/__figma__/Avatar.figma.d.ts +0 -2
  119. package/dts/media/__figma__/Avatar.figma.d.ts.map +0 -1
  120. package/dts/multi-content-module/__figma__/MultiContentModule.figma.d.ts +0 -2
  121. package/dts/multi-content-module/__figma__/MultiContentModule.figma.d.ts.map +0 -1
  122. package/dts/navigation/__figma__/BrowserBar.figma.d.ts +0 -2
  123. package/dts/navigation/__figma__/BrowserBar.figma.d.ts.map +0 -1
  124. package/dts/navigation/__figma__/TopNavBar.figma.d.ts +0 -2
  125. package/dts/navigation/__figma__/TopNavBar.figma.d.ts.map +0 -1
  126. package/dts/numpad/__figma__/Numpad.figma.d.ts +0 -2
  127. package/dts/numpad/__figma__/Numpad.figma.d.ts.map +0 -1
  128. package/dts/overlays/__figma__/Alert.figma.d.ts +0 -2
  129. package/dts/overlays/__figma__/Alert.figma.d.ts.map +0 -1
  130. package/dts/overlays/__figma__/Toast.figma.d.ts +0 -2
  131. package/dts/overlays/__figma__/Toast.figma.d.ts.map +0 -1
  132. package/dts/overlays/modal/__figma__/Modal.figma.d.ts +0 -2
  133. package/dts/overlays/modal/__figma__/Modal.figma.d.ts.map +0 -1
  134. package/dts/overlays/tooltip/__figma__/Tooltip.figma.d.ts +0 -2
  135. package/dts/overlays/tooltip/__figma__/Tooltip.figma.d.ts.map +0 -1
  136. package/dts/overlays/tray/__figma__/Tray.figma.d.ts +0 -2
  137. package/dts/overlays/tray/__figma__/Tray.figma.d.ts.map +0 -1
  138. package/dts/page/__figma__/PageFooter.figma.d.ts +0 -2
  139. package/dts/page/__figma__/PageFooter.figma.d.ts.map +0 -1
  140. package/dts/page/__figma__/PageHeader.figma.d.ts +0 -2
  141. package/dts/page/__figma__/PageHeader.figma.d.ts.map +0 -1
  142. package/dts/perf/component-config/Button.component-config.perf-test.d.ts +0 -2
  143. package/dts/perf/component-config/Button.component-config.perf-test.d.ts.map +0 -1
  144. package/dts/perf/component-config/ComponentConfigProvider.perf-test.d.ts +0 -2
  145. package/dts/perf/component-config/ComponentConfigProvider.perf-test.d.ts.map +0 -1
  146. package/dts/perf/component-config/ComponentConfigStickerSheet.perf-test.d.ts +0 -2
  147. package/dts/perf/component-config/ComponentConfigStickerSheet.perf-test.d.ts.map +0 -1
  148. package/dts/section-header/__figma__/SectionHeader.figma.d.ts +0 -2
  149. package/dts/section-header/__figma__/SectionHeader.figma.d.ts.map +0 -1
  150. package/dts/sticky-footer/__figma__/StickyFooter.figma.d.ts +0 -2
  151. package/dts/sticky-footer/__figma__/StickyFooter.figma.d.ts.map +0 -1
  152. package/dts/tabs/__figma__/SegmentedTabs.figma.d.ts +0 -2
  153. package/dts/tabs/__figma__/SegmentedTabs.figma.d.ts.map +0 -1
  154. package/dts/tabs/__figma__/TabNavigation.figma.d.ts +0 -2
  155. package/dts/tabs/__figma__/TabNavigation.figma.d.ts.map +0 -1
  156. package/dts/tag/__figma__/Tag.figma.d.ts +0 -2
  157. package/dts/tag/__figma__/Tag.figma.d.ts.map +0 -1
  158. package/dts/typography/__figma__/Link.figma.d.ts +0 -2
  159. package/dts/typography/__figma__/Link.figma.d.ts.map +0 -1
  160. package/dts/visualizations/__figma__/ProgressBar.figma.d.ts +0 -2
  161. package/dts/visualizations/__figma__/ProgressBar.figma.d.ts.map +0 -1
  162. package/dts/visualizations/__figma__/ProgressCircle.figma.d.ts +0 -2
  163. package/dts/visualizations/__figma__/ProgressCircle.figma.d.ts.map +0 -1
  164. package/dts/visualizations/sparkline/__figma__/Sparkline.figma.d.ts +0 -2
  165. package/dts/visualizations/sparkline/__figma__/Sparkline.figma.d.ts.map +0 -1
  166. package/dts/visualizations/sparkline/sparkline-interactive/__figma__/SparklineInteractive.figma.d.ts +0 -2
  167. package/dts/visualizations/sparkline/sparkline-interactive/__figma__/SparklineInteractive.figma.d.ts.map +0 -1
  168. package/dts/visualizations/sparkline/sparkline-interactive-header/__figma__/SparklineInteractiveHeader.figma.d.ts +0 -2
  169. package/dts/visualizations/sparkline/sparkline-interactive-header/__figma__/SparklineInteractiveHeader.figma.d.ts.map +0 -1
  170. package/esm/accordion/__figma__/Accordion.figma.js +0 -42
  171. package/esm/alpha/__figma__/Select.figma.js +0 -63
  172. package/esm/alpha/data-card/__figma__/DataCard.figma.js +0 -29
  173. package/esm/buttons/__figma__/AvatarButton.figma.js +0 -25
  174. package/esm/buttons/__figma__/Button.figma.js +0 -65
  175. package/esm/buttons/__figma__/ButtonGroup.figma.js +0 -48
  176. package/esm/buttons/__figma__/IconButton.figma.js +0 -29
  177. package/esm/buttons/__figma__/SlideButton.figma.js +0 -27
  178. package/esm/cards/ContentCard/__figma__/ContentCard.figma.js +0 -35
  179. package/esm/cards/MediaCard/__figma__/MediaCard.figma.js +0 -46
  180. package/esm/cards/MessagingCard/__figma__/MessagingCard.figma.js +0 -38
  181. package/esm/cards/__figma__/AnnouncementCard.figma.js +0 -19
  182. package/esm/cards/__figma__/ContainedAssetCard.figma.js +0 -39
  183. package/esm/cards/__figma__/FloatingAssetCard.figma.js +0 -30
  184. package/esm/cards/__figma__/NudgeCard.figma.js +0 -54
  185. package/esm/cards/__figma__/UpsellCard.figma.js +0 -48
  186. package/esm/carousel/__figma__/Carousel.figma.js +0 -36
  187. package/esm/cells/__figma__/ContentCell.figma.js +0 -35
  188. package/esm/cells/__figma__/ListCell.figma.js +0 -74
  189. package/esm/chips/__figma__/InputChip.figma.js +0 -27
  190. package/esm/chips/__figma__/SelectChip.figma.js +0 -38
  191. package/esm/chips/__figma__/TabbedChips.figma.js +0 -55
  192. package/esm/coachmark/__figma__/Coachmark.figma.js +0 -41
  193. package/esm/controls/__figma__/Checkbox.figma.js +0 -27
  194. package/esm/controls/__figma__/CheckboxCell.figma.js +0 -38
  195. package/esm/controls/__figma__/CheckboxGroup.figma.js +0 -23
  196. package/esm/controls/__figma__/RadioCell.figma.js +0 -78
  197. package/esm/controls/__figma__/RadioGroup.figma.js +0 -47
  198. package/esm/controls/__figma__/SearchInput.figma.js +0 -35
  199. package/esm/controls/__figma__/SelectOption.figma.js +0 -35
  200. package/esm/controls/__figma__/Switch.figma.js +0 -16
  201. package/esm/controls/__figma__/TextInput.figma.js +0 -125
  202. package/esm/dates/__figma__/DatePicker.figma.js +0 -43
  203. package/esm/dots/__figma__/DotCount.figma.js +0 -16
  204. package/esm/dots/__figma__/DotStatusColor.figma.js +0 -23
  205. package/esm/dots/__figma__/DotSymbol.figma.js +0 -45
  206. package/esm/icons/__figma__/Icon.figma.js +0 -3906
  207. package/esm/icons/__figma__/LogoMark.figma.js +0 -20
  208. package/esm/icons/__figma__/LogoWordmark.figma.js +0 -32
  209. package/esm/icons/__figma__/SubBrandLogoMark.figma.js +0 -47
  210. package/esm/icons/__figma__/SubBrandLogoWordmark.figma.js +0 -48
  211. package/esm/illustrations/__figma__/HeroSquare.figma.js +0 -2104
  212. package/esm/illustrations/__figma__/Pictogram.figma.js +0 -1774
  213. package/esm/illustrations/__figma__/SpotIcon.figma.js +0 -340
  214. package/esm/illustrations/__figma__/SpotRectangle.figma.js +0 -1102
  215. package/esm/illustrations/__figma__/SpotSquare.figma.js +0 -1192
  216. package/esm/jest.d.js +0 -12
  217. package/esm/layout/__figma__/Divider.figma.js +0 -27
  218. package/esm/layout/__figma__/Fallback.figma.js +0 -21
  219. package/esm/media/__figma__/Avatar.figma.js +0 -56
  220. package/esm/multi-content-module/__figma__/MultiContentModule.figma.js +0 -31
  221. package/esm/navigation/__figma__/BrowserBar.figma.js +0 -58
  222. package/esm/navigation/__figma__/TopNavBar.figma.js +0 -319
  223. package/esm/numpad/__figma__/Numpad.figma.js +0 -63
  224. package/esm/overlays/__figma__/Alert.figma.js +0 -32
  225. package/esm/overlays/__figma__/Toast.figma.js +0 -51
  226. package/esm/overlays/modal/__figma__/Modal.figma.js +0 -74
  227. package/esm/overlays/tooltip/__figma__/Tooltip.figma.js +0 -92
  228. package/esm/overlays/tray/__figma__/Tray.figma.js +0 -223
  229. package/esm/page/__figma__/PageFooter.figma.js +0 -61
  230. package/esm/page/__figma__/PageHeader.figma.js +0 -58
  231. package/esm/perf/component-config/Button.component-config.perf-test.js +0 -35
  232. package/esm/perf/component-config/ComponentConfigProvider.perf-test.js +0 -147
  233. package/esm/perf/component-config/ComponentConfigStickerSheet.perf-test.js +0 -326
  234. package/esm/perf/component-config/README.md +0 -8
  235. package/esm/section-header/__figma__/SectionHeader.figma.js +0 -50
  236. package/esm/sticky-footer/__figma__/StickyFooter.figma.js +0 -25
  237. package/esm/tabs/__figma__/SegmentedTabs.figma.js +0 -79
  238. package/esm/tabs/__figma__/TabNavigation.figma.js +0 -83
  239. package/esm/tag/__figma__/Tag.figma.js +0 -86
  240. package/esm/typography/__figma__/Link.figma.js +0 -28
  241. package/esm/visualizations/__figma__/ProgressBar.figma.js +0 -99
  242. package/esm/visualizations/__figma__/ProgressCircle.figma.js +0 -26
  243. package/esm/visualizations/sparkline/__figma__/Sparkline.figma.js +0 -22
  244. package/esm/visualizations/sparkline/sparkline-interactive/__figma__/SparklineInteractive.figma.js +0 -85
  245. package/esm/visualizations/sparkline/sparkline-interactive-header/__figma__/SparklineInteractiveHeader.figma.js +0 -104
@@ -1,326 +0,0 @@
1
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
2
- import React from 'react';
3
- import { Pressable } from 'react-native';
4
- import { fireEvent, screen } from '@testing-library/react-native';
5
- import { measurePerformance } from 'reassure';
6
- import { Button } from '../../buttons/Button';
7
- import { IconButton } from '../../buttons/IconButton';
8
- import { ListCell } from '../../cells/ListCell';
9
- import { Chip } from '../../chips/Chip';
10
- import { SearchInput } from '../../controls/SearchInput';
11
- import { TextInput } from '../../controls/TextInput';
12
- import { DotCount } from '../../dots/DotCount';
13
- import { Icon } from '../../icons/Icon';
14
- import { HStack } from '../../layout/HStack';
15
- import { VStack } from '../../layout/VStack';
16
- import { Avatar } from '../../media/Avatar';
17
- import { ComponentConfigProvider } from '../../system/ComponentConfigProvider';
18
- import { ThemeProvider } from '../../system/ThemeProvider';
19
- import { Tag } from '../../tag/Tag';
20
- import { defaultTheme } from '../../themes/defaultTheme';
21
- import { Text } from '../../typography/Text';
22
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
23
- const updateIterations = 50;
24
- const customPerfTheme = _extends({}, defaultTheme, {
25
- id: 'component-config-mobile-perf-theme',
26
- lightColor: _extends({}, defaultTheme.lightColor, {
27
- bgAlternate: defaultTheme.lightColor.bgSecondary
28
- }),
29
- darkColor: _extends({}, defaultTheme.darkColor, {
30
- bgAlternate: defaultTheme.darkColor.bgSecondary
31
- })
32
- });
33
- const customComponentConfig = {
34
- Button: props => ({
35
- borderRadius: 200,
36
- height: props.compact ? 24 : 32,
37
- font: props.compact ? 'label1' : 'headline'
38
- }),
39
- IconButton: props => ({
40
- borderRadius: 200,
41
- height: props.compact ? 24 : 32,
42
- width: props.compact ? 24 : 32
43
- }),
44
- TextInput: props => ({
45
- bordered: false,
46
- inputBackground: 'bgAlternate',
47
- font: props.compact ? 'label2' : 'body',
48
- variant: 'foregroundMuted',
49
- focusedBorderWidth: 100
50
- }),
51
- SearchInput: props => ({
52
- borderRadius: 200,
53
- height: props.compact ? 24 : 32
54
- }),
55
- Chip: {
56
- borderRadius: 200
57
- },
58
- ListCell: {
59
- spacingVariant: 'condensed'
60
- }
61
- };
62
- const ComplexStickerSheetLike = _ref => {
63
- let {
64
- tick = 0
65
- } = _ref;
66
- return /*#__PURE__*/_jsx(VStack, {
67
- alignItems: "center",
68
- background: "bgAlternate",
69
- gap: 2,
70
- padding: 2,
71
- children: /*#__PURE__*/_jsxs(HStack, {
72
- gap: 2,
73
- children: [/*#__PURE__*/_jsxs(VStack, {
74
- gap: 2,
75
- width: 420,
76
- children: [/*#__PURE__*/_jsx(HStack, {
77
- gap: 1,
78
- children: Array.from({
79
- length: 12
80
- }, (_, i) => /*#__PURE__*/_jsx(Button, {
81
- variant: tick % 2 === 0 ? 'primary' : 'secondary',
82
- children: "Primary"
83
- }, "primary-" + i))
84
- }), /*#__PURE__*/_jsx(HStack, {
85
- gap: 1,
86
- children: Array.from({
87
- length: 12
88
- }, (_, i) => /*#__PURE__*/_jsx(Button, {
89
- compact: true,
90
- variant: "secondary",
91
- children: "Secondary"
92
- }, "secondary-" + i))
93
- }), /*#__PURE__*/_jsx(VStack, {
94
- gap: 1,
95
- children: Array.from({
96
- length: 8
97
- }, (_, i) => /*#__PURE__*/_jsx(TextInput, {
98
- label: "Label " + i,
99
- onChangeText: () => {},
100
- value: ""
101
- }, "input-" + i))
102
- }), /*#__PURE__*/_jsx(VStack, {
103
- gap: 1,
104
- children: Array.from({
105
- length: 8
106
- }, (_, i) => /*#__PURE__*/_jsx(SearchInput, {
107
- label: "Search " + i,
108
- onChangeText: () => {},
109
- value: ""
110
- }, "search-" + i))
111
- }), /*#__PURE__*/_jsx(VStack, {
112
- gap: 1,
113
- children: Array.from({
114
- length: 8
115
- }, (_, i) => /*#__PURE__*/_jsx(ListCell, {
116
- accessibilityLabel: "List row " + i,
117
- description: "$100",
118
- media: /*#__PURE__*/_jsx(Avatar, {
119
- name: "A",
120
- size: "m"
121
- }),
122
- onPress: () => {},
123
- subtitle: "Subtitle",
124
- title: "Row " + i
125
- }, "cell-" + i))
126
- })]
127
- }), /*#__PURE__*/_jsxs(VStack, {
128
- gap: 2,
129
- width: 600,
130
- children: [/*#__PURE__*/_jsx(HStack, {
131
- gap: 1,
132
- children: Array.from({
133
- length: 16
134
- }, (_, i) => /*#__PURE__*/_jsx(IconButton, {
135
- accessibilityLabel: "Icon button " + i,
136
- name: "add",
137
- variant: "tertiary"
138
- }, "icon-" + i))
139
- }), /*#__PURE__*/_jsx(HStack, {
140
- flexWrap: "wrap",
141
- gap: 1,
142
- children: Array.from({
143
- length: 24
144
- }, (_, i) => /*#__PURE__*/_jsxs(Chip, {
145
- accessibilityLabel: "Chip " + i,
146
- onPress: () => {},
147
- children: ["Chip ", i]
148
- }, "chip-" + i))
149
- }), /*#__PURE__*/_jsx(HStack, {
150
- gap: 1,
151
- children: Array.from({
152
- length: 20
153
- }, (_, i) => /*#__PURE__*/_jsxs(Tag, {
154
- intent: i % 2 === 0 ? 'informational' : 'promotional',
155
- children: ["Tag ", i]
156
- }, "tag-" + i))
157
- }), /*#__PURE__*/_jsx(HStack, {
158
- gap: 1,
159
- children: Array.from({
160
- length: 10
161
- }, (_, i) => /*#__PURE__*/_jsx(DotCount, {
162
- count: i + 1,
163
- children: /*#__PURE__*/_jsx(Icon, {
164
- name: "bell",
165
- size: "l"
166
- })
167
- }, "dot-" + i))
168
- }), /*#__PURE__*/_jsxs(Text, {
169
- font: "title3",
170
- children: ["Complex story-like surface tick=", tick]
171
- })]
172
- })]
173
- })
174
- });
175
- };
176
- const BaselineHarness = () => /*#__PURE__*/_jsx(ThemeProvider, {
177
- activeColorScheme: "light",
178
- theme: defaultTheme,
179
- children: /*#__PURE__*/_jsx(ComplexStickerSheetLike, {})
180
- });
181
- const CustomHarness = () => /*#__PURE__*/_jsx(ThemeProvider, {
182
- activeColorScheme: "dark",
183
- theme: customPerfTheme,
184
- children: /*#__PURE__*/_jsx(ComponentConfigProvider, {
185
- value: customComponentConfig,
186
- children: /*#__PURE__*/_jsx(ComplexStickerSheetLike, {})
187
- })
188
- });
189
- const UnrelatedConfigUpdateHarness = () => {
190
- const [tick, setTick] = React.useState(0);
191
- const value = React.useMemo(() => _extends({}, customComponentConfig, {
192
- Tour: tick % 2 === 0 ? {} : {}
193
- }), [tick]);
194
- return /*#__PURE__*/_jsxs(_Fragment, {
195
- children: [/*#__PURE__*/_jsx(Pressable, {
196
- onPress: () => setTick(v => v + 1),
197
- testID: "update-unrelated-config"
198
- }), /*#__PURE__*/_jsx(ThemeProvider, {
199
- activeColorScheme: "dark",
200
- theme: customPerfTheme,
201
- children: /*#__PURE__*/_jsx(ComponentConfigProvider, {
202
- value: value,
203
- children: /*#__PURE__*/_jsx(ComplexStickerSheetLike, {})
204
- })
205
- })]
206
- });
207
- };
208
- const TargetedConfigUpdateHarness = () => {
209
- const [tick, setTick] = React.useState(0);
210
- const value = React.useMemo(() => _extends({}, customComponentConfig, {
211
- Button: props => ({
212
- borderRadius: tick % 2 === 0 ? 200 : 300,
213
- height: props.compact ? 24 : 32,
214
- font: props.compact ? 'label1' : 'headline'
215
- })
216
- }), [tick]);
217
- return /*#__PURE__*/_jsxs(_Fragment, {
218
- children: [/*#__PURE__*/_jsx(Pressable, {
219
- onPress: () => setTick(v => v + 1),
220
- testID: "update-targeted-config"
221
- }), /*#__PURE__*/_jsx(ThemeProvider, {
222
- activeColorScheme: "dark",
223
- theme: customPerfTheme,
224
- children: /*#__PURE__*/_jsx(ComponentConfigProvider, {
225
- value: value,
226
- children: /*#__PURE__*/_jsx(ComplexStickerSheetLike, {})
227
- })
228
- })]
229
- });
230
- };
231
- const RandomStateUpdateHarness = () => {
232
- const [tick, setTick] = React.useState(0);
233
- return /*#__PURE__*/_jsxs(_Fragment, {
234
- children: [/*#__PURE__*/_jsx(Pressable, {
235
- onPress: () => setTick(v => v + 1),
236
- testID: "update-random-state"
237
- }), /*#__PURE__*/_jsx(ThemeProvider, {
238
- activeColorScheme: "dark",
239
- theme: customPerfTheme,
240
- children: /*#__PURE__*/_jsx(ComponentConfigProvider, {
241
- value: customComponentConfig,
242
- children: /*#__PURE__*/_jsx(ComplexStickerSheetLike, {
243
- tick: tick
244
- })
245
- })
246
- })]
247
- });
248
- };
249
- const CustomThemeNoProviderHarness = () => /*#__PURE__*/_jsx(ThemeProvider, {
250
- activeColorScheme: "dark",
251
- theme: customPerfTheme,
252
- children: /*#__PURE__*/_jsx(ComplexStickerSheetLike, {})
253
- });
254
- const CustomThemeNoProviderStateUpdateHarness = () => {
255
- const [tick, setTick] = React.useState(0);
256
- return /*#__PURE__*/_jsxs(_Fragment, {
257
- children: [/*#__PURE__*/_jsx(Pressable, {
258
- onPress: () => setTick(v => v + 1),
259
- testID: "update-page-state-no-provider"
260
- }), /*#__PURE__*/_jsx(ThemeProvider, {
261
- activeColorScheme: "dark",
262
- theme: customPerfTheme,
263
- children: /*#__PURE__*/_jsx(ComplexStickerSheetLike, {
264
- tick: tick
265
- })
266
- })]
267
- });
268
- };
269
- describe('ComponentConfig StickerSheet performance tests (mobile)', () => {
270
- jest.setTimeout(90000);
271
- beforeAll(() => {
272
- jest.spyOn(console, 'error').mockImplementation(() => {});
273
- });
274
- afterAll(() => {
275
- jest.restoreAllMocks();
276
- });
277
- it('renders StickerSheet baseline (no provider)', async () => {
278
- await measurePerformance(/*#__PURE__*/_jsx(BaselineHarness, {}));
279
- });
280
- it('renders StickerSheet custom story (theme + component config)', async () => {
281
- await measurePerformance(/*#__PURE__*/_jsx(CustomHarness, {}));
282
- });
283
- it('updates unrelated config key 50 times', async () => {
284
- const scenario = async () => {
285
- for (let i = 0; i < updateIterations; i += 1) {
286
- fireEvent.press(screen.getByTestId('update-unrelated-config'));
287
- }
288
- };
289
- await measurePerformance(/*#__PURE__*/_jsx(UnrelatedConfigUpdateHarness, {}), {
290
- scenario
291
- });
292
- });
293
- it('updates targeted config key 50 times', async () => {
294
- const scenario = async () => {
295
- for (let i = 0; i < updateIterations; i += 1) {
296
- fireEvent.press(screen.getByTestId('update-targeted-config'));
297
- }
298
- };
299
- await measurePerformance(/*#__PURE__*/_jsx(TargetedConfigUpdateHarness, {}), {
300
- scenario
301
- });
302
- });
303
- it('updates random local state 50 times (provider enabled)', async () => {
304
- const scenario = async () => {
305
- for (let i = 0; i < updateIterations; i += 1) {
306
- fireEvent.press(screen.getByTestId('update-random-state'));
307
- }
308
- };
309
- await measurePerformance(/*#__PURE__*/_jsx(RandomStateUpdateHarness, {}), {
310
- scenario
311
- });
312
- });
313
- it('renders custom theme with no provider', async () => {
314
- await measurePerformance(/*#__PURE__*/_jsx(CustomThemeNoProviderHarness, {}));
315
- });
316
- it('updates page state 50 times with custom theme and no provider', async () => {
317
- const scenario = async () => {
318
- for (let i = 0; i < updateIterations; i += 1) {
319
- fireEvent.press(screen.getByTestId('update-page-state-no-provider'));
320
- }
321
- };
322
- await measurePerformance(/*#__PURE__*/_jsx(CustomThemeNoProviderStateUpdateHarness, {}), {
323
- scenario
324
- });
325
- });
326
- });
@@ -1,8 +0,0 @@
1
- # Component Config Perf Tests
2
-
3
- This folder contains manual performance benchmarks for component config behavior.
4
-
5
- ## Run
6
-
7
- - Web + mobile together:
8
- - `yarn perf:component-config`
@@ -1,50 +0,0 @@
1
- const _excluded = ["searchNode"];
2
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
3
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
4
- import React from 'react';
5
- import { figma } from '@figma/code-connect';
6
- import { HStack } from '../../layout';
7
- import { SectionHeader } from '../SectionHeader';
8
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
9
- figma.connect(SectionHeader, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=19270%3A19118', {
10
- imports: ["import { SectionHeader } from '@coinbase/cds-mobile/section-header/SectionHeader'"],
11
- props: {
12
- title: figma.children('string.section title'),
13
- balance: figma.enum('type', {
14
- 'with balance (bottom)': figma.children(['Balance Header', 'Subdetails'])
15
- }),
16
- searchNode: figma.boolean('show search', {
17
- true: figma.children('Search Input (Desktop)'),
18
- false: undefined
19
- }),
20
- spacingBottom: figma.boolean('show bottom spacing', {
21
- true: undefined,
22
- false: 0
23
- }),
24
- start: figma.boolean('show start', {
25
- true: figma.instance('↳ start'),
26
- false: undefined
27
- }),
28
- icon: figma.boolean('show icon', {
29
- true: figma.children('icon'),
30
- false: undefined
31
- }),
32
- description: figma.boolean('show description', {
33
- true: figma.string('↳ string'),
34
- false: undefined
35
- }),
36
- end: figma.boolean('show start', {
37
- true: figma.instance('↳ end'),
38
- false: undefined
39
- })
40
- },
41
- example: _ref => {
42
- let {
43
- searchNode
44
- } = _ref,
45
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
46
- return /*#__PURE__*/_jsxs(HStack, {
47
- children: [/*#__PURE__*/_jsx(SectionHeader, _extends({}, props)), searchNode]
48
- });
49
- }
50
- });
@@ -1,25 +0,0 @@
1
- import React from 'react';
2
- import { figma } from '@figma/code-connect';
3
- import { StickyFooter } from '../StickyFooter';
4
- import { jsx as _jsx } from "react/jsx-runtime";
5
- figma.connect(StickyFooter, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=10340-69579&m=dev', {
6
- imports: ["import {StickyFooter} from '@coinbase/cds-mobile/sticky-footer/StickyFooter'"],
7
- props: {
8
- // showlegaltext1391921: figma.boolean('show legal text'),
9
- // buttons: figma.enum('buttons', {
10
- // 'single primary': 'single-primary',
11
- // 'single secondary': 'single-secondary',
12
- // stacked: 'stacked',
13
- // 'stacked with transparent button': 'stacked-with-transparent-button',
14
- // 'side-by-side': 'side-by-side',
15
- // none: 'none',
16
- // }),
17
- elevated: figma.boolean('floating'),
18
- // compact: figma.boolean('compact'),
19
- children: figma.children(['Button', 'ButtonGroup'])
20
- },
21
- example: props => /*#__PURE__*/_jsx(StickyFooter, {
22
- elevated: props.elevated,
23
- children: props.children
24
- })
25
- });
@@ -1,79 +0,0 @@
1
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
2
- import React from 'react';
3
- import { figma } from '@figma/code-connect';
4
- import { SegmentedTab } from '../SegmentedTab';
5
- import { SegmentedTabs } from '../SegmentedTabs';
6
- import { jsx as _jsx } from "react/jsx-runtime";
7
- figma.connect(SegmentedTabs, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=20859-2979&m=dev', {
8
- imports: ["import { SegmentedTabs } from '@coinbase/cds-mobile/tabs/SegmentedTabs'"],
9
- variant: {
10
- tabs: '2 tabs'
11
- },
12
- props: {
13
- activeTab: figma.enum('active state', {
14
- left: {
15
- id: '1',
16
- label: 'Title'
17
- },
18
- right: {
19
- id: '2',
20
- label: 'Title'
21
- }
22
- }),
23
- disabled: figma.boolean('disabled')
24
- },
25
- example: props => /*#__PURE__*/_jsx(SegmentedTabs, _extends({
26
- onChange: () => {},
27
- tabs: [{
28
- id: '1',
29
- label: 'Title'
30
- }, {
31
- id: '2',
32
- label: 'Title'
33
- }]
34
- }, props))
35
- });
36
- figma.connect(SegmentedTabs, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=20859-2979&m=dev', {
37
- imports: ["import { SegmentedTabs } from '@coinbase/cds-mobile/tabs/SegmentedTabs'"],
38
- variant: {
39
- tabs: '3 tabs'
40
- },
41
- props: {
42
- activeTab: figma.enum('active state', {
43
- left: {
44
- id: '1',
45
- label: 'Title'
46
- },
47
- center: {
48
- id: '2',
49
- label: 'Title'
50
- },
51
- right: {
52
- id: '3',
53
- label: 'Title'
54
- }
55
- }),
56
- disabled: figma.boolean('disabled')
57
- },
58
- example: props => /*#__PURE__*/_jsx(SegmentedTabs, _extends({
59
- onChange: () => {},
60
- tabs: [{
61
- id: '1',
62
- label: 'Title'
63
- }, {
64
- id: '2',
65
- label: 'Title'
66
- }, {
67
- id: '3',
68
- label: 'Title'
69
- }]
70
- }, props))
71
- });
72
- figma.connect(SegmentedTabs, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=20859-3073&m=dev', {
73
- imports: ["import { SegmentedTab } from '@coinbase/cds-mobile/tabs/SegmentedTab'"],
74
- props: {
75
- id: figma.string('title'),
76
- label: figma.string('title')
77
- },
78
- example: props => /*#__PURE__*/_jsx(SegmentedTab, _extends({}, props))
79
- });
@@ -1,83 +0,0 @@
1
- /* eslint-disable react-hooks/rules-of-hooks */
2
- import React, { useMemo, useState } from 'react';
3
- import { figma } from '@figma/code-connect';
4
- import { TabNavigation } from '../TabNavigation';
5
- import { jsx as _jsx } from "react/jsx-runtime";
6
- figma.connect(TabNavigation, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=240-8930&m=dev', {
7
- imports: ["import { TabNavigation } from '@coinbase/cds-mobile/tabs/TabNavigation'"],
8
- props: {
9
- tab1: figma.nestedProps('1 Primary Tab', {
10
- count: figma.boolean('dot count', {
11
- true: 1,
12
- false: undefined
13
- }),
14
- label: figma.textContent('Label'),
15
- id: figma.textContent('Label')
16
- }),
17
- tab2: figma.nestedProps('2 Primary Tab', {
18
- count: figma.boolean('dot count', {
19
- true: 1,
20
- false: undefined
21
- }),
22
- label: figma.textContent('Label'),
23
- id: figma.textContent('Label')
24
- }),
25
- tab3: figma.nestedProps('3 Primary Tab', {
26
- count: figma.boolean('dot count', {
27
- true: 1,
28
- false: undefined
29
- }),
30
- label: figma.textContent('Label'),
31
- id: figma.textContent('Label')
32
- }),
33
- tab4: figma.nestedProps('4 Primary Tab', {
34
- count: figma.boolean('dot count', {
35
- true: 1,
36
- false: undefined
37
- }),
38
- label: figma.textContent('Label'),
39
- id: figma.textContent('Label')
40
- }),
41
- tab5: figma.nestedProps('5 Primary Tab', {
42
- count: figma.boolean('dot count', {
43
- true: 1,
44
- false: undefined
45
- }),
46
- label: figma.textContent('Label'),
47
- id: figma.textContent('Label')
48
- }),
49
- tab6: figma.nestedProps('6 Primary Tab', {
50
- count: figma.boolean('dot count', {
51
- true: 1,
52
- false: undefined
53
- }),
54
- label: figma.textContent('Label'),
55
- id: figma.textContent('Label')
56
- })
57
- },
58
- example: () => {
59
- const tabs = useMemo(() => [{
60
- id: 'first_primary_tab',
61
- label: 'Primary tab',
62
- count: 1
63
- }, {
64
- id: 'second_primary_tab',
65
- label: 'Primary tab'
66
- }, {
67
- id: 'third_primary_tab',
68
- label: 'Primary tab'
69
- }, {
70
- id: 'fourth_primary_tab',
71
- label: 'Primary tab'
72
- }, {
73
- id: 'fifth_primary_tab',
74
- label: 'Primary tab'
75
- }], []);
76
- const [value, setValue] = useState(tabs[0].id);
77
- return /*#__PURE__*/_jsx(TabNavigation, {
78
- onChange: setValue,
79
- tabs: tabs,
80
- value: value
81
- });
82
- }
83
- });
@@ -1,86 +0,0 @@
1
- const _excluded = ["children"],
2
- _excluded2 = ["children"];
3
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
4
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
5
- import React from 'react';
6
- import { figma } from '@figma/code-connect';
7
- import { Tag } from '../Tag';
8
- import { jsx as _jsx } from "react/jsx-runtime";
9
- figma.connect(Tag, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=68%3A996', {
10
- imports: ["import { Tag } from '@coinbase/cds-mobile/tag/Tag'"],
11
- variant: {
12
- intent: 'informational'
13
- },
14
- props: {
15
- emphasis: figma.enum('emphasis', {
16
- high: 'high',
17
- low: 'low'
18
- }),
19
- colorScheme: figma.enum('colorScheme', {
20
- green: 'green',
21
- purple: 'purple',
22
- blue: 'blue',
23
- yellow: 'yellow',
24
- red: 'red',
25
- gray: 'gray'
26
- }),
27
- children: figma.nestedProps('string.info tags', {
28
- node: figma.enum('Ready-made', {
29
- Custom: figma.string('string'),
30
- 'Most popular': figma.textContent('tag-label'),
31
- New: figma.textContent('tag-label'),
32
- 'Needs review': figma.textContent('tag-label'),
33
- 'Not verified': figma.textContent('tag-label'),
34
- Recommended: figma.textContent('tag-label')
35
- })
36
- })
37
- },
38
- example: _ref => {
39
- let {
40
- children
41
- } = _ref,
42
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
43
- return /*#__PURE__*/_jsx(Tag, _extends({}, props, {
44
- children: children.node
45
- }));
46
- }
47
- });
48
- figma.connect(Tag, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=68%3A996', {
49
- imports: ["import { Tag } from '@coinbase/cds-mobile/tag/Tag'"],
50
- variant: {
51
- intent: 'promotional'
52
- },
53
- props: {
54
- emphasis: figma.enum('emphasis', {
55
- high: 'high',
56
- low: 'low'
57
- }),
58
- colorScheme: figma.enum('colorScheme', {
59
- green: 'green',
60
- purple: 'purple',
61
- blue: 'blue',
62
- yellow: 'yellow',
63
- red: 'red',
64
- gray: 'gray'
65
- }),
66
- children: figma.nestedProps('string.promo tags', {
67
- node: figma.enum('Ready-made', {
68
- Custom: figma.string('string'),
69
- 'Most popular': figma.textContent('tag-label'),
70
- New: figma.textContent('tag-label'),
71
- Recommended: figma.textContent('tag-label')
72
- })
73
- })
74
- },
75
- example: _ref2 => {
76
- let {
77
- children
78
- } = _ref2,
79
- props = _objectWithoutPropertiesLoose(_ref2, _excluded2);
80
- return /*#__PURE__*/_jsx(Tag, _extends({
81
- intent: "promotional"
82
- }, props, {
83
- children: children.node
84
- }));
85
- }
86
- });
@@ -1,28 +0,0 @@
1
- const _excluded = ["children"];
2
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
3
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
4
- import { figma } from '@figma/code-connect';
5
- import { Link } from '../Link';
6
- import { jsx as _jsx } from "react/jsx-runtime";
7
- figma.connect(Link, 'https://www.figma.com/design/k5CtyJccNQUGMI5bI4lJ2g/✨-CDS-Components?node-id=324-14982&m=dev', {
8
- imports: ["import { Link } from '@coinbase/cds-mobile/typography/Link'"],
9
- props: {
10
- children: figma.string('string'),
11
- color: figma.enum('variant', {
12
- primary: 'fgPrimary',
13
- foreground: 'fg',
14
- negativeForeground: 'fgNegative'
15
- }),
16
- // Note: variant prop removed in v8 - Link now wraps Text component
17
- underline: figma.boolean('underline')
18
- },
19
- example: _ref => {
20
- let {
21
- children
22
- } = _ref,
23
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
24
- return /*#__PURE__*/_jsx(Link, _extends({}, props, {
25
- children: children
26
- }));
27
- }
28
- });