@lidofinance/lido-app-ui 1.5.0 → 1.6.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 (261) hide show
  1. package/dist/cjs/accordion/Accordion.cjs +5 -0
  2. package/dist/cjs/accordion/Accordion.cjs.map +1 -1
  3. package/dist/cjs/badge/Badge.cjs +3 -0
  4. package/dist/cjs/badge/Badge.cjs.map +1 -1
  5. package/dist/cjs/banner/Banner.cjs +6 -0
  6. package/dist/cjs/banner/Banner.cjs.map +1 -1
  7. package/dist/cjs/button/Button.cjs +5 -0
  8. package/dist/cjs/button/Button.cjs.map +1 -1
  9. package/dist/cjs/card/Card.cjs +2 -0
  10. package/dist/cjs/card/Card.cjs.map +1 -1
  11. package/dist/cjs/checkbox/Checkbox.cjs +4 -0
  12. package/dist/cjs/checkbox/Checkbox.cjs.map +1 -1
  13. package/dist/cjs/counter/Counter.cjs +2 -0
  14. package/dist/cjs/counter/Counter.cjs.map +1 -1
  15. package/dist/cjs/data-list/DataList.cjs +5 -1
  16. package/dist/cjs/data-list/DataList.cjs.map +1 -1
  17. package/dist/cjs/data-list/DataListRow.cjs +10 -1
  18. package/dist/cjs/data-list/DataListRow.cjs.map +1 -1
  19. package/dist/cjs/icon-button/IconButton.cjs +3 -0
  20. package/dist/cjs/icon-button/IconButton.cjs.map +1 -1
  21. package/dist/cjs/identicon/Identicon.cjs +8 -2
  22. package/dist/cjs/identicon/Identicon.cjs.map +1 -1
  23. package/dist/cjs/input/Input.cjs +7 -0
  24. package/dist/cjs/input/Input.cjs.map +1 -1
  25. package/dist/cjs/message-box/MessageBox.cjs +5 -0
  26. package/dist/cjs/message-box/MessageBox.cjs.map +1 -1
  27. package/dist/cjs/modal/Modal.cjs +13 -2
  28. package/dist/cjs/modal/Modal.cjs.map +1 -1
  29. package/dist/cjs/notification/Notification.cjs +10 -1
  30. package/dist/cjs/notification/Notification.cjs.map +1 -1
  31. package/dist/cjs/radio-button/RadioButton.cjs +4 -0
  32. package/dist/cjs/radio-button/RadioButton.cjs.map +1 -1
  33. package/dist/cjs/rich-input/RichInput.cjs +9 -0
  34. package/dist/cjs/rich-input/RichInput.cjs.map +1 -1
  35. package/dist/cjs/section-title/SectionTitle.cjs +5 -0
  36. package/dist/cjs/section-title/SectionTitle.cjs.map +1 -1
  37. package/dist/cjs/segmented-control/Segment.cjs +3 -0
  38. package/dist/cjs/segmented-control/Segment.cjs.map +1 -1
  39. package/dist/cjs/segmented-control/SegmentCard.cjs +8 -0
  40. package/dist/cjs/segmented-control/SegmentCard.cjs.map +1 -1
  41. package/dist/cjs/segmented-control/SegmentedControl.cjs +6 -1
  42. package/dist/cjs/segmented-control/SegmentedControl.cjs.map +1 -1
  43. package/dist/cjs/segmented-control/SegmentedControlCard.cjs +6 -1
  44. package/dist/cjs/segmented-control/SegmentedControlCard.cjs.map +1 -1
  45. package/dist/cjs/slider/Slider.cjs +3 -0
  46. package/dist/cjs/slider/Slider.cjs.map +1 -1
  47. package/dist/cjs/small-card/SmallCard.cjs +8 -0
  48. package/dist/cjs/small-card/SmallCard.cjs.map +1 -1
  49. package/dist/cjs/stat-item/StatItem.cjs +8 -0
  50. package/dist/cjs/stat-item/StatItem.cjs.map +1 -1
  51. package/dist/cjs/switch/Switch.cjs +4 -0
  52. package/dist/cjs/switch/Switch.cjs.map +1 -1
  53. package/dist/cjs/tabs/Tab.cjs +2 -0
  54. package/dist/cjs/tabs/Tab.cjs.map +1 -1
  55. package/dist/cjs/tabs/Tabs.cjs +6 -1
  56. package/dist/cjs/tabs/Tabs.cjs.map +1 -1
  57. package/dist/cjs/tag/Tag.cjs +4 -0
  58. package/dist/cjs/tag/Tag.cjs.map +1 -1
  59. package/dist/cjs/text-link/TextLink.cjs +3 -0
  60. package/dist/cjs/text-link/TextLink.cjs.map +1 -1
  61. package/dist/cjs/token-amount/TokenAmount.cjs +8 -2
  62. package/dist/cjs/token-amount/TokenAmount.cjs.map +1 -1
  63. package/dist/cjs/token-selector/TokenSelector.cjs +20 -1
  64. package/dist/cjs/token-selector/TokenSelector.cjs.map +1 -1
  65. package/dist/cjs/tooltip/Tooltip.cjs +3 -0
  66. package/dist/cjs/tooltip/Tooltip.cjs.map +1 -1
  67. package/dist/cjs/tx-status/TxStatus.cjs +9 -1
  68. package/dist/cjs/tx-status/TxStatus.cjs.map +1 -1
  69. package/dist/cjs/typography/Typography.cjs +2 -0
  70. package/dist/cjs/typography/Typography.cjs.map +1 -1
  71. package/dist/esm/accordion/Accordion.mjs +5 -0
  72. package/dist/esm/accordion/Accordion.mjs.map +1 -1
  73. package/dist/esm/badge/Badge.mjs +3 -0
  74. package/dist/esm/badge/Badge.mjs.map +1 -1
  75. package/dist/esm/banner/Banner.mjs +6 -0
  76. package/dist/esm/banner/Banner.mjs.map +1 -1
  77. package/dist/esm/button/Button.mjs +5 -0
  78. package/dist/esm/button/Button.mjs.map +1 -1
  79. package/dist/esm/card/Card.mjs +2 -0
  80. package/dist/esm/card/Card.mjs.map +1 -1
  81. package/dist/esm/checkbox/Checkbox.mjs +4 -0
  82. package/dist/esm/checkbox/Checkbox.mjs.map +1 -1
  83. package/dist/esm/counter/Counter.mjs +2 -0
  84. package/dist/esm/counter/Counter.mjs.map +1 -1
  85. package/dist/esm/data-list/DataList.mjs +5 -1
  86. package/dist/esm/data-list/DataList.mjs.map +1 -1
  87. package/dist/esm/data-list/DataListRow.mjs +10 -1
  88. package/dist/esm/data-list/DataListRow.mjs.map +1 -1
  89. package/dist/esm/icon-button/IconButton.mjs +3 -0
  90. package/dist/esm/icon-button/IconButton.mjs.map +1 -1
  91. package/dist/esm/identicon/Identicon.mjs +8 -2
  92. package/dist/esm/identicon/Identicon.mjs.map +1 -1
  93. package/dist/esm/input/Input.mjs +7 -0
  94. package/dist/esm/input/Input.mjs.map +1 -1
  95. package/dist/esm/message-box/MessageBox.mjs +5 -0
  96. package/dist/esm/message-box/MessageBox.mjs.map +1 -1
  97. package/dist/esm/modal/Modal.mjs +13 -2
  98. package/dist/esm/modal/Modal.mjs.map +1 -1
  99. package/dist/esm/notification/Notification.mjs +10 -1
  100. package/dist/esm/notification/Notification.mjs.map +1 -1
  101. package/dist/esm/radio-button/RadioButton.mjs +4 -0
  102. package/dist/esm/radio-button/RadioButton.mjs.map +1 -1
  103. package/dist/esm/rich-input/RichInput.mjs +9 -0
  104. package/dist/esm/rich-input/RichInput.mjs.map +1 -1
  105. package/dist/esm/section-title/SectionTitle.mjs +5 -0
  106. package/dist/esm/section-title/SectionTitle.mjs.map +1 -1
  107. package/dist/esm/segmented-control/Segment.mjs +3 -0
  108. package/dist/esm/segmented-control/Segment.mjs.map +1 -1
  109. package/dist/esm/segmented-control/SegmentCard.mjs +8 -0
  110. package/dist/esm/segmented-control/SegmentCard.mjs.map +1 -1
  111. package/dist/esm/segmented-control/SegmentedControl.mjs +6 -1
  112. package/dist/esm/segmented-control/SegmentedControl.mjs.map +1 -1
  113. package/dist/esm/segmented-control/SegmentedControlCard.mjs +6 -1
  114. package/dist/esm/segmented-control/SegmentedControlCard.mjs.map +1 -1
  115. package/dist/esm/slider/Slider.mjs +3 -0
  116. package/dist/esm/slider/Slider.mjs.map +1 -1
  117. package/dist/esm/small-card/SmallCard.mjs +8 -0
  118. package/dist/esm/small-card/SmallCard.mjs.map +1 -1
  119. package/dist/esm/stat-item/StatItem.mjs +8 -0
  120. package/dist/esm/stat-item/StatItem.mjs.map +1 -1
  121. package/dist/esm/switch/Switch.mjs +4 -0
  122. package/dist/esm/switch/Switch.mjs.map +1 -1
  123. package/dist/esm/tabs/Tab.mjs +2 -0
  124. package/dist/esm/tabs/Tab.mjs.map +1 -1
  125. package/dist/esm/tabs/Tabs.mjs +6 -1
  126. package/dist/esm/tabs/Tabs.mjs.map +1 -1
  127. package/dist/esm/tag/Tag.mjs +4 -0
  128. package/dist/esm/tag/Tag.mjs.map +1 -1
  129. package/dist/esm/text-link/TextLink.mjs +3 -0
  130. package/dist/esm/text-link/TextLink.mjs.map +1 -1
  131. package/dist/esm/token-amount/TokenAmount.mjs +8 -2
  132. package/dist/esm/token-amount/TokenAmount.mjs.map +1 -1
  133. package/dist/esm/token-selector/TokenSelector.mjs +20 -1
  134. package/dist/esm/token-selector/TokenSelector.mjs.map +1 -1
  135. package/dist/esm/tooltip/Tooltip.mjs +3 -0
  136. package/dist/esm/tooltip/Tooltip.mjs.map +1 -1
  137. package/dist/esm/tx-status/TxStatus.mjs +9 -1
  138. package/dist/esm/tx-status/TxStatus.mjs.map +1 -1
  139. package/dist/esm/typography/Typography.mjs +2 -0
  140. package/dist/esm/typography/Typography.mjs.map +1 -1
  141. package/dist/types/accordion/Accordion.d.ts +8 -1
  142. package/dist/types/accordion/Accordion.d.ts.map +1 -1
  143. package/dist/types/badge/Badge.d.ts +6 -1
  144. package/dist/types/badge/Badge.d.ts.map +1 -1
  145. package/dist/types/badge/index.d.ts +1 -1
  146. package/dist/types/badge/index.d.ts.map +1 -1
  147. package/dist/types/banner/Banner.d.ts +9 -1
  148. package/dist/types/banner/Banner.d.ts.map +1 -1
  149. package/dist/types/button/Button.d.ts +8 -1
  150. package/dist/types/button/Button.d.ts.map +1 -1
  151. package/dist/types/button/index.d.ts +1 -1
  152. package/dist/types/button/index.d.ts.map +1 -1
  153. package/dist/types/card/Card.d.ts +7 -2
  154. package/dist/types/card/Card.d.ts.map +1 -1
  155. package/dist/types/card/index.d.ts +1 -1
  156. package/dist/types/card/index.d.ts.map +1 -1
  157. package/dist/types/checkbox/Checkbox.d.ts +7 -0
  158. package/dist/types/checkbox/Checkbox.d.ts.map +1 -1
  159. package/dist/types/checkbox/index.d.ts +1 -1
  160. package/dist/types/checkbox/index.d.ts.map +1 -1
  161. package/dist/types/counter/Counter.d.ts +5 -1
  162. package/dist/types/counter/Counter.d.ts.map +1 -1
  163. package/dist/types/counter/index.d.ts +1 -1
  164. package/dist/types/counter/index.d.ts.map +1 -1
  165. package/dist/types/data-list/DataList.d.ts +7 -4
  166. package/dist/types/data-list/DataList.d.ts.map +1 -1
  167. package/dist/types/data-list/DataListRow.d.ts +11 -4
  168. package/dist/types/data-list/DataListRow.d.ts.map +1 -1
  169. package/dist/types/data-list/index.d.ts +2 -2
  170. package/dist/types/data-list/index.d.ts.map +1 -1
  171. package/dist/types/icon-button/IconButton.d.ts +6 -1
  172. package/dist/types/icon-button/IconButton.d.ts.map +1 -1
  173. package/dist/types/icon-button/index.d.ts +1 -1
  174. package/dist/types/icon-button/index.d.ts.map +1 -1
  175. package/dist/types/identicon/Identicon.d.ts +11 -3
  176. package/dist/types/identicon/Identicon.d.ts.map +1 -1
  177. package/dist/types/identicon/index.d.ts +1 -1
  178. package/dist/types/identicon/index.d.ts.map +1 -1
  179. package/dist/types/input/Input.d.ts +10 -0
  180. package/dist/types/input/Input.d.ts.map +1 -1
  181. package/dist/types/message-box/MessageBox.d.ts +8 -1
  182. package/dist/types/message-box/MessageBox.d.ts.map +1 -1
  183. package/dist/types/message-box/index.d.ts +1 -1
  184. package/dist/types/message-box/index.d.ts.map +1 -1
  185. package/dist/types/modal/Modal.d.ts +12 -4
  186. package/dist/types/modal/Modal.d.ts.map +1 -1
  187. package/dist/types/modal/index.d.ts +1 -1
  188. package/dist/types/modal/index.d.ts.map +1 -1
  189. package/dist/types/notification/Notification.d.ts +15 -6
  190. package/dist/types/notification/Notification.d.ts.map +1 -1
  191. package/dist/types/notification/index.d.ts +1 -1
  192. package/dist/types/notification/index.d.ts.map +1 -1
  193. package/dist/types/radio-button/RadioButton.d.ts +7 -0
  194. package/dist/types/radio-button/RadioButton.d.ts.map +1 -1
  195. package/dist/types/radio-button/index.d.ts +1 -1
  196. package/dist/types/radio-button/index.d.ts.map +1 -1
  197. package/dist/types/rich-input/RichInput.d.ts +11 -1
  198. package/dist/types/rich-input/RichInput.d.ts.map +1 -1
  199. package/dist/types/rich-input/index.d.ts +1 -1
  200. package/dist/types/rich-input/index.d.ts.map +1 -1
  201. package/dist/types/section-title/SectionTitle.d.ts +8 -1
  202. package/dist/types/section-title/SectionTitle.d.ts.map +1 -1
  203. package/dist/types/section-title/index.d.ts +1 -1
  204. package/dist/types/section-title/index.d.ts.map +1 -1
  205. package/dist/types/segmented-control/Segment.d.ts +6 -0
  206. package/dist/types/segmented-control/Segment.d.ts.map +1 -1
  207. package/dist/types/segmented-control/SegmentCard.d.ts +9 -0
  208. package/dist/types/segmented-control/SegmentCard.d.ts.map +1 -1
  209. package/dist/types/segmented-control/SegmentedControl.d.ts +9 -4
  210. package/dist/types/segmented-control/SegmentedControl.d.ts.map +1 -1
  211. package/dist/types/segmented-control/SegmentedControlCard.d.ts +9 -4
  212. package/dist/types/segmented-control/SegmentedControlCard.d.ts.map +1 -1
  213. package/dist/types/segmented-control/index.d.ts +4 -4
  214. package/dist/types/segmented-control/index.d.ts.map +1 -1
  215. package/dist/types/slider/Slider.d.ts +6 -0
  216. package/dist/types/slider/Slider.d.ts.map +1 -1
  217. package/dist/types/slider/index.d.ts +1 -1
  218. package/dist/types/slider/index.d.ts.map +1 -1
  219. package/dist/types/small-card/SmallCard.d.ts +11 -1
  220. package/dist/types/small-card/SmallCard.d.ts.map +1 -1
  221. package/dist/types/small-card/index.d.ts +1 -1
  222. package/dist/types/small-card/index.d.ts.map +1 -1
  223. package/dist/types/stat-item/StatItem.d.ts +10 -1
  224. package/dist/types/stat-item/StatItem.d.ts.map +1 -1
  225. package/dist/types/stat-item/index.d.ts +1 -1
  226. package/dist/types/stat-item/index.d.ts.map +1 -1
  227. package/dist/types/switch/Switch.d.ts +7 -0
  228. package/dist/types/switch/Switch.d.ts.map +1 -1
  229. package/dist/types/switch/index.d.ts +1 -1
  230. package/dist/types/switch/index.d.ts.map +1 -1
  231. package/dist/types/tabs/Tab.d.ts +5 -0
  232. package/dist/types/tabs/Tab.d.ts.map +1 -1
  233. package/dist/types/tabs/Tabs.d.ts +9 -4
  234. package/dist/types/tabs/Tabs.d.ts.map +1 -1
  235. package/dist/types/tabs/index.d.ts +2 -2
  236. package/dist/types/tabs/index.d.ts.map +1 -1
  237. package/dist/types/tag/Tag.d.ts +7 -1
  238. package/dist/types/tag/Tag.d.ts.map +1 -1
  239. package/dist/types/tag/index.d.ts +1 -1
  240. package/dist/types/tag/index.d.ts.map +1 -1
  241. package/dist/types/text-link/TextLink.d.ts +6 -1
  242. package/dist/types/text-link/TextLink.d.ts.map +1 -1
  243. package/dist/types/text-link/index.d.ts +1 -1
  244. package/dist/types/text-link/index.d.ts.map +1 -1
  245. package/dist/types/token-amount/TokenAmount.d.ts +9 -4
  246. package/dist/types/token-amount/TokenAmount.d.ts.map +1 -1
  247. package/dist/types/token-selector/TokenSelector.d.ts +17 -4
  248. package/dist/types/token-selector/TokenSelector.d.ts.map +1 -1
  249. package/dist/types/token-selector/index.d.ts +1 -1
  250. package/dist/types/token-selector/index.d.ts.map +1 -1
  251. package/dist/types/tooltip/Tooltip.d.ts +6 -1
  252. package/dist/types/tooltip/Tooltip.d.ts.map +1 -1
  253. package/dist/types/tooltip/index.d.ts +1 -1
  254. package/dist/types/tooltip/index.d.ts.map +1 -1
  255. package/dist/types/tx-status/TxStatus.d.ts +11 -4
  256. package/dist/types/tx-status/TxStatus.d.ts.map +1 -1
  257. package/dist/types/tx-status/index.d.ts +1 -1
  258. package/dist/types/tx-status/index.d.ts.map +1 -1
  259. package/dist/types/typography/Typography.d.ts +5 -1
  260. package/dist/types/typography/Typography.d.ts.map +1 -1
  261. package/package.json +1 -1
@@ -13,7 +13,9 @@ const SegmentedControlCard = _ref => {
13
13
  items,
14
14
  value,
15
15
  onChange,
16
- className
16
+ className,
17
+ dataTestId,
18
+ ...rest
17
19
  } = _ref;
18
20
  const containerRef = react.useRef(null);
19
21
  const activeButtonRef = react.useRef(null);
@@ -48,6 +50,8 @@ const SegmentedControlCard = _ref => {
48
50
  ref: containerRef,
49
51
  role: "tablist",
50
52
  className: cn(SegmentedControlCard_module.segmentedControlCard, className),
53
+ "data-testid": dataTestId?.root,
54
+ ...rest,
51
55
  children: [/*#__PURE__*/jsxRuntime.jsx("div", {
52
56
  ref: selectionRef,
53
57
  "aria-hidden": "true",
@@ -62,6 +66,7 @@ const SegmentedControlCard = _ref => {
62
66
  title: item.title,
63
67
  tag: item.tag,
64
68
  description: item.description,
69
+ dataTestId: item.dataTestId,
65
70
  onClick: () => {
66
71
  if (item.value !== value) onChange(item.value);
67
72
  }
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControlCard.cjs","sources":["../../../src/segmented-control/SegmentedControlCard.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState, type ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { SegmentCard } from './SegmentCard'\nimport styles from './SegmentedControlCard.module.css'\n\nexport type SegmentCardItem = {\n value: string\n title: ReactNode\n description?: ReactNode\n icon?: ReactNode\n tag?: ReactNode\n disabled?: boolean\n}\n\nexport type SegmentedControlCardProps = {\n items: SegmentCardItem[]\n value: string\n onChange: (value: string) => void\n className?: string\n}\n\nexport const SegmentedControlCard = ({\n items,\n value,\n onChange,\n className,\n}: SegmentedControlCardProps) => {\n const containerRef = useRef<HTMLDivElement>(null)\n const activeButtonRef = useRef<HTMLButtonElement>(null)\n const selectionRef = useRef<HTMLDivElement>(null)\n // Skip the transition on the first measurement so the highlight doesn't fly in from 0,0.\n const [animated, setAnimated] = useState(false)\n\n useLayoutEffect(() => {\n const updateSelection = () => {\n const button = activeButtonRef.current\n const container = containerRef.current\n const selection = selectionRef.current\n if (!button || !container || !selection) return\n\n const buttonRect = button.getBoundingClientRect()\n const containerRect = container.getBoundingClientRect()\n const style = getComputedStyle(container)\n const borderLeft = parseFloat(style.borderLeftWidth) || 0\n const borderTop = parseFloat(style.borderTopWidth) || 0\n const x = buttonRect.left - containerRect.left - borderLeft\n const y = buttonRect.top - containerRect.top - borderTop\n\n selection.style.width = `${buttonRect.width}px`\n selection.style.height = `${buttonRect.height}px`\n selection.style.transform = `translate(${x}px, ${y}px)`\n }\n\n updateSelection()\n setAnimated(true)\n\n window.addEventListener('resize', updateSelection)\n return () => {\n window.removeEventListener('resize', updateSelection)\n }\n }, [value, items])\n\n return (\n <div\n ref={containerRef}\n role='tablist'\n className={cn(styles.segmentedControlCard, className)}\n >\n <div\n ref={selectionRef}\n aria-hidden='true'\n className={cn(styles.selection, animated && styles.animated)}\n />\n {items.map((item) => {\n const active = item.value === value\n return (\n <SegmentCard\n key={item.value}\n ref={active ? activeButtonRef : undefined}\n active={active}\n disabled={item.disabled}\n icon={item.icon}\n title={item.title}\n tag={item.tag}\n description={item.description}\n onClick={() => {\n if (item.value !== value) onChange(item.value)\n }}\n />\n )\n })}\n </div>\n )\n}\n"],"names":["SegmentedControlCard","_ref","items","value","onChange","className","containerRef","useRef","activeButtonRef","selectionRef","animated","setAnimated","useState","useLayoutEffect","updateSelection","button","current","container","selection","buttonRect","getBoundingClientRect","containerRect","style","getComputedStyle","borderLeft","parseFloat","borderLeftWidth","borderTop","borderTopWidth","x","left","y","top","width","height","transform","window","addEventListener","removeEventListener","_jsxs","ref","role","cn","styles","segmentedControlCard","children","_jsx","map","item","active","SegmentCard","undefined","disabled","icon","title","tag","description","onClick"],"mappings":"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"}
1
+ {"version":3,"file":"SegmentedControlCard.cjs","sources":["../../../src/segmented-control/SegmentedControlCard.tsx"],"sourcesContent":["import {\n useLayoutEffect,\n useRef,\n useState,\n type ComponentPropsWithoutRef,\n type ReactNode,\n} from 'react'\n\nimport cn from 'classnames'\n\nimport { SegmentCard, type SegmentCardDataTestId } from './SegmentCard'\nimport styles from './SegmentedControlCard.module.css'\n\nexport type SegmentedControlCardDataTestId = {\n root?: string\n}\n\nexport type SegmentCardItem = {\n value: string\n title: ReactNode\n description?: ReactNode\n icon?: ReactNode\n tag?: ReactNode\n disabled?: boolean\n dataTestId?: SegmentCardDataTestId\n}\n\nexport type SegmentedControlCardProps = Omit<\n ComponentPropsWithoutRef<'div'>,\n 'onChange'\n> & {\n items: SegmentCardItem[]\n value: string\n onChange: (value: string) => void\n dataTestId?: SegmentedControlCardDataTestId\n}\n\nexport const SegmentedControlCard = ({\n items,\n value,\n onChange,\n className,\n dataTestId,\n ...rest\n}: SegmentedControlCardProps) => {\n const containerRef = useRef<HTMLDivElement>(null)\n const activeButtonRef = useRef<HTMLButtonElement>(null)\n const selectionRef = useRef<HTMLDivElement>(null)\n // Skip the transition on the first measurement so the highlight doesn't fly in from 0,0.\n const [animated, setAnimated] = useState(false)\n\n useLayoutEffect(() => {\n const updateSelection = () => {\n const button = activeButtonRef.current\n const container = containerRef.current\n const selection = selectionRef.current\n if (!button || !container || !selection) return\n\n const buttonRect = button.getBoundingClientRect()\n const containerRect = container.getBoundingClientRect()\n const style = getComputedStyle(container)\n const borderLeft = parseFloat(style.borderLeftWidth) || 0\n const borderTop = parseFloat(style.borderTopWidth) || 0\n const x = buttonRect.left - containerRect.left - borderLeft\n const y = buttonRect.top - containerRect.top - borderTop\n\n selection.style.width = `${buttonRect.width}px`\n selection.style.height = `${buttonRect.height}px`\n selection.style.transform = `translate(${x}px, ${y}px)`\n }\n\n updateSelection()\n setAnimated(true)\n\n window.addEventListener('resize', updateSelection)\n return () => {\n window.removeEventListener('resize', updateSelection)\n }\n }, [value, items])\n\n return (\n <div\n ref={containerRef}\n role='tablist'\n className={cn(styles.segmentedControlCard, className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n <div\n ref={selectionRef}\n aria-hidden='true'\n className={cn(styles.selection, animated && styles.animated)}\n />\n {items.map((item) => {\n const active = item.value === value\n return (\n <SegmentCard\n key={item.value}\n ref={active ? activeButtonRef : undefined}\n active={active}\n disabled={item.disabled}\n icon={item.icon}\n title={item.title}\n tag={item.tag}\n description={item.description}\n dataTestId={item.dataTestId}\n onClick={() => {\n if (item.value !== value) onChange(item.value)\n }}\n />\n )\n })}\n </div>\n )\n}\n"],"names":["SegmentedControlCard","_ref","items","value","onChange","className","dataTestId","rest","containerRef","useRef","activeButtonRef","selectionRef","animated","setAnimated","useState","useLayoutEffect","updateSelection","button","current","container","selection","buttonRect","getBoundingClientRect","containerRect","style","getComputedStyle","borderLeft","parseFloat","borderLeftWidth","borderTop","borderTopWidth","x","left","y","top","width","height","transform","window","addEventListener","removeEventListener","_jsxs","ref","role","cn","styles","segmentedControlCard","root","children","_jsx","map","item","active","SegmentCard","undefined","disabled","icon","title","tag","description","onClick"],"mappings":"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"}
@@ -20,6 +20,7 @@ const Slider = /*#__PURE__*/react.forwardRef((_ref, ref) => {
20
20
  className,
21
21
  disabled,
22
22
  onChange,
23
+ dataTestId,
23
24
  ...rest
24
25
  } = _ref;
25
26
  const [innerValue, setInnerValue] = react.useState(defaultValue ?? min);
@@ -35,6 +36,7 @@ const Slider = /*#__PURE__*/react.forwardRef((_ref, ref) => {
35
36
  }, (_, index) => (index + 1) / stepsCount * 100) : [];
36
37
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
37
38
  className: cn(Slider_module.root, className),
39
+ "data-testid": dataTestId?.root,
38
40
  children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
39
41
  className: Slider_module.track,
40
42
  children: [/*#__PURE__*/jsxRuntime.jsx("div", {
@@ -60,6 +62,7 @@ const Slider = /*#__PURE__*/react.forwardRef((_ref, ref) => {
60
62
  value: current,
61
63
  disabled: disabled,
62
64
  onChange: handleChange,
65
+ "data-testid": dataTestId?.input,
63
66
  ...rest
64
67
  })]
65
68
  }), minLabel != null || maxLabel != null ? /*#__PURE__*/jsxRuntime.jsxs("div", {
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.cjs","sources":["../../../src/slider/Slider.tsx"],"sourcesContent":["import {\n forwardRef,\n useState,\n type ChangeEvent,\n type InputHTMLAttributes,\n type ReactNode,\n} from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Slider.module.css'\n\nexport type SliderProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'type' | 'value' | 'defaultValue'\n> & {\n min?: number\n max?: number\n step?: number\n value?: number\n defaultValue?: number\n minLabel?: ReactNode\n maxLabel?: ReactNode\n /** Renders a mark at every intermediate step. */\n marks?: boolean\n}\n\nexport const Slider = forwardRef<HTMLInputElement, SliderProps>(\n (\n {\n min = 0,\n max = 100,\n step = 1,\n value,\n defaultValue,\n minLabel,\n maxLabel,\n marks = false,\n className,\n disabled,\n onChange,\n ...rest\n },\n ref,\n ) => {\n const [innerValue, setInnerValue] = useState(defaultValue ?? min)\n const current = value ?? innerValue\n const fillPercent = ((current - min) / (max - min)) * 100\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n setInnerValue(event.target.valueAsNumber)\n onChange?.(event)\n }\n\n const stepsCount = Math.round((max - min) / step)\n const markPositions =\n marks && stepsCount > 1\n ? Array.from(\n { length: stepsCount - 1 },\n (_, index) => ((index + 1) / stepsCount) * 100,\n )\n : []\n\n return (\n <div className={cn(styles.root, className)}>\n <div className={styles.track}>\n <div className={styles.bar}>\n <div\n className={cn(styles.fill, disabled && styles.fillDisabled)}\n style={{ width: `${fillPercent}%` }}\n />\n </div>\n {markPositions.map((position) => (\n <span\n key={position}\n className={styles.mark}\n style={{ left: `${position}%` }}\n />\n ))}\n <input\n ref={ref}\n type='range'\n className={styles.input}\n min={min}\n max={max}\n step={step}\n value={current}\n disabled={disabled}\n onChange={handleChange}\n {...rest}\n />\n </div>\n {minLabel != null || maxLabel != null ? (\n <div className={styles.labels}>\n <span className={styles.label}>{minLabel}</span>\n <span className={styles.label}>{maxLabel}</span>\n </div>\n ) : null}\n </div>\n )\n },\n)\n\nSlider.displayName = 'Slider'\n"],"names":["Slider","forwardRef","_ref","ref","min","max","step","value","defaultValue","minLabel","maxLabel","marks","className","disabled","onChange","rest","innerValue","setInnerValue","useState","current","fillPercent","handleChange","event","target","valueAsNumber","stepsCount","Math","round","markPositions","Array","from","length","_","index","_jsxs","cn","styles","root","children","track","_jsx","bar","fill","fillDisabled","style","width","map","position","mark","left","type","input","labels","label","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"Slider.cjs","sources":["../../../src/slider/Slider.tsx"],"sourcesContent":["import {\n forwardRef,\n useState,\n type ChangeEvent,\n type InputHTMLAttributes,\n type ReactNode,\n} from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Slider.module.css'\n\nexport type SliderDataTestId = {\n root?: string\n input?: string\n}\n\nexport type SliderProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'type' | 'value' | 'defaultValue'\n> & {\n min?: number\n max?: number\n step?: number\n value?: number\n defaultValue?: number\n minLabel?: ReactNode\n maxLabel?: ReactNode\n /** Renders a mark at every intermediate step. */\n marks?: boolean\n dataTestId?: SliderDataTestId\n}\n\nexport const Slider = forwardRef<HTMLInputElement, SliderProps>(\n (\n {\n min = 0,\n max = 100,\n step = 1,\n value,\n defaultValue,\n minLabel,\n maxLabel,\n marks = false,\n className,\n disabled,\n onChange,\n dataTestId,\n ...rest\n },\n ref,\n ) => {\n const [innerValue, setInnerValue] = useState(defaultValue ?? min)\n const current = value ?? innerValue\n const fillPercent = ((current - min) / (max - min)) * 100\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n setInnerValue(event.target.valueAsNumber)\n onChange?.(event)\n }\n\n const stepsCount = Math.round((max - min) / step)\n const markPositions =\n marks && stepsCount > 1\n ? Array.from(\n { length: stepsCount - 1 },\n (_, index) => ((index + 1) / stepsCount) * 100,\n )\n : []\n\n return (\n <div\n className={cn(styles.root, className)}\n data-testid={dataTestId?.root}\n >\n <div className={styles.track}>\n <div className={styles.bar}>\n <div\n className={cn(styles.fill, disabled && styles.fillDisabled)}\n style={{ width: `${fillPercent}%` }}\n />\n </div>\n {markPositions.map((position) => (\n <span\n key={position}\n className={styles.mark}\n style={{ left: `${position}%` }}\n />\n ))}\n <input\n ref={ref}\n type='range'\n className={styles.input}\n min={min}\n max={max}\n step={step}\n value={current}\n disabled={disabled}\n onChange={handleChange}\n data-testid={dataTestId?.input}\n {...rest}\n />\n </div>\n {minLabel != null || maxLabel != null ? (\n <div className={styles.labels}>\n <span className={styles.label}>{minLabel}</span>\n <span className={styles.label}>{maxLabel}</span>\n </div>\n ) : null}\n </div>\n )\n },\n)\n\nSlider.displayName = 'Slider'\n"],"names":["Slider","forwardRef","_ref","ref","min","max","step","value","defaultValue","minLabel","maxLabel","marks","className","disabled","onChange","dataTestId","rest","innerValue","setInnerValue","useState","current","fillPercent","handleChange","event","target","valueAsNumber","stepsCount","Math","round","markPositions","Array","from","length","_","index","_jsxs","cn","styles","root","children","track","_jsx","bar","fill","fillDisabled","style","width","map","position","mark","left","type","input","labels","label","displayName"],"mappings":"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"}
@@ -15,35 +15,43 @@ const SmallCard = _ref => {
15
15
  description,
16
16
  footer,
17
17
  className,
18
+ dataTestId,
18
19
  ...rest
19
20
  } = _ref;
20
21
  return /*#__PURE__*/jsxRuntime.jsxs("a", {
21
22
  className: cn(SmallCard_module.card, className),
23
+ "data-testid": dataTestId?.root,
22
24
  ...rest,
23
25
  children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
24
26
  className: SmallCard_module.content,
25
27
  children: [image != null ? /*#__PURE__*/jsxRuntime.jsx("div", {
26
28
  className: SmallCard_module.image,
29
+ "data-testid": dataTestId?.image,
27
30
  children: image
28
31
  }) : null, /*#__PURE__*/jsxRuntime.jsxs("div", {
29
32
  className: SmallCard_module.header,
30
33
  children: [logo != null ? /*#__PURE__*/jsxRuntime.jsx("span", {
31
34
  className: SmallCard_module.logo,
35
+ "data-testid": dataTestId?.logo,
32
36
  children: logo
33
37
  }) : null, /*#__PURE__*/jsxRuntime.jsx("span", {
34
38
  className: SmallCard_module.title,
39
+ "data-testid": dataTestId?.title,
35
40
  children: title
36
41
  }), icon != null ? /*#__PURE__*/jsxRuntime.jsx("span", {
37
42
  className: SmallCard_module.icon,
38
43
  "aria-hidden": "true",
44
+ "data-testid": dataTestId?.icon,
39
45
  children: icon
40
46
  }) : null]
41
47
  }), description != null ? /*#__PURE__*/jsxRuntime.jsx("p", {
42
48
  className: SmallCard_module.description,
49
+ "data-testid": dataTestId?.description,
43
50
  children: description
44
51
  }) : null]
45
52
  }), footer != null ? /*#__PURE__*/jsxRuntime.jsx("div", {
46
53
  className: SmallCard_module.footer,
54
+ "data-testid": dataTestId?.footer,
47
55
  children: footer
48
56
  }) : null]
49
57
  });
@@ -1 +1 @@
1
- {"version":3,"file":"SmallCard.cjs","sources":["../../../src/small-card/SmallCard.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './SmallCard.module.css'\n\nexport type SmallCardProps = Omit<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n 'title'\n> & {\n /** Fixed-height (120px) media slot above the header — an image or illustration. */\n image?: ReactNode\n logo?: ReactNode\n /** Trailing glyph next to the title — an external-link arrow, a badge, etc. */\n icon?: ReactNode\n title: ReactNode\n description?: ReactNode\n /** Arbitrary content below the description — wraps in a row, e.g. a list of `Tag`s. */\n footer?: ReactNode\n}\n\nexport const SmallCard = ({\n image,\n logo,\n icon,\n title,\n description,\n footer,\n className,\n ...rest\n}: SmallCardProps) => (\n <a className={cn(styles.card, className)} {...rest}>\n <div className={styles.content}>\n {image != null ? <div className={styles.image}>{image}</div> : null}\n <div className={styles.header}>\n {logo != null ? <span className={styles.logo}>{logo}</span> : null}\n <span className={styles.title}>{title}</span>\n {icon != null ? (\n <span className={styles.icon} aria-hidden='true'>\n {icon}\n </span>\n ) : null}\n </div>\n {description != null ? (\n <p className={styles.description}>{description}</p>\n ) : null}\n </div>\n {footer != null ? <div className={styles.footer}>{footer}</div> : null}\n </a>\n)\n"],"names":["SmallCard","_ref","image","logo","icon","title","description","footer","className","rest","_jsxs","cn","styles","card","children","content","_jsx","header"],"mappings":";;;;;;;;AAqBO,MAAMA,SAAS,GAAGC,IAAA,IAAA;EAAA,IAAC;IACxBC,KAAK;IACLC,IAAI;IACJC,IAAI;IACJC,KAAK;IACLC,WAAW;IACXC,MAAM;IACNC,SAAS;IACT,GAAGC,IAAAA;AACW,GAAC,GAAAR,IAAA,CAAA;AAAA,EAAA,oBACfS,eAAA,CAAA,GAAA,EAAA;IAAGF,SAAS,EAAEG,EAAE,CAACC,gBAAM,CAACC,IAAI,EAAEL,SAAS,CAAE;AAAA,IAAA,GAAKC,IAAI;AAAAK,IAAAA,QAAA,gBAChDJ,eAAA,CAAA,KAAA,EAAA;MAAKF,SAAS,EAAEI,gBAAM,CAACG,OAAQ;AAAAD,MAAAA,QAAA,EAC5BZ,CAAAA,KAAK,IAAI,IAAI,gBAAGc,cAAA,CAAA,KAAA,EAAA;QAAKR,SAAS,EAAEI,gBAAM,CAACV,KAAM;AAAAY,QAAAA,QAAA,EAAEZ,KAAAA;AAAK,OAAM,CAAC,GAAG,IAAI,eACnEQ,eAAA,CAAA,KAAA,EAAA;QAAKF,SAAS,EAAEI,gBAAM,CAACK,MAAO;AAAAH,QAAAA,QAAA,EAC3BX,CAAAA,IAAI,IAAI,IAAI,gBAAGa,cAAA,CAAA,MAAA,EAAA;UAAMR,SAAS,EAAEI,gBAAM,CAACT,IAAK;AAAAW,UAAAA,QAAA,EAAEX,IAAAA;AAAI,SAAO,CAAC,GAAG,IAAI,eAClEa,cAAA,CAAA,MAAA,EAAA;UAAMR,SAAS,EAAEI,gBAAM,CAACP,KAAM;AAAAS,UAAAA,QAAA,EAAET,KAAAA;AAAK,SAAO,CAAC,EAC5CD,IAAI,IAAI,IAAI,gBACXY,cAAA,CAAA,MAAA,EAAA;UAAMR,SAAS,EAAEI,gBAAM,CAACR,IAAK;AAAC,UAAA,aAAA,EAAY,MAAM;AAAAU,UAAAA,QAAA,EAC7CV,IAAAA;SACG,CAAC,GACL,IAAI,CAAA;AAAA,OACL,CAAC,EACLE,WAAW,IAAI,IAAI,gBAClBU,cAAA,CAAA,GAAA,EAAA;QAAGR,SAAS,EAAEI,gBAAM,CAACN,WAAY;AAAAQ,QAAAA,QAAA,EAAER,WAAAA;OAAe,CAAC,GACjD,IAAI,CAAA;AAAA,KACL,CAAC,EACLC,MAAM,IAAI,IAAI,gBAAGS,cAAA,CAAA,KAAA,EAAA;MAAKR,SAAS,EAAEI,gBAAM,CAACL,MAAO;AAAAO,MAAAA,QAAA,EAAEP,MAAAA;KAAY,CAAC,GAAG,IAAI,CAAA;AAAA,GACrE,CAAC,CAAA;AAAA;;;;"}
1
+ {"version":3,"file":"SmallCard.cjs","sources":["../../../src/small-card/SmallCard.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './SmallCard.module.css'\n\nexport type SmallCardDataTestId = {\n root?: string\n image?: string\n logo?: string\n icon?: string\n title?: string\n description?: string\n footer?: string\n}\n\nexport type SmallCardProps = Omit<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n 'title'\n> & {\n /** Fixed-height (120px) media slot above the header — an image or illustration. */\n image?: ReactNode\n logo?: ReactNode\n /** Trailing glyph next to the title — an external-link arrow, a badge, etc. */\n icon?: ReactNode\n title: ReactNode\n description?: ReactNode\n /** Arbitrary content below the description — wraps in a row, e.g. a list of `Tag`s. */\n footer?: ReactNode\n dataTestId?: SmallCardDataTestId\n}\n\nexport const SmallCard = ({\n image,\n logo,\n icon,\n title,\n description,\n footer,\n className,\n dataTestId,\n ...rest\n}: SmallCardProps) => (\n <a\n className={cn(styles.card, className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n <div className={styles.content}>\n {image != null ? (\n <div className={styles.image} data-testid={dataTestId?.image}>\n {image}\n </div>\n ) : null}\n <div className={styles.header}>\n {logo != null ? (\n <span className={styles.logo} data-testid={dataTestId?.logo}>\n {logo}\n </span>\n ) : null}\n <span className={styles.title} data-testid={dataTestId?.title}>\n {title}\n </span>\n {icon != null ? (\n <span\n className={styles.icon}\n aria-hidden='true'\n data-testid={dataTestId?.icon}\n >\n {icon}\n </span>\n ) : null}\n </div>\n {description != null ? (\n <p className={styles.description} data-testid={dataTestId?.description}>\n {description}\n </p>\n ) : null}\n </div>\n {footer != null ? (\n <div className={styles.footer} data-testid={dataTestId?.footer}>\n {footer}\n </div>\n ) : null}\n </a>\n)\n"],"names":["SmallCard","_ref","image","logo","icon","title","description","footer","className","dataTestId","rest","_jsxs","cn","styles","card","root","children","content","_jsx","header"],"mappings":";;;;;;;;AAgCO,MAAMA,SAAS,GAAGC,IAAA,IAAA;EAAA,IAAC;IACxBC,KAAK;IACLC,IAAI;IACJC,IAAI;IACJC,KAAK;IACLC,WAAW;IACXC,MAAM;IACNC,SAAS;IACTC,UAAU;IACV,GAAGC,IAAAA;AACW,GAAC,GAAAT,IAAA,CAAA;AAAA,EAAA,oBACfU,eAAA,CAAA,GAAA,EAAA;IACEH,SAAS,EAAEI,EAAE,CAACC,gBAAM,CAACC,IAAI,EAAEN,SAAS,CAAE;IACtC,aAAaC,EAAAA,UAAU,EAAEM,IAAK;AAAA,IAAA,GAC1BL,IAAI;AAAAM,IAAAA,QAAA,gBAERL,eAAA,CAAA,KAAA,EAAA;MAAKH,SAAS,EAAEK,gBAAM,CAACI,OAAQ;AAAAD,MAAAA,QAAA,EAC5Bd,CAAAA,KAAK,IAAI,IAAI,gBACZgB,cAAA,CAAA,KAAA,EAAA;QAAKV,SAAS,EAAEK,gBAAM,CAACX,KAAM;QAAC,aAAaO,EAAAA,UAAU,EAAEP,KAAM;AAAAc,QAAAA,QAAA,EAC1Dd,KAAAA;AAAK,OACH,CAAC,GACJ,IAAI,eACRS,eAAA,CAAA,KAAA,EAAA;QAAKH,SAAS,EAAEK,gBAAM,CAACM,MAAO;AAAAH,QAAAA,QAAA,EAC3Bb,CAAAA,IAAI,IAAI,IAAI,gBACXe,cAAA,CAAA,MAAA,EAAA;UAAMV,SAAS,EAAEK,gBAAM,CAACV,IAAK;UAAC,aAAaM,EAAAA,UAAU,EAAEN,IAAK;AAAAa,UAAAA,QAAA,EACzDb,IAAAA;AAAI,SACD,CAAC,GACL,IAAI,eACRe,cAAA,CAAA,MAAA,EAAA;UAAMV,SAAS,EAAEK,gBAAM,CAACR,KAAM;UAAC,aAAaI,EAAAA,UAAU,EAAEJ,KAAM;AAAAW,UAAAA,QAAA,EAC3DX,KAAAA;AAAK,SACF,CAAC,EACND,IAAI,IAAI,IAAI,gBACXc,cAAA,CAAA,MAAA,EAAA;UACEV,SAAS,EAAEK,gBAAM,CAACT,IAAK;AACvB,UAAA,aAAA,EAAY,MAAM;UAClB,aAAaK,EAAAA,UAAU,EAAEL,IAAK;AAAAY,UAAAA,QAAA,EAE7BZ,IAAAA;SACG,CAAC,GACL,IAAI,CAAA;AAAA,OACL,CAAC,EACLE,WAAW,IAAI,IAAI,gBAClBY,cAAA,CAAA,GAAA,EAAA;QAAGV,SAAS,EAAEK,gBAAM,CAACP,WAAY;QAAC,aAAaG,EAAAA,UAAU,EAAEH,WAAY;AAAAU,QAAAA,QAAA,EACpEV,WAAAA;OACA,CAAC,GACF,IAAI,CAAA;AAAA,KACL,CAAC,EACLC,MAAM,IAAI,IAAI,gBACbW,cAAA,CAAA,KAAA,EAAA;MAAKV,SAAS,EAAEK,gBAAM,CAACN,MAAO;MAAC,aAAaE,EAAAA,UAAU,EAAEF,MAAO;AAAAS,MAAAA,QAAA,EAC5DT,MAAAA;KACE,CAAC,GACJ,IAAI,CAAA;AAAA,GACP,CAAC,CAAA;AAAA;;;;"}
@@ -19,10 +19,12 @@ const StatItem = _ref => {
19
19
  description,
20
20
  align = 'center',
21
21
  className,
22
+ dataTestId,
22
23
  ...rest
23
24
  } = _ref;
24
25
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
25
26
  className: cn(StatItem_module.item, StatItem_module[align], className),
27
+ "data-testid": dataTestId?.root,
26
28
  ...rest,
27
29
  children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
28
30
  className: StatItem_module.title,
@@ -32,6 +34,7 @@ const StatItem = _ref => {
32
34
  children: titleIcon
33
35
  }) : null, /*#__PURE__*/jsxRuntime.jsx("div", {
34
36
  className: StatItem_module.label,
37
+ "data-testid": dataTestId?.label,
35
38
  children: label
36
39
  }), info ? /*#__PURE__*/jsxRuntime.jsx(Tooltip.Tooltip, {
37
40
  content: info,
@@ -44,20 +47,25 @@ const StatItem = _ref => {
44
47
  className: StatItem_module.valueRow,
45
48
  children: [/*#__PURE__*/jsxRuntime.jsx("div", {
46
49
  className: StatItem_module.value,
50
+ "data-testid": dataTestId?.value,
47
51
  children: value
48
52
  }), icon != null ? /*#__PURE__*/jsxRuntime.jsx("span", {
49
53
  className: StatItem_module.icon,
50
54
  "aria-hidden": "true",
55
+ "data-testid": dataTestId?.icon,
51
56
  children: icon
52
57
  }) : null, align === 'left' && subValue != null ? /*#__PURE__*/jsxRuntime.jsx("div", {
53
58
  className: StatItem_module.subValue,
59
+ "data-testid": dataTestId?.subValue,
54
60
  children: subValue
55
61
  }) : null]
56
62
  }), align === 'center' && subValue != null ? /*#__PURE__*/jsxRuntime.jsx("div", {
57
63
  className: StatItem_module.subValue,
64
+ "data-testid": dataTestId?.subValue,
58
65
  children: subValue
59
66
  }) : null, description != null ? /*#__PURE__*/jsxRuntime.jsx("div", {
60
67
  className: StatItem_module.description,
68
+ "data-testid": dataTestId?.description,
61
69
  children: description
62
70
  }) : null]
63
71
  });
@@ -1 +1 @@
1
- {"version":3,"file":"StatItem.cjs","sources":["../../../src/stat-item/StatItem.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { IconInfo } from '../icons'\nimport { Tooltip } from '../tooltip'\n\nimport styles from './StatItem.module.css'\n\nexport type StatItemAlign = 'left' | 'center'\n\nexport type StatItemProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {\n label: ReactNode\n value: ReactNode\n titleIcon?: ReactNode\n info?: ReactNode\n icon?: ReactNode\n subValue?: ReactNode\n description?: ReactNode\n align?: StatItemAlign\n}\n\nexport const StatItem = ({\n label,\n value,\n titleIcon,\n info,\n icon,\n subValue,\n description,\n align = 'center',\n className,\n ...rest\n}: StatItemProps) => (\n <div className={cn(styles.item, styles[align], className)} {...rest}>\n <div className={styles.title}>\n {titleIcon ? (\n <span className={styles.titleIcon} aria-hidden='true'>\n {titleIcon}\n </span>\n ) : null}\n <div className={styles.label}>{label}</div>\n {info ? (\n <Tooltip content={info} className={styles.info}>\n <IconInfo className={styles.infoIcon} />\n </Tooltip>\n ) : null}\n </div>\n <div className={styles.valueRow}>\n <div className={styles.value}>{value}</div>\n {icon != null ? (\n <span className={styles.icon} aria-hidden='true'>\n {icon}\n </span>\n ) : null}\n {align === 'left' && subValue != null ? (\n <div className={styles.subValue}>{subValue}</div>\n ) : null}\n </div>\n {align === 'center' && subValue != null ? (\n <div className={styles.subValue}>{subValue}</div>\n ) : null}\n {description != null ? (\n <div className={styles.description}>{description}</div>\n ) : null}\n </div>\n)\n"],"names":["StatItem","_ref","label","value","titleIcon","info","icon","subValue","description","align","className","rest","_jsxs","cn","styles","item","children","title","_jsx","Tooltip","content","IconInfo","infoIcon","valueRow"],"mappings":";;;;;;;;;;AAsBO,MAAMA,QAAQ,GAAGC,IAAA,IAAA;EAAA,IAAC;IACvBC,KAAK;IACLC,KAAK;IACLC,SAAS;IACTC,IAAI;IACJC,IAAI;IACJC,QAAQ;IACRC,WAAW;AACXC,IAAAA,KAAK,GAAG,QAAQ;IAChBC,SAAS;IACT,GAAGC,IAAAA;AACU,GAAC,GAAAV,IAAA,CAAA;AAAA,EAAA,oBACdW,eAAA,CAAA,KAAA,EAAA;AAAKF,IAAAA,SAAS,EAAEG,EAAE,CAACC,eAAM,CAACC,IAAI,EAAED,eAAM,CAACL,KAAK,CAAC,EAAEC,SAAS,CAAE;AAAA,IAAA,GAAKC,IAAI;AAAAK,IAAAA,QAAA,gBACjEJ,eAAA,CAAA,KAAA,EAAA;MAAKF,SAAS,EAAEI,eAAM,CAACG,KAAM;MAAAD,QAAA,EAAA,CAC1BZ,SAAS,gBACRc,cAAA,CAAA,MAAA,EAAA;QAAMR,SAAS,EAAEI,eAAM,CAACV,SAAU;AAAC,QAAA,aAAA,EAAY,MAAM;AAAAY,QAAAA,QAAA,EAClDZ,SAAAA;AAAS,OACN,CAAC,GACL,IAAI,eACRc,cAAA,CAAA,KAAA,EAAA;QAAKR,SAAS,EAAEI,eAAM,CAACZ,KAAM;AAAAc,QAAAA,QAAA,EAAEd,KAAAA;AAAK,OAAM,CAAC,EAC1CG,IAAI,gBACHa,cAAA,CAACC,eAAO,EAAA;AAACC,QAAAA,OAAO,EAAEf,IAAK;QAACK,SAAS,EAAEI,eAAM,CAACT,IAAK;QAAAW,QAAA,eAC7CE,cAAA,CAACG,iBAAQ,EAAA;UAACX,SAAS,EAAEI,eAAM,CAACQ,QAAAA;SAAW,CAAA;OAChC,CAAC,GACR,IAAI,CAAA;KACL,CAAC,eACNV,eAAA,CAAA,KAAA,EAAA;MAAKF,SAAS,EAAEI,eAAM,CAACS,QAAS;AAAAP,MAAAA,QAAA,gBAC9BE,cAAA,CAAA,KAAA,EAAA;QAAKR,SAAS,EAAEI,eAAM,CAACX,KAAM;AAAAa,QAAAA,QAAA,EAAEb,KAAAA;AAAK,OAAM,CAAC,EAC1CG,IAAI,IAAI,IAAI,gBACXY,cAAA,CAAA,MAAA,EAAA;QAAMR,SAAS,EAAEI,eAAM,CAACR,IAAK;AAAC,QAAA,aAAA,EAAY,MAAM;AAAAU,QAAAA,QAAA,EAC7CV,IAAAA;AAAI,OACD,CAAC,GACL,IAAI,EACPG,KAAK,KAAK,MAAM,IAAIF,QAAQ,IAAI,IAAI,gBACnCW,cAAA,CAAA,KAAA,EAAA;QAAKR,SAAS,EAAEI,eAAM,CAACP,QAAS;AAAAS,QAAAA,QAAA,EAAET,QAAAA;OAAc,CAAC,GAC/C,IAAI,CAAA;KACL,CAAC,EACLE,KAAK,KAAK,QAAQ,IAAIF,QAAQ,IAAI,IAAI,gBACrCW,cAAA,CAAA,KAAA,EAAA;MAAKR,SAAS,EAAEI,eAAM,CAACP,QAAS;AAAAS,MAAAA,QAAA,EAAET,QAAAA;KAAc,CAAC,GAC/C,IAAI,EACPC,WAAW,IAAI,IAAI,gBAClBU,cAAA,CAAA,KAAA,EAAA;MAAKR,SAAS,EAAEI,eAAM,CAACN,WAAY;AAAAQ,MAAAA,QAAA,EAAER,WAAAA;KAAiB,CAAC,GACrD,IAAI,CAAA;AAAA,GACL,CAAC,CAAA;AAAA;;;;"}
1
+ {"version":3,"file":"StatItem.cjs","sources":["../../../src/stat-item/StatItem.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { IconInfo } from '../icons'\nimport { Tooltip } from '../tooltip'\n\nimport styles from './StatItem.module.css'\n\nexport type StatItemAlign = 'left' | 'center'\n\nexport type StatItemDataTestId = {\n root?: string\n label?: string\n icon?: string\n value?: string\n subValue?: string\n description?: string\n}\n\nexport type StatItemProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {\n label: ReactNode\n value: ReactNode\n titleIcon?: ReactNode\n info?: ReactNode\n icon?: ReactNode\n subValue?: ReactNode\n description?: ReactNode\n align?: StatItemAlign\n dataTestId?: StatItemDataTestId\n}\n\nexport const StatItem = ({\n label,\n value,\n titleIcon,\n info,\n icon,\n subValue,\n description,\n align = 'center',\n className,\n dataTestId,\n ...rest\n}: StatItemProps) => (\n <div\n className={cn(styles.item, styles[align], className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n <div className={styles.title}>\n {titleIcon ? (\n <span className={styles.titleIcon} aria-hidden='true'>\n {titleIcon}\n </span>\n ) : null}\n <div className={styles.label} data-testid={dataTestId?.label}>\n {label}\n </div>\n {info ? (\n <Tooltip content={info} className={styles.info}>\n <IconInfo className={styles.infoIcon} />\n </Tooltip>\n ) : null}\n </div>\n <div className={styles.valueRow}>\n <div className={styles.value} data-testid={dataTestId?.value}>\n {value}\n </div>\n {icon != null ? (\n <span\n className={styles.icon}\n aria-hidden='true'\n data-testid={dataTestId?.icon}\n >\n {icon}\n </span>\n ) : null}\n {align === 'left' && subValue != null ? (\n <div className={styles.subValue} data-testid={dataTestId?.subValue}>\n {subValue}\n </div>\n ) : null}\n </div>\n {align === 'center' && subValue != null ? (\n <div className={styles.subValue} data-testid={dataTestId?.subValue}>\n {subValue}\n </div>\n ) : null}\n {description != null ? (\n <div className={styles.description} data-testid={dataTestId?.description}>\n {description}\n </div>\n ) : null}\n </div>\n)\n"],"names":["StatItem","_ref","label","value","titleIcon","info","icon","subValue","description","align","className","dataTestId","rest","_jsxs","cn","styles","item","root","children","title","_jsx","Tooltip","content","IconInfo","infoIcon","valueRow"],"mappings":"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"}
@@ -12,12 +12,14 @@ const Switch = /*#__PURE__*/react.forwardRef((_ref, ref) => {
12
12
  label,
13
13
  className,
14
14
  disabled,
15
+ dataTestId,
15
16
  ...rest
16
17
  } = _ref;
17
18
  return /*#__PURE__*/jsxRuntime.jsxs("label", {
18
19
  className: cn(Switch_module.container, className, {
19
20
  [Switch_module.containerDisabled]: disabled
20
21
  }),
22
+ "data-testid": dataTestId?.root,
21
23
  children: [/*#__PURE__*/jsxRuntime.jsxs("span", {
22
24
  className: Switch_module.control,
23
25
  children: [/*#__PURE__*/jsxRuntime.jsx("input", {
@@ -26,6 +28,7 @@ const Switch = /*#__PURE__*/react.forwardRef((_ref, ref) => {
26
28
  role: "switch",
27
29
  className: Switch_module.input,
28
30
  disabled: disabled,
31
+ "data-testid": dataTestId?.input,
29
32
  ...rest
30
33
  }), /*#__PURE__*/jsxRuntime.jsx("span", {
31
34
  className: Switch_module.knob
@@ -34,6 +37,7 @@ const Switch = /*#__PURE__*/react.forwardRef((_ref, ref) => {
34
37
  className: cn(Switch_module.label, {
35
38
  [Switch_module.labelDisabled]: disabled
36
39
  }),
40
+ "data-testid": dataTestId?.label,
37
41
  children: label
38
42
  }) : null]
39
43
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.cjs","sources":["../../../src/switch/Switch.tsx"],"sourcesContent":["import { forwardRef, type InputHTMLAttributes, type ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Switch.module.css'\n\nexport type SwitchProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'type'\n> & {\n label?: ReactNode\n}\n\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n ({ label, className, disabled, ...rest }, ref) => (\n <label\n className={cn(styles.container, className, {\n [styles.containerDisabled]: disabled,\n })}\n >\n <span className={styles.control}>\n <input\n ref={ref}\n type='checkbox'\n role='switch'\n className={styles.input}\n disabled={disabled}\n {...rest}\n />\n <span className={styles.knob} />\n </span>\n {label ? (\n <span\n className={cn(styles.label, { [styles.labelDisabled]: disabled })}\n >\n {label}\n </span>\n ) : null}\n </label>\n ),\n)\n\nSwitch.displayName = 'Switch'\n"],"names":["Switch","forwardRef","_ref","ref","label","className","disabled","rest","_jsxs","cn","styles","container","containerDisabled","children","control","_jsx","type","role","input","knob","labelDisabled","displayName"],"mappings":";;;;;;;;;AAaO,MAAMA,MAAM,gBAAGC,gBAAU,CAC9B,CAAAC,IAAA,EAA0CC,GAAG,KAAA;EAAA,IAA5C;IAAEC,KAAK;IAAEC,SAAS;IAAEC,QAAQ;IAAE,GAAGC,IAAAA;AAAK,GAAC,GAAAL,IAAA,CAAA;AAAA,EAAA,oBACtCM,eAAA,CAAA,OAAA,EAAA;IACEH,SAAS,EAAEI,EAAE,CAACC,aAAM,CAACC,SAAS,EAAEN,SAAS,EAAE;MACzC,CAACK,aAAM,CAACE,iBAAiB,GAAGN,QAAAA;AAC9B,KAAC,CAAE;AAAAO,IAAAA,QAAA,gBAEHL,eAAA,CAAA,MAAA,EAAA;MAAMH,SAAS,EAAEK,aAAM,CAACI,OAAQ;AAAAD,MAAAA,QAAA,gBAC9BE,cAAA,CAAA,OAAA,EAAA;AACEZ,QAAAA,GAAG,EAAEA,GAAI;AACTa,QAAAA,IAAI,EAAC,UAAU;AACfC,QAAAA,IAAI,EAAC,QAAQ;QACbZ,SAAS,EAAEK,aAAM,CAACQ,KAAM;AACxBZ,QAAAA,QAAQ,EAAEA,QAAS;QAAA,GACfC,IAAAA;OACL,CAAC,eACFQ,cAAA,CAAA,MAAA,EAAA;QAAMV,SAAS,EAAEK,aAAM,CAACS,IAAAA;AAAK,OAAE,CAAC,CAAA;AAAA,KAC5B,CAAC,EACNf,KAAK,gBACJW,cAAA,CAAA,MAAA,EAAA;AACEV,MAAAA,SAAS,EAAEI,EAAE,CAACC,aAAM,CAACN,KAAK,EAAE;QAAE,CAACM,aAAM,CAACU,aAAa,GAAGd,QAAAA;AAAS,OAAC,CAAE;AAAAO,MAAAA,QAAA,EAEjET,KAAAA;KACG,CAAC,GACL,IAAI,CAAA;AAAA,GACH,CAAC,CAAA;AAAA,CAEZ,EAAC;AAEDJ,MAAM,CAACqB,WAAW,GAAG,QAAQ;;;;"}
1
+ {"version":3,"file":"Switch.cjs","sources":["../../../src/switch/Switch.tsx"],"sourcesContent":["import { forwardRef, type InputHTMLAttributes, type ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Switch.module.css'\n\nexport type SwitchDataTestId = {\n root?: string\n input?: string\n label?: string\n}\n\nexport type SwitchProps = Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'type'\n> & {\n label?: ReactNode\n dataTestId?: SwitchDataTestId\n}\n\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n ({ label, className, disabled, dataTestId, ...rest }, ref) => (\n <label\n className={cn(styles.container, className, {\n [styles.containerDisabled]: disabled,\n })}\n data-testid={dataTestId?.root}\n >\n <span className={styles.control}>\n <input\n ref={ref}\n type='checkbox'\n role='switch'\n className={styles.input}\n disabled={disabled}\n data-testid={dataTestId?.input}\n {...rest}\n />\n <span className={styles.knob} />\n </span>\n {label ? (\n <span\n className={cn(styles.label, { [styles.labelDisabled]: disabled })}\n data-testid={dataTestId?.label}\n >\n {label}\n </span>\n ) : null}\n </label>\n ),\n)\n\nSwitch.displayName = 'Switch'\n"],"names":["Switch","forwardRef","_ref","ref","label","className","disabled","dataTestId","rest","_jsxs","cn","styles","container","containerDisabled","root","children","control","_jsx","type","role","input","knob","labelDisabled","displayName"],"mappings":";;;;;;;;;AAoBO,MAAMA,MAAM,gBAAGC,gBAAU,CAC9B,CAAAC,IAAA,EAAsDC,GAAG,KAAA;EAAA,IAAxD;IAAEC,KAAK;IAAEC,SAAS;IAAEC,QAAQ;IAAEC,UAAU;IAAE,GAAGC,IAAAA;AAAK,GAAC,GAAAN,IAAA,CAAA;AAAA,EAAA,oBAClDO,eAAA,CAAA,OAAA,EAAA;IACEJ,SAAS,EAAEK,EAAE,CAACC,aAAM,CAACC,SAAS,EAAEP,SAAS,EAAE;MACzC,CAACM,aAAM,CAACE,iBAAiB,GAAGP,QAAAA;AAC9B,KAAC,CAAE;IACH,aAAaC,EAAAA,UAAU,EAAEO,IAAK;AAAAC,IAAAA,QAAA,gBAE9BN,eAAA,CAAA,MAAA,EAAA;MAAMJ,SAAS,EAAEM,aAAM,CAACK,OAAQ;AAAAD,MAAAA,QAAA,gBAC9BE,cAAA,CAAA,OAAA,EAAA;AACEd,QAAAA,GAAG,EAAEA,GAAI;AACTe,QAAAA,IAAI,EAAC,UAAU;AACfC,QAAAA,IAAI,EAAC,QAAQ;QACbd,SAAS,EAAEM,aAAM,CAACS,KAAM;AACxBd,QAAAA,QAAQ,EAAEA,QAAS;QACnB,aAAaC,EAAAA,UAAU,EAAEa,KAAM;QAAA,GAC3BZ,IAAAA;OACL,CAAC,eACFS,cAAA,CAAA,MAAA,EAAA;QAAMZ,SAAS,EAAEM,aAAM,CAACU,IAAAA;AAAK,OAAE,CAAC,CAAA;AAAA,KAC5B,CAAC,EACNjB,KAAK,gBACJa,cAAA,CAAA,MAAA,EAAA;AACEZ,MAAAA,SAAS,EAAEK,EAAE,CAACC,aAAM,CAACP,KAAK,EAAE;QAAE,CAACO,aAAM,CAACW,aAAa,GAAGhB,QAAAA;AAAS,OAAC,CAAE;MAClE,aAAaC,EAAAA,UAAU,EAAEH,KAAM;AAAAW,MAAAA,QAAA,EAE9BX,KAAAA;KACG,CAAC,GACL,IAAI,CAAA;AAAA,GACH,CAAC,CAAA;AAAA,CAEZ,EAAC;AAEDJ,MAAM,CAACuB,WAAW,GAAG,QAAQ;;;;"}
@@ -13,6 +13,7 @@ const Tab = /*#__PURE__*/react.forwardRef((_ref, ref) => {
13
13
  className,
14
14
  children,
15
15
  type = 'button',
16
+ dataTestId,
16
17
  ...rest
17
18
  } = _ref;
18
19
  return /*#__PURE__*/jsxRuntime.jsx("button", {
@@ -21,6 +22,7 @@ const Tab = /*#__PURE__*/react.forwardRef((_ref, ref) => {
21
22
  role: "tab",
22
23
  "aria-selected": active,
23
24
  className: cn(Tab_module.tab, active && Tab_module.active, className),
25
+ "data-testid": dataTestId?.root,
24
26
  ...rest,
25
27
  children: children
26
28
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Tab.cjs","sources":["../../../src/tabs/Tab.tsx"],"sourcesContent":["import { forwardRef, type ButtonHTMLAttributes } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Tab.module.css'\n\nexport type TabProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n active?: boolean\n}\n\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(\n ({ active = false, className, children, type = 'button', ...rest }, ref) => (\n <button\n ref={ref}\n type={type}\n role='tab'\n aria-selected={active}\n className={cn(styles.tab, active && styles.active, className)}\n {...rest}\n >\n {children}\n </button>\n ),\n)\n\nTab.displayName = 'Tab'\n"],"names":["Tab","forwardRef","_ref","ref","active","className","children","type","rest","_jsx","role","cn","styles","tab","displayName"],"mappings":";;;;;;;;;AAUO,MAAMA,GAAG,gBAAGC,gBAAU,CAC3B,CAAAC,IAAA,EAAoEC,GAAG,KAAA;EAAA,IAAtE;AAAEC,IAAAA,MAAM,GAAG,KAAK;IAAEC,SAAS;IAAEC,QAAQ;AAAEC,IAAAA,IAAI,GAAG,QAAQ;IAAE,GAAGC,IAAAA;AAAK,GAAC,GAAAN,IAAA,CAAA;AAAA,EAAA,oBAChEO,cAAA,CAAA,QAAA,EAAA;AACEN,IAAAA,GAAG,EAAEA,GAAI;AACTI,IAAAA,IAAI,EAAEA,IAAK;AACXG,IAAAA,IAAI,EAAC,KAAK;AACV,IAAA,eAAA,EAAeN,MAAO;AACtBC,IAAAA,SAAS,EAAEM,EAAE,CAACC,UAAM,CAACC,GAAG,EAAET,MAAM,IAAIQ,UAAM,CAACR,MAAM,EAAEC,SAAS,CAAE;AAAA,IAAA,GAC1DG,IAAI;AAAAF,IAAAA,QAAA,EAEPA,QAAAA;AAAQ,GACH,CAAC,CAAA;AAAA,CAEb,EAAC;AAEDN,GAAG,CAACc,WAAW,GAAG,KAAK;;;;"}
1
+ {"version":3,"file":"Tab.cjs","sources":["../../../src/tabs/Tab.tsx"],"sourcesContent":["import { forwardRef, type ButtonHTMLAttributes } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Tab.module.css'\n\nexport type TabDataTestId = {\n root?: string\n}\n\nexport type TabProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n active?: boolean\n dataTestId?: TabDataTestId\n}\n\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(\n (\n {\n active = false,\n className,\n children,\n type = 'button',\n dataTestId,\n ...rest\n },\n ref,\n ) => (\n <button\n ref={ref}\n type={type}\n role='tab'\n aria-selected={active}\n className={cn(styles.tab, active && styles.active, className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n {children}\n </button>\n ),\n)\n\nTab.displayName = 'Tab'\n"],"names":["Tab","forwardRef","_ref","ref","active","className","children","type","dataTestId","rest","_jsx","role","cn","styles","tab","root","displayName"],"mappings":";;;;;;;;;AAeO,MAAMA,GAAG,gBAAGC,gBAAU,CAC3B,CAAAC,IAAA,EASEC,GAAG,KAAA;EAAA,IARH;AACEC,IAAAA,MAAM,GAAG,KAAK;IACdC,SAAS;IACTC,QAAQ;AACRC,IAAAA,IAAI,GAAG,QAAQ;IACfC,UAAU;IACV,GAAGC,IAAAA;AACL,GAAC,GAAAP,IAAA,CAAA;AAAA,EAAA,oBAGDQ,cAAA,CAAA,QAAA,EAAA;AACEP,IAAAA,GAAG,EAAEA,GAAI;AACTI,IAAAA,IAAI,EAAEA,IAAK;AACXI,IAAAA,IAAI,EAAC,KAAK;AACV,IAAA,eAAA,EAAeP,MAAO;AACtBC,IAAAA,SAAS,EAAEO,EAAE,CAACC,UAAM,CAACC,GAAG,EAAEV,MAAM,IAAIS,UAAM,CAACT,MAAM,EAAEC,SAAS,CAAE;IAC9D,aAAaG,EAAAA,UAAU,EAAEO,IAAK;AAAA,IAAA,GAC1BN,IAAI;AAAAH,IAAAA,QAAA,EAEPA,QAAAA;AAAQ,GACH,CAAC,CAAA;AAAA,CAEb,EAAC;AAEDN,GAAG,CAACgB,WAAW,GAAG,KAAK;;;;"}
@@ -13,7 +13,9 @@ const Tabs = _ref => {
13
13
  items,
14
14
  value,
15
15
  onChange,
16
- className
16
+ className,
17
+ dataTestId,
18
+ ...rest
17
19
  } = _ref;
18
20
  const containerRef = react.useRef(null);
19
21
  const activeButtonRef = react.useRef(null);
@@ -43,6 +45,8 @@ const Tabs = _ref => {
43
45
  ref: containerRef,
44
46
  role: "tablist",
45
47
  className: cn(Tabs_module.tabs, className),
48
+ "data-testid": dataTestId?.root,
49
+ ...rest,
46
50
  children: [/*#__PURE__*/jsxRuntime.jsx("div", {
47
51
  ref: selectionRef,
48
52
  "aria-hidden": "true",
@@ -53,6 +57,7 @@ const Tabs = _ref => {
53
57
  ref: active ? activeButtonRef : undefined,
54
58
  active: active,
55
59
  disabled: item.disabled,
60
+ dataTestId: item.dataTestId,
56
61
  onClick: () => {
57
62
  if (item.value !== value) onChange(item.value);
58
63
  },
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.cjs","sources":["../../../src/tabs/Tabs.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState, type ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { Tab } from './Tab'\nimport styles from './Tabs.module.css'\n\nexport type TabItem = {\n value: string\n label: ReactNode\n disabled?: boolean\n}\n\nexport type TabsProps = {\n items: TabItem[]\n value: string\n onChange: (value: string) => void\n className?: string\n}\n\nexport const Tabs = ({ items, value, onChange, className }: TabsProps) => {\n const containerRef = useRef<HTMLDivElement>(null)\n const activeButtonRef = useRef<HTMLButtonElement>(null)\n const selectionRef = useRef<HTMLDivElement>(null)\n // Skip the transition on the first measurement so the bar doesn't fly in from 0,0.\n const [animated, setAnimated] = useState(false)\n\n useLayoutEffect(() => {\n const updateSelection = () => {\n const button = activeButtonRef.current\n const container = containerRef.current\n const selection = selectionRef.current\n if (!button || !container || !selection) return\n\n const buttonRect = button.getBoundingClientRect()\n const containerRect = container.getBoundingClientRect()\n const x = buttonRect.left - containerRect.left\n\n selection.style.width = `${buttonRect.width}px`\n selection.style.transform = `translateX(${x}px)`\n }\n\n updateSelection()\n setAnimated(true)\n\n window.addEventListener('resize', updateSelection)\n return () => {\n window.removeEventListener('resize', updateSelection)\n }\n }, [value, items])\n\n return (\n <div\n ref={containerRef}\n role='tablist'\n className={cn(styles.tabs, className)}\n >\n <div\n ref={selectionRef}\n aria-hidden='true'\n className={cn(styles.selection, animated && styles.animated)}\n />\n {items.map((item) => {\n const active = item.value === value\n return (\n <Tab\n key={item.value}\n ref={active ? activeButtonRef : undefined}\n active={active}\n disabled={item.disabled}\n onClick={() => {\n if (item.value !== value) onChange(item.value)\n }}\n >\n {item.label}\n </Tab>\n )\n })}\n </div>\n )\n}\n"],"names":["Tabs","_ref","items","value","onChange","className","containerRef","useRef","activeButtonRef","selectionRef","animated","setAnimated","useState","useLayoutEffect","updateSelection","button","current","container","selection","buttonRect","getBoundingClientRect","containerRect","x","left","style","width","transform","window","addEventListener","removeEventListener","_jsxs","ref","role","cn","styles","tabs","children","_jsx","map","item","active","Tab","undefined","disabled","onClick","label"],"mappings":"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"}
1
+ {"version":3,"file":"Tabs.cjs","sources":["../../../src/tabs/Tabs.tsx"],"sourcesContent":["import {\n useLayoutEffect,\n useRef,\n useState,\n type ComponentPropsWithoutRef,\n type ReactNode,\n} from 'react'\n\nimport cn from 'classnames'\n\nimport { Tab, type TabDataTestId } from './Tab'\nimport styles from './Tabs.module.css'\n\nexport type TabsDataTestId = {\n root?: string\n}\n\nexport type TabItem = {\n value: string\n label: ReactNode\n disabled?: boolean\n dataTestId?: TabDataTestId\n}\n\nexport type TabsProps = Omit<ComponentPropsWithoutRef<'div'>, 'onChange'> & {\n items: TabItem[]\n value: string\n onChange: (value: string) => void\n dataTestId?: TabsDataTestId\n}\n\nexport const Tabs = ({\n items,\n value,\n onChange,\n className,\n dataTestId,\n ...rest\n}: TabsProps) => {\n const containerRef = useRef<HTMLDivElement>(null)\n const activeButtonRef = useRef<HTMLButtonElement>(null)\n const selectionRef = useRef<HTMLDivElement>(null)\n // Skip the transition on the first measurement so the bar doesn't fly in from 0,0.\n const [animated, setAnimated] = useState(false)\n\n useLayoutEffect(() => {\n const updateSelection = () => {\n const button = activeButtonRef.current\n const container = containerRef.current\n const selection = selectionRef.current\n if (!button || !container || !selection) return\n\n const buttonRect = button.getBoundingClientRect()\n const containerRect = container.getBoundingClientRect()\n const x = buttonRect.left - containerRect.left\n\n selection.style.width = `${buttonRect.width}px`\n selection.style.transform = `translateX(${x}px)`\n }\n\n updateSelection()\n setAnimated(true)\n\n window.addEventListener('resize', updateSelection)\n return () => {\n window.removeEventListener('resize', updateSelection)\n }\n }, [value, items])\n\n return (\n <div\n ref={containerRef}\n role='tablist'\n className={cn(styles.tabs, className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n <div\n ref={selectionRef}\n aria-hidden='true'\n className={cn(styles.selection, animated && styles.animated)}\n />\n {items.map((item) => {\n const active = item.value === value\n return (\n <Tab\n key={item.value}\n ref={active ? activeButtonRef : undefined}\n active={active}\n disabled={item.disabled}\n dataTestId={item.dataTestId}\n onClick={() => {\n if (item.value !== value) onChange(item.value)\n }}\n >\n {item.label}\n </Tab>\n )\n })}\n </div>\n )\n}\n"],"names":["Tabs","_ref","items","value","onChange","className","dataTestId","rest","containerRef","useRef","activeButtonRef","selectionRef","animated","setAnimated","useState","useLayoutEffect","updateSelection","button","current","container","selection","buttonRect","getBoundingClientRect","containerRect","x","left","style","width","transform","window","addEventListener","removeEventListener","_jsxs","ref","role","cn","styles","tabs","root","children","_jsx","map","item","active","Tab","undefined","disabled","onClick","label"],"mappings":"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"}
@@ -14,20 +14,24 @@ const Tag = _ref => {
14
14
  onClose,
15
15
  className,
16
16
  children,
17
+ dataTestId,
17
18
  ...rest
18
19
  } = _ref;
19
20
  return /*#__PURE__*/jsxRuntime.jsxs("span", {
20
21
  className: cn(Tag_module.tag, Tag_module[variant], className),
22
+ "data-testid": dataTestId?.root,
21
23
  ...rest,
22
24
  children: [icon != null ? /*#__PURE__*/jsxRuntime.jsx("span", {
23
25
  className: Tag_module.icon,
24
26
  "aria-hidden": "true",
27
+ "data-testid": dataTestId?.icon,
25
28
  children: icon
26
29
  }) : null, children, onClose ? /*#__PURE__*/jsxRuntime.jsx("button", {
27
30
  type: "button",
28
31
  className: Tag_module.closeButton,
29
32
  "aria-label": "Remove",
30
33
  onClick: onClose,
34
+ "data-testid": dataTestId?.closeButton,
31
35
  children: /*#__PURE__*/jsxRuntime.jsx(IconCross.IconCross, {
32
36
  "aria-hidden": "true"
33
37
  })
@@ -1 +1 @@
1
- {"version":3,"file":"Tag.cjs","sources":["../../../src/tag/Tag.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { IconCross } from '../icons'\nimport styles from './Tag.module.css'\n\nexport type TagVariant =\n | 'default'\n | 'neutral'\n | 'success'\n | 'warning'\n | 'error'\n | 'info'\n | 'active'\n | 'action'\n\nexport type TagProps = HTMLAttributes<HTMLSpanElement> & {\n variant?: TagVariant\n icon?: ReactNode\n onClose?: () => void\n}\n\nexport const Tag = ({\n variant = 'default',\n icon,\n onClose,\n className,\n children,\n ...rest\n}: TagProps) => (\n <span className={cn(styles.tag, styles[variant], className)} {...rest}>\n {icon != null ? (\n <span className={styles.icon} aria-hidden='true'>\n {icon}\n </span>\n ) : null}\n {children}\n {onClose ? (\n <button\n type='button'\n className={styles.closeButton}\n aria-label='Remove'\n onClick={onClose}\n >\n <IconCross aria-hidden='true' />\n </button>\n ) : null}\n </span>\n)\n"],"names":["Tag","_ref","variant","icon","onClose","className","children","rest","_jsxs","cn","styles","tag","_jsx","type","closeButton","onClick","IconCross"],"mappings":";;;;;;;;;AAuBO,MAAMA,GAAG,GAAGC,IAAA,IAAA;EAAA,IAAC;AAClBC,IAAAA,OAAO,GAAG,SAAS;IACnBC,IAAI;IACJC,OAAO;IACPC,SAAS;IACTC,QAAQ;IACR,GAAGC,IAAAA;AACK,GAAC,GAAAN,IAAA,CAAA;AAAA,EAAA,oBACTO,eAAA,CAAA,MAAA,EAAA;AAAMH,IAAAA,SAAS,EAAEI,EAAE,CAACC,UAAM,CAACC,GAAG,EAAED,UAAM,CAACR,OAAO,CAAC,EAAEG,SAAS,CAAE;AAAA,IAAA,GAAKE,IAAI;AAAAD,IAAAA,QAAA,EAClEH,CAAAA,IAAI,IAAI,IAAI,gBACXS,cAAA,CAAA,MAAA,EAAA;MAAMP,SAAS,EAAEK,UAAM,CAACP,IAAK;AAAC,MAAA,aAAA,EAAY,MAAM;AAAAG,MAAAA,QAAA,EAC7CH,IAAAA;KACG,CAAC,GACL,IAAI,EACPG,QAAQ,EACRF,OAAO,gBACNQ,cAAA,CAAA,QAAA,EAAA;AACEC,MAAAA,IAAI,EAAC,QAAQ;MACbR,SAAS,EAAEK,UAAM,CAACI,WAAY;AAC9B,MAAA,YAAA,EAAW,QAAQ;AACnBC,MAAAA,OAAO,EAAEX,OAAQ;MAAAE,QAAA,eAEjBM,cAAA,CAACI,mBAAS,EAAA;QAAC,aAAY,EAAA,MAAA;OAAQ,CAAA;KACzB,CAAC,GACP,IAAI,CAAA;AAAA,GACJ,CAAC,CAAA;AAAA;;;;"}
1
+ {"version":3,"file":"Tag.cjs","sources":["../../../src/tag/Tag.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { IconCross } from '../icons'\nimport styles from './Tag.module.css'\n\nexport type TagVariant =\n | 'default'\n | 'neutral'\n | 'success'\n | 'warning'\n | 'error'\n | 'info'\n | 'active'\n | 'action'\n\nexport type TagDataTestId = {\n root?: string\n icon?: string\n closeButton?: string\n}\n\nexport type TagProps = HTMLAttributes<HTMLSpanElement> & {\n variant?: TagVariant\n icon?: ReactNode\n onClose?: () => void\n dataTestId?: TagDataTestId\n}\n\nexport const Tag = ({\n variant = 'default',\n icon,\n onClose,\n className,\n children,\n dataTestId,\n ...rest\n}: TagProps) => (\n <span\n className={cn(styles.tag, styles[variant], className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n {icon != null ? (\n <span\n className={styles.icon}\n aria-hidden='true'\n data-testid={dataTestId?.icon}\n >\n {icon}\n </span>\n ) : null}\n {children}\n {onClose ? (\n <button\n type='button'\n className={styles.closeButton}\n aria-label='Remove'\n onClick={onClose}\n data-testid={dataTestId?.closeButton}\n >\n <IconCross aria-hidden='true' />\n </button>\n ) : null}\n </span>\n)\n"],"names":["Tag","_ref","variant","icon","onClose","className","children","dataTestId","rest","_jsxs","cn","styles","tag","root","_jsx","type","closeButton","onClick","IconCross"],"mappings":";;;;;;;;;AA8BO,MAAMA,GAAG,GAAGC,IAAA,IAAA;EAAA,IAAC;AAClBC,IAAAA,OAAO,GAAG,SAAS;IACnBC,IAAI;IACJC,OAAO;IACPC,SAAS;IACTC,QAAQ;IACRC,UAAU;IACV,GAAGC,IAAAA;AACK,GAAC,GAAAP,IAAA,CAAA;AAAA,EAAA,oBACTQ,eAAA,CAAA,MAAA,EAAA;AACEJ,IAAAA,SAAS,EAAEK,EAAE,CAACC,UAAM,CAACC,GAAG,EAAED,UAAM,CAACT,OAAO,CAAC,EAAEG,SAAS,CAAE;IACtD,aAAaE,EAAAA,UAAU,EAAEM,IAAK;AAAA,IAAA,GAC1BL,IAAI;AAAAF,IAAAA,QAAA,EAEPH,CAAAA,IAAI,IAAI,IAAI,gBACXW,cAAA,CAAA,MAAA,EAAA;MACET,SAAS,EAAEM,UAAM,CAACR,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaI,EAAAA,UAAU,EAAEJ,IAAK;AAAAG,MAAAA,QAAA,EAE7BH,IAAAA;KACG,CAAC,GACL,IAAI,EACPG,QAAQ,EACRF,OAAO,gBACNU,cAAA,CAAA,QAAA,EAAA;AACEC,MAAAA,IAAI,EAAC,QAAQ;MACbV,SAAS,EAAEM,UAAM,CAACK,WAAY;AAC9B,MAAA,YAAA,EAAW,QAAQ;AACnBC,MAAAA,OAAO,EAAEb,OAAQ;MACjB,aAAaG,EAAAA,UAAU,EAAES,WAAY;MAAAV,QAAA,eAErCQ,cAAA,CAACI,mBAAS,EAAA;QAAC,aAAY,EAAA,MAAA;OAAQ,CAAA;KACzB,CAAC,GACP,IAAI,CAAA;AAAA,GACJ,CAAC,CAAA;AAAA;;;;"}
@@ -17,6 +17,7 @@ const TextLink = _ref => {
17
17
  rel,
18
18
  href,
19
19
  onClick,
20
+ dataTestId,
20
21
  ...rest
21
22
  } = _ref;
22
23
  return /*#__PURE__*/jsxRuntime.jsxs("a", {
@@ -27,10 +28,12 @@ const TextLink = _ref => {
27
28
  "aria-disabled": disabled || undefined,
28
29
  tabIndex: disabled ? -1 : undefined,
29
30
  onClick: disabled ? undefined : onClick,
31
+ "data-testid": dataTestId?.root,
30
32
  ...rest,
31
33
  children: [children, icon != null ? /*#__PURE__*/jsxRuntime.jsx("span", {
32
34
  className: TextLink_module.icon,
33
35
  "aria-hidden": "true",
36
+ "data-testid": dataTestId?.icon,
34
37
  children: icon
35
38
  }) : null]
36
39
  });
@@ -1 +1 @@
1
- {"version":3,"file":"TextLink.cjs","sources":["../../../src/text-link/TextLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './TextLink.module.css'\n\nexport type TextLinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {\n icon?: ReactNode\n external?: boolean\n disabled?: boolean\n}\n\nexport const TextLink = ({\n icon,\n external = false,\n disabled = false,\n className,\n children,\n target,\n rel,\n href,\n onClick,\n ...rest\n}: TextLinkProps) => (\n <a\n className={cn(styles.link, className)}\n target={target ?? (external ? '_blank' : undefined)}\n rel={rel ?? (external ? 'noopener noreferrer' : undefined)}\n href={disabled ? undefined : href}\n aria-disabled={disabled || undefined}\n tabIndex={disabled ? -1 : undefined}\n onClick={disabled ? undefined : onClick}\n {...rest}\n >\n {children}\n {icon != null ? (\n <span className={styles.icon} aria-hidden='true'>\n {icon}\n </span>\n ) : null}\n </a>\n)\n"],"names":["TextLink","_ref","icon","external","disabled","className","children","target","rel","href","onClick","rest","_jsxs","cn","styles","link","undefined","tabIndex","_jsx"],"mappings":";;;;;;;;AAYO,MAAMA,QAAQ,GAAGC,IAAA,IAAA;EAAA,IAAC;IACvBC,IAAI;AACJC,IAAAA,QAAQ,GAAG,KAAK;AAChBC,IAAAA,QAAQ,GAAG,KAAK;IAChBC,SAAS;IACTC,QAAQ;IACRC,MAAM;IACNC,GAAG;IACHC,IAAI;IACJC,OAAO;IACP,GAAGC,IAAAA;AACU,GAAC,GAAAV,IAAA,CAAA;AAAA,EAAA,oBACdW,eAAA,CAAA,GAAA,EAAA;IACEP,SAAS,EAAEQ,EAAE,CAACC,eAAM,CAACC,IAAI,EAAEV,SAAS,CAAE;IACtCE,MAAM,EAAEA,MAAM,KAAKJ,QAAQ,GAAG,QAAQ,GAAGa,SAAS,CAAE;IACpDR,GAAG,EAAEA,GAAG,KAAKL,QAAQ,GAAG,qBAAqB,GAAGa,SAAS,CAAE;AAC3DP,IAAAA,IAAI,EAAEL,QAAQ,GAAGY,SAAS,GAAGP,IAAK;IAClC,eAAeL,EAAAA,QAAQ,IAAIY,SAAU;AACrCC,IAAAA,QAAQ,EAAEb,QAAQ,GAAG,CAAC,CAAC,GAAGY,SAAU;AACpCN,IAAAA,OAAO,EAAEN,QAAQ,GAAGY,SAAS,GAAGN,OAAQ;AAAA,IAAA,GACpCC,IAAI;AAAAL,IAAAA,QAAA,GAEPA,QAAQ,EACRJ,IAAI,IAAI,IAAI,gBACXgB,cAAA,CAAA,MAAA,EAAA;MAAMb,SAAS,EAAES,eAAM,CAACZ,IAAK;AAAC,MAAA,aAAA,EAAY,MAAM;AAAAI,MAAAA,QAAA,EAC7CJ,IAAAA;KACG,CAAC,GACL,IAAI,CAAA;AAAA,GACP,CAAC,CAAA;AAAA;;;;"}
1
+ {"version":3,"file":"TextLink.cjs","sources":["../../../src/text-link/TextLink.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './TextLink.module.css'\n\nexport type TextLinkDataTestId = {\n root?: string\n icon?: string\n}\n\nexport type TextLinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {\n icon?: ReactNode\n external?: boolean\n disabled?: boolean\n dataTestId?: TextLinkDataTestId\n}\n\nexport const TextLink = ({\n icon,\n external = false,\n disabled = false,\n className,\n children,\n target,\n rel,\n href,\n onClick,\n dataTestId,\n ...rest\n}: TextLinkProps) => (\n <a\n className={cn(styles.link, className)}\n target={target ?? (external ? '_blank' : undefined)}\n rel={rel ?? (external ? 'noopener noreferrer' : undefined)}\n href={disabled ? undefined : href}\n aria-disabled={disabled || undefined}\n tabIndex={disabled ? -1 : undefined}\n onClick={disabled ? undefined : onClick}\n data-testid={dataTestId?.root}\n {...rest}\n >\n {children}\n {icon != null ? (\n <span\n className={styles.icon}\n aria-hidden='true'\n data-testid={dataTestId?.icon}\n >\n {icon}\n </span>\n ) : null}\n </a>\n)\n"],"names":["TextLink","_ref","icon","external","disabled","className","children","target","rel","href","onClick","dataTestId","rest","_jsxs","cn","styles","link","undefined","tabIndex","root","_jsx"],"mappings":";;;;;;;;AAkBO,MAAMA,QAAQ,GAAGC,IAAA,IAAA;EAAA,IAAC;IACvBC,IAAI;AACJC,IAAAA,QAAQ,GAAG,KAAK;AAChBC,IAAAA,QAAQ,GAAG,KAAK;IAChBC,SAAS;IACTC,QAAQ;IACRC,MAAM;IACNC,GAAG;IACHC,IAAI;IACJC,OAAO;IACPC,UAAU;IACV,GAAGC,IAAAA;AACU,GAAC,GAAAX,IAAA,CAAA;AAAA,EAAA,oBACdY,eAAA,CAAA,GAAA,EAAA;IACER,SAAS,EAAES,EAAE,CAACC,eAAM,CAACC,IAAI,EAAEX,SAAS,CAAE;IACtCE,MAAM,EAAEA,MAAM,KAAKJ,QAAQ,GAAG,QAAQ,GAAGc,SAAS,CAAE;IACpDT,GAAG,EAAEA,GAAG,KAAKL,QAAQ,GAAG,qBAAqB,GAAGc,SAAS,CAAE;AAC3DR,IAAAA,IAAI,EAAEL,QAAQ,GAAGa,SAAS,GAAGR,IAAK;IAClC,eAAeL,EAAAA,QAAQ,IAAIa,SAAU;AACrCC,IAAAA,QAAQ,EAAEd,QAAQ,GAAG,CAAC,CAAC,GAAGa,SAAU;AACpCP,IAAAA,OAAO,EAAEN,QAAQ,GAAGa,SAAS,GAAGP,OAAQ;IACxC,aAAaC,EAAAA,UAAU,EAAEQ,IAAK;AAAA,IAAA,GAC1BP,IAAI;AAAAN,IAAAA,QAAA,GAEPA,QAAQ,EACRJ,IAAI,IAAI,IAAI,gBACXkB,cAAA,CAAA,MAAA,EAAA;MACEf,SAAS,EAAEU,eAAM,CAACb,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaS,EAAAA,UAAU,EAAET,IAAK;AAAAI,MAAAA,QAAA,EAE7BJ,IAAAA;KACG,CAAC,GACL,IAAI,CAAA;AAAA,GACP,CAAC,CAAA;AAAA;;;;"}
@@ -11,15 +11,21 @@ const TokenAmount = _ref => {
11
11
  let {
12
12
  symbol,
13
13
  amount,
14
- className
14
+ className,
15
+ dataTestId,
16
+ ...rest
15
17
  } = _ref;
16
18
  return /*#__PURE__*/jsxRuntime.jsxs("span", {
17
19
  className: cn(TokenAmount_module.root, className),
20
+ "data-testid": dataTestId?.root,
21
+ ...rest,
18
22
  children: [/*#__PURE__*/jsxRuntime.jsx(TokenIcon.TokenIcon, {
19
23
  token: symbol,
20
- className: TokenAmount_module.icon
24
+ className: TokenAmount_module.icon,
25
+ "data-testid": dataTestId?.icon
21
26
  }), /*#__PURE__*/jsxRuntime.jsx("span", {
22
27
  className: TokenAmount_module.amount,
28
+ "data-testid": dataTestId?.amount,
23
29
  children: amount
24
30
  })]
25
31
  });
@@ -1 +1 @@
1
- {"version":3,"file":"TokenAmount.cjs","sources":["../../../src/token-amount/TokenAmount.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport { TokenIcon, type TokenIconSymbol } from '../icons'\nimport cn from 'classnames'\n\nimport styles from './TokenAmount.module.css'\n\nexport type TokenAmountProps = {\n symbol: TokenIconSymbol\n amount: ReactNode\n className?: string\n}\n\nexport const TokenAmount = ({\n symbol,\n amount,\n className,\n}: TokenAmountProps) => (\n <span className={cn(styles.root, className)}>\n <TokenIcon token={symbol} className={styles.icon} />\n <span className={styles.amount}>{amount}</span>\n </span>\n)\n"],"names":["TokenAmount","_ref","symbol","amount","className","_jsxs","cn","styles","root","children","_jsx","TokenIcon","token","icon"],"mappings":";;;;;;;;;AAaO,MAAMA,WAAW,GAAGC,IAAA,IAAA;EAAA,IAAC;IAC1BC,MAAM;IACNC,MAAM;AACNC,IAAAA,SAAAA;AACgB,GAAC,GAAAH,IAAA,CAAA;AAAA,EAAA,oBACjBI,eAAA,CAAA,MAAA,EAAA;IAAMD,SAAS,EAAEE,EAAE,CAACC,kBAAM,CAACC,IAAI,EAAEJ,SAAS,CAAE;IAAAK,QAAA,EAAA,cAC1CC,cAAA,CAACC,mBAAS,EAAA;AAACC,MAAAA,KAAK,EAAEV,MAAO;MAACE,SAAS,EAAEG,kBAAM,CAACM,IAAAA;KAAO,CAAC,eACpDH,cAAA,CAAA,MAAA,EAAA;MAAMN,SAAS,EAAEG,kBAAM,CAACJ,MAAO;AAAAM,MAAAA,QAAA,EAAEN,MAAAA;AAAM,KAAO,CAAC,CAAA;AAAA,GAC3C,CAAC,CAAA;AAAA;;;;"}
1
+ {"version":3,"file":"TokenAmount.cjs","sources":["../../../src/token-amount/TokenAmount.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { TokenIcon, type TokenIconSymbol } from '../icons'\nimport cn from 'classnames'\n\nimport styles from './TokenAmount.module.css'\n\nexport type TokenAmountDataTestId = {\n root?: string\n icon?: string\n amount?: string\n}\n\nexport type TokenAmountProps = Omit<\n ComponentPropsWithoutRef<'span'>,\n 'children'\n> & {\n symbol: TokenIconSymbol\n amount: ReactNode\n dataTestId?: TokenAmountDataTestId\n}\n\nexport const TokenAmount = ({\n symbol,\n amount,\n className,\n dataTestId,\n ...rest\n}: TokenAmountProps) => (\n <span\n className={cn(styles.root, className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n <TokenIcon\n token={symbol}\n className={styles.icon}\n data-testid={dataTestId?.icon}\n />\n <span className={styles.amount} data-testid={dataTestId?.amount}>\n {amount}\n </span>\n </span>\n)\n"],"names":["TokenAmount","_ref","symbol","amount","className","dataTestId","rest","_jsxs","cn","styles","root","children","_jsx","TokenIcon","token","icon"],"mappings":";;;;;;;;;AAsBO,MAAMA,WAAW,GAAGC,IAAA,IAAA;EAAA,IAAC;IAC1BC,MAAM;IACNC,MAAM;IACNC,SAAS;IACTC,UAAU;IACV,GAAGC,IAAAA;AACa,GAAC,GAAAL,IAAA,CAAA;AAAA,EAAA,oBACjBM,eAAA,CAAA,MAAA,EAAA;IACEH,SAAS,EAAEI,EAAE,CAACC,kBAAM,CAACC,IAAI,EAAEN,SAAS,CAAE;IACtC,aAAaC,EAAAA,UAAU,EAAEK,IAAK;AAAA,IAAA,GAC1BJ,IAAI;IAAAK,QAAA,EAAA,cAERC,cAAA,CAACC,mBAAS,EAAA;AACRC,MAAAA,KAAK,EAAEZ,MAAO;MACdE,SAAS,EAAEK,kBAAM,CAACM,IAAK;AACvB,MAAA,aAAA,EAAaV,UAAU,EAAEU,IAAAA;KAC1B,CAAC,eACFH,cAAA,CAAA,MAAA,EAAA;MAAMR,SAAS,EAAEK,kBAAM,CAACN,MAAO;MAAC,aAAaE,EAAAA,UAAU,EAAEF,MAAO;AAAAQ,MAAAA,QAAA,EAC7DR,MAAAA;AAAM,KACH,CAAC,CAAA;AAAA,GACH,CAAC,CAAA;AAAA;;;;"}