@seeqdev/qomponents 0.0.157 → 0.0.158

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 (428) hide show
  1. package/dist/Accordion/Accordion.js +7 -0
  2. package/dist/Accordion/Accordion.js.map +1 -0
  3. package/dist/Accordion/Accordion.stories.js +75 -0
  4. package/dist/Accordion/Accordion.stories.js.map +1 -0
  5. package/dist/Accordion/Accordion.test.js +55 -0
  6. package/dist/Accordion/Accordion.test.js.map +1 -0
  7. package/dist/Accordion/Accordion.types.js +2 -0
  8. package/dist/Accordion/Accordion.types.js.map +1 -0
  9. package/dist/Accordion/index.js +2 -0
  10. package/dist/Accordion/index.js.map +1 -0
  11. package/dist/Alert/Alert.js +32 -0
  12. package/dist/Alert/Alert.js.map +1 -0
  13. package/dist/Alert/Alert.stories.js +57 -0
  14. package/dist/Alert/Alert.stories.js.map +1 -0
  15. package/dist/Alert/Alert.test.js +50 -0
  16. package/dist/Alert/Alert.test.js.map +1 -0
  17. package/dist/Alert/Alert.types.js +2 -0
  18. package/dist/Alert/Alert.types.js.map +1 -0
  19. package/dist/Alert/index.js +2 -0
  20. package/dist/Alert/index.js.map +1 -0
  21. package/dist/Button/Button.js +89 -0
  22. package/dist/Button/Button.js.map +1 -0
  23. package/dist/Button/Button.stories.js +25 -0
  24. package/dist/Button/Button.stories.js.map +1 -0
  25. package/dist/Button/Button.test.js +47 -0
  26. package/dist/Button/Button.test.js.map +1 -0
  27. package/dist/Button/Button.types.js +5 -0
  28. package/dist/Button/Button.types.js.map +1 -0
  29. package/dist/Button/index.js +2 -0
  30. package/dist/Button/index.js.map +1 -0
  31. package/dist/ButtonGroup/ButtonGroup.js +35 -0
  32. package/dist/ButtonGroup/ButtonGroup.js.map +1 -0
  33. package/dist/ButtonGroup/ButtonGroup.stories.js +317 -0
  34. package/dist/ButtonGroup/ButtonGroup.stories.js.map +1 -0
  35. package/dist/ButtonGroup/ButtonGroup.test.js +66 -0
  36. package/dist/ButtonGroup/ButtonGroup.test.js.map +1 -0
  37. package/dist/ButtonGroup/ButtonGroup.types.js +2 -0
  38. package/dist/ButtonGroup/ButtonGroup.types.js.map +1 -0
  39. package/dist/ButtonGroup/index.js +2 -0
  40. package/dist/ButtonGroup/index.js.map +1 -0
  41. package/dist/ButtonWithDropdown/ButtonWithDropdown.js +36 -0
  42. package/dist/ButtonWithDropdown/ButtonWithDropdown.js.map +1 -0
  43. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js +104 -0
  44. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js.map +1 -0
  45. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js +93 -0
  46. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js.map +1 -0
  47. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js +2 -0
  48. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js.map +1 -0
  49. package/dist/ButtonWithDropdown/index.js +2 -0
  50. package/dist/ButtonWithDropdown/index.js.map +1 -0
  51. package/dist/ButtonWithPopover/ButtonWithPopover.js +55 -0
  52. package/dist/ButtonWithPopover/ButtonWithPopover.js.map +1 -0
  53. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js +25 -0
  54. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js.map +1 -0
  55. package/dist/ButtonWithPopover/ButtonWithPopover.test.js +81 -0
  56. package/dist/ButtonWithPopover/ButtonWithPopover.test.js.map +1 -0
  57. package/dist/ButtonWithPopover/ButtonWithPopover.types.js +2 -0
  58. package/dist/ButtonWithPopover/ButtonWithPopover.types.js.map +1 -0
  59. package/dist/ButtonWithPopover/index.js +2 -0
  60. package/dist/ButtonWithPopover/index.js.map +1 -0
  61. package/dist/Carousel/Carousel.js +75 -0
  62. package/dist/Carousel/Carousel.js.map +1 -0
  63. package/dist/Carousel/Carousel.stories.js +63 -0
  64. package/dist/Carousel/Carousel.stories.js.map +1 -0
  65. package/dist/Carousel/Carousel.test.js +48 -0
  66. package/dist/Carousel/Carousel.test.js.map +1 -0
  67. package/dist/Carousel/Carousel.types.js +2 -0
  68. package/dist/Carousel/Carousel.types.js.map +1 -0
  69. package/dist/Carousel/index.js +2 -0
  70. package/dist/Carousel/index.js.map +1 -0
  71. package/dist/Checkbox/Checkbox.js +24 -0
  72. package/dist/Checkbox/Checkbox.js.map +1 -0
  73. package/dist/Checkbox/Checkbox.stories.js +12 -0
  74. package/dist/Checkbox/Checkbox.stories.js.map +1 -0
  75. package/dist/Checkbox/Checkbox.test.js +94 -0
  76. package/dist/Checkbox/Checkbox.test.js.map +1 -0
  77. package/dist/Checkbox/Checkbox.types.js +2 -0
  78. package/dist/Checkbox/Checkbox.types.js.map +1 -0
  79. package/dist/Checkbox/index.js +2 -0
  80. package/dist/Checkbox/index.js.map +1 -0
  81. package/dist/Collapse/Collapse.js +17 -0
  82. package/dist/Collapse/Collapse.js.map +1 -0
  83. package/dist/Collapse/Collapse.stories.js +15 -0
  84. package/dist/Collapse/Collapse.stories.js.map +1 -0
  85. package/dist/Collapse/Collapse.test.js +17 -0
  86. package/dist/Collapse/Collapse.test.js.map +1 -0
  87. package/dist/Collapse/Collapse.types.js +2 -0
  88. package/dist/Collapse/Collapse.types.js.map +1 -0
  89. package/dist/Collapse/index.js +2 -0
  90. package/dist/Collapse/index.js.map +1 -0
  91. package/dist/Icon/Icon.js +55 -0
  92. package/dist/Icon/Icon.js.map +1 -0
  93. package/dist/Icon/Icon.stories.js +15 -0
  94. package/dist/Icon/Icon.stories.js.map +1 -0
  95. package/dist/Icon/Icon.test.js +55 -0
  96. package/dist/Icon/Icon.test.js.map +1 -0
  97. package/dist/Icon/Icon.types.js +16 -0
  98. package/dist/Icon/Icon.types.js.map +1 -0
  99. package/dist/Icon/index.js +2 -0
  100. package/dist/Icon/index.js.map +1 -0
  101. package/dist/InputGroup/InputGroup.js +34 -0
  102. package/dist/InputGroup/InputGroup.js.map +1 -0
  103. package/dist/InputGroup/InputGroup.stories.js +129 -0
  104. package/dist/InputGroup/InputGroup.stories.js.map +1 -0
  105. package/dist/InputGroup/InputGroup.test.js +42 -0
  106. package/dist/InputGroup/InputGroup.test.js.map +1 -0
  107. package/dist/InputGroup/InputGroup.types.js +2 -0
  108. package/dist/InputGroup/InputGroup.types.js.map +1 -0
  109. package/dist/InputGroup/index.js +2 -0
  110. package/dist/InputGroup/index.js.map +1 -0
  111. package/dist/Modal/Modal.js +76 -0
  112. package/dist/Modal/Modal.js.map +1 -0
  113. package/dist/Modal/Modal.stories.js +44 -0
  114. package/dist/Modal/Modal.stories.js.map +1 -0
  115. package/dist/Modal/Modal.test.js +108 -0
  116. package/dist/Modal/Modal.test.js.map +1 -0
  117. package/dist/Modal/Modal.types.js +2 -0
  118. package/dist/Modal/Modal.types.js.map +1 -0
  119. package/dist/Modal/index.js +2 -0
  120. package/dist/Modal/index.js.map +1 -0
  121. package/dist/ProgressBar/ProgressBar.js +72 -0
  122. package/dist/ProgressBar/ProgressBar.js.map +1 -0
  123. package/dist/ProgressBar/ProgressBar.stories.js +35 -0
  124. package/dist/ProgressBar/ProgressBar.stories.js.map +1 -0
  125. package/dist/ProgressBar/ProgressBar.test.js +43 -0
  126. package/dist/ProgressBar/ProgressBar.test.js.map +1 -0
  127. package/dist/ProgressBar/ProgressBar.types.js +2 -0
  128. package/dist/ProgressBar/ProgressBar.types.js.map +1 -0
  129. package/dist/ProgressBar/index.js +2 -0
  130. package/dist/ProgressBar/index.js.map +1 -0
  131. package/dist/SeeqActionDropdown/SeeqActionDropdown.js +39 -0
  132. package/dist/SeeqActionDropdown/SeeqActionDropdown.js.map +1 -0
  133. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js +56 -0
  134. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js.map +1 -0
  135. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js +73 -0
  136. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js.map +1 -0
  137. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js +2 -0
  138. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js.map +1 -0
  139. package/dist/SeeqActionDropdown/index.js +2 -0
  140. package/dist/SeeqActionDropdown/index.js.map +1 -0
  141. package/dist/SeeqActionDropdown/variants.js +29 -0
  142. package/dist/SeeqActionDropdown/variants.js.map +1 -0
  143. package/dist/Select/Select.js +177 -0
  144. package/dist/Select/Select.js.map +1 -0
  145. package/dist/Select/Select.stories.js +40 -0
  146. package/dist/Select/Select.stories.js.map +1 -0
  147. package/dist/Select/Select.test.js +175 -0
  148. package/dist/Select/Select.test.js.map +1 -0
  149. package/dist/Select/Select.types.js +2 -0
  150. package/dist/Select/Select.types.js.map +1 -0
  151. package/dist/Select/index.js +3 -0
  152. package/dist/Select/index.js.map +1 -0
  153. package/dist/Slider/Slider.js +10 -0
  154. package/dist/Slider/Slider.js.map +1 -0
  155. package/dist/Slider/Slider.stories.js +14 -0
  156. package/dist/Slider/Slider.stories.js.map +1 -0
  157. package/dist/Slider/Slider.test.js +32 -0
  158. package/dist/Slider/Slider.test.js.map +1 -0
  159. package/dist/Slider/Slider.types.js +2 -0
  160. package/dist/Slider/Slider.types.js.map +1 -0
  161. package/dist/Slider/index.js +2 -0
  162. package/dist/Slider/index.js.map +1 -0
  163. package/dist/SvgIcon/SvgIcon.js +28 -0
  164. package/dist/SvgIcon/SvgIcon.js.map +1 -0
  165. package/dist/SvgIcon/SvgIcon.stories.js +18 -0
  166. package/dist/SvgIcon/SvgIcon.stories.js.map +1 -0
  167. package/dist/SvgIcon/SvgIcon.test.js +41 -0
  168. package/dist/SvgIcon/SvgIcon.test.js.map +1 -0
  169. package/dist/SvgIcon/SvgIcon.types.js +6 -0
  170. package/dist/SvgIcon/SvgIcon.types.js.map +1 -0
  171. package/dist/SvgIcon/index.js +2 -0
  172. package/dist/SvgIcon/index.js.map +1 -0
  173. package/dist/Tabs/Tabs.js +17 -0
  174. package/dist/Tabs/Tabs.js.map +1 -0
  175. package/dist/Tabs/Tabs.stories.js +73 -0
  176. package/dist/Tabs/Tabs.stories.js.map +1 -0
  177. package/dist/Tabs/Tabs.test.js +86 -0
  178. package/dist/Tabs/Tabs.test.js.map +1 -0
  179. package/dist/Tabs/Tabs.types.js +2 -0
  180. package/dist/Tabs/Tabs.types.js.map +1 -0
  181. package/dist/Tabs/index.js +2 -0
  182. package/dist/Tabs/index.js.map +1 -0
  183. package/dist/TextArea/TextArea.js +25 -0
  184. package/dist/TextArea/TextArea.js.map +1 -0
  185. package/dist/TextArea/TextArea.stories.js +10 -0
  186. package/dist/TextArea/TextArea.stories.js.map +1 -0
  187. package/dist/TextArea/TextArea.test.js +68 -0
  188. package/dist/TextArea/TextArea.test.js.map +1 -0
  189. package/dist/TextArea/TextArea.types.js +2 -0
  190. package/dist/TextArea/TextArea.types.js.map +1 -0
  191. package/dist/TextArea/index.js +2 -0
  192. package/dist/TextArea/index.js.map +1 -0
  193. package/dist/TextField/TextField.js +85 -0
  194. package/dist/TextField/TextField.js.map +1 -0
  195. package/dist/TextField/TextField.stories.js +11 -0
  196. package/dist/TextField/TextField.stories.js.map +1 -0
  197. package/dist/TextField/TextField.test.js +41 -0
  198. package/dist/TextField/TextField.test.js.map +1 -0
  199. package/dist/TextField/TextField.types.js +2 -0
  200. package/dist/TextField/TextField.types.js.map +1 -0
  201. package/dist/TextField/index.js +2 -0
  202. package/dist/TextField/index.js.map +1 -0
  203. package/dist/ToolbarButton/ToolbarButton.js +57 -0
  204. package/dist/ToolbarButton/ToolbarButton.js.map +1 -0
  205. package/dist/ToolbarButton/ToolbarButton.stories.js +28 -0
  206. package/dist/ToolbarButton/ToolbarButton.stories.js.map +1 -0
  207. package/dist/ToolbarButton/ToolbarButton.test.js +85 -0
  208. package/dist/ToolbarButton/ToolbarButton.test.js.map +1 -0
  209. package/dist/ToolbarButton/ToolbarButton.types.js +2 -0
  210. package/dist/ToolbarButton/ToolbarButton.types.js.map +1 -0
  211. package/dist/ToolbarButton/index.js +2 -0
  212. package/dist/ToolbarButton/index.js.map +1 -0
  213. package/dist/Tooltip/QTip.stories.js +18 -0
  214. package/dist/Tooltip/QTip.stories.js.map +1 -0
  215. package/dist/Tooltip/QTip.types.js +2 -0
  216. package/dist/Tooltip/QTip.types.js.map +1 -0
  217. package/dist/Tooltip/QTipPerformance.stories.js +26 -0
  218. package/dist/Tooltip/QTipPerformance.stories.js.map +1 -0
  219. package/dist/Tooltip/Qtip.js +168 -0
  220. package/dist/Tooltip/Qtip.js.map +1 -0
  221. package/dist/Tooltip/Tooltip.js +34 -0
  222. package/dist/Tooltip/Tooltip.js.map +1 -0
  223. package/dist/Tooltip/Tooltip.stories.js +15 -0
  224. package/dist/Tooltip/Tooltip.stories.js.map +1 -0
  225. package/dist/Tooltip/Tooltip.types.js +3 -0
  226. package/dist/Tooltip/Tooltip.types.js.map +1 -0
  227. package/dist/Tooltip/TooltipPerformance.stories.js +26 -0
  228. package/dist/Tooltip/TooltipPerformance.stories.js.map +1 -0
  229. package/dist/Tooltip/index.js +3 -0
  230. package/dist/Tooltip/index.js.map +1 -0
  231. package/dist/Tooltip/qTip.utilities.js +11 -0
  232. package/dist/Tooltip/qTip.utilities.js.map +1 -0
  233. package/dist/example/package.json +15 -13
  234. package/dist/example/src/Example.tsx +269 -39
  235. package/dist/example/src/index.css +1 -0
  236. package/dist/example/vite.config.ts +2 -1
  237. package/dist/index.esm.js +2710 -2706
  238. package/dist/index.esm.js.map +1 -1
  239. package/dist/index.js +2710 -2706
  240. package/dist/index.js.map +1 -1
  241. package/dist/setupTests.d.ts +1 -0
  242. package/dist/setupTests.js +6 -0
  243. package/dist/setupTests.js.map +1 -0
  244. package/dist/{Accordion → src/Accordion}/Accordion.d.ts +4 -4
  245. package/dist/src/Accordion/Accordion.stories.d.ts +5 -0
  246. package/dist/{Accordion → src/Accordion}/Accordion.test.d.ts +1 -1
  247. package/dist/src/Accordion/Accordion.types.d.ts +86 -0
  248. package/dist/{Accordion → src/Accordion}/index.d.ts +1 -1
  249. package/dist/{Alert → src/Alert}/Alert.d.ts +7 -7
  250. package/dist/src/Alert/Alert.stories.d.ts +5 -0
  251. package/dist/src/Alert/Alert.test.d.ts +1 -0
  252. package/dist/src/Alert/Alert.types.d.ts +63 -0
  253. package/dist/{Alert → src/Alert}/index.d.ts +1 -1
  254. package/dist/{Button → src/Button}/Button.d.ts +10 -10
  255. package/dist/src/Button/Button.stories.d.ts +8 -0
  256. package/dist/{Button → src/Button}/Button.test.d.ts +1 -1
  257. package/dist/src/Button/Button.types.d.ts +148 -0
  258. package/dist/{Button → src/Button}/index.d.ts +1 -1
  259. package/dist/{ButtonGroup → src/ButtonGroup}/ButtonGroup.d.ts +7 -7
  260. package/dist/src/ButtonGroup/ButtonGroup.stories.d.ts +5 -0
  261. package/dist/src/ButtonGroup/ButtonGroup.test.d.ts +1 -0
  262. package/dist/src/ButtonGroup/ButtonGroup.types.d.ts +81 -0
  263. package/dist/{ButtonGroup → src/ButtonGroup}/index.d.ts +1 -1
  264. package/dist/{ButtonWithDropdown → src/ButtonWithDropdown}/ButtonWithDropdown.d.ts +4 -4
  265. package/dist/src/ButtonWithDropdown/ButtonWithDropdown.stories.d.ts +5 -0
  266. package/dist/{ButtonWithDropdown → src/ButtonWithDropdown}/ButtonWithDropdown.test.d.ts +1 -1
  267. package/dist/src/ButtonWithDropdown/ButtonWithDropdown.types.d.ts +233 -0
  268. package/dist/{ButtonWithDropdown → src/ButtonWithDropdown}/index.d.ts +1 -1
  269. package/dist/{ButtonWithPopover → src/ButtonWithPopover}/ButtonWithPopover.d.ts +4 -4
  270. package/dist/src/ButtonWithPopover/ButtonWithPopover.stories.d.ts +5 -0
  271. package/dist/{ButtonWithPopover → src/ButtonWithPopover}/ButtonWithPopover.test.d.ts +1 -1
  272. package/dist/src/ButtonWithPopover/ButtonWithPopover.types.d.ts +134 -0
  273. package/dist/{ButtonWithPopover → src/ButtonWithPopover}/index.d.ts +1 -1
  274. package/dist/{Carousel → src/Carousel}/Carousel.d.ts +9 -9
  275. package/dist/src/Carousel/Carousel.stories.d.ts +5 -0
  276. package/dist/{Carousel → src/Carousel}/Carousel.test.d.ts +1 -1
  277. package/dist/src/Carousel/Carousel.types.d.ts +86 -0
  278. package/dist/{Carousel → src/Carousel}/index.d.ts +1 -1
  279. package/dist/{Checkbox → src/Checkbox}/Checkbox.d.ts +7 -7
  280. package/dist/src/Checkbox/Checkbox.stories.d.ts +5 -0
  281. package/dist/{Checkbox → src/Checkbox}/Checkbox.test.d.ts +1 -1
  282. package/dist/src/Checkbox/Checkbox.types.d.ts +92 -0
  283. package/dist/{Checkbox → src/Checkbox}/index.d.ts +1 -1
  284. package/dist/{Collapse → src/Collapse}/Collapse.d.ts +4 -4
  285. package/dist/src/Collapse/Collapse.stories.d.ts +5 -0
  286. package/dist/{Collapse → src/Collapse}/Collapse.test.d.ts +1 -1
  287. package/dist/src/Collapse/Collapse.types.d.ts +19 -0
  288. package/dist/{Collapse → src/Collapse}/index.d.ts +1 -1
  289. package/dist/{Icon → src/Icon}/Icon.d.ts +10 -10
  290. package/dist/src/Icon/Icon.stories.d.ts +5 -0
  291. package/dist/{Icon → src/Icon}/Icon.test.d.ts +1 -1
  292. package/dist/src/Icon/Icon.types.d.ts +87 -0
  293. package/dist/{Icon → src/Icon}/index.d.ts +1 -1
  294. package/dist/{InputGroup → src/InputGroup}/InputGroup.d.ts +7 -7
  295. package/dist/src/InputGroup/InputGroup.stories.d.ts +5 -0
  296. package/dist/src/InputGroup/InputGroup.test.d.ts +1 -0
  297. package/dist/src/InputGroup/InputGroup.types.d.ts +62 -0
  298. package/dist/{InputGroup → src/InputGroup}/index.d.ts +2 -2
  299. package/dist/{Modal → src/Modal}/Modal.d.ts +5 -5
  300. package/dist/{Modal → src/Modal}/Modal.stories.d.ts +10 -10
  301. package/dist/{Modal → src/Modal}/Modal.test.d.ts +1 -1
  302. package/dist/src/Modal/Modal.types.d.ts +244 -0
  303. package/dist/{Modal → src/Modal}/index.d.ts +1 -1
  304. package/dist/{ProgressBar → src/ProgressBar}/ProgressBar.d.ts +4 -4
  305. package/dist/src/ProgressBar/ProgressBar.stories.d.ts +5 -0
  306. package/dist/src/ProgressBar/ProgressBar.test.d.ts +1 -0
  307. package/dist/src/ProgressBar/ProgressBar.types.d.ts +77 -0
  308. package/dist/{ProgressBar → src/ProgressBar}/index.d.ts +1 -1
  309. package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/SeeqActionDropdown.d.ts +4 -4
  310. package/dist/src/SeeqActionDropdown/SeeqActionDropdown.stories.d.ts +5 -0
  311. package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/SeeqActionDropdown.test.d.ts +1 -1
  312. package/dist/src/SeeqActionDropdown/SeeqActionDropdown.types.d.ts +160 -0
  313. package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/index.d.ts +1 -1
  314. package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/variants.d.ts +5 -5
  315. package/dist/{Select → src/Select}/Select.d.ts +15 -15
  316. package/dist/src/Select/Select.stories.d.ts +5 -0
  317. package/dist/{Select → src/Select}/Select.test.d.ts +1 -1
  318. package/dist/src/Select/Select.types.d.ts +220 -0
  319. package/dist/{Select → src/Select}/index.d.ts +2 -2
  320. package/dist/{Slider → src/Slider}/Slider.d.ts +6 -6
  321. package/dist/src/Slider/Slider.stories.d.ts +5 -0
  322. package/dist/src/Slider/Slider.test.d.ts +1 -0
  323. package/dist/src/Slider/Slider.types.d.ts +85 -0
  324. package/dist/{Slider → src/Slider}/index.d.ts +1 -1
  325. package/dist/{SvgIcon → src/SvgIcon}/SvgIcon.d.ts +20 -20
  326. package/dist/src/SvgIcon/SvgIcon.stories.d.ts +5 -0
  327. package/dist/{SvgIcon → src/SvgIcon}/SvgIcon.test.d.ts +1 -1
  328. package/dist/src/SvgIcon/SvgIcon.types.d.ts +76 -0
  329. package/dist/{SvgIcon → src/SvgIcon}/index.d.ts +1 -1
  330. package/dist/{Tabs → src/Tabs}/Tabs.d.ts +4 -4
  331. package/dist/src/Tabs/Tabs.stories.d.ts +5 -0
  332. package/dist/{Tabs → src/Tabs}/Tabs.test.d.ts +1 -1
  333. package/dist/src/Tabs/Tabs.types.d.ts +95 -0
  334. package/dist/{Tabs → src/Tabs}/index.d.ts +1 -1
  335. package/dist/{TextArea → src/TextArea}/TextArea.d.ts +7 -7
  336. package/dist/src/TextArea/TextArea.stories.d.ts +5 -0
  337. package/dist/{TextArea → src/TextArea}/TextArea.test.d.ts +1 -1
  338. package/dist/src/TextArea/TextArea.types.d.ts +105 -0
  339. package/dist/{TextArea → src/TextArea}/index.d.ts +1 -1
  340. package/dist/{TextField → src/TextField}/TextField.d.ts +7 -7
  341. package/dist/src/TextField/TextField.stories.d.ts +5 -0
  342. package/dist/{TextField → src/TextField}/TextField.test.d.ts +1 -1
  343. package/dist/src/TextField/TextField.types.d.ts +199 -0
  344. package/dist/{TextField → src/TextField}/index.d.ts +1 -1
  345. package/dist/{ToolbarButton → src/ToolbarButton}/ToolbarButton.d.ts +3 -3
  346. package/dist/src/ToolbarButton/ToolbarButton.stories.d.ts +5 -0
  347. package/dist/{ToolbarButton → src/ToolbarButton}/ToolbarButton.test.d.ts +1 -1
  348. package/dist/src/ToolbarButton/ToolbarButton.types.d.ts +124 -0
  349. package/dist/{ToolbarButton → src/ToolbarButton}/index.d.ts +1 -1
  350. package/dist/src/Tooltip/QTip.stories.d.ts +5 -0
  351. package/dist/{Tooltip → src/Tooltip}/QTip.types.d.ts +13 -13
  352. package/dist/src/Tooltip/QTipPerformance.stories.d.ts +5 -0
  353. package/dist/{Tooltip → src/Tooltip}/Qtip.d.ts +26 -26
  354. package/dist/{Tooltip → src/Tooltip}/Tooltip.d.ts +13 -13
  355. package/dist/src/Tooltip/Tooltip.stories.d.ts +5 -0
  356. package/dist/{Tooltip → src/Tooltip}/Tooltip.types.d.ts +22 -22
  357. package/dist/src/Tooltip/TooltipPerformance.stories.d.ts +5 -0
  358. package/dist/{Tooltip → src/Tooltip}/index.d.ts +2 -2
  359. package/dist/{Tooltip → src/Tooltip}/qTip.utilities.d.ts +3 -3
  360. package/dist/{index.d.ts → src/index.d.ts} +45 -45
  361. package/dist/src/setupTests.d.ts +1 -0
  362. package/dist/{types.d.ts → src/types.d.ts} +2 -2
  363. package/dist/{utils → src/utils}/browserId.d.ts +9 -9
  364. package/dist/{utils → src/utils}/svg.d.ts +15 -15
  365. package/dist/{utils → src/utils}/validateStyleDimension.d.ts +2 -2
  366. package/dist/{utils → src/utils}/validateStyleDimension.test.d.ts +1 -1
  367. package/dist/styles.css +98 -67
  368. package/dist/types.js +2 -0
  369. package/dist/types.js.map +1 -0
  370. package/dist/utils/browserId.js +29 -0
  371. package/dist/utils/browserId.js.map +1 -0
  372. package/dist/utils/svg.js +20 -0
  373. package/dist/utils/svg.js.map +1 -0
  374. package/dist/utils/validateStyleDimension.js +14 -0
  375. package/dist/utils/validateStyleDimension.js.map +1 -0
  376. package/dist/utils/validateStyleDimension.test.js +20 -0
  377. package/dist/utils/validateStyleDimension.test.js.map +1 -0
  378. package/package.json +20 -20
  379. package/dist/Accordion/Accordion.stories.d.ts +0 -6
  380. package/dist/Accordion/Accordion.types.d.ts +0 -20
  381. package/dist/Alert/Alert.stories.d.ts +0 -6
  382. package/dist/Alert/Alert.test.d.ts +0 -1
  383. package/dist/Alert/Alert.types.d.ts +0 -14
  384. package/dist/Button/Button.stories.d.ts +0 -9
  385. package/dist/Button/Button.types.d.ts +0 -53
  386. package/dist/ButtonGroup/ButtonGroup.stories.d.ts +0 -6
  387. package/dist/ButtonGroup/ButtonGroup.test.d.ts +0 -1
  388. package/dist/ButtonGroup/ButtonGroup.types.d.ts +0 -40
  389. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.d.ts +0 -6
  390. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.d.ts +0 -90
  391. package/dist/ButtonWithPopover/ButtonWithPopover.stories.d.ts +0 -6
  392. package/dist/ButtonWithPopover/ButtonWithPopover.types.d.ts +0 -48
  393. package/dist/Carousel/Carousel.stories.d.ts +0 -6
  394. package/dist/Carousel/Carousel.types.d.ts +0 -24
  395. package/dist/Checkbox/Checkbox.stories.d.ts +0 -6
  396. package/dist/Checkbox/Checkbox.types.d.ts +0 -20
  397. package/dist/Collapse/Collapse.stories.d.ts +0 -6
  398. package/dist/Collapse/Collapse.types.d.ts +0 -5
  399. package/dist/Icon/Icon.stories.d.ts +0 -6
  400. package/dist/Icon/Icon.types.d.ts +0 -31
  401. package/dist/InputGroup/InputGroup.stories.d.ts +0 -6
  402. package/dist/InputGroup/InputGroup.test.d.ts +0 -1
  403. package/dist/InputGroup/InputGroup.types.d.ts +0 -36
  404. package/dist/Modal/Modal.types.d.ts +0 -48
  405. package/dist/ProgressBar/ProgressBar.stories.d.ts +0 -6
  406. package/dist/ProgressBar/ProgressBar.test.d.ts +0 -1
  407. package/dist/ProgressBar/ProgressBar.types.d.ts +0 -30
  408. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.d.ts +0 -6
  409. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.d.ts +0 -58
  410. package/dist/Select/Select.stories.d.ts +0 -6
  411. package/dist/Select/Select.types.d.ts +0 -89
  412. package/dist/Slider/Slider.stories.d.ts +0 -6
  413. package/dist/Slider/Slider.test.d.ts +0 -1
  414. package/dist/Slider/Slider.types.d.ts +0 -17
  415. package/dist/SvgIcon/SvgIcon.stories.d.ts +0 -6
  416. package/dist/SvgIcon/SvgIcon.types.d.ts +0 -25
  417. package/dist/Tabs/Tabs.stories.d.ts +0 -6
  418. package/dist/Tabs/Tabs.types.d.ts +0 -21
  419. package/dist/TextArea/TextArea.stories.d.ts +0 -6
  420. package/dist/TextArea/TextArea.types.d.ts +0 -35
  421. package/dist/TextField/TextField.stories.d.ts +0 -6
  422. package/dist/TextField/TextField.types.d.ts +0 -40
  423. package/dist/ToolbarButton/ToolbarButton.stories.d.ts +0 -6
  424. package/dist/ToolbarButton/ToolbarButton.types.d.ts +0 -53
  425. package/dist/Tooltip/QTip.stories.d.ts +0 -6
  426. package/dist/Tooltip/QTipPerformance.stories.d.ts +0 -6
  427. package/dist/Tooltip/Tooltip.stories.d.ts +0 -6
  428. package/dist/Tooltip/TooltipPerformance.stories.d.ts +0 -6
@@ -0,0 +1,7 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { Root, Item, Trigger, Content } from '@radix-ui/react-accordion';
3
+ const Accordion = ({ accordionItems, defaultValue, value, onItemSelect, disabled, extraClassNames, testId, }) => {
4
+ return (_jsx(Root, { className: `tw-rounded-md tw-w-full focus-visible:tw-outline-none ${extraClassNames || ''}`, type: "single", defaultValue: defaultValue, value: value, collapsible: true, "data-testid": testId, onValueChange: (_value) => onItemSelect(_value), children: accordionItems.map((item) => (_jsxs(Item, { className: `tw-bg-transparent tw-p-0 tw-flex tw-flex-col tw-w-full`, disabled: disabled, value: item.value, children: [_jsx(Trigger, { disabled: disabled, className: `tw-w-full tw-cursor-default focus-visible:tw-outline-none`, children: item.trigger }), _jsx(Content, { className: `data-[state=open]:tw-animate-slideDown data-[state=closed]:tw-animate-slideUp tw-overflow-hidden focus-visible:tw-outline-none ${item.contentClassNames || ''}`, children: item.content })] }, item.value))) }));
5
+ };
6
+ export default Accordion;
7
+ //# sourceMappingURL=Accordion.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAGzE,MAAM,SAAS,GAA4C,CAAC,EAC1D,cAAc,EACd,YAAY,EACZ,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,eAAe,EACf,MAAM,GACP,EAAE,EAAE;IACH,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,yDAAyD,eAAe,IAAI,EAAE,EAAE,EAC3F,IAAI,EAAC,QAAQ,EACb,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,EACZ,WAAW,uBACE,MAAM,EACnB,aAAa,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,YAC9C,cAAc,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5B,MAAC,IAAI,IACH,SAAS,EAAE,wDAAwD,EAEnE,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,aACjB,KAAC,OAAO,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,2DAA2D,YAChG,IAAI,CAAC,OAAO,GACL,EACV,KAAC,OAAO,IACN,SAAS,EAAE,kIACT,IAAI,CAAC,iBAAiB,IAAI,EAC5B,EAAE,YACD,IAAI,CAAC,OAAO,GACL,KAXL,IAAI,CAAC,KAAK,CAYV,CACR,CAAC,GACG,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -0,0 +1,75 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import React from 'react';
3
+ import Accordion from './Accordion';
4
+ import { QTip } from '../Tooltip/Qtip';
5
+ import Icon from '../Icon';
6
+ import Tabs from '../Tabs';
7
+ import Button from '../Button';
8
+ export default {
9
+ title: 'Accordion',
10
+ };
11
+ const Trigger = ({ label }) => (_jsxs("div", { className: "tw-flex tw-justify-start tw-items-center tw-border-b tw-px-2 tw-text-sq-color-dark", children: [_jsx(Icon, { icon: "fc-arrow-dropdown", extraClassNames: "tw-text-sq-color-dark tw-mr-[0.5rem] tw-text-[0.75rem]", type: "text" }), label] }));
12
+ const TriggerSecond = ({ label }) => (_jsxs("div", { className: "tw-flex tw-justify-between tw-items-center tw-border-b tw-px-2 tw-text-sq-color-dark tw-py-2", children: [label, _jsx(Icon, { icon: "fc-arrow-dropdown", extraClassNames: "tw-text-sq-color-dark tw-mr-[0.5rem] tw-text-[0.75rem]", type: "text" })] }));
13
+ const renderData = () => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: "This is a data tab to show details about your data. You can make changes to your account" }), _jsx(Button, { variant: "outline", label: "Save data" })] }));
14
+ const renderTools = () => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: "Make changes to your account here. Click save when you're done." }), _jsx(Button, { variant: "outline", label: "Save tools" })] }));
15
+ const renderJournal = () => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: "Make changes to your account here. Click save when you're done." }), _jsx(Button, { variant: "outline", label: "Save journal" })] }));
16
+ const tabsList = [
17
+ {
18
+ id: 'data',
19
+ label: 'Data',
20
+ icon: 'fc-data',
21
+ content: renderData(),
22
+ },
23
+ {
24
+ id: 'tools',
25
+ label: 'Tools',
26
+ icon: 'fc-gears-2',
27
+ content: renderTools(),
28
+ },
29
+ {
30
+ id: 'journal',
31
+ label: 'Journal',
32
+ icon: 'fc-workbook-lock',
33
+ content: renderJournal(),
34
+ },
35
+ ];
36
+ export const AllAccordionVariants = () => {
37
+ const [activeTab, setActiveTab] = React.useState('data');
38
+ const [value, setValue] = React.useState('oranges');
39
+ const accordionItems = [
40
+ {
41
+ value: 'oranges',
42
+ id: 'oranges',
43
+ itemTestId: 'oranges',
44
+ trigger: _jsx(Trigger, { label: "Oranges" }),
45
+ content: (_jsx("div", { className: "tw-p-2 tw-text-[0.8125rem] dark:tw-text-sq-white", children: "Oranges are the fruit of the citrus species Citrus \u00D7 sinensis in the family Rutaceae. They are also called sweet oranges to distinguish them from the related Citrus \u00D7 aurantium, referred to as bitter oranges. They are round and orange, and usually have a sour or bitter taste. Oranges are a good source of vitamin C." })),
46
+ },
47
+ {
48
+ value: 'apples',
49
+ id: 'apples',
50
+ itemTestId: 'apples',
51
+ trigger: _jsx(Trigger, { label: "Apples" }),
52
+ content: (_jsx("div", { children: _jsx("div", { className: "tw-p-4", children: _jsx(Tabs, { stretchTabs: true, activeTab: activeTab, onTabSelect: setActiveTab, defaultActiveTab: "data", tabs: tabsList }) }) })),
53
+ },
54
+ {
55
+ value: 'bananas',
56
+ id: 'bananas',
57
+ trigger: _jsx(Trigger, { label: "Bananas" }),
58
+ itemTestId: 'bananas',
59
+ content: (_jsx("div", { children: "A banana is an elongated, edible fruit \u2013 botanically a berry \u2013 produced by several kinds of large herbaceous flowering plants in the genus Musa. In some countries, bananas used for cooking may be called \"plantains\", distinguishing them from dessert bananas. The fruit is variable in size, color, and firmness, but is usually elongated and curved, with soft flesh rich in starch covered with a rind, which may be green, yellow, red, purple, or brown when ripe." })),
60
+ },
61
+ {
62
+ value: 'pineapples',
63
+ id: 'pineapples',
64
+ trigger: _jsx(Trigger, { label: "Pineapples" }),
65
+ itemTestId: 'pineapples',
66
+ content: (_jsx("div", { children: "The pineapple is a tropical plant with an edible fruit and the most economically significant plant in the family Bromeliaceae. The pineapple is indigenous to South America, where it has been cultivated for many centuries. The introduction of the pineapple to Europe in the 17th century made it a significant cultural icon of luxury. Since the 1820s, pineapple has been commercially grown in greenhouses and many tropical plantations." })),
67
+ },
68
+ ];
69
+ const allAccordions = (isDark) => (_jsx("div", { className: isDark ? 'tw-dark tw-bg-sq-dark-background' : '', children: _jsx("div", { className: "tw-p-5 ", children: _jsx(Accordion, { accordionItems: isDark
70
+ ? accordionItems
71
+ : accordionItems.map((item) => ({ ...item, trigger: _jsx(TriggerSecond, { label: item.value.toUpperCase() }) })), value: value, testId: "basic-accordion1", onItemSelect: (value) => setValue(value) }) }) }));
72
+ const renderAllVariations = (isDark) => _jsx("div", { className: "tw-p-4", children: allAccordions(isDark) });
73
+ return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsx(QTip, {}), _jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations()] })] }), _jsxs("div", { className: "tw-dark tw-bg-sq-dark-background tw-grid tw-grid-cols-4 tw-gap-4 tw-py-4", children: [_jsxs("div", { className: "color_topic dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations(true)] }), _jsxs("div", { className: "color_analysis dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations(true)] }), _jsxs("div", { className: "color_datalab dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations(true)] }), _jsxs("div", { className: "color_vantage dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations(true)] })] })] }));
74
+ };
75
+ //# sourceMappingURL=Accordion.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.stories.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,55 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import '@testing-library/jest-dom';
3
+ import { render, screen } from '@testing-library/react';
4
+ import userEvent from '@testing-library/user-event';
5
+ import Accordion from './Accordion';
6
+ describe('Accordion', () => {
7
+ const mockOnItemSelect = jest.fn();
8
+ class Context {
9
+ testId = 'buttonTestId';
10
+ label = 'button label';
11
+ props = {
12
+ accordionItems: [
13
+ {
14
+ id: 'item1',
15
+ value: 'item1',
16
+ trigger: 'Item 1',
17
+ content: 'Content 1',
18
+ },
19
+ {
20
+ id: 'item2',
21
+ value: 'item2',
22
+ trigger: 'Item 2',
23
+ content: 'Content 2',
24
+ },
25
+ ],
26
+ defaultValue: 'item1',
27
+ value: 'item1',
28
+ onItemSelect: (key) => mockOnItemSelect(key),
29
+ disabled: false,
30
+ extraClassNames: 'extra-class',
31
+ testId: this.testId,
32
+ };
33
+ }
34
+ let tc;
35
+ beforeEach(() => {
36
+ tc = new Context();
37
+ });
38
+ const renderAccordion = (props) => render(_jsx(Accordion, { ...props }));
39
+ it('renders accordion items', () => {
40
+ renderAccordion(tc.props);
41
+ expect(screen.getByText('Item 1')).toBeInTheDocument();
42
+ expect(screen.getByText('Item 2')).toBeInTheDocument();
43
+ });
44
+ it('renders accordion content', () => {
45
+ renderAccordion(tc.props);
46
+ expect(screen.getByText('Content 1')).toBeInTheDocument();
47
+ expect(screen.queryByText('Content 2')).not.toBeInTheDocument();
48
+ });
49
+ it('calls onItemSelect when an item is selected', async () => {
50
+ renderAccordion(tc.props);
51
+ await userEvent.click(screen.getByText('Item 2'));
52
+ expect(mockOnItemSelect).toHaveBeenCalledWith('item2');
53
+ });
54
+ });
55
+ //# sourceMappingURL=Accordion.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Accordion.test.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.test.tsx"],"names":[],"mappings":";AACA,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AAEpD,OAAO,SAAS,MAAM,aAAa,CAAC;AAGpC,QAAQ,CAAC,WAAW,EAAE,GAAG,EAAE;IACzB,MAAM,gBAAgB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;IACnC,MAAM,OAAO;QACX,MAAM,GAAG,cAAc,CAAC;QACxB,KAAK,GAAG,cAAc,CAAC;QACvB,KAAK,GAAmB;YACtB,cAAc,EAAE;gBACd;oBACE,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,QAAQ;oBACjB,OAAO,EAAE,WAAW;iBACrB;gBACD;oBACE,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,QAAQ;oBACjB,OAAO,EAAE,WAAW;iBACrB;aACF;YACD,YAAY,EAAE,OAAO;YACrB,KAAK,EAAE,OAAO;YACd,YAAY,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,gBAAgB,CAAC,GAAG,CAAC;YAC5C,QAAQ,EAAE,KAAK;YACf,eAAe,EAAE,aAAa;YAC9B,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;KACH;IAED,IAAI,EAAW,CAAC;IAChB,UAAU,CAAC,GAAG,EAAE;QACd,EAAE,GAAG,IAAI,OAAO,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,MAAM,eAAe,GAAG,CAAC,KAAqB,EAAE,EAAE,CAAC,MAAM,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC,CAAC;IAEpF,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;QACjC,eAAe,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QAC1B,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QACvD,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;QACnC,eAAe,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QAC1B,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QAC1D,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC;IAClE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,6CAA6C,EAAE,KAAK,IAAI,EAAE;QAC3D,eAAe,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QAC1B,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;QAClD,MAAM,CAAC,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC;IACzD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=Accordion.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Accordion.types.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.types.ts"],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ export { default } from './Accordion';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC"}
@@ -0,0 +1,32 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import '../styles.css';
3
+ import Icon from '../Icon';
4
+ const baseClasses = 'tw-mx-auto tw-p-4 tw-leading-normal tw-outline-none tw-py-2 tw-px-3 tw-rounded-[10px] tw-w-full tw-relative' +
5
+ ' tw-border-solid tw-border tw-text-sm tw-flex tw-flex-col tw-justify-center tw-items-center';
6
+ const darkTheme = 'dark:tw-bg-sq-colored-hover-dark dark:tw-text-sq-dark-text';
7
+ const lightTheme = 'tw-text-sq-text-color tw-bg-sq-colored-hover';
8
+ const errorClasses = 'tw-border-sq-danger-color';
9
+ const borderColorClasses = 'tw-border-sq-color-dark';
10
+ /**
11
+ * Alert.
12
+ */
13
+ export const Alert = ({ children, dismissible = true, onClose, show = true, variant, testId = 'alert-id', id, extraClassNames, ...tooltipProps }) => {
14
+ const appliedTheme = {
15
+ theme: `${lightTheme} ${darkTheme}`,
16
+ danger: 'tw-text-sq-text-color tw-bg-sq-danger-color',
17
+ warning: 'tw-bg-sq-bg-warning-color tw-text-sq-text-color',
18
+ gray: 'tw-bg-sq-light-gray tw-text-sq-text-color dark:tw-bg-sq-worksheetspanel-gray-dark dark:tw-text-sq-dark-text',
19
+ };
20
+ const appliedBorderTheme = {
21
+ theme: borderColorClasses,
22
+ danger: errorClasses,
23
+ warning: 'tw-border-none',
24
+ gray: 'tw-border-sq-darkish-gray',
25
+ };
26
+ const appliedClasses = `${baseClasses} ${appliedTheme[variant]} ${extraClassNames} ${appliedBorderTheme[variant]}`;
27
+ if (!show) {
28
+ return _jsx("div", {});
29
+ }
30
+ return (_jsxs("div", { "data-testid": testId, id: id, className: appliedClasses, children: [children, dismissible && (_jsx(Icon, { icon: "fc-delete", type: variant.match(/danger|warning/) ? 'color' : 'theme', color: variant.match(/danger|warning/) ? 'inherit' : undefined, extraClassNames: `tw-self-end tw-text-[0.6875rem] tw-cursor-pointer tw-absolute tw-right-[10px] tw-top-[10px] ${variant.match(/danger|warning|gray/) ? 'tw-text-sq-text-color dark:tw-text-sq-dark-text' : ''}`, testId: `${testId}-close-btn`, onClick: onClose, ...tooltipProps }))] }));
31
+ };
32
+ //# sourceMappingURL=Alert.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/Alert/Alert.tsx"],"names":[],"mappings":";AACA,OAAO,eAAe,CAAC;AACvB,OAAO,IAAI,MAAM,SAAS,CAAC;AAG3B,MAAM,WAAW,GACf,6GAA6G;IAC7G,6FAA6F,CAAC;AAEhG,MAAM,SAAS,GAAG,4DAA4D,CAAC;AAC/E,MAAM,UAAU,GAAG,8CAA8C,CAAC;AAElE,MAAM,YAAY,GAAG,2BAA2B,CAAC;AAEjD,MAAM,kBAAkB,GAAG,yBAAyB,CAAC;AAErD;;GAEG;AACH,MAAM,CAAC,MAAM,KAAK,GAAwC,CAAC,EACzD,QAAQ,EACR,WAAW,GAAG,IAAI,EAClB,OAAO,EACP,IAAI,GAAG,IAAI,EACX,OAAO,EACP,MAAM,GAAG,UAAU,EACnB,EAAE,EACF,eAAe,EACf,GAAG,YAAY,EAChB,EAAE,EAAE;IACH,MAAM,YAAY,GAA0C;QAC1D,KAAK,EAAE,GAAG,UAAU,IAAI,SAAS,EAAE;QACnC,MAAM,EAAE,6CAA6C;QACrD,OAAO,EAAE,iDAAiD;QAC1D,IAAI,EAAE,6GAA6G;KACpH,CAAC;IACF,MAAM,kBAAkB,GAA0C;QAChE,KAAK,EAAE,kBAAkB;QACzB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,gBAAgB;QACzB,IAAI,EAAE,2BAA2B;KAClC,CAAC;IACF,MAAM,cAAc,GAAG,GAAG,WAAW,IAAI,YAAY,CAAC,OAAO,CAAC,IAAI,eAAe,IAAI,kBAAkB,CAAC,OAAO,CAAC,EAAE,CAAC;IAEnH,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,OAAO,eAAO,CAAC;IACjB,CAAC;IACD,OAAO,CACL,8BAAkB,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,cAAc,aACxD,QAAQ,EACR,WAAW,IAAI,CACd,KAAC,IAAI,IACH,IAAI,EAAC,WAAW,EAChB,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACzD,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAC9D,eAAe,EAAE,+FACf,OAAO,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,iDAAiD,CAAC,CAAC,CAAC,EAC7F,EAAE,EACF,MAAM,EAAE,GAAG,MAAM,YAAY,EAC7B,OAAO,EAAE,OAAO,KACZ,YAAY,GAChB,CACH,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,57 @@
1
+ import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
2
+ import { Alert } from './Alert';
3
+ import { QTip } from '../Tooltip';
4
+ const Template = ({ variant }) => {
5
+ return (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsxs("h3", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: ["This is a ", variant, " alert, it looks very pleasing and is very useful for showing alerts to the user"] }), _jsx(Alert, { variant: variant, dismissible: true, show: true, extraClassNames: "tw-h-[200px]", tooltip: "This is a small close alert icon", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, children: "This is a dismissible alert, it looks very pleasing and is very useful for showing alerts to the user" }), _jsx(QTip, {})] }));
6
+ };
7
+ export const ThemedAlert = Template.bind({});
8
+ ThemedAlert.args = {
9
+ variant: "theme",
10
+ };
11
+ export const WarningAlert = Template.bind({});
12
+ WarningAlert.args = {
13
+ variant: "warning",
14
+ };
15
+ export const DangerAlert = Template.bind({});
16
+ DangerAlert.args = {
17
+ variant: "danger",
18
+ };
19
+ export const GrayAlert = Template.bind({});
20
+ GrayAlert.args = {
21
+ variant: "gray",
22
+ };
23
+ const colors = ['topic', 'analysis', 'datalab', 'vantage'];
24
+ const renderAlert = ({ text, dismissable, variant, }) => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal" }), _jsx(Alert, { variant: variant, dismissible: dismissable, show: true, extraClassNames: "tw-h-[200px]", tooltip: "This is a small close alert icon", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, children: text })] }));
25
+ export const AllAlertsVariants = () => {
26
+ const renderAllVariations = (color) => (_jsxs("div", { children: [_jsx("div", { className: "tw-p-4", children: renderAlert({
27
+ text: 'This is a dismissible alert, it looks very pleasing and is very useful for showing alerts to the user',
28
+ dismissable: true,
29
+ variant: 'theme',
30
+ }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
31
+ text: 'This is a non dismissable alert, it looks very pleasing and is very useful for showing alerts to the user',
32
+ dismissable: false,
33
+ variant: 'theme',
34
+ }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
35
+ text: 'This is a warning alert, it is used to display a warning',
36
+ dismissable: false,
37
+ variant: 'warning',
38
+ }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
39
+ text: 'This is an error alert, it is used to display an error',
40
+ dismissable: false,
41
+ variant: 'danger',
42
+ }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
43
+ text: 'This is a gray alert, it is used to display a neutral alert',
44
+ dismissable: true,
45
+ variant: 'gray',
46
+ }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
47
+ text: 'This is an error alert that is dismissible, it is used to display an error',
48
+ dismissable: true,
49
+ variant: 'danger',
50
+ }) })] }, color + '_wrapper'));
51
+ return (_jsxs("div", { children: [_jsx(QTip, {}), _jsx("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: colors.map((color) => {
52
+ return _jsx("div", { className: `color_${color}`, children: renderAllVariations(color) });
53
+ }) }), _jsx("div", { className: "tw-dark tw-bg-sq-dark-background tw-grid tw-grid-cols-4 tw-gap-4", children: colors.map((color) => {
54
+ return _jsx("div", { className: `color_${color}`, children: renderAllVariations(color) });
55
+ }) })] }));
56
+ };
57
+ //# sourceMappingURL=Alert.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Alert.stories.js","sourceRoot":"","sources":["../../src/Alert/Alert.stories.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,50 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { fireEvent, render, screen } from '@testing-library/react';
3
+ import { Alert } from './Alert';
4
+ describe('Alert Component', () => {
5
+ const defaultProps = {
6
+ children: 'Test Alert',
7
+ dismissible: true,
8
+ onClose: jest.fn(),
9
+ show: true,
10
+ variant: 'theme',
11
+ testId: 'alert-test-id',
12
+ id: 'alert-id',
13
+ extraClassNames: '',
14
+ };
15
+ it('should render the Alert component', () => {
16
+ render(_jsx(Alert, { ...defaultProps }));
17
+ const alertElement = screen.getByTestId('alert-test-id');
18
+ expect(alertElement).toBeInTheDocument();
19
+ });
20
+ it('should render children correctly', () => {
21
+ render(_jsx(Alert, { ...defaultProps }));
22
+ const alertElement = screen.getByTestId('alert-test-id');
23
+ expect(alertElement).toHaveTextContent('Test Alert');
24
+ });
25
+ it('should apply the correct classes based on variant', () => {
26
+ const { rerender } = render(_jsx(Alert, { ...defaultProps, variant: "danger" }));
27
+ let alertElement = screen.getByTestId('alert-test-id');
28
+ expect(alertElement).toHaveClass('tw-text-sq-text-color tw-bg-sq-danger-color');
29
+ rerender(_jsx(Alert, { ...defaultProps, variant: "warning" }));
30
+ alertElement = screen.getByTestId('alert-test-id');
31
+ expect(alertElement).toHaveClass('tw-bg-sq-bg-warning-color tw-text-sq-text-color');
32
+ });
33
+ it('should call onClose when dismissible icon is clicked', () => {
34
+ render(_jsx(Alert, { ...defaultProps }));
35
+ const closeButton = screen.getByTestId('alert-test-id-close-btn');
36
+ fireEvent.click(closeButton);
37
+ expect(defaultProps.onClose).toHaveBeenCalled();
38
+ });
39
+ it('should not render when show is false', () => {
40
+ render(_jsx(Alert, { ...defaultProps, show: false }));
41
+ const alertElement = screen.queryByTestId('alert-test-id');
42
+ expect(alertElement).not.toBeInTheDocument();
43
+ });
44
+ it('should apply extra class names', () => {
45
+ render(_jsx(Alert, { ...defaultProps, extraClassNames: "extra-class" }));
46
+ const alertElement = screen.getByTestId('alert-test-id');
47
+ expect(alertElement).toHaveClass('extra-class');
48
+ });
49
+ });
50
+ //# sourceMappingURL=Alert.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Alert.test.js","sourceRoot":"","sources":["../../src/Alert/Alert.test.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=Alert.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Alert.types.js","sourceRoot":"","sources":["../../src/Alert/Alert.types.ts"],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ export { Alert as default } from './Alert';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Alert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,MAAM,SAAS,CAAC"}
@@ -0,0 +1,89 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import '../styles.css';
3
+ import { browserIsFirefox } from '../utils/browserId';
4
+ import Icon from '../Icon';
5
+ import { DEFAULT_TOOL_TIP_DELAY } from '../Tooltip/Tooltip.types';
6
+ /**
7
+ * All-in-one Button:
8
+ * - use "variant" to achieve the desired style
9
+ * - include tooltips and/or icons
10
+ */
11
+ const Button = ({ onClick, label, variant = 'outline', type = 'button', size = 'sm', disabled, extraClassNames, id, testId, stopPropagation = true, tooltip, tooltipOptions, iconStyle = 'text', icon, iconColor, iconPosition = 'left', iconPrefix = undefined, preventBlur = false, isHtmlTooltip = false, tooltipTestId, }) => {
12
+ const baseClasses = 'tw-py-1 tw-px-2.5 tw-rounded-md focus:tw-ring-0 focus-visible:tw-outline-none disabled:tw-pointer-events-none';
13
+ const baseClassesByVariant = {
14
+ 'outline': 'disabled:tw-opacity-50 tw-border-solid tw-border',
15
+ 'theme': 'disabled:tw-opacity-50 tw-border-solid tw-border',
16
+ 'danger': 'tw-bg-sq-danger-color hover:tw-bg-sq-danger-color-hover disabled:tw-opacity-50 tw-border-solid tw-border ' +
17
+ 'tw-border-sq-danger-color hover:tw-border-sq-danger-color-hover',
18
+ 'theme-light': 'disabled:tw-opacity-50 tw-border-solid tw-border',
19
+ 'no-border': 'disabled:tw-opacity-50',
20
+ 'warning': 'tw-bg-sq-warning-color tw-border-solid tw-border tw-border-sq-warning-color',
21
+ };
22
+ const textClassesByVariantLightTheme = {
23
+ 'outline': 'tw-text-sq-text-color',
24
+ 'theme': 'tw-text-white',
25
+ 'theme-light': 'tw-text-white',
26
+ 'danger': 'tw-text-white',
27
+ 'no-border': 'tw-text-sq-text-color',
28
+ 'warning': 'tw-text-white',
29
+ };
30
+ const textClassesByVariantDarkTheme = {
31
+ 'outline': 'dark:tw-text-sq-dark-text',
32
+ 'theme': 'dark:tw-text-white',
33
+ 'theme-light': 'dark:tw-text-white',
34
+ 'danger': 'dark:tw-text-white',
35
+ 'no-border': 'dark:tw-text-sq-dark-text',
36
+ 'warning': 'dark:tw-text-white',
37
+ };
38
+ const classesByVariantLightTheme = {
39
+ 'outline': 'tw-bg-white dark:tw-bg-sq-dark-background tw-border-sq-disabled-gray hover:tw-bg-sq-light-gray' +
40
+ ' focus:tw-bg-sq-dark-gray active:tw-bg-sq-dark-gray focus:tw-border-sq-color-dark active:tw-border-sq-color-dark',
41
+ 'theme': 'tw-bg-sq-color-dark hover:tw-bg-sq-color-highlight tw-border-sq-color-dark' +
42
+ ' hover:tw-border-sq-color-highlight',
43
+ 'danger': '',
44
+ 'theme-light': 'tw-bg-sq-icon hover:tw-bg-sq-link tw-border-sq-icon hover:tw-border-sq-link',
45
+ 'no-border': '',
46
+ 'warning': '',
47
+ };
48
+ const classesByVariantDarkTheme = {
49
+ 'outline': 'dark:tw-border-sq-dark-disabled-gray dark:hover:tw-bg-sq-highlight-color-dark' +
50
+ ' dark:focus:tw-bg-sq-multi-gray-dark dark:active:tw-bg-sq-multi-gray-dark dark:focus:tw-border-sq-color-dark' +
51
+ ' dark:active:tw-border-sq-color-dark',
52
+ 'theme': 'dark:tw-bg-sq-color-dark dark:hover:tw-bg-sq-color-highlight dark:tw-border-sq-color-dark' +
53
+ ' dark:hover:tw-border-sq-color-highlight',
54
+ 'danger': '',
55
+ 'theme-light': 'dark:tw-bg-sq-icon-dark dark:hover:tw-bg-sq-link-dark dark:tw-border-sq-icon-dark' +
56
+ ' dark:hover:tw-border-sq-link-dark',
57
+ 'no-border': '',
58
+ 'warning': '',
59
+ };
60
+ const sizeClasses = {
61
+ sm: 'tw-text-sm',
62
+ lg: 'tw-text-xl',
63
+ };
64
+ const appliedClasses = `${baseClasses} ${baseClassesByVariant[variant]} ${sizeClasses[size]} ${classesByVariantLightTheme[variant]} ${classesByVariantDarkTheme[variant]} ${textClassesByVariantLightTheme[variant]} ${textClassesByVariantDarkTheme[variant]} ${extraClassNames}`;
65
+ let tooltipData = undefined;
66
+ if (tooltip) {
67
+ tooltipData = {
68
+ 'data-qtip-text': tooltip,
69
+ 'data-qtip-placement': tooltipOptions?.position,
70
+ 'data-qtip-is-html': isHtmlTooltip,
71
+ 'data-qtip-testid': tooltipTestId,
72
+ 'data-qtip-delay': tooltipOptions?.delay ?? DEFAULT_TOOL_TIP_DELAY,
73
+ };
74
+ }
75
+ const iconClass = iconPosition === 'left' ? 'tw-mr-1' : 'tw-ml-1';
76
+ const iconElement = icon && (_jsx(Icon, { icon: icon, iconPrefix: iconPrefix, type: iconStyle, color: iconColor, extraClassNames: label
77
+ ? `${iconClass} ${textClassesByVariantLightTheme[variant]} ${textClassesByVariantDarkTheme[variant]}`
78
+ : '', testId: `${id}_spinner` }));
79
+ return (_jsxs("button", { id: id, ...tooltipData, disabled: disabled, "data-testid": testId, type: type === 'link' || (type === 'submit' && browserIsFirefox) ? 'button' : type, onClick: (e) => {
80
+ stopPropagation && e.stopPropagation();
81
+ onClick && onClick(e);
82
+ }, onMouseDown: (e) => {
83
+ if (preventBlur) {
84
+ e.preventDefault();
85
+ }
86
+ }, className: appliedClasses, children: [iconPosition === 'left' && iconElement, label, iconPosition === 'right' && iconElement] }));
87
+ };
88
+ export default Button;
89
+ //# sourceMappingURL=Button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,25 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import Button from './Button';
3
+ import { buttonVariants } from './Button.types';
4
+ import { QTip } from '../Tooltip';
5
+ export default {
6
+ title: 'Button',
7
+ };
8
+ export const AllButtonVariants = () => {
9
+ const renderAllVariations = () => (_jsx(_Fragment, { children: buttonVariants.map((variant) => (_jsxs("div", { className: "tw-grid tw-grid-cols-2 tw-gap-4", children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { label: `Variant: ${variant}`, onClick: () => { }, variant: variant }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { label: `Variant: ${variant}`, onClick: () => { }, variant: variant }) })] }, `{variant_${variant}`))) }));
10
+ return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations()] })] }));
11
+ };
12
+ export const ButtonWithTooltip = () => {
13
+ const renderButtonWithTooltip = () => (_jsxs(_Fragment, { children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { tooltip: "Helpful tooltip", variant: "theme", label: "Hover me" }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { tooltip: "Helpful tooltip", variant: "theme", label: "Hover me" }) })] }));
14
+ return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsx(QTip, {}), _jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderButtonWithTooltip()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderButtonWithTooltip()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderButtonWithTooltip()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderButtonWithTooltip()] })] }));
15
+ };
16
+ export const ButtonWithIcon = () => {
17
+ const renderButtonWithIcon = () => (_jsxs(_Fragment, { children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { icon: "fc-search-power", variant: "theme", label: "With Icon" }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { icon: "fc-search-power", variant: "theme", label: "With Icon" }) })] }));
18
+ const renderButtonWithIconOnRight = () => (_jsxs(_Fragment, { children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { icon: "fc-search-power", iconPosition: "right", variant: "theme", label: "With Icon On Right" }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { icon: "fc-search-power", iconPosition: "right", variant: "theme", label: "With Icon On Right" }) })] }));
19
+ return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderButtonWithIcon()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderButtonWithIcon()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderButtonWithIcon()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderButtonWithIcon()] }), _jsx("div", { className: "color_topic", children: renderButtonWithIconOnRight() }), _jsx("div", { className: "color_analysis", children: renderButtonWithIconOnRight() }), _jsx("div", { className: "color_datalab", children: renderButtonWithIconOnRight() }), _jsx("div", { className: "color_vantage", children: renderButtonWithIconOnRight() })] }));
20
+ };
21
+ export const DisabledButton = () => {
22
+ const renderDisabledButton = () => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "tw-p-4", children: [_jsx(Button, { disabled: true, variant: "theme", label: "Disabled Button" }), _jsx(Button, { extraClassNames: "tw-m-5", disabled: true, label: "Disabled Button" })] }), _jsxs("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: [_jsx(Button, { disabled: true, variant: "theme", label: "Disabled Button" }), _jsx(Button, { extraClassNames: "tw-m-5", disabled: true, label: "Disabled Button" })] })] }));
23
+ return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderDisabledButton()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderDisabledButton()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderDisabledButton()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderDisabledButton()] })] }));
24
+ };
25
+ //# sourceMappingURL=Button.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../src/Button/Button.stories.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAElC,eAAe;IACb,KAAK,EAAE,QAAQ;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC,CAChC,4BACG,cAAc,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAC/B,eAAiC,SAAS,EAAC,iCAAiC,aAC1E,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,MAAM,IAAC,KAAK,EAAE,YAAY,OAAO,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAO,GAAI,GACzE,EACN,cAAK,SAAS,EAAC,yCAAyC,YACtD,KAAC,MAAM,IAAC,KAAK,EAAE,YAAY,OAAO,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAO,GAAI,GACzE,KANE,YAAY,OAAO,EAAE,CAOzB,CACP,CAAC,GACD,CACJ,CAAC;IACF,OAAO,CACL,eAAK,SAAS,EAAC,iCAAiC,aAC9C,eAAK,SAAS,EAAC,aAAa,aAC1B,uCAAmB,EAClB,mBAAmB,EAAE,IAClB,EAEN,eAAK,SAAS,EAAC,gBAAgB,aAC7B,0CAAsB,EACrB,mBAAmB,EAAE,IAClB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,mBAAmB,EAAE,IAClB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,mBAAmB,EAAE,IAClB,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,MAAM,uBAAuB,GAAG,GAAG,EAAE,CAAC,CACpC,8BACE,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,MAAM,IAAC,OAAO,EAAC,iBAAiB,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,UAAU,GAAG,GACjE,EACN,cAAK,SAAS,EAAC,yCAAyC,YACtD,KAAC,MAAM,IAAC,OAAO,EAAC,iBAAiB,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,UAAU,GAAG,GACjE,IACL,CACJ,CAAC;IACF,OAAO,CACL,eAAK,SAAS,EAAC,iCAAiC,aAC9C,KAAC,IAAI,KAAG,EACR,eAAK,SAAS,EAAC,aAAa,aAC1B,uCAAmB,EAClB,uBAAuB,EAAE,IACtB,EAEN,eAAK,SAAS,EAAC,gBAAgB,aAC7B,0CAAsB,EACrB,uBAAuB,EAAE,IACtB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,uBAAuB,EAAE,IACtB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,uBAAuB,EAAE,IACtB,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,MAAM,oBAAoB,GAAG,GAAG,EAAE,CAAC,CACjC,8BACE,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,MAAM,IAAC,IAAI,EAAC,iBAAiB,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,WAAW,GAAG,GAC/D,EACN,cAAK,SAAS,EAAC,yCAAyC,YACtD,KAAC,MAAM,IAAC,IAAI,EAAC,iBAAiB,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,WAAW,GAAG,GAC/D,IACL,CACJ,CAAC;IACF,MAAM,2BAA2B,GAAG,GAAG,EAAE,CAAC,CACxC,8BACE,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,MAAM,IAAC,IAAI,EAAC,iBAAiB,EAAC,YAAY,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,oBAAoB,GAAG,GAC7F,EACN,cAAK,SAAS,EAAC,yCAAyC,YACtD,KAAC,MAAM,IAAC,IAAI,EAAC,iBAAiB,EAAC,YAAY,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,oBAAoB,GAAG,GAC7F,IACL,CACJ,CAAC;IACF,OAAO,CACL,eAAK,SAAS,EAAC,iCAAiC,aAC9C,eAAK,SAAS,EAAC,aAAa,aAC1B,uCAAmB,EAClB,oBAAoB,EAAE,IACnB,EAEN,eAAK,SAAS,EAAC,gBAAgB,aAC7B,0CAAsB,EACrB,oBAAoB,EAAE,IACnB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,oBAAoB,EAAE,IACnB,EACN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,oBAAoB,EAAE,IACnB,EAEN,cAAK,SAAS,EAAC,aAAa,YAAE,2BAA2B,EAAE,GAAO,EAElE,cAAK,SAAS,EAAC,gBAAgB,YAAE,2BAA2B,EAAE,GAAO,EAErE,cAAK,SAAS,EAAC,eAAe,YAAE,2BAA2B,EAAE,GAAO,EAEpE,cAAK,SAAS,EAAC,eAAe,YAAE,2BAA2B,EAAE,GAAO,IAChE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,MAAM,oBAAoB,GAAG,GAAG,EAAE,CAAC,CACjC,8BACE,eAAK,SAAS,EAAC,QAAQ,aACrB,KAAC,MAAM,IAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,iBAAiB,GAAG,EAClE,KAAC,MAAM,IAAC,eAAe,EAAC,QAAQ,EAAC,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAC,iBAAiB,GAAG,IACvE,EACN,eAAK,SAAS,EAAC,yCAAyC,aACtD,KAAC,MAAM,IAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,iBAAiB,GAAG,EAClE,KAAC,MAAM,IAAC,eAAe,EAAC,QAAQ,EAAC,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAC,iBAAiB,GAAG,IACvE,IACL,CACJ,CAAC;IACF,OAAO,CACL,eAAK,SAAS,EAAC,iCAAiC,aAC9C,eAAK,SAAS,EAAC,aAAa,aAC1B,uCAAmB,EAClB,oBAAoB,EAAE,IACnB,EAEN,eAAK,SAAS,EAAC,gBAAgB,aAC7B,0CAAsB,EACrB,oBAAoB,EAAE,IACnB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,oBAAoB,EAAE,IACnB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,oBAAoB,EAAE,IACnB,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,47 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import '@testing-library/jest-dom';
3
+ import { render, screen } from '@testing-library/react';
4
+ import userEvent from '@testing-library/user-event';
5
+ import Button from './Button';
6
+ describe('Button', () => {
7
+ class Context {
8
+ testId = 'buttonTestId';
9
+ label = 'button label';
10
+ props = {
11
+ label: this.label,
12
+ onClick: jest.fn(),
13
+ testId: this.testId,
14
+ };
15
+ }
16
+ let tc;
17
+ beforeEach(() => {
18
+ tc = new Context();
19
+ });
20
+ const renderButton = (props) => render(_jsx(Button, { ...props }));
21
+ it('renders button label', () => {
22
+ renderButton(tc.props);
23
+ expect(screen.getByText(tc.label)).toBeInTheDocument();
24
+ });
25
+ it('calls on click', async () => {
26
+ renderButton(tc.props);
27
+ await userEvent.click(screen.getByTestId(tc.testId));
28
+ expect(tc.props.onClick).toHaveBeenCalled();
29
+ });
30
+ it('renders disabled button', () => {
31
+ renderButton({ ...tc.props, disabled: true });
32
+ expect(screen.getByText(tc.label)).toBeDisabled();
33
+ });
34
+ it('respects stopPropagation default', async () => {
35
+ const callOnPropagation = jest.fn();
36
+ render(_jsx("div", { onClick: callOnPropagation, children: _jsx(Button, { ...tc.props }) }));
37
+ await userEvent.click(screen.getByTestId(tc.testId));
38
+ expect(callOnPropagation).not.toHaveBeenCalled();
39
+ });
40
+ it('propagates click event if not told not to', async () => {
41
+ const callOnPropagation = jest.fn();
42
+ render(_jsx("div", { onClick: callOnPropagation, children: _jsx(Button, { ...tc.props, stopPropagation: false }) }));
43
+ await userEvent.click(screen.getByTestId(tc.testId));
44
+ expect(callOnPropagation).toHaveBeenCalled();
45
+ });
46
+ });
47
+ //# sourceMappingURL=Button.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.test.js","sourceRoot":"","sources":["../../src/Button/Button.test.tsx"],"names":[],"mappings":";AACA,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AAEpD,OAAO,MAAM,MAAM,UAAU,CAAC;AAG9B,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;IACtB,MAAM,OAAO;QACX,MAAM,GAAG,cAAc,CAAC;QACxB,KAAK,GAAG,cAAc,CAAC;QACvB,KAAK,GAAgB;YACnB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE;YAClB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;KACH;IAED,IAAI,EAAW,CAAC;IAChB,UAAU,CAAC,GAAG,EAAE;QACd,EAAE,GAAG,IAAI,OAAO,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,MAAM,CAAC,KAAC,MAAM,OAAK,KAAK,GAAI,CAAC,CAAC;IAE3E,EAAE,CAAC,sBAAsB,EAAE,GAAG,EAAE;QAC9B,YAAY,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QACvB,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gBAAgB,EAAE,KAAK,IAAI,EAAE;QAC9B,YAAY,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QACvB,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;QACrD,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,gBAAgB,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;QACjC,YAAY,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;QAC9C,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC;IACpD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,iBAAiB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QACpC,MAAM,CACJ,cAAK,OAAO,EAAE,iBAAiB,YAC7B,KAAC,MAAM,OAAK,EAAE,CAAC,KAAK,GAAI,GACpB,CACP,CAAC;QACF,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;QACrD,MAAM,CAAC,iBAAiB,CAAC,CAAC,GAAG,CAAC,gBAAgB,EAAE,CAAC;IACnD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2CAA2C,EAAE,KAAK,IAAI,EAAE;QACzD,MAAM,iBAAiB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QACpC,MAAM,CACJ,cAAK,OAAO,EAAE,iBAAiB,YAC7B,KAAC,MAAM,IAAO,GAAG,EAAE,CAAC,KAAK,EAAE,eAAe,EAAE,KAAK,GAAM,GACnD,CACP,CAAC;QACF,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;QACrD,MAAM,CAAC,iBAAiB,CAAC,CAAC,gBAAgB,EAAE,CAAC;IAC/C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -0,0 +1,5 @@
1
+ export const buttonTypes = ['button', 'reset', 'submit', 'link'];
2
+ export const buttonSizes = ['sm', 'lg'];
3
+ export const buttonVariants = ['outline', 'theme', 'theme-light', 'warning', 'danger', 'no-border'];
4
+ export const iconPositions = ['left', 'right'];
5
+ //# sourceMappingURL=Button.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.types.js","sourceRoot":"","sources":["../../src/Button/Button.types.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,CAAU,CAAC;AAC1E,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,CAAU,CAAC;AACjD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAS,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,CAAU,CAAC;AAC7G,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export { default } from "./Button";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}