@seeqdev/qomponents 0.0.171 → 0.0.172

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 (387) hide show
  1. package/README.md +135 -135
  2. package/dist/example/.eslintrc.cjs +14 -14
  3. package/dist/example/README.md +33 -33
  4. package/dist/example/index.html +13 -13
  5. package/dist/example/package.json +32 -32
  6. package/dist/example/src/ComplexSelectExample.tsx +81 -81
  7. package/dist/example/src/Example.tsx +638 -638
  8. package/dist/example/src/index.css +103 -103
  9. package/dist/example/src/main.tsx +10 -10
  10. package/dist/example/src/vite-env.d.ts +1 -1
  11. package/dist/example/tsconfig.json +33 -33
  12. package/dist/example/tsconfig.node.json +12 -12
  13. package/dist/example/vite.config.ts +13 -13
  14. package/dist/index.esm.js +14 -14
  15. package/dist/index.esm.js.map +1 -1
  16. package/dist/index.js +14 -14
  17. package/dist/index.js.map +1 -1
  18. package/dist/src/Tabs/Tabs.types.d.ts +5 -0
  19. package/dist/styles.css +3868 -3868
  20. package/package.json +89 -89
  21. package/dist/Accordion/Accordion.d.ts +0 -4
  22. package/dist/Accordion/Accordion.js +0 -7
  23. package/dist/Accordion/Accordion.js.map +0 -1
  24. package/dist/Accordion/Accordion.stories.d.ts +0 -5
  25. package/dist/Accordion/Accordion.stories.js +0 -75
  26. package/dist/Accordion/Accordion.stories.js.map +0 -1
  27. package/dist/Accordion/Accordion.test.d.ts +0 -1
  28. package/dist/Accordion/Accordion.test.js +0 -55
  29. package/dist/Accordion/Accordion.test.js.map +0 -1
  30. package/dist/Accordion/Accordion.types.d.ts +0 -86
  31. package/dist/Accordion/Accordion.types.js +0 -2
  32. package/dist/Accordion/Accordion.types.js.map +0 -1
  33. package/dist/Accordion/index.d.ts +0 -1
  34. package/dist/Accordion/index.js +0 -2
  35. package/dist/Accordion/index.js.map +0 -1
  36. package/dist/Alert/Alert.d.ts +0 -7
  37. package/dist/Alert/Alert.js +0 -32
  38. package/dist/Alert/Alert.js.map +0 -1
  39. package/dist/Alert/Alert.stories.d.ts +0 -5
  40. package/dist/Alert/Alert.stories.js +0 -57
  41. package/dist/Alert/Alert.stories.js.map +0 -1
  42. package/dist/Alert/Alert.test.d.ts +0 -1
  43. package/dist/Alert/Alert.test.js +0 -50
  44. package/dist/Alert/Alert.test.js.map +0 -1
  45. package/dist/Alert/Alert.types.d.ts +0 -63
  46. package/dist/Alert/Alert.types.js +0 -2
  47. package/dist/Alert/Alert.types.js.map +0 -1
  48. package/dist/Alert/index.d.ts +0 -1
  49. package/dist/Alert/index.js +0 -2
  50. package/dist/Alert/index.js.map +0 -1
  51. package/dist/Button/Button.d.ts +0 -10
  52. package/dist/Button/Button.js +0 -90
  53. package/dist/Button/Button.js.map +0 -1
  54. package/dist/Button/Button.stories.d.ts +0 -9
  55. package/dist/Button/Button.stories.js +0 -29
  56. package/dist/Button/Button.stories.js.map +0 -1
  57. package/dist/Button/Button.test.d.ts +0 -1
  58. package/dist/Button/Button.test.js +0 -47
  59. package/dist/Button/Button.test.js.map +0 -1
  60. package/dist/Button/Button.types.d.ts +0 -148
  61. package/dist/Button/Button.types.js +0 -5
  62. package/dist/Button/Button.types.js.map +0 -1
  63. package/dist/Button/index.d.ts +0 -1
  64. package/dist/Button/index.js +0 -2
  65. package/dist/Button/index.js.map +0 -1
  66. package/dist/ButtonGroup/ButtonGroup.d.ts +0 -7
  67. package/dist/ButtonGroup/ButtonGroup.js +0 -35
  68. package/dist/ButtonGroup/ButtonGroup.js.map +0 -1
  69. package/dist/ButtonGroup/ButtonGroup.stories.d.ts +0 -5
  70. package/dist/ButtonGroup/ButtonGroup.stories.js +0 -317
  71. package/dist/ButtonGroup/ButtonGroup.stories.js.map +0 -1
  72. package/dist/ButtonGroup/ButtonGroup.test.d.ts +0 -1
  73. package/dist/ButtonGroup/ButtonGroup.test.js +0 -66
  74. package/dist/ButtonGroup/ButtonGroup.test.js.map +0 -1
  75. package/dist/ButtonGroup/ButtonGroup.types.d.ts +0 -81
  76. package/dist/ButtonGroup/ButtonGroup.types.js +0 -2
  77. package/dist/ButtonGroup/ButtonGroup.types.js.map +0 -1
  78. package/dist/ButtonGroup/index.d.ts +0 -1
  79. package/dist/ButtonGroup/index.js +0 -2
  80. package/dist/ButtonGroup/index.js.map +0 -1
  81. package/dist/ButtonWithDropdown/ButtonWithDropdown.d.ts +0 -4
  82. package/dist/ButtonWithDropdown/ButtonWithDropdown.js +0 -36
  83. package/dist/ButtonWithDropdown/ButtonWithDropdown.js.map +0 -1
  84. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.d.ts +0 -5
  85. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js +0 -104
  86. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js.map +0 -1
  87. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.d.ts +0 -1
  88. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js +0 -93
  89. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js.map +0 -1
  90. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.d.ts +0 -233
  91. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js +0 -2
  92. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js.map +0 -1
  93. package/dist/ButtonWithDropdown/index.d.ts +0 -1
  94. package/dist/ButtonWithDropdown/index.js +0 -2
  95. package/dist/ButtonWithDropdown/index.js.map +0 -1
  96. package/dist/ButtonWithPopover/ButtonWithPopover.d.ts +0 -4
  97. package/dist/ButtonWithPopover/ButtonWithPopover.js +0 -55
  98. package/dist/ButtonWithPopover/ButtonWithPopover.js.map +0 -1
  99. package/dist/ButtonWithPopover/ButtonWithPopover.stories.d.ts +0 -5
  100. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js +0 -25
  101. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js.map +0 -1
  102. package/dist/ButtonWithPopover/ButtonWithPopover.test.d.ts +0 -1
  103. package/dist/ButtonWithPopover/ButtonWithPopover.test.js +0 -81
  104. package/dist/ButtonWithPopover/ButtonWithPopover.test.js.map +0 -1
  105. package/dist/ButtonWithPopover/ButtonWithPopover.types.d.ts +0 -134
  106. package/dist/ButtonWithPopover/ButtonWithPopover.types.js +0 -2
  107. package/dist/ButtonWithPopover/ButtonWithPopover.types.js.map +0 -1
  108. package/dist/ButtonWithPopover/index.d.ts +0 -1
  109. package/dist/ButtonWithPopover/index.js +0 -2
  110. package/dist/ButtonWithPopover/index.js.map +0 -1
  111. package/dist/Carousel/Carousel.d.ts +0 -9
  112. package/dist/Carousel/Carousel.js +0 -75
  113. package/dist/Carousel/Carousel.js.map +0 -1
  114. package/dist/Carousel/Carousel.stories.d.ts +0 -5
  115. package/dist/Carousel/Carousel.stories.js +0 -63
  116. package/dist/Carousel/Carousel.stories.js.map +0 -1
  117. package/dist/Carousel/Carousel.test.d.ts +0 -1
  118. package/dist/Carousel/Carousel.test.js +0 -48
  119. package/dist/Carousel/Carousel.test.js.map +0 -1
  120. package/dist/Carousel/Carousel.types.d.ts +0 -86
  121. package/dist/Carousel/Carousel.types.js +0 -2
  122. package/dist/Carousel/Carousel.types.js.map +0 -1
  123. package/dist/Carousel/index.d.ts +0 -1
  124. package/dist/Carousel/index.js +0 -2
  125. package/dist/Carousel/index.js.map +0 -1
  126. package/dist/Checkbox/Checkbox.d.ts +0 -7
  127. package/dist/Checkbox/Checkbox.js +0 -25
  128. package/dist/Checkbox/Checkbox.js.map +0 -1
  129. package/dist/Checkbox/Checkbox.stories.d.ts +0 -5
  130. package/dist/Checkbox/Checkbox.stories.js +0 -12
  131. package/dist/Checkbox/Checkbox.stories.js.map +0 -1
  132. package/dist/Checkbox/Checkbox.test.d.ts +0 -1
  133. package/dist/Checkbox/Checkbox.test.js +0 -94
  134. package/dist/Checkbox/Checkbox.test.js.map +0 -1
  135. package/dist/Checkbox/Checkbox.types.d.ts +0 -92
  136. package/dist/Checkbox/Checkbox.types.js +0 -2
  137. package/dist/Checkbox/Checkbox.types.js.map +0 -1
  138. package/dist/Checkbox/index.d.ts +0 -1
  139. package/dist/Checkbox/index.js +0 -2
  140. package/dist/Checkbox/index.js.map +0 -1
  141. package/dist/Collapse/Collapse.d.ts +0 -4
  142. package/dist/Collapse/Collapse.js +0 -17
  143. package/dist/Collapse/Collapse.js.map +0 -1
  144. package/dist/Collapse/Collapse.stories.d.ts +0 -5
  145. package/dist/Collapse/Collapse.stories.js +0 -15
  146. package/dist/Collapse/Collapse.stories.js.map +0 -1
  147. package/dist/Collapse/Collapse.test.d.ts +0 -1
  148. package/dist/Collapse/Collapse.test.js +0 -17
  149. package/dist/Collapse/Collapse.test.js.map +0 -1
  150. package/dist/Collapse/Collapse.types.d.ts +0 -19
  151. package/dist/Collapse/Collapse.types.js +0 -2
  152. package/dist/Collapse/Collapse.types.js.map +0 -1
  153. package/dist/Collapse/index.d.ts +0 -1
  154. package/dist/Collapse/index.js +0 -2
  155. package/dist/Collapse/index.js.map +0 -1
  156. package/dist/Icon/Icon.d.ts +0 -10
  157. package/dist/Icon/Icon.js +0 -56
  158. package/dist/Icon/Icon.js.map +0 -1
  159. package/dist/Icon/Icon.stories.d.ts +0 -5
  160. package/dist/Icon/Icon.stories.js +0 -15
  161. package/dist/Icon/Icon.stories.js.map +0 -1
  162. package/dist/Icon/Icon.test.d.ts +0 -1
  163. package/dist/Icon/Icon.test.js +0 -55
  164. package/dist/Icon/Icon.test.js.map +0 -1
  165. package/dist/Icon/Icon.types.d.ts +0 -91
  166. package/dist/Icon/Icon.types.js +0 -16
  167. package/dist/Icon/Icon.types.js.map +0 -1
  168. package/dist/Icon/index.d.ts +0 -1
  169. package/dist/Icon/index.js +0 -2
  170. package/dist/Icon/index.js.map +0 -1
  171. package/dist/InputGroup/InputGroup.d.ts +0 -7
  172. package/dist/InputGroup/InputGroup.js +0 -34
  173. package/dist/InputGroup/InputGroup.js.map +0 -1
  174. package/dist/InputGroup/InputGroup.stories.d.ts +0 -5
  175. package/dist/InputGroup/InputGroup.stories.js +0 -129
  176. package/dist/InputGroup/InputGroup.stories.js.map +0 -1
  177. package/dist/InputGroup/InputGroup.test.d.ts +0 -1
  178. package/dist/InputGroup/InputGroup.test.js +0 -42
  179. package/dist/InputGroup/InputGroup.test.js.map +0 -1
  180. package/dist/InputGroup/InputGroup.types.d.ts +0 -62
  181. package/dist/InputGroup/InputGroup.types.js +0 -2
  182. package/dist/InputGroup/InputGroup.types.js.map +0 -1
  183. package/dist/InputGroup/index.d.ts +0 -2
  184. package/dist/InputGroup/index.js +0 -2
  185. package/dist/InputGroup/index.js.map +0 -1
  186. package/dist/Modal/Modal.d.ts +0 -5
  187. package/dist/Modal/Modal.js +0 -76
  188. package/dist/Modal/Modal.js.map +0 -1
  189. package/dist/Modal/Modal.stories.d.ts +0 -10
  190. package/dist/Modal/Modal.stories.js +0 -44
  191. package/dist/Modal/Modal.stories.js.map +0 -1
  192. package/dist/Modal/Modal.test.d.ts +0 -1
  193. package/dist/Modal/Modal.test.js +0 -108
  194. package/dist/Modal/Modal.test.js.map +0 -1
  195. package/dist/Modal/Modal.types.d.ts +0 -244
  196. package/dist/Modal/Modal.types.js +0 -2
  197. package/dist/Modal/Modal.types.js.map +0 -1
  198. package/dist/Modal/index.d.ts +0 -1
  199. package/dist/Modal/index.js +0 -2
  200. package/dist/Modal/index.js.map +0 -1
  201. package/dist/ProgressBar/ProgressBar.d.ts +0 -4
  202. package/dist/ProgressBar/ProgressBar.js +0 -72
  203. package/dist/ProgressBar/ProgressBar.js.map +0 -1
  204. package/dist/ProgressBar/ProgressBar.stories.d.ts +0 -5
  205. package/dist/ProgressBar/ProgressBar.stories.js +0 -35
  206. package/dist/ProgressBar/ProgressBar.stories.js.map +0 -1
  207. package/dist/ProgressBar/ProgressBar.test.d.ts +0 -1
  208. package/dist/ProgressBar/ProgressBar.test.js +0 -43
  209. package/dist/ProgressBar/ProgressBar.test.js.map +0 -1
  210. package/dist/ProgressBar/ProgressBar.types.d.ts +0 -77
  211. package/dist/ProgressBar/ProgressBar.types.js +0 -2
  212. package/dist/ProgressBar/ProgressBar.types.js.map +0 -1
  213. package/dist/ProgressBar/index.d.ts +0 -1
  214. package/dist/ProgressBar/index.js +0 -2
  215. package/dist/ProgressBar/index.js.map +0 -1
  216. package/dist/SeeqActionDropdown/SeeqActionDropdown.d.ts +0 -4
  217. package/dist/SeeqActionDropdown/SeeqActionDropdown.js +0 -39
  218. package/dist/SeeqActionDropdown/SeeqActionDropdown.js.map +0 -1
  219. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.d.ts +0 -5
  220. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js +0 -56
  221. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js.map +0 -1
  222. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.d.ts +0 -1
  223. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js +0 -73
  224. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js.map +0 -1
  225. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.d.ts +0 -160
  226. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js +0 -2
  227. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js.map +0 -1
  228. package/dist/SeeqActionDropdown/index.d.ts +0 -1
  229. package/dist/SeeqActionDropdown/index.js +0 -2
  230. package/dist/SeeqActionDropdown/index.js.map +0 -1
  231. package/dist/SeeqActionDropdown/variants.d.ts +0 -5
  232. package/dist/SeeqActionDropdown/variants.js +0 -29
  233. package/dist/SeeqActionDropdown/variants.js.map +0 -1
  234. package/dist/Select/Select.d.ts +0 -15
  235. package/dist/Select/Select.js +0 -177
  236. package/dist/Select/Select.js.map +0 -1
  237. package/dist/Select/Select.stories.d.ts +0 -5
  238. package/dist/Select/Select.stories.js +0 -40
  239. package/dist/Select/Select.stories.js.map +0 -1
  240. package/dist/Select/Select.test.d.ts +0 -1
  241. package/dist/Select/Select.test.js +0 -175
  242. package/dist/Select/Select.test.js.map +0 -1
  243. package/dist/Select/Select.types.d.ts +0 -220
  244. package/dist/Select/Select.types.js +0 -2
  245. package/dist/Select/Select.types.js.map +0 -1
  246. package/dist/Select/index.d.ts +0 -2
  247. package/dist/Select/index.js +0 -3
  248. package/dist/Select/index.js.map +0 -1
  249. package/dist/Slider/Slider.d.ts +0 -6
  250. package/dist/Slider/Slider.js +0 -10
  251. package/dist/Slider/Slider.js.map +0 -1
  252. package/dist/Slider/Slider.stories.d.ts +0 -5
  253. package/dist/Slider/Slider.stories.js +0 -14
  254. package/dist/Slider/Slider.stories.js.map +0 -1
  255. package/dist/Slider/Slider.test.d.ts +0 -1
  256. package/dist/Slider/Slider.test.js +0 -32
  257. package/dist/Slider/Slider.test.js.map +0 -1
  258. package/dist/Slider/Slider.types.d.ts +0 -85
  259. package/dist/Slider/Slider.types.js +0 -2
  260. package/dist/Slider/Slider.types.js.map +0 -1
  261. package/dist/Slider/index.d.ts +0 -1
  262. package/dist/Slider/index.js +0 -2
  263. package/dist/Slider/index.js.map +0 -1
  264. package/dist/SvgIcon/SvgIcon.d.ts +0 -20
  265. package/dist/SvgIcon/SvgIcon.js +0 -28
  266. package/dist/SvgIcon/SvgIcon.js.map +0 -1
  267. package/dist/SvgIcon/SvgIcon.stories.d.ts +0 -5
  268. package/dist/SvgIcon/SvgIcon.stories.js +0 -18
  269. package/dist/SvgIcon/SvgIcon.stories.js.map +0 -1
  270. package/dist/SvgIcon/SvgIcon.test.d.ts +0 -1
  271. package/dist/SvgIcon/SvgIcon.test.js +0 -41
  272. package/dist/SvgIcon/SvgIcon.test.js.map +0 -1
  273. package/dist/SvgIcon/SvgIcon.types.d.ts +0 -76
  274. package/dist/SvgIcon/SvgIcon.types.js +0 -3
  275. package/dist/SvgIcon/SvgIcon.types.js.map +0 -1
  276. package/dist/SvgIcon/index.d.ts +0 -1
  277. package/dist/SvgIcon/index.js +0 -2
  278. package/dist/SvgIcon/index.js.map +0 -1
  279. package/dist/Tabs/Tabs.d.ts +0 -4
  280. package/dist/Tabs/Tabs.js +0 -17
  281. package/dist/Tabs/Tabs.js.map +0 -1
  282. package/dist/Tabs/Tabs.stories.d.ts +0 -5
  283. package/dist/Tabs/Tabs.stories.js +0 -73
  284. package/dist/Tabs/Tabs.stories.js.map +0 -1
  285. package/dist/Tabs/Tabs.test.d.ts +0 -1
  286. package/dist/Tabs/Tabs.test.js +0 -86
  287. package/dist/Tabs/Tabs.test.js.map +0 -1
  288. package/dist/Tabs/Tabs.types.d.ts +0 -95
  289. package/dist/Tabs/Tabs.types.js +0 -2
  290. package/dist/Tabs/Tabs.types.js.map +0 -1
  291. package/dist/Tabs/index.d.ts +0 -1
  292. package/dist/Tabs/index.js +0 -2
  293. package/dist/Tabs/index.js.map +0 -1
  294. package/dist/TextArea/TextArea.d.ts +0 -7
  295. package/dist/TextArea/TextArea.js +0 -55
  296. package/dist/TextArea/TextArea.js.map +0 -1
  297. package/dist/TextArea/TextArea.stories.d.ts +0 -5
  298. package/dist/TextArea/TextArea.stories.js +0 -10
  299. package/dist/TextArea/TextArea.stories.js.map +0 -1
  300. package/dist/TextArea/TextArea.test.d.ts +0 -1
  301. package/dist/TextArea/TextArea.test.js +0 -130
  302. package/dist/TextArea/TextArea.test.js.map +0 -1
  303. package/dist/TextArea/TextArea.types.d.ts +0 -116
  304. package/dist/TextArea/TextArea.types.js +0 -2
  305. package/dist/TextArea/TextArea.types.js.map +0 -1
  306. package/dist/TextArea/index.d.ts +0 -1
  307. package/dist/TextArea/index.js +0 -2
  308. package/dist/TextArea/index.js.map +0 -1
  309. package/dist/TextField/TextField.d.ts +0 -7
  310. package/dist/TextField/TextField.js +0 -85
  311. package/dist/TextField/TextField.js.map +0 -1
  312. package/dist/TextField/TextField.stories.d.ts +0 -5
  313. package/dist/TextField/TextField.stories.js +0 -11
  314. package/dist/TextField/TextField.stories.js.map +0 -1
  315. package/dist/TextField/TextField.test.d.ts +0 -1
  316. package/dist/TextField/TextField.test.js +0 -41
  317. package/dist/TextField/TextField.test.js.map +0 -1
  318. package/dist/TextField/TextField.types.d.ts +0 -199
  319. package/dist/TextField/TextField.types.js +0 -2
  320. package/dist/TextField/TextField.types.js.map +0 -1
  321. package/dist/TextField/index.d.ts +0 -1
  322. package/dist/TextField/index.js +0 -2
  323. package/dist/TextField/index.js.map +0 -1
  324. package/dist/ToolbarButton/ToolbarButton.d.ts +0 -3
  325. package/dist/ToolbarButton/ToolbarButton.js +0 -57
  326. package/dist/ToolbarButton/ToolbarButton.js.map +0 -1
  327. package/dist/ToolbarButton/ToolbarButton.stories.d.ts +0 -5
  328. package/dist/ToolbarButton/ToolbarButton.stories.js +0 -28
  329. package/dist/ToolbarButton/ToolbarButton.stories.js.map +0 -1
  330. package/dist/ToolbarButton/ToolbarButton.test.d.ts +0 -1
  331. package/dist/ToolbarButton/ToolbarButton.test.js +0 -85
  332. package/dist/ToolbarButton/ToolbarButton.test.js.map +0 -1
  333. package/dist/ToolbarButton/ToolbarButton.types.d.ts +0 -122
  334. package/dist/ToolbarButton/ToolbarButton.types.js +0 -2
  335. package/dist/ToolbarButton/ToolbarButton.types.js.map +0 -1
  336. package/dist/ToolbarButton/index.d.ts +0 -1
  337. package/dist/ToolbarButton/index.js +0 -2
  338. package/dist/ToolbarButton/index.js.map +0 -1
  339. package/dist/Tooltip/QTip.stories.d.ts +0 -5
  340. package/dist/Tooltip/QTip.stories.js +0 -19
  341. package/dist/Tooltip/QTip.stories.js.map +0 -1
  342. package/dist/Tooltip/QTip.types.d.ts +0 -13
  343. package/dist/Tooltip/QTip.types.js +0 -2
  344. package/dist/Tooltip/QTip.types.js.map +0 -1
  345. package/dist/Tooltip/QTipPerformance.stories.d.ts +0 -5
  346. package/dist/Tooltip/QTipPerformance.stories.js +0 -26
  347. package/dist/Tooltip/QTipPerformance.stories.js.map +0 -1
  348. package/dist/Tooltip/Qtip.d.ts +0 -26
  349. package/dist/Tooltip/Qtip.js +0 -168
  350. package/dist/Tooltip/Qtip.js.map +0 -1
  351. package/dist/Tooltip/Tooltip.d.ts +0 -13
  352. package/dist/Tooltip/Tooltip.js +0 -34
  353. package/dist/Tooltip/Tooltip.js.map +0 -1
  354. package/dist/Tooltip/Tooltip.stories.d.ts +0 -5
  355. package/dist/Tooltip/Tooltip.stories.js +0 -15
  356. package/dist/Tooltip/Tooltip.stories.js.map +0 -1
  357. package/dist/Tooltip/Tooltip.types.d.ts +0 -22
  358. package/dist/Tooltip/Tooltip.types.js +0 -3
  359. package/dist/Tooltip/Tooltip.types.js.map +0 -1
  360. package/dist/Tooltip/TooltipPerformance.stories.d.ts +0 -5
  361. package/dist/Tooltip/TooltipPerformance.stories.js +0 -26
  362. package/dist/Tooltip/TooltipPerformance.stories.js.map +0 -1
  363. package/dist/Tooltip/index.d.ts +0 -2
  364. package/dist/Tooltip/index.js +0 -3
  365. package/dist/Tooltip/index.js.map +0 -1
  366. package/dist/Tooltip/qTip.utilities.d.ts +0 -3
  367. package/dist/Tooltip/qTip.utilities.js +0 -11
  368. package/dist/Tooltip/qTip.utilities.js.map +0 -1
  369. package/dist/index.d.ts +0 -46
  370. package/dist/setupTests.d.ts +0 -1
  371. package/dist/setupTests.js +0 -6
  372. package/dist/setupTests.js.map +0 -1
  373. package/dist/types.d.ts +0 -27
  374. package/dist/types.js +0 -26
  375. package/dist/types.js.map +0 -1
  376. package/dist/utils/browserId.d.ts +0 -9
  377. package/dist/utils/browserId.js +0 -29
  378. package/dist/utils/browserId.js.map +0 -1
  379. package/dist/utils/svg.d.ts +0 -15
  380. package/dist/utils/svg.js +0 -20
  381. package/dist/utils/svg.js.map +0 -1
  382. package/dist/utils/validateStyleDimension.d.ts +0 -2
  383. package/dist/utils/validateStyleDimension.js +0 -14
  384. package/dist/utils/validateStyleDimension.js.map +0 -1
  385. package/dist/utils/validateStyleDimension.test.d.ts +0 -1
  386. package/dist/utils/validateStyleDimension.test.js +0 -20
  387. package/dist/utils/validateStyleDimension.test.js.map +0 -1
@@ -1,50 +0,0 @@
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
@@ -1 +0,0 @@
1
- {"version":3,"file":"Alert.test.js","sourceRoot":"","sources":["../../src/Alert/Alert.test.tsx"],"names":[],"mappings":"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"}
@@ -1,63 +0,0 @@
1
- /// <reference types="react" />
2
- import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
3
- interface Props {
4
- /**
5
- * The content to be displayed inside the alert message.
6
- * Can include text, icons, buttons, or any other React elements.
7
- * This is the main message or information you want to communicate to the user.
8
- */
9
- children: React.ReactNode;
10
- /**
11
- * When true, displays a close button (X icon) that allows users to dismiss the alert.
12
- * When false, the alert cannot be closed by the user and must be controlled programmatically.
13
- * @default true
14
- */
15
- dismissible?: boolean;
16
- /**
17
- * Callback function triggered when the user clicks the close button to dismiss the alert.
18
- * Only relevant when `dismissible` is true. Use this to handle alert dismissal logic,
19
- * such as updating state to hide the alert or performing cleanup actions.
20
- */
21
- onClose?: () => void;
22
- /**
23
- * Controls the visibility of the alert component.
24
- * When false, the alert is completely hidden from the UI.
25
- * Use this for programmatic control of when alerts should appear or disappear.
26
- * @default true
27
- */
28
- show?: boolean;
29
- /**
30
- * The visual style variant of the alert, which determines its appearance and color scheme:
31
- * - `danger`: Red styling for error messages or critical warnings
32
- * - `warning`: Yellow/orange styling for caution messages
33
- * - `gray`: Neutral gray styling for general information
34
- * - `theme`: Uses the current theme colors for contextual information
35
- */
36
- variant: 'danger' | 'theme' | 'warning' | 'gray';
37
- /**
38
- * Test ID attribute for the alert container element.
39
- * Used for automated testing and element selection in test suites.
40
- * Also used as a prefix for the close button's test ID when dismissible.
41
- * @default 'alert-id'
42
- */
43
- testId?: string;
44
- /**
45
- * HTML ID attribute for the alert container element.
46
- * Should be unique across the entire page for proper HTML semantics.
47
- * Useful for accessibility, linking, or custom styling via CSS selectors.
48
- */
49
- id?: string;
50
- /**
51
- * Additional CSS classes to apply to the alert container.
52
- * Use this to customize the alert's appearance beyond the built-in variants.
53
- * Classes are combined with the component's default styling.
54
- */
55
- extraClassNames?: string;
56
- }
57
- /**
58
- * Combined props for the Alert component.
59
- * Includes all Alert-specific properties plus tooltip functionality
60
- * inherited from TooltipComponentProps for enhanced user interaction.
61
- */
62
- export type AlertProps = Props & TooltipComponentProps;
63
- export {};
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=Alert.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Alert.types.js","sourceRoot":"","sources":["../../src/Alert/Alert.types.ts"],"names":[],"mappings":""}
@@ -1 +0,0 @@
1
- export { Alert as default } from './Alert';
@@ -1,2 +0,0 @@
1
- export { Alert as default } from './Alert';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Alert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,MAAM,SAAS,CAAC"}
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- import { ButtonProps } from './Button.types';
3
- import '../styles.css';
4
- /**
5
- * All-in-one Button:
6
- * - use "variant" to achieve the desired style
7
- * - include tooltips and/or icons
8
- */
9
- declare const Button: React.FunctionComponent<ButtonProps>;
10
- export default Button;
@@ -1,90 +0,0 @@
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-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
- xs: 'tw-text-xs tw-py-0.5',
62
- sm: 'tw-text-sm tw-py-1',
63
- lg: 'tw-text-xl tw-py-1',
64
- };
65
- const appliedClasses = `${baseClasses} ${baseClassesByVariant[variant]} ${sizeClasses[size]} ${classesByVariantLightTheme[variant]} ${classesByVariantDarkTheme[variant]} ${textClassesByVariantLightTheme[variant]} ${textClassesByVariantDarkTheme[variant]} ${extraClassNames}`;
66
- let tooltipData = undefined;
67
- if (tooltip) {
68
- tooltipData = {
69
- 'data-qtip-text': tooltip,
70
- 'data-qtip-placement': tooltipOptions?.position,
71
- 'data-qtip-is-html': isHtmlTooltip,
72
- 'data-qtip-testid': tooltipTestId,
73
- 'data-qtip-delay': tooltipOptions?.delay ?? DEFAULT_TOOL_TIP_DELAY,
74
- };
75
- }
76
- const iconClass = iconPosition === 'left' ? 'tw-mr-1' : 'tw-ml-1';
77
- const iconElement = icon && (_jsx(Icon, { icon: icon, iconPrefix: iconPrefix, type: iconStyle, color: iconColor, extraClassNames: label
78
- ? `${iconClass} ${textClassesByVariantLightTheme[variant]} ${textClassesByVariantDarkTheme[variant]}`
79
- : '', testId: `${id}_spinner` }));
80
- return (_jsxs("button", { id: id, ...tooltipData, disabled: disabled, "data-testid": testId, type: type === 'link' || (type === 'submit' && browserIsFirefox) ? 'button' : type, onClick: (e) => {
81
- stopPropagation && e.stopPropagation();
82
- onClick && onClick(e);
83
- }, onMouseDown: (e) => {
84
- if (preventBlur) {
85
- e.preventDefault();
86
- }
87
- }, className: appliedClasses, children: [iconPosition === 'left' && iconElement, label, iconPosition === 'right' && iconElement] }));
88
- };
89
- export default Button;
90
- //# sourceMappingURL=Button.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -1,9 +0,0 @@
1
- declare const _default: {
2
- title: string;
3
- };
4
- export default _default;
5
- export declare const AllButtonVariants: () => import("react/jsx-runtime").JSX.Element;
6
- export declare const ButtonWithTooltip: () => import("react/jsx-runtime").JSX.Element;
7
- export declare const ButtonWithIcon: () => import("react/jsx-runtime").JSX.Element;
8
- export declare const DisabledButton: () => import("react/jsx-runtime").JSX.Element;
9
- export declare const ButtonSizes: () => import("react/jsx-runtime").JSX.Element;
@@ -1,29 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import Button from './Button';
3
- import { buttonVariants, buttonSizes } 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
- export const ButtonSizes = () => {
26
- const renderButtonSizes = () => (_jsxs(_Fragment, { children: [_jsx("div", { className: "tw-p-4", children: buttonSizes.map((size) => (_jsx("div", { className: "tw-mb-2", children: _jsx(Button, { size: size, variant: "theme", label: `Size: ${size}` }) }, `size_light_${size}`))) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: buttonSizes.map((size) => (_jsx("div", { className: "tw-mb-2", children: _jsx(Button, { size: size, variant: "theme", label: `Size: ${size}` }) }, `size_dark_${size}`))) })] }));
27
- 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" }), renderButtonSizes()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderButtonSizes()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderButtonSizes()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderButtonSizes()] })] }));
28
- };
29
- //# sourceMappingURL=Button.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../src/Button/Button.stories.tsx"],"names":[],"mappings":"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"}
@@ -1 +0,0 @@
1
- import '@testing-library/jest-dom';
@@ -1,47 +0,0 @@
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
@@ -1 +0,0 @@
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"}
@@ -1,148 +0,0 @@
1
- import { TooltipProps } from '../Tooltip/Tooltip.types';
2
- import { IconType } from '../Icon/Icon.types';
3
- import React from 'react';
4
- export declare const buttonTypes: readonly ["button", "reset", "submit", "link"];
5
- export declare const buttonSizes: readonly ["xs", "sm", "lg"];
6
- export declare const buttonVariants: readonly ["outline", "theme", "theme-light", "warning", "danger", "no-border"];
7
- export declare const iconPositions: string[];
8
- export type ButtonType = (typeof buttonTypes)[number];
9
- export type ButtonSize = (typeof buttonSizes)[number];
10
- export type ButtonVariant = (typeof buttonVariants)[number];
11
- export type IconPosition = (typeof iconPositions)[number];
12
- export interface ButtonProps {
13
- /**
14
- * Callback function triggered when the button is clicked.
15
- * Receives the mouse event as a parameter for additional event handling.
16
- * Use this to define the primary action the button should perform.
17
- */
18
- onClick?: (e: React.MouseEvent) => void;
19
- /**
20
- * The text, element, or content to display inside the button.
21
- * Can be a string for simple text, a translation key, or any React element/node
22
- * for more complex content like formatted text or inline elements.
23
- */
24
- label?: string | React.JSX.Element | React.ReactNode;
25
- /**
26
- * Visual style variant that determines the button's appearance and color scheme:
27
- * - `outline`: White background with border, suitable for secondary actions
28
- * - `theme`: Primary theme colors, typically for main call-to-action buttons
29
- * - `theme-light`: Lighter version of theme colors for subtle primary actions
30
- * - `warning`: Yellow/orange styling for caution-related actions
31
- * - `danger`: Red styling for destructive or critical actions
32
- * - `no-border`: Borderless styling for minimal, text-like buttons
33
- * @default 'outline'
34
- */
35
- variant?: ButtonVariant;
36
- /**
37
- * HTML button type attribute that determines the button's behavior in forms:
38
- * - `button`: Standard button with no special form behavior (default)
39
- * - `submit`: Submits the parent form when clicked
40
- * - `reset`: Resets the parent form fields to their initial values
41
- * - `link`: Behaves like a button but renders as button type for Firefox compatibility
42
- * @default 'button'
43
- */
44
- type?: ButtonType;
45
- /**
46
- * Size variant that controls the button's dimensions and text size:
47
- * - `sm`: Small button with compact padding and smaller text (default)
48
- * - `lg`: Large button with generous padding and larger text
49
- * @default 'sm'
50
- */
51
- size?: ButtonSize;
52
- /**
53
- * When true, disables the button preventing user interaction.
54
- * Disabled buttons are visually dimmed and do not respond to clicks or focus.
55
- * The button will also have `pointer-events: none` applied via CSS.
56
- */
57
- disabled?: boolean;
58
- /**
59
- * Additional CSS classes to apply to the button element.
60
- * These classes are combined with the component's built-in styling classes.
61
- * Use this to customize appearance beyond the standard variants.
62
- */
63
- extraClassNames?: string;
64
- /**
65
- * Icon class name to display alongside the button text.
66
- * Typically uses FontAwesome classes (e.g., 'fc-zoom', 'fc-delete').
67
- * The icon is automatically styled to match the button's text color.
68
- */
69
- icon?: string;
70
- /**
71
- * Determines how the icon should be styled and colored:
72
- * - `text`: Uses the button's text color (default)
73
- * - `white`: Forces white color regardless of button variant
74
- * - `theme`: Uses theme-specific colors
75
- * - `color`: Uses a custom color specified in `iconColor`
76
- * @default 'text'
77
- */
78
- iconStyle?: IconType;
79
- /**
80
- * Custom color for the icon when `iconStyle` is set to 'color'.
81
- * Can be any valid CSS color value (hex, rgb, color name, etc.).
82
- * This property is required when iconStyle is 'color'.
83
- */
84
- iconColor?: string;
85
- /**
86
- * Position of the icon relative to the button text:
87
- * - `left`: Icon appears before the text with right margin
88
- * - `right`: Icon appears after the text with left margin
89
- * @default 'left'
90
- */
91
- iconPosition?: IconPosition;
92
- /**
93
- * Custom prefix for the icon class when not using standard FontAwesome icons.
94
- * By default, icons are prefixed with 'fa-sharp fa-regular', but some icons
95
- * require different prefixes. Use this to override the default behavior.
96
- */
97
- iconPrefix?: string;
98
- /**
99
- * HTML ID attribute for the button element.
100
- * Should be unique across the entire page for proper HTML semantics.
101
- * Also used as a prefix for the icon's test ID when an icon is present.
102
- */
103
- id?: string;
104
- /**
105
- * Test ID attribute for the button element used in automated testing.
106
- * Applied to the `data-testid` attribute for element selection in test suites.
107
- */
108
- testId?: string;
109
- /**
110
- * Controls whether the click event should stop propagation to parent elements.
111
- * When true (default), prevents the click from bubbling up the DOM tree.
112
- * Set to false if you need parent elements to also handle the click event.
113
- * @default true
114
- */
115
- stopPropagation?: boolean;
116
- /**
117
- * Tooltip text to display when hovering over the button.
118
- * When provided, the button will show a tooltip with this text on hover.
119
- * The tooltip appearance and behavior can be customized with `tooltipOptions`.
120
- */
121
- tooltip?: string;
122
- /**
123
- * When true, the tooltip text is rendered as HTML allowing for rich content.
124
- * When false (default), the tooltip text is treated as plain text for security.
125
- * Only set to true if you trust the tooltip content source.
126
- * @default false
127
- */
128
- isHtmlTooltip?: boolean;
129
- /**
130
- * Test ID attribute specifically for the tooltip element.
131
- * Used for automated testing to identify and interact with the tooltip.
132
- * Helpful when you need to test tooltip-specific behavior separately from the button.
133
- */
134
- tooltipTestId?: string;
135
- /**
136
- * Configuration options for customizing tooltip behavior and appearance.
137
- * Omits the 'text' property since that's handled by the `tooltip` prop.
138
- * Includes options like position, delay, and other tooltip-specific settings.
139
- */
140
- tooltipOptions?: Omit<TooltipProps, 'text'>;
141
- /**
142
- * When true, prevents the blur event from occurring on mouse down.
143
- * Useful when you want to keep focus on the current element after clicking the button.
144
- * Commonly used in scenarios where button clicks shouldn't interrupt form input focus.
145
- * @default false
146
- */
147
- preventBlur?: boolean;
148
- }
@@ -1,5 +0,0 @@
1
- export const buttonTypes = ['button', 'reset', 'submit', 'link'];
2
- export const buttonSizes = ['xs', '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
@@ -1 +0,0 @@
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,EAAE,IAAI,CAAU,CAAC;AACvD,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"}
@@ -1 +0,0 @@
1
- export { default } from "./Button";
@@ -1,2 +0,0 @@
1
- export { default } from "./Button";
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}
@@ -1,7 +0,0 @@
1
- import React from 'react';
2
- import '../styles.css';
3
- import { ButtonGroupProps } from './ButtonGroup.types';
4
- /**
5
- * ButtonGroup.
6
- */
7
- export declare const ButtonGroup: React.FunctionComponent<ButtonGroupProps>;
@@ -1,35 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import '../styles.css';
3
- import { getQTipData } from '../Tooltip/qTip.utilities';
4
- import Button from '../Button';
5
- const baseClasses = 'tw-flex tw-outline-none tw-w-full tw-relative tw-flex-wrap';
6
- const activeClassesByVariantLightTheme = {
7
- 'outline': '!tw-bg-sq-disabled-gray tw-border-sq-color-dark',
8
- 'theme': 'tw-bg-sq-color-highlight',
9
- 'danger': '',
10
- 'theme-light': '',
11
- 'no-border': '!tw-bg-sq-disabled-gray',
12
- 'warning': '',
13
- };
14
- const activeClassesByVariantDarkTheme = {
15
- 'outline': 'dark:!tw-bg-sq-multi-gray-dark dark:tw-border-sq-color-dark',
16
- 'theme': 'dark:tw-bg-sq-color-highlight',
17
- 'danger': '',
18
- 'theme-light': '',
19
- 'no-border': 'dark:!tw-bg-sq-multi-gray-dark',
20
- 'warning': '',
21
- };
22
- /**
23
- * ButtonGroup.
24
- */
25
- export const ButtonGroup = (props) => {
26
- const { id, extraClassNames = '', testId, onChange, buttons = [], ...tooltipProps } = props;
27
- const tooltipData = getQTipData(tooltipProps);
28
- const appliedClasses = `${baseClasses} ${extraClassNames}`;
29
- return (_jsx("div", { id: id ? `button-group-${id}` : undefined, "data-testid": testId, className: appliedClasses, ...tooltipData, children: buttons
30
- .filter(Boolean)
31
- .map((item, index) => item?.variant === 'button' ? (_jsx(Button, { ...item.buttonProps, extraClassNames: `tw-ml-[-1px] focus:tw-z-40 tw-outline-none focus:tw-border tw-rounded-none first:tw-rounded-l-md last:tw-rounded-r-md ${item.buttonProps?.isActive
32
- ? `${activeClassesByVariantLightTheme[item?.buttonProps?.variant ?? 'outline']} ${activeClassesByVariantDarkTheme[item?.buttonProps?.variant ?? 'outline']} `
33
- : ''} ${item.buttonProps.extraClassNames}`, onClick: () => onChange && onChange(item?.buttonProps?.value) }, index)) : (item?.element)) }));
34
- };
35
- //# sourceMappingURL=ButtonGroup.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ButtonGroup.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":";AACA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,MAAM,MAAM,WAAW,CAAC;AAG/B,MAAM,WAAW,GAAG,4DAA4D,CAAC;AAEjF,MAAM,gCAAgC,GAAG;IACvC,SAAS,EAAE,iDAAiD;IAC5D,OAAO,EAAE,0BAA0B;IACnC,QAAQ,EAAE,EAAE;IACZ,aAAa,EAAE,EAAE;IACjB,WAAW,EAAE,yBAAyB;IACtC,SAAS,EAAE,EAAE;CACd,CAAC;AAEF,MAAM,+BAA+B,GAAG;IACtC,SAAS,EAAE,6DAA6D;IACxE,OAAO,EAAE,+BAA+B;IACxC,QAAQ,EAAE,EAAE;IACZ,aAAa,EAAE,EAAE;IACjB,WAAW,EAAE,gCAAgC;IAC7C,SAAS,EAAE,EAAE;CACd,CAAC;AACF;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAA8C,CAAC,KAAK,EAAE,EAAE;IAC9E,MAAM,EAAE,EAAE,EAAE,eAAe,GAAG,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,EAAE,EAAE,GAAG,YAAY,EAAE,GAAG,KAAK,CAAC;IAC5F,MAAM,WAAW,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IAE9C,MAAM,cAAc,GAAG,GAAG,WAAW,IAAI,eAAe,EAAE,CAAC;IAE3D,OAAO,CACL,cAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,iBAAe,MAAM,EAAE,SAAS,EAAE,cAAc,KAAM,WAAW,YAC5G,OAAO;aACL,MAAM,CAAC,OAAO,CAAC;aACf,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CACnB,IAAI,EAAE,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC3B,KAAC,MAAM,OAED,IAAI,CAAC,WAAW,EACpB,eAAe,EAAE,yHACf,IAAI,CAAC,WAAW,EAAE,QAAQ;gBACxB,CAAC,CAAC,GAAG,gCAAgC,CAAC,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,SAAS,CAAC,IAC1E,+BAA+B,CAAC,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,SAAS,CACzE,GAAG;gBACL,CAAC,CAAC,EACN,IAAI,IAAI,CAAC,WAAW,CAAC,eAAe,EAAE,EACtC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,IAAI,EAAE,WAAW,EAAE,KAAK,CAAC,IATxD,KAAK,CAUV,CACH,CAAC,CAAC,CAAC,CACF,IAAI,EAAE,OAAO,CACd,CACF,GACC,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -1,5 +0,0 @@
1
- declare const _default: {
2
- title: string;
3
- };
4
- export default _default;
5
- export declare const AllButtonGroups: () => import("react/jsx-runtime").JSX.Element;