@seeqdev/qomponents 0.0.177 → 0.0.179

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 (374) hide show
  1. package/dist/example/src/Example.tsx +7 -7
  2. package/dist/index.esm.js +34 -30
  3. package/dist/index.esm.js.map +1 -1
  4. package/dist/index.js +34 -30
  5. package/dist/index.js.map +1 -1
  6. package/dist/styles.css +114 -1
  7. package/package.json +2 -2
  8. package/dist/Accordion/Accordion.d.ts +0 -4
  9. package/dist/Accordion/Accordion.js +0 -7
  10. package/dist/Accordion/Accordion.js.map +0 -1
  11. package/dist/Accordion/Accordion.stories.d.ts +0 -5
  12. package/dist/Accordion/Accordion.stories.js +0 -75
  13. package/dist/Accordion/Accordion.stories.js.map +0 -1
  14. package/dist/Accordion/Accordion.test.d.ts +0 -1
  15. package/dist/Accordion/Accordion.test.js +0 -55
  16. package/dist/Accordion/Accordion.test.js.map +0 -1
  17. package/dist/Accordion/Accordion.types.d.ts +0 -86
  18. package/dist/Accordion/Accordion.types.js +0 -2
  19. package/dist/Accordion/Accordion.types.js.map +0 -1
  20. package/dist/Accordion/index.d.ts +0 -1
  21. package/dist/Accordion/index.js +0 -2
  22. package/dist/Accordion/index.js.map +0 -1
  23. package/dist/Alert/Alert.d.ts +0 -7
  24. package/dist/Alert/Alert.js +0 -34
  25. package/dist/Alert/Alert.js.map +0 -1
  26. package/dist/Alert/Alert.stories.d.ts +0 -6
  27. package/dist/Alert/Alert.stories.js +0 -65
  28. package/dist/Alert/Alert.stories.js.map +0 -1
  29. package/dist/Alert/Alert.test.d.ts +0 -1
  30. package/dist/Alert/Alert.test.js +0 -50
  31. package/dist/Alert/Alert.test.js.map +0 -1
  32. package/dist/Alert/Alert.types.d.ts +0 -62
  33. package/dist/Alert/Alert.types.js +0 -2
  34. package/dist/Alert/Alert.types.js.map +0 -1
  35. package/dist/Alert/index.d.ts +0 -1
  36. package/dist/Alert/index.js +0 -2
  37. package/dist/Alert/index.js.map +0 -1
  38. package/dist/Button/Button.d.ts +0 -10
  39. package/dist/Button/Button.js +0 -90
  40. package/dist/Button/Button.js.map +0 -1
  41. package/dist/Button/Button.stories.d.ts +0 -9
  42. package/dist/Button/Button.stories.js +0 -29
  43. package/dist/Button/Button.stories.js.map +0 -1
  44. package/dist/Button/Button.test.d.ts +0 -1
  45. package/dist/Button/Button.test.js +0 -47
  46. package/dist/Button/Button.test.js.map +0 -1
  47. package/dist/Button/Button.types.d.ts +0 -148
  48. package/dist/Button/Button.types.js +0 -5
  49. package/dist/Button/Button.types.js.map +0 -1
  50. package/dist/Button/index.d.ts +0 -1
  51. package/dist/Button/index.js +0 -2
  52. package/dist/Button/index.js.map +0 -1
  53. package/dist/ButtonGroup/ButtonGroup.d.ts +0 -7
  54. package/dist/ButtonGroup/ButtonGroup.js +0 -35
  55. package/dist/ButtonGroup/ButtonGroup.js.map +0 -1
  56. package/dist/ButtonGroup/ButtonGroup.stories.d.ts +0 -5
  57. package/dist/ButtonGroup/ButtonGroup.stories.js +0 -317
  58. package/dist/ButtonGroup/ButtonGroup.stories.js.map +0 -1
  59. package/dist/ButtonGroup/ButtonGroup.test.d.ts +0 -1
  60. package/dist/ButtonGroup/ButtonGroup.test.js +0 -66
  61. package/dist/ButtonGroup/ButtonGroup.test.js.map +0 -1
  62. package/dist/ButtonGroup/ButtonGroup.types.d.ts +0 -80
  63. package/dist/ButtonGroup/ButtonGroup.types.js +0 -2
  64. package/dist/ButtonGroup/ButtonGroup.types.js.map +0 -1
  65. package/dist/ButtonGroup/index.d.ts +0 -1
  66. package/dist/ButtonGroup/index.js +0 -2
  67. package/dist/ButtonGroup/index.js.map +0 -1
  68. package/dist/ButtonWithDropdown/ButtonWithDropdown.d.ts +0 -4
  69. package/dist/ButtonWithDropdown/ButtonWithDropdown.js +0 -36
  70. package/dist/ButtonWithDropdown/ButtonWithDropdown.js.map +0 -1
  71. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.d.ts +0 -5
  72. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js +0 -104
  73. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js.map +0 -1
  74. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.d.ts +0 -1
  75. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js +0 -93
  76. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js.map +0 -1
  77. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.d.ts +0 -232
  78. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js +0 -2
  79. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js.map +0 -1
  80. package/dist/ButtonWithDropdown/index.d.ts +0 -1
  81. package/dist/ButtonWithDropdown/index.js +0 -2
  82. package/dist/ButtonWithDropdown/index.js.map +0 -1
  83. package/dist/ButtonWithPopover/ButtonWithPopover.d.ts +0 -4
  84. package/dist/ButtonWithPopover/ButtonWithPopover.js +0 -55
  85. package/dist/ButtonWithPopover/ButtonWithPopover.js.map +0 -1
  86. package/dist/ButtonWithPopover/ButtonWithPopover.stories.d.ts +0 -5
  87. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js +0 -25
  88. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js.map +0 -1
  89. package/dist/ButtonWithPopover/ButtonWithPopover.test.d.ts +0 -1
  90. package/dist/ButtonWithPopover/ButtonWithPopover.test.js +0 -81
  91. package/dist/ButtonWithPopover/ButtonWithPopover.test.js.map +0 -1
  92. package/dist/ButtonWithPopover/ButtonWithPopover.types.d.ts +0 -134
  93. package/dist/ButtonWithPopover/ButtonWithPopover.types.js +0 -2
  94. package/dist/ButtonWithPopover/ButtonWithPopover.types.js.map +0 -1
  95. package/dist/ButtonWithPopover/index.d.ts +0 -1
  96. package/dist/ButtonWithPopover/index.js +0 -2
  97. package/dist/ButtonWithPopover/index.js.map +0 -1
  98. package/dist/Carousel/Carousel.d.ts +0 -9
  99. package/dist/Carousel/Carousel.js +0 -76
  100. package/dist/Carousel/Carousel.js.map +0 -1
  101. package/dist/Carousel/Carousel.stories.d.ts +0 -5
  102. package/dist/Carousel/Carousel.stories.js +0 -63
  103. package/dist/Carousel/Carousel.stories.js.map +0 -1
  104. package/dist/Carousel/Carousel.test.d.ts +0 -1
  105. package/dist/Carousel/Carousel.test.js +0 -48
  106. package/dist/Carousel/Carousel.test.js.map +0 -1
  107. package/dist/Carousel/Carousel.types.d.ts +0 -85
  108. package/dist/Carousel/Carousel.types.js +0 -2
  109. package/dist/Carousel/Carousel.types.js.map +0 -1
  110. package/dist/Carousel/index.d.ts +0 -1
  111. package/dist/Carousel/index.js +0 -2
  112. package/dist/Carousel/index.js.map +0 -1
  113. package/dist/Checkbox/Checkbox.d.ts +0 -7
  114. package/dist/Checkbox/Checkbox.js +0 -24
  115. package/dist/Checkbox/Checkbox.js.map +0 -1
  116. package/dist/Checkbox/Checkbox.stories.d.ts +0 -5
  117. package/dist/Checkbox/Checkbox.stories.js +0 -12
  118. package/dist/Checkbox/Checkbox.stories.js.map +0 -1
  119. package/dist/Checkbox/Checkbox.test.d.ts +0 -1
  120. package/dist/Checkbox/Checkbox.test.js +0 -94
  121. package/dist/Checkbox/Checkbox.test.js.map +0 -1
  122. package/dist/Checkbox/Checkbox.types.d.ts +0 -91
  123. package/dist/Checkbox/Checkbox.types.js +0 -2
  124. package/dist/Checkbox/Checkbox.types.js.map +0 -1
  125. package/dist/Checkbox/index.d.ts +0 -1
  126. package/dist/Checkbox/index.js +0 -2
  127. package/dist/Checkbox/index.js.map +0 -1
  128. package/dist/Collapse/Collapse.d.ts +0 -4
  129. package/dist/Collapse/Collapse.js +0 -17
  130. package/dist/Collapse/Collapse.js.map +0 -1
  131. package/dist/Collapse/Collapse.stories.d.ts +0 -5
  132. package/dist/Collapse/Collapse.stories.js +0 -15
  133. package/dist/Collapse/Collapse.stories.js.map +0 -1
  134. package/dist/Collapse/Collapse.test.d.ts +0 -1
  135. package/dist/Collapse/Collapse.test.js +0 -17
  136. package/dist/Collapse/Collapse.test.js.map +0 -1
  137. package/dist/Collapse/Collapse.types.d.ts +0 -18
  138. package/dist/Collapse/Collapse.types.js +0 -2
  139. package/dist/Collapse/Collapse.types.js.map +0 -1
  140. package/dist/Collapse/index.d.ts +0 -1
  141. package/dist/Collapse/index.js +0 -2
  142. package/dist/Collapse/index.js.map +0 -1
  143. package/dist/Icon/Icon.d.ts +0 -10
  144. package/dist/Icon/Icon.js +0 -56
  145. package/dist/Icon/Icon.js.map +0 -1
  146. package/dist/Icon/Icon.stories.d.ts +0 -5
  147. package/dist/Icon/Icon.stories.js +0 -15
  148. package/dist/Icon/Icon.stories.js.map +0 -1
  149. package/dist/Icon/Icon.test.d.ts +0 -1
  150. package/dist/Icon/Icon.test.js +0 -55
  151. package/dist/Icon/Icon.test.js.map +0 -1
  152. package/dist/Icon/Icon.types.d.ts +0 -90
  153. package/dist/Icon/Icon.types.js +0 -16
  154. package/dist/Icon/Icon.types.js.map +0 -1
  155. package/dist/Icon/index.d.ts +0 -1
  156. package/dist/Icon/index.js +0 -2
  157. package/dist/Icon/index.js.map +0 -1
  158. package/dist/InputGroup/InputGroup.d.ts +0 -7
  159. package/dist/InputGroup/InputGroup.js +0 -36
  160. package/dist/InputGroup/InputGroup.js.map +0 -1
  161. package/dist/InputGroup/InputGroup.stories.d.ts +0 -5
  162. package/dist/InputGroup/InputGroup.stories.js +0 -129
  163. package/dist/InputGroup/InputGroup.stories.js.map +0 -1
  164. package/dist/InputGroup/InputGroup.test.d.ts +0 -1
  165. package/dist/InputGroup/InputGroup.test.js +0 -42
  166. package/dist/InputGroup/InputGroup.test.js.map +0 -1
  167. package/dist/InputGroup/InputGroup.types.d.ts +0 -61
  168. package/dist/InputGroup/InputGroup.types.js +0 -2
  169. package/dist/InputGroup/InputGroup.types.js.map +0 -1
  170. package/dist/InputGroup/index.d.ts +0 -2
  171. package/dist/InputGroup/index.js +0 -2
  172. package/dist/InputGroup/index.js.map +0 -1
  173. package/dist/Modal/Modal.d.ts +0 -5
  174. package/dist/Modal/Modal.js +0 -76
  175. package/dist/Modal/Modal.js.map +0 -1
  176. package/dist/Modal/Modal.stories.d.ts +0 -10
  177. package/dist/Modal/Modal.stories.js +0 -44
  178. package/dist/Modal/Modal.stories.js.map +0 -1
  179. package/dist/Modal/Modal.test.d.ts +0 -1
  180. package/dist/Modal/Modal.test.js +0 -108
  181. package/dist/Modal/Modal.test.js.map +0 -1
  182. package/dist/Modal/Modal.types.d.ts +0 -244
  183. package/dist/Modal/Modal.types.js +0 -2
  184. package/dist/Modal/Modal.types.js.map +0 -1
  185. package/dist/Modal/index.d.ts +0 -1
  186. package/dist/Modal/index.js +0 -2
  187. package/dist/Modal/index.js.map +0 -1
  188. package/dist/ProgressBar/ProgressBar.d.ts +0 -4
  189. package/dist/ProgressBar/ProgressBar.js +0 -72
  190. package/dist/ProgressBar/ProgressBar.js.map +0 -1
  191. package/dist/ProgressBar/ProgressBar.stories.d.ts +0 -5
  192. package/dist/ProgressBar/ProgressBar.stories.js +0 -35
  193. package/dist/ProgressBar/ProgressBar.stories.js.map +0 -1
  194. package/dist/ProgressBar/ProgressBar.test.d.ts +0 -1
  195. package/dist/ProgressBar/ProgressBar.test.js +0 -43
  196. package/dist/ProgressBar/ProgressBar.test.js.map +0 -1
  197. package/dist/ProgressBar/ProgressBar.types.d.ts +0 -77
  198. package/dist/ProgressBar/ProgressBar.types.js +0 -2
  199. package/dist/ProgressBar/ProgressBar.types.js.map +0 -1
  200. package/dist/ProgressBar/index.d.ts +0 -1
  201. package/dist/ProgressBar/index.js +0 -2
  202. package/dist/ProgressBar/index.js.map +0 -1
  203. package/dist/SeeqActionDropdown/SeeqActionDropdown.d.ts +0 -4
  204. package/dist/SeeqActionDropdown/SeeqActionDropdown.js +0 -39
  205. package/dist/SeeqActionDropdown/SeeqActionDropdown.js.map +0 -1
  206. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.d.ts +0 -5
  207. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js +0 -58
  208. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js.map +0 -1
  209. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.d.ts +0 -1
  210. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js +0 -73
  211. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js.map +0 -1
  212. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.d.ts +0 -164
  213. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js +0 -2
  214. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js.map +0 -1
  215. package/dist/SeeqActionDropdown/index.d.ts +0 -1
  216. package/dist/SeeqActionDropdown/index.js +0 -2
  217. package/dist/SeeqActionDropdown/index.js.map +0 -1
  218. package/dist/SeeqActionDropdown/variants.d.ts +0 -5
  219. package/dist/SeeqActionDropdown/variants.js +0 -23
  220. package/dist/SeeqActionDropdown/variants.js.map +0 -1
  221. package/dist/Select/Select.d.ts +0 -15
  222. package/dist/Select/Select.js +0 -179
  223. package/dist/Select/Select.js.map +0 -1
  224. package/dist/Select/Select.stories.d.ts +0 -5
  225. package/dist/Select/Select.stories.js +0 -40
  226. package/dist/Select/Select.stories.js.map +0 -1
  227. package/dist/Select/Select.test.d.ts +0 -1
  228. package/dist/Select/Select.test.js +0 -175
  229. package/dist/Select/Select.test.js.map +0 -1
  230. package/dist/Select/Select.types.d.ts +0 -220
  231. package/dist/Select/Select.types.js +0 -2
  232. package/dist/Select/Select.types.js.map +0 -1
  233. package/dist/Select/index.d.ts +0 -2
  234. package/dist/Select/index.js +0 -3
  235. package/dist/Select/index.js.map +0 -1
  236. package/dist/Slider/Slider.d.ts +0 -6
  237. package/dist/Slider/Slider.js +0 -10
  238. package/dist/Slider/Slider.js.map +0 -1
  239. package/dist/Slider/Slider.stories.d.ts +0 -5
  240. package/dist/Slider/Slider.stories.js +0 -14
  241. package/dist/Slider/Slider.stories.js.map +0 -1
  242. package/dist/Slider/Slider.test.d.ts +0 -1
  243. package/dist/Slider/Slider.test.js +0 -32
  244. package/dist/Slider/Slider.test.js.map +0 -1
  245. package/dist/Slider/Slider.types.d.ts +0 -84
  246. package/dist/Slider/Slider.types.js +0 -2
  247. package/dist/Slider/Slider.types.js.map +0 -1
  248. package/dist/Slider/index.d.ts +0 -1
  249. package/dist/Slider/index.js +0 -2
  250. package/dist/Slider/index.js.map +0 -1
  251. package/dist/SvgIcon/SvgIcon.d.ts +0 -20
  252. package/dist/SvgIcon/SvgIcon.js +0 -28
  253. package/dist/SvgIcon/SvgIcon.js.map +0 -1
  254. package/dist/SvgIcon/SvgIcon.stories.d.ts +0 -5
  255. package/dist/SvgIcon/SvgIcon.stories.js +0 -18
  256. package/dist/SvgIcon/SvgIcon.stories.js.map +0 -1
  257. package/dist/SvgIcon/SvgIcon.test.d.ts +0 -1
  258. package/dist/SvgIcon/SvgIcon.test.js +0 -41
  259. package/dist/SvgIcon/SvgIcon.test.js.map +0 -1
  260. package/dist/SvgIcon/SvgIcon.types.d.ts +0 -75
  261. package/dist/SvgIcon/SvgIcon.types.js +0 -3
  262. package/dist/SvgIcon/SvgIcon.types.js.map +0 -1
  263. package/dist/SvgIcon/index.d.ts +0 -1
  264. package/dist/SvgIcon/index.js +0 -2
  265. package/dist/SvgIcon/index.js.map +0 -1
  266. package/dist/Tabs/Tabs.d.ts +0 -4
  267. package/dist/Tabs/Tabs.js +0 -17
  268. package/dist/Tabs/Tabs.js.map +0 -1
  269. package/dist/Tabs/Tabs.stories.d.ts +0 -5
  270. package/dist/Tabs/Tabs.stories.js +0 -73
  271. package/dist/Tabs/Tabs.stories.js.map +0 -1
  272. package/dist/Tabs/Tabs.test.d.ts +0 -1
  273. package/dist/Tabs/Tabs.test.js +0 -86
  274. package/dist/Tabs/Tabs.test.js.map +0 -1
  275. package/dist/Tabs/Tabs.types.d.ts +0 -100
  276. package/dist/Tabs/Tabs.types.js +0 -2
  277. package/dist/Tabs/Tabs.types.js.map +0 -1
  278. package/dist/Tabs/index.d.ts +0 -1
  279. package/dist/Tabs/index.js +0 -2
  280. package/dist/Tabs/index.js.map +0 -1
  281. package/dist/TextArea/TextArea.d.ts +0 -7
  282. package/dist/TextArea/TextArea.js +0 -55
  283. package/dist/TextArea/TextArea.js.map +0 -1
  284. package/dist/TextArea/TextArea.stories.d.ts +0 -5
  285. package/dist/TextArea/TextArea.stories.js +0 -10
  286. package/dist/TextArea/TextArea.stories.js.map +0 -1
  287. package/dist/TextArea/TextArea.test.d.ts +0 -1
  288. package/dist/TextArea/TextArea.test.js +0 -130
  289. package/dist/TextArea/TextArea.test.js.map +0 -1
  290. package/dist/TextArea/TextArea.types.d.ts +0 -115
  291. package/dist/TextArea/TextArea.types.js +0 -2
  292. package/dist/TextArea/TextArea.types.js.map +0 -1
  293. package/dist/TextArea/index.d.ts +0 -1
  294. package/dist/TextArea/index.js +0 -2
  295. package/dist/TextArea/index.js.map +0 -1
  296. package/dist/TextField/TextField.d.ts +0 -7
  297. package/dist/TextField/TextField.js +0 -85
  298. package/dist/TextField/TextField.js.map +0 -1
  299. package/dist/TextField/TextField.stories.d.ts +0 -5
  300. package/dist/TextField/TextField.stories.js +0 -11
  301. package/dist/TextField/TextField.stories.js.map +0 -1
  302. package/dist/TextField/TextField.test.d.ts +0 -1
  303. package/dist/TextField/TextField.test.js +0 -41
  304. package/dist/TextField/TextField.test.js.map +0 -1
  305. package/dist/TextField/TextField.types.d.ts +0 -198
  306. package/dist/TextField/TextField.types.js +0 -2
  307. package/dist/TextField/TextField.types.js.map +0 -1
  308. package/dist/TextField/index.d.ts +0 -1
  309. package/dist/TextField/index.js +0 -2
  310. package/dist/TextField/index.js.map +0 -1
  311. package/dist/ToolbarButton/ToolbarButton.d.ts +0 -3
  312. package/dist/ToolbarButton/ToolbarButton.js +0 -56
  313. package/dist/ToolbarButton/ToolbarButton.js.map +0 -1
  314. package/dist/ToolbarButton/ToolbarButton.stories.d.ts +0 -5
  315. package/dist/ToolbarButton/ToolbarButton.stories.js +0 -28
  316. package/dist/ToolbarButton/ToolbarButton.stories.js.map +0 -1
  317. package/dist/ToolbarButton/ToolbarButton.test.d.ts +0 -1
  318. package/dist/ToolbarButton/ToolbarButton.test.js +0 -85
  319. package/dist/ToolbarButton/ToolbarButton.test.js.map +0 -1
  320. package/dist/ToolbarButton/ToolbarButton.types.d.ts +0 -122
  321. package/dist/ToolbarButton/ToolbarButton.types.js +0 -2
  322. package/dist/ToolbarButton/ToolbarButton.types.js.map +0 -1
  323. package/dist/ToolbarButton/index.d.ts +0 -1
  324. package/dist/ToolbarButton/index.js +0 -2
  325. package/dist/ToolbarButton/index.js.map +0 -1
  326. package/dist/Tooltip/QTip.stories.d.ts +0 -5
  327. package/dist/Tooltip/QTip.stories.js +0 -19
  328. package/dist/Tooltip/QTip.stories.js.map +0 -1
  329. package/dist/Tooltip/QTip.types.d.ts +0 -13
  330. package/dist/Tooltip/QTip.types.js +0 -2
  331. package/dist/Tooltip/QTip.types.js.map +0 -1
  332. package/dist/Tooltip/QTipPerformance.stories.d.ts +0 -5
  333. package/dist/Tooltip/QTipPerformance.stories.js +0 -26
  334. package/dist/Tooltip/QTipPerformance.stories.js.map +0 -1
  335. package/dist/Tooltip/Qtip.d.ts +0 -26
  336. package/dist/Tooltip/Qtip.js +0 -168
  337. package/dist/Tooltip/Qtip.js.map +0 -1
  338. package/dist/Tooltip/Tooltip.d.ts +0 -13
  339. package/dist/Tooltip/Tooltip.js +0 -34
  340. package/dist/Tooltip/Tooltip.js.map +0 -1
  341. package/dist/Tooltip/Tooltip.stories.d.ts +0 -5
  342. package/dist/Tooltip/Tooltip.stories.js +0 -15
  343. package/dist/Tooltip/Tooltip.stories.js.map +0 -1
  344. package/dist/Tooltip/Tooltip.types.d.ts +0 -22
  345. package/dist/Tooltip/Tooltip.types.js +0 -3
  346. package/dist/Tooltip/Tooltip.types.js.map +0 -1
  347. package/dist/Tooltip/TooltipPerformance.stories.d.ts +0 -5
  348. package/dist/Tooltip/TooltipPerformance.stories.js +0 -26
  349. package/dist/Tooltip/TooltipPerformance.stories.js.map +0 -1
  350. package/dist/Tooltip/index.d.ts +0 -2
  351. package/dist/Tooltip/index.js +0 -3
  352. package/dist/Tooltip/index.js.map +0 -1
  353. package/dist/Tooltip/qTip.utilities.d.ts +0 -3
  354. package/dist/Tooltip/qTip.utilities.js +0 -11
  355. package/dist/Tooltip/qTip.utilities.js.map +0 -1
  356. package/dist/index.d.ts +0 -46
  357. package/dist/setupTests.d.ts +0 -1
  358. package/dist/setupTests.js +0 -6
  359. package/dist/setupTests.js.map +0 -1
  360. package/dist/types.d.ts +0 -27
  361. package/dist/types.js +0 -26
  362. package/dist/types.js.map +0 -1
  363. package/dist/utils/browserId.d.ts +0 -9
  364. package/dist/utils/browserId.js +0 -29
  365. package/dist/utils/browserId.js.map +0 -1
  366. package/dist/utils/svg.d.ts +0 -15
  367. package/dist/utils/svg.js +0 -20
  368. package/dist/utils/svg.js.map +0 -1
  369. package/dist/utils/validateStyleDimension.d.ts +0 -2
  370. package/dist/utils/validateStyleDimension.js +0 -14
  371. package/dist/utils/validateStyleDimension.js.map +0 -1
  372. package/dist/utils/validateStyleDimension.test.d.ts +0 -1
  373. package/dist/utils/validateStyleDimension.test.js +0 -20
  374. package/dist/utils/validateStyleDimension.test.js.map +0 -1
@@ -1,90 +0,0 @@
1
- import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
2
- export declare const iconTypes: readonly ["theme", "white", "dark-gray", "darkish-gray", "gray", "color", "info", "text", "warning", "inherit", "danger", "theme-light", "success"];
3
- export type IconType = (typeof iconTypes)[number];
4
- export type IconSize = '2xs' | 'xs' | 'sm' | 'lg' | 'xl' | '2xl' | '1x' | '2x' | '3x' | '4x' | '5x' | '6x' | '7x' | '8x' | '9x' | '10x';
5
- /**
6
- * Props for the Icon component that renders customizable icons with various styling options.
7
- * Extends TooltipComponentProps to support tooltip functionality on the icon.
8
- */
9
- export interface IconProps extends TooltipComponentProps {
10
- /**
11
- * Icon class name to display, typically from FontAwesome.
12
- * Examples: 'fc-zoom', 'fc-delete', 'fc-save'. This determines which icon is rendered.
13
- */
14
- icon: string;
15
- /**
16
- * Custom prefix for the icon class when not using standard FontAwesome icons.
17
- * By default, icons are prefixed with 'fa-sharp fa-regular', but some icons
18
- * from different icon sets require specific prefixes. Use this to override the default.
19
- */
20
- iconPrefix?: string;
21
- /**
22
- * Visual style type that determines the icon's color and appearance:
23
- * - `theme`: Uses primary theme colors (default)
24
- * - `white`: Pure white color
25
- * - `text`: Uses standard text color
26
- * - `dark-gray`: Dark gray color
27
- * - `darkish-gray`: Medium-dark gray color
28
- * - `gray`: Standard gray color
29
- * - `color`: Uses custom color specified in `color` prop
30
- * - `info`: Blue informational color
31
- * - `warning`: Yellow/orange warning color
32
- * - `danger`: Red error/danger color
33
- * - `success`: Green success color
34
- * - `theme-light`: Lighter version of theme color
35
- * - `inherit`: Inherits color from parent element
36
- * @default 'theme'
37
- */
38
- type?: IconType;
39
- /**
40
- * Icon size, mapped to FontAwesome sizing classes so it works for both FA and FontCustom icons.
41
- * Examples: 'sm', 'lg', 'xl', '2xl', '1x'...'10x', 'xs', '2xs'.
42
- */
43
- size?: IconSize;
44
- /**
45
- * Custom color value for the icon when `type` is set to 'color'.
46
- * Can be any valid CSS color (hex, rgb, color names, etc.).
47
- * This property is required when type is 'color'.
48
- */
49
- color?: string;
50
- /**
51
- * Callback function triggered when the icon is clicked.
52
- * Receives the mouse event as a parameter. Use this to make icons interactive
53
- * for actions like opening menus, triggering functions, or navigation.
54
- */
55
- onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => any;
56
- /**
57
- * Additional CSS classes to apply to the icon element.
58
- * Use this to customize the icon's appearance, spacing, or behavior beyond built-in options.
59
- */
60
- extraClassNames?: string;
61
- /**
62
- * HTML ID attribute for the icon element.
63
- * Should be unique across the page for proper HTML semantics and accessibility.
64
- */
65
- id?: string;
66
- /**
67
- * @deprecated Use `size="lg"` instead.
68
- */
69
- large?: boolean;
70
- /**
71
- * @deprecated Use `size="sm"` instead.
72
- */
73
- small?: boolean;
74
- /**
75
- * Test ID attribute for the icon element used in automated testing.
76
- * Applied to the `data-testid` attribute for element selection in test suites.
77
- */
78
- testId?: string;
79
- /**
80
- * Custom identifier placed in the `data-customid` attribute on the icon element.
81
- * Useful for identifying the specific icon in event handlers when multiple icons
82
- * share the same click handler. Helps distinguish which icon was clicked.
83
- */
84
- customId?: string;
85
- /**
86
- * Numeric value associated with the icon, purpose depends on specific use case.
87
- * Can be used for ordering, counting, or any numeric data related to the icon.
88
- */
89
- number?: number;
90
- }
@@ -1,16 +0,0 @@
1
- export const iconTypes = [
2
- 'theme',
3
- 'white',
4
- 'dark-gray',
5
- 'darkish-gray',
6
- 'gray',
7
- 'color',
8
- 'info',
9
- 'text',
10
- 'warning',
11
- 'inherit',
12
- 'danger',
13
- 'theme-light',
14
- 'success',
15
- ];
16
- //# sourceMappingURL=Icon.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Icon.types.js","sourceRoot":"","sources":["../../src/Icon/Icon.types.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,OAAO;IACP,OAAO;IACP,WAAW;IACX,cAAc;IACd,MAAM;IACN,OAAO;IACP,MAAM;IACN,MAAM;IACN,SAAS;IACT,SAAS;IACT,QAAQ;IACR,aAAa;IACb,SAAS;CACD,CAAC"}
@@ -1 +0,0 @@
1
- export { default } from './Icon';
@@ -1,2 +0,0 @@
1
- export { default } from './Icon';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC"}
@@ -1,7 +0,0 @@
1
- import React from 'react';
2
- import { InputGroupProps } from './InputGroup.types';
3
- import '../styles.css';
4
- /**
5
- * InputGroup.
6
- */
7
- export declare const InputGroup: React.FunctionComponent<InputGroupProps>;
@@ -1,36 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import React from 'react';
3
- import '../styles.css';
4
- import { getQTipData } from '../Tooltip/qTip.utilities';
5
- import TextField from '../TextField';
6
- import Button from '../Button';
7
- const baseClasses = 'tw:flex tw:outline-none tw:rounded-md tw:w-full tw:relative tw:flex-wrap';
8
- const errorClasses = 'tw:border-sq-danger';
9
- const borderColorClasses = [
10
- 'tw:border-sq-disabled-gray',
11
- 'tw:dark:border-sq-dark-disabled-gray',
12
- 'tw:dark:focus:border-sq-theme-darker',
13
- 'tw:dark:active:border-sq-theme-darker',
14
- 'tw:focus:border-sq-theme-dark',
15
- 'tw:active:border-sq-theme-dark',
16
- ].join(' ');
17
- const fieldBorderRadius = 'tw:rounded-l-md tw:rounded-r-none';
18
- const fieldClasses = 'tw:leading-normal tw:outline-none tw:py-1 tw:px-3' + 'tw:p-1 tw:border-solid tw:border';
19
- const darkTheme = 'tw:dark:bg-sq-dark-background tw:dark:text-sq-dark-text tw:disabled:dark:text-sq-disabled-gray';
20
- const lightTheme = 'tw:text-sq-text-color tw:disabled:text-sq-darkish-gray';
21
- /**
22
- * InputGroup.
23
- */
24
- export const InputGroup = React.forwardRef((props, ref) => {
25
- const { readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, name, value, placeholder, append = [], extraClassNames = '', id, testId, showError, required, autoComplete, autoFocus, disabled, type, step, min, max, field, maxLength, minLength, ...tooltipProps } = props;
26
- const tooltipData = getQTipData(tooltipProps);
27
- const appliedClasses = `${baseClasses} ${extraClassNames}`;
28
- const fieldAppliedClasses = `${fieldClasses} ${extraClassNames} ${lightTheme} ${darkTheme} ${fieldBorderRadius} ${showError ? errorClasses : borderColorClasses} `;
29
- const elementsToAppend = append.filter(Boolean);
30
- return (_jsxs("div", { id: `input-group-${id}`, className: appliedClasses, children: [field ? (_jsx("div", { "data-testid": testId, className: `tw:flex tw:flex-1 tw:cursor-pointer tw:active:z-50 ${fieldAppliedClasses}`, children: field })) : (_jsx(TextField, { testId: testId, readonly: readonly, onChange: onChange, onKeyUp: onKeyUp, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, name: name, ref: ref, showError: showError, value: value, required: required, placeholder: placeholder, autoComplete: autoComplete, autoFocus: autoFocus, id: id, type: type, disabled: disabled, step: step, min: min, max: max, maxLength: maxLength, minLength: minLength, extraClassNames: `tw:flex tw:flex-1 tw:w-full tw:focus:z-30 tw:rounded-r-none tw:last:rounded-r-md ${extraClassNames}`, ...tooltipData })), elementsToAppend.map((item, index) => {
31
- return item?.variant === 'button' ? (_jsx(Button, { extraClassNames: `$
32
- index ? 'tw:-ml-px' : 'tw:ml-0'
33
- } tw:focus:z-40 tw:focus:border tw:rounded-none tw:last:rounded-r-md`, ...item.buttonProps }, index)) : (_jsx("div", { className: `${borderColorClasses} ${index ? 'tw:-ml-px' : 'tw:ml-0'} tw:flex tw:items-center tw:justify-center tw:rounded-none tw:last:rounded-r-md tw:active:z-30 tw:active:border tw:border`, children: item?.element }, index));
34
- })] }));
35
- });
36
- //# sourceMappingURL=InputGroup.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.js","sourceRoot":"","sources":["../../src/InputGroup/InputGroup.tsx"],"names":[],"mappings":"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"}
@@ -1,5 +0,0 @@
1
- declare const _default: {
2
- title: string;
3
- };
4
- export default _default;
5
- export declare const AllTextFields: () => import("react/jsx-runtime").JSX.Element;
@@ -1,129 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import { InputGroup } from './InputGroup';
3
- import { QTip } from '../Tooltip/Qtip';
4
- export default {
5
- title: 'InputGroup',
6
- };
7
- export const AllTextFields = () => {
8
- const renderAllVariations = () => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "light", children: [_jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { value: "value provided", append: [
9
- {
10
- variant: 'button',
11
- buttonProps: {
12
- icon: 'fc-annotate',
13
- iconStyle: 'theme',
14
- },
15
- },
16
- {
17
- variant: 'button',
18
- buttonProps: {
19
- icon: 'fc-trash',
20
- iconStyle: 'theme',
21
- },
22
- },
23
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
24
- {
25
- variant: 'button',
26
- buttonProps: {
27
- icon: 'fc-annotate',
28
- iconStyle: 'theme',
29
- },
30
- },
31
- {
32
- variant: 'button',
33
- buttonProps: {
34
- icon: 'fc-trash',
35
- iconStyle: 'theme',
36
- },
37
- },
38
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
39
- {
40
- variant: 'button',
41
- buttonProps: {
42
- icon: 'fc-annotate',
43
- iconStyle: 'theme',
44
- },
45
- },
46
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with custom element", append: [
47
- {
48
- variant: 'element',
49
- element: _jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background", children: "Custom" }),
50
- },
51
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "button input group", field: _jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background", onClick: () => console.log('clicked'), children: "custom grouped element" }), append: [
52
- {
53
- variant: 'element',
54
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Custom" })),
55
- },
56
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, field: _jsxs("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background", children: [_jsx("div", { className: "tw:rounded-sm tw:bg-green-400 ", children: "Custom element 1" }), _jsx("div", { className: "tw:rounded-sm tw:bg-red-400 tw:mt-1", onClick: () => console.log('clicked'), children: "Custom element 2" })] }), append: [
57
- {
58
- variant: 'element',
59
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Edit" })),
60
- },
61
- {
62
- variant: 'element',
63
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Edit 2" })),
64
- },
65
- {
66
- variant: 'element',
67
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Delete" })),
68
- },
69
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, placeholder: "inputgroup without any appended element", tooltipPlacement: "top", isHtmlTooltip: false, append: [] }) })] }), _jsxs("div", { className: "tw-dark tw:bg-sq-dark-background", children: [_jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { value: "value provided", append: [
70
- {
71
- variant: 'button',
72
- buttonProps: {
73
- icon: 'fc-annotate',
74
- iconStyle: 'theme',
75
- },
76
- },
77
- {
78
- variant: 'button',
79
- buttonProps: {
80
- icon: 'fc-trash',
81
- iconStyle: 'theme',
82
- },
83
- },
84
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
85
- {
86
- variant: 'button',
87
- buttonProps: {
88
- icon: 'fc-annotate',
89
- iconStyle: 'theme',
90
- },
91
- },
92
- {
93
- variant: 'button',
94
- buttonProps: {
95
- icon: 'fc-trash',
96
- iconStyle: 'theme',
97
- },
98
- },
99
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
100
- {
101
- variant: 'button',
102
- buttonProps: {
103
- icon: 'fc-annotate',
104
- iconStyle: 'theme',
105
- },
106
- },
107
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with custom element", append: [
108
- {
109
- variant: 'element',
110
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Custom" })),
111
- },
112
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "button input group", field: _jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", onClick: () => console.log('clicked'), children: "custom grouped element" }), append: [
113
- {
114
- variant: 'element',
115
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Custom" })),
116
- },
117
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, field: _jsxs("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background", children: [_jsx("div", { className: "tw:rounded-sm tw:bg-green-400 tw:dark:text-sq-dark-text", children: "Custom element 1" }), _jsx("div", { className: "tw:rounded-sm tw:bg-red-400 tw:dark:text-sq-dark-text tw:mt-1", onClick: () => console.log('clicked'), children: "Custom element 2" })] }), append: [
118
- {
119
- variant: 'element',
120
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Edit" })),
121
- },
122
- {
123
- variant: 'element',
124
- element: (_jsx("div", { className: "tw:text-sm tw:p-1 tw:bg-sq-light-background tw:dark:text-sq-dark-text", children: "Delete" })),
125
- },
126
- ] }) }), _jsx("div", { className: "tw:p-4", children: _jsx(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, placeholder: "inputgroup without any appended element", tooltipPlacement: "top", isHtmlTooltip: false, append: [] }) })] })] }));
127
- 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" }), 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()] })] }));
128
- };
129
- //# sourceMappingURL=InputGroup.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.stories.js","sourceRoot":"","sources":["../../src/InputGroup/InputGroup.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEvC,eAAe;IACb,KAAK,EAAE,YAAY;CACpB,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC,CAChC,8BACE,eAAK,SAAS,EAAC,OAAO,aACpB,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,KAAK,EAAC,gBAAgB,EACtB,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,aAAa;wCACnB,SAAS,EAAE,OAAO;qCACnB;iCACF;gCACD;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,UAAU;wCAChB,SAAS,EAAE,OAAO;qCACnB;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,cAAc,EACpB,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,aAAa;wCACnB,SAAS,EAAE,OAAO;qCACnB;iCACF;gCACD;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,UAAU;wCAChB,SAAS,EAAE,OAAO;qCACnB;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,cAAc,EACpB,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,aAAa;wCACnB,SAAS,EAAE,OAAO;qCACnB;iCACF;6BACF,GACD,GACE,EAEN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,qBAAqB,EAC3B,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,cAAK,SAAS,EAAC,6CAA6C,uBAAa;iCACnF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,oBAAoB,EAC1B,KAAK,EACH,cAAK,SAAS,EAAC,6CAA6C,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,uCAE5F,EAER,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,uBAAa,CACpG;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EACH,eAAK,SAAS,EAAC,6CAA6C,aAC1D,cAAK,SAAS,EAAC,gCAAgC,iCAAuB,EACtE,cAAK,SAAS,EAAC,qCAAqC,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,iCAEpF,IACF,EAER,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,qBAAW,CAClG;iCACF;gCACD;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,uBAAa,CACpG;iCACF;gCACD;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,uBAAa,CACpG;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,WAAW,EAAC,yCAAyC,EACrD,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,MAAM,EAAE,EAAE,GACV,GACE,IACF,EAEN,eAAK,SAAS,EAAC,kCAAkC,aAC/C,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,KAAK,EAAC,gBAAgB,EACtB,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,aAAa;wCACnB,SAAS,EAAE,OAAO;qCACnB;iCACF;gCACD;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,UAAU;wCAChB,SAAS,EAAE,OAAO;qCACnB;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,cAAc,EACpB,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,aAAa;wCACnB,SAAS,EAAE,OAAO;qCACnB;iCACF;gCACD;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,UAAU;wCAChB,SAAS,EAAE,OAAO;qCACnB;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,cAAc,EACpB,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,QAAQ;oCACjB,WAAW,EAAE;wCACX,IAAI,EAAE,aAAa;wCACnB,SAAS,EAAE,OAAO;qCACnB;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,qBAAqB,EAC3B,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,uBAAa,CACpG;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EAAC,oBAAoB,EAC1B,KAAK,EACH,cACE,SAAS,EAAC,uEAAuE,EACjF,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,uCAEjC,EAER,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,uBAAa,CACpG;iCACF;6BACF,GACD,GACE,EACN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,KAAK,EACH,eAAK,SAAS,EAAC,6CAA6C,aAC1D,cAAK,SAAS,EAAC,yDAAyD,iCAAuB,EAC/F,cACE,SAAS,EAAC,+DAA+D,EACzE,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,iCAEjC,IACF,EAER,MAAM,EAAE;gCACN;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,qBAAW,CAClG;iCACF;gCACD;oCACE,OAAO,EAAE,SAAS;oCAClB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,uEAAuE,uBAAa,CACpG;iCACF;6BACF,GACD,GACE,EAEN,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,UAAU,IACT,OAAO,EAAC,8BAA8B,EACtC,YAAY,EAAE,CAAC,EACf,WAAW,EAAC,yCAAyC,EACrD,gBAAgB,EAAC,KAAK,EACtB,aAAa,EAAE,KAAK,EACpB,MAAM,EAAE,EAAE,GACV,GACE,IACF,IACL,CACJ,CAAC;IACF,OAAO,CACL,eAAK,SAAS,EAAC,iCAAiC,aAC9C,KAAC,IAAI,KAAG,EACR,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"}
@@ -1 +0,0 @@
1
- export {};
@@ -1,42 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { render } from '@testing-library/react';
3
- import { InputGroup } from './InputGroup';
4
- describe('InputGroup', () => {
5
- const defaultProps = {
6
- value: 'with tooltip',
7
- append: [
8
- {
9
- variant: 'button',
10
- buttonProps: {
11
- icon: 'fc-annotate',
12
- iconStyle: 'theme',
13
- },
14
- },
15
- ],
16
- extraClassNames: 'extra-class',
17
- tooltip: 'Tooltip title',
18
- tooltipDelay: 0,
19
- id: 'input-group-id',
20
- testId: 'input-group-test-id',
21
- };
22
- it('renders without crashing', () => {
23
- const { getByTestId } = render(_jsx(InputGroup, { ...defaultProps }));
24
- expect(getByTestId('input-group-test-id')).toBeInTheDocument();
25
- });
26
- it('applies the correct classes', () => {
27
- const { getByTestId } = render(_jsx(InputGroup, { ...defaultProps }));
28
- const inputGroup = getByTestId('input-group-test-id');
29
- expect(inputGroup).toHaveClass('tw:flex');
30
- expect(inputGroup).toHaveClass('tw:outline-none');
31
- expect(inputGroup).toHaveClass('extra-class');
32
- });
33
- it('renders append items', () => {
34
- const { getByRole } = render(_jsx(InputGroup, { ...defaultProps }));
35
- expect(getByRole('button')).toBeInTheDocument();
36
- });
37
- it('renders input element', () => {
38
- const { container } = render(_jsx(InputGroup, { ...defaultProps }));
39
- expect(container.querySelector('input[type="text"]')).toBeInTheDocument();
40
- });
41
- });
42
- //# sourceMappingURL=InputGroup.test.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.test.js","sourceRoot":"","sources":["../../src/InputGroup/InputGroup.test.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC1B,MAAM,YAAY,GAAoB;QACpC,KAAK,EAAE,cAAc;QACrB,MAAM,EAAE;YACN;gBACE,OAAO,EAAE,QAAQ;gBACjB,WAAW,EAAE;oBACX,IAAI,EAAE,aAAa;oBACnB,SAAS,EAAE,OAAO;iBACnB;aACF;SACF;QACD,eAAe,EAAE,aAAa;QAC9B,OAAO,EAAE,eAAe;QACxB,YAAY,EAAE,CAAC;QACf,EAAE,EAAE,gBAAgB;QACpB,MAAM,EAAE,qBAAqB;KAC9B,CAAC;IAEF,EAAE,CAAC,0BAA0B,EAAE,GAAG,EAAE;QAClC,MAAM,EAAE,WAAW,EAAE,GAAG,MAAM,CAAC,KAAC,UAAU,OAAK,YAAY,GAAI,CAAC,CAAC;QACjE,MAAM,CAAC,WAAW,CAAC,qBAAqB,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IACjE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,6BAA6B,EAAE,GAAG,EAAE;QACrC,MAAM,EAAE,WAAW,EAAE,GAAG,MAAM,CAAC,KAAC,UAAU,OAAK,YAAY,GAAI,CAAC,CAAC;QACjE,MAAM,UAAU,GAAG,WAAW,CAAC,qBAAqB,CAAC,CAAC;QACtD,MAAM,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;QAC1C,MAAM,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QAClD,MAAM,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;IAChD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,sBAAsB,EAAE,GAAG,EAAE;QAC9B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,KAAC,UAAU,OAAK,YAAY,GAAI,CAAC,CAAC;QAC/D,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAClD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uBAAuB,EAAE,GAAG,EAAE;QAC/B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,KAAC,UAAU,OAAK,YAAY,GAAI,CAAC,CAAC;QAC/D,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC5E,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -1,61 +0,0 @@
1
- import { ButtonProps } from '../Button/Button.types';
2
- import { InputLengthStyleProps, TextFieldProps } from '../TextField/TextField.types';
3
- import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
4
- /**
5
- * Interface for button elements that can be appended to an InputGroup.
6
- * Used when you want to add interactive buttons alongside the input field.
7
- */
8
- interface AppendedButtonProps {
9
- /**
10
- * Specifies that this appended item is an interactive button.
11
- * Button items can trigger actions and provide additional functionality to the input.
12
- */
13
- variant: 'button';
14
- /**
15
- * Configuration properties for the button component.
16
- * Uses all standard Button props including click handlers, styling, icons, and tooltips.
17
- */
18
- buttonProps: ButtonProps;
19
- }
20
- /**
21
- * Interface for custom React elements that can be appended to an InputGroup.
22
- * Used when you need to add non-button content like icons, labels, or decorative elements.
23
- */
24
- interface ElementProps {
25
- /**
26
- * Specifies that this appended item is a custom React element.
27
- * Element items are typically decorative or informational and don't have built-in interactivity.
28
- */
29
- variant: 'element';
30
- /**
31
- * The React content to render alongside the input field.
32
- * Can be any valid React node including text, icons, indicators, or complex components.
33
- */
34
- element: React.ReactNode;
35
- }
36
- export type AppendedProps = AppendedButtonProps | ElementProps | undefined;
37
- /**
38
- * Base interface for InputGroup component properties.
39
- * Extends TextFieldProps to inherit all text input functionality while adding group-specific features.
40
- */
41
- interface BaseInputGroupProps extends TextFieldProps {
42
- /**
43
- * Array of elements to append to the right side of the input field.
44
- * Each item can be either a button (for interactive functionality) or an element (for decoration).
45
- * Items are displayed in the order they appear in the array, creating a cohesive input group.
46
- */
47
- append: AppendedProps[];
48
- /**
49
- * Custom input field component to render instead of the default TextField.
50
- * Use this when you need specialized input behavior while maintaining the group styling.
51
- * The field will be integrated seamlessly with the appended elements.
52
- */
53
- field?: React.ReactNode;
54
- }
55
- /**
56
- * Complete props interface for the InputGroup component.
57
- * Combines base input group functionality with tooltip support and text length constraints.
58
- * Creates a cohesive input control with attached buttons or decorative elements.
59
- */
60
- export type InputGroupProps = BaseInputGroupProps & TooltipComponentProps & InputLengthStyleProps;
61
- export {};
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=InputGroup.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.types.js","sourceRoot":"","sources":["../../src/InputGroup/InputGroup.types.ts"],"names":[],"mappings":""}
@@ -1,2 +0,0 @@
1
- export { InputGroup as default } from './InputGroup';
2
- export type { AppendedProps } from './InputGroup.types';
@@ -1,2 +0,0 @@
1
- export { InputGroup as default } from './InputGroup';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/InputGroup/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,OAAO,EAAE,MAAM,cAAc,CAAC"}
@@ -1,5 +0,0 @@
1
- import React from 'react';
2
- import '../styles.css';
3
- import { ModalProps } from './Modal.types';
4
- declare const Modal: React.FunctionComponent<ModalProps>;
5
- export default Modal;
@@ -1,76 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import React, { useEffect, useState } from 'react';
3
- import * as DialogPrimitive from '@radix-ui/react-dialog';
4
- import classNames from 'classnames';
5
- import '../styles.css';
6
- import Button from '../Button';
7
- import Icon from '../Icon';
8
- import TextField from '../TextField';
9
- const Dialog = DialogPrimitive.Root;
10
- const DialogPortal = DialogPrimitive.Portal;
11
- const DialogClose = DialogPrimitive.Close;
12
- const DialogContent = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(DialogPortal, { children: [_jsx("div", { className: "tw:select-none tw:fixed tw:w-full tw:h-full tw:opacity-50 tw:inset-0 tw:z-[1009] tw:bg-sq-dark-background\n tw:data-[state=open]:animate-in tw:data-[state=closed]:animate-out tw:data-[state=closed]:fade-out-0\n tw:data-[state=open]:fade-in-0 " }), _jsxs(DialogPrimitive.Content, { ref: ref, className: `tw:fixed tw:left-[50%] tw:top-0 tw:my-6 tw:translate-x-[-50%] tw:z-[1010] tw:grid
13
- tw:gap-4 tw:border tw:bg-sq-white tw:dark:bg-sq-dark-background tw:shadow-lg tw:duration-200
14
- tw:rounded-lg ${className}`, ...props, children: [_jsx(DialogPrimitive.DialogTitle, { className: "tw:hidden" }), children] })] })));
15
- DialogContent.displayName = DialogPrimitive.Content.displayName;
16
- const DialogHeader = (props) => (_jsx("div", { className: "tw:w-full tw:justify-between", children: _jsx("div", { ...props }) }));
17
- DialogHeader.displayName = 'DialogHeader';
18
- const DialogFooter = (props) => _jsx("div", { ...props });
19
- DialogFooter.displayName = 'DialogFooter';
20
- const DialogTitle = React.forwardRef((props, ref) => _jsx(DialogPrimitive.Title, { ref: ref, ...props }));
21
- DialogTitle.displayName = DialogPrimitive.Title.displayName;
22
- const DialogDescription = React.forwardRef((props, ref) => _jsx(DialogPrimitive.Description, { ref: ref, ...props }));
23
- DialogDescription.displayName = DialogPrimitive.Description.displayName;
24
- const Modal = ({ titleIcon, title = 'Modal title example', titleSuffixLabel, subtitle, children, open = false, onClose, customButton = false, customButtonLabel = 'Back', onClickCustomButton, submitButtonLabel = 'Submit', cancelButtonLabel = 'Cancel', disableSubmitButton = false, stopPropagationSubmitButton = false, onSubmit, isTitleEditable = false, onTitleChanged, inputExtraClassNames, hideCloseIcon = false, size = 'xl', titleIconPosition = 'left', hideFooterButtons = false, hideSubmitButton = false, hideCancelButton = false, testId = 'modal', modalFooter, dialogClassName, titlePlaceholder, titleRequired, titleError, submitButtonTooltip, cancelButtonTooltip, disableCustomButton, customHeader, middleFooterSection = _jsx(_Fragment, {}), customButtonVariant = 'outline', submitButtonVariant = 'theme', keepFocusInsideModal = true, onPointerDownOutside, onInteractOutside, }) => {
25
- const [isLoading, setIsLoading] = useState(false);
26
- // the Dialog is adding pointerEvents: none to body and the dropdowns from the modal does not work anymore
27
- useEffect(() => {
28
- if (open) {
29
- // Pushing the change to the end of the call stack
30
- const timer = setTimeout(() => {
31
- document.body.style.pointerEvents = '';
32
- }, 0);
33
- return () => clearTimeout(timer);
34
- }
35
- else {
36
- document.body.style.pointerEvents = 'auto';
37
- }
38
- }, [open]);
39
- const handleSubmit = async (e) => {
40
- if (!onSubmit)
41
- return;
42
- try {
43
- setIsLoading(true);
44
- await onSubmit(e);
45
- }
46
- finally {
47
- setIsLoading(false);
48
- }
49
- };
50
- const renderTitle = () => {
51
- let titleIconElement = _jsx(_Fragment, {});
52
- if (titleIcon) {
53
- if (typeof titleIcon === 'string') {
54
- titleIconElement = (_jsx(Icon, { icon: titleIcon, testId: "modalTitleIcon", extraClassNames: "tw:flex tw:text-xl tw:mt-1" }));
55
- }
56
- else {
57
- titleIconElement = _jsx("div", { className: "tw:mt-1.5", children: titleIcon });
58
- }
59
- }
60
- return (_jsxs(_Fragment, { children: [titleIcon && titleIconPosition === 'left' ? _jsx("div", { className: "tw:flex tw:mr-2", children: titleIconElement }) : _jsx(_Fragment, {}), _jsx(DialogTitle, { asChild: true, children: isTitleEditable ? (_jsxs("div", { className: "tw:flex tw:w-full tw:items-center", children: [_jsx(TextField, { extraClassNames: inputExtraClassNames, value: title, type: "text", testId: "modalTitle", onChange: onTitleChanged, placeholder: titlePlaceholder, required: titleRequired, showError: !!titleError }), titleError && _jsx("p", { className: "tw:text-sq-danger tw:min-w-fit tw:pl-2 tw:mb-0", children: titleError })] })) : (customHeader ?? (_jsxs("div", { "data-testid": "modalTitle", className: "modal-title", children: [_jsxs("div", { className: "tw:flex tw:items-center", children: [_jsx("h3", { children: title }), titleSuffixLabel && _jsx("span", { className: "tw:text-xl tw:pl-0.5", children: titleSuffixLabel })] }), subtitle && (_jsx("div", { className: "tw:italic tw:text-sm tw:text-left tw:mt-1", "data-testid": "modal-subtitle", children: subtitle }))] }))) }), titleIcon && titleIconPosition === 'right' ? _jsx("div", { className: "tw:flex tw:ml-4", children: titleIconElement }) : _jsx(_Fragment, {})] }));
61
- };
62
- return open ? (_jsx(Dialog, { open: true, onOpenChange: onClose, modal: keepFocusInsideModal, children: _jsxs(DialogContent, { onPointerDownOutside: (e) => (onPointerDownOutside ? onPointerDownOutside(e) : e.preventDefault()), onInteractOutside: (e) => (onInteractOutside ? onInteractOutside(e) : e.preventDefault()), "data-testid": testId, className: classNames(`modalContent tw:w-full tw:border-none tw:shadow-none tw:dark:text-sq-dark-text tw:!gap-0`, {
63
- 'tw:max-w-xs': size === 'xs',
64
- 'tw:max-w-sm': size === 'sm',
65
- 'tw:max-w-md': size === 'md',
66
- 'tw:max-w-lg': size === 'lg',
67
- 'tw:max-w-xl': size === 'xl',
68
- 'tw:max-w-2xl': size === '2xl',
69
- 'tw:max-w-3xl': size === '3xl',
70
- 'tw:max-w-4xl': size === '4xl',
71
- 'tw:max-w-5xl': size === '5xl',
72
- 'tw:max-w-6xl': size === '6xl',
73
- }, dialogClassName), children: [_jsxs(DialogHeader, { className: "modal-header tw:flex tw:w-full tw:justify-between tw:border-sq-disabled-gray\n tw:dark:border-sq-dark-disabled-gray tw:border-0 tw:border-b tw:px-6 tw:py-4", children: [_jsx("div", { className: "tw:flex tw:w-full", children: renderTitle() }), !hideCloseIcon && (_jsx(DialogClose, { autoFocus: false, className: "tw:[&:has(:focus-visible)]:none tw:opacity-70 tw:bg-transparent tw:hover:opacity-100 close tw:text-base tw:cursor-pointer tw:ml-4", "data-testid": "closeButton", children: _jsx("span", { className: "tw:cursor-pointer", children: "\u00D7" }) }))] }), _jsx(DialogDescription, { className: "modal-body tw:px-6 tw:py-4 tw:overflow-y-auto", asChild: true, children: children }), !hideFooterButtons && (_jsx(DialogFooter, { className: "modal-footer tw:px-6 tw:py-4", children: modalFooter ?? (_jsxs("div", { className: "tw:flex tw:w-full tw:justify-between", "data-testid": "modalFooter", children: [_jsx("div", { className: "tw:flex tw:justify-start", children: customButton && (_jsx(Button, { label: customButtonLabel, onClick: onClickCustomButton, disabled: disableCustomButton, extraClassNames: "tw:justify-start tw:min-w-25", testId: "customButton", variant: customButtonVariant })) }), _jsxs("div", { className: "tw:flex tw:justify-end", children: [_jsx("div", { className: "tw:flex tw:items-center", children: middleFooterSection }), !hideCancelButton && (_jsx(DialogClose, { asChild: true, children: _jsx(Button, { label: cancelButtonLabel, extraClassNames: "tw:mr-5 tw:min-w-25", tooltip: cancelButtonTooltip, variant: "outline", stopPropagation: false, testId: "cancelButton" }) })), !hideSubmitButton && (_jsx(Button, { label: submitButtonLabel, onClick: handleSubmit, disabled: disableSubmitButton || isLoading, variant: submitButtonVariant, stopPropagation: stopPropagationSubmitButton, tooltip: submitButtonTooltip, icon: isLoading ? 'fc-loading-notch tw:animate-spin' : undefined, iconPosition: "left", testId: "submitButton", extraClassNames: "tw:min-w-25" }))] })] })) }))] }) })) : (_jsx(_Fragment, {}));
74
- };
75
- export default Modal;
76
- //# sourceMappingURL=Modal.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../src/Modal/Modal.tsx"],"names":[],"mappings":"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"}
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- declare const _default: {
3
- title: string;
4
- };
5
- export default _default;
6
- export declare const AllModalsVariants: React.FunctionComponent;
7
- export declare const ModalsWithDisabledSubmit: React.FunctionComponent;
8
- export declare const ModalsWithEditableTitle: React.FunctionComponent;
9
- export declare const ModalsWithCustomButton: React.FunctionComponent;
10
- export declare const ModalsWithVariantButton: React.FunctionComponent;