@seeqdev/qomponents 0.0.158 → 0.0.159

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 (252) hide show
  1. package/dist/index.esm.js +29 -14
  2. package/dist/index.esm.js.map +1 -1
  3. package/dist/index.js +29 -14
  4. package/dist/index.js.map +1 -1
  5. package/dist/styles.css +4 -0
  6. package/dist/types.d.ts.map +1 -0
  7. package/package.json +1 -3
  8. package/dist/Accordion/Accordion.js +0 -7
  9. package/dist/Accordion/Accordion.js.map +0 -1
  10. package/dist/Accordion/Accordion.stories.js +0 -75
  11. package/dist/Accordion/Accordion.stories.js.map +0 -1
  12. package/dist/Accordion/Accordion.test.js +0 -55
  13. package/dist/Accordion/Accordion.test.js.map +0 -1
  14. package/dist/Accordion/Accordion.types.js +0 -2
  15. package/dist/Accordion/Accordion.types.js.map +0 -1
  16. package/dist/Accordion/index.js +0 -2
  17. package/dist/Accordion/index.js.map +0 -1
  18. package/dist/Alert/Alert.js +0 -32
  19. package/dist/Alert/Alert.js.map +0 -1
  20. package/dist/Alert/Alert.stories.js +0 -57
  21. package/dist/Alert/Alert.stories.js.map +0 -1
  22. package/dist/Alert/Alert.test.js +0 -50
  23. package/dist/Alert/Alert.test.js.map +0 -1
  24. package/dist/Alert/Alert.types.js +0 -2
  25. package/dist/Alert/Alert.types.js.map +0 -1
  26. package/dist/Alert/index.js +0 -2
  27. package/dist/Alert/index.js.map +0 -1
  28. package/dist/Button/Button.js +0 -89
  29. package/dist/Button/Button.js.map +0 -1
  30. package/dist/Button/Button.stories.js +0 -25
  31. package/dist/Button/Button.stories.js.map +0 -1
  32. package/dist/Button/Button.test.js +0 -47
  33. package/dist/Button/Button.test.js.map +0 -1
  34. package/dist/Button/Button.types.js +0 -5
  35. package/dist/Button/Button.types.js.map +0 -1
  36. package/dist/Button/index.js +0 -2
  37. package/dist/Button/index.js.map +0 -1
  38. package/dist/ButtonGroup/ButtonGroup.js +0 -35
  39. package/dist/ButtonGroup/ButtonGroup.js.map +0 -1
  40. package/dist/ButtonGroup/ButtonGroup.stories.js +0 -317
  41. package/dist/ButtonGroup/ButtonGroup.stories.js.map +0 -1
  42. package/dist/ButtonGroup/ButtonGroup.test.js +0 -66
  43. package/dist/ButtonGroup/ButtonGroup.test.js.map +0 -1
  44. package/dist/ButtonGroup/ButtonGroup.types.js +0 -2
  45. package/dist/ButtonGroup/ButtonGroup.types.js.map +0 -1
  46. package/dist/ButtonGroup/index.js +0 -2
  47. package/dist/ButtonGroup/index.js.map +0 -1
  48. package/dist/ButtonWithDropdown/ButtonWithDropdown.js +0 -36
  49. package/dist/ButtonWithDropdown/ButtonWithDropdown.js.map +0 -1
  50. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js +0 -104
  51. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js.map +0 -1
  52. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js +0 -93
  53. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js.map +0 -1
  54. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js +0 -2
  55. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js.map +0 -1
  56. package/dist/ButtonWithDropdown/index.js +0 -2
  57. package/dist/ButtonWithDropdown/index.js.map +0 -1
  58. package/dist/ButtonWithPopover/ButtonWithPopover.js +0 -55
  59. package/dist/ButtonWithPopover/ButtonWithPopover.js.map +0 -1
  60. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js +0 -25
  61. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js.map +0 -1
  62. package/dist/ButtonWithPopover/ButtonWithPopover.test.js +0 -81
  63. package/dist/ButtonWithPopover/ButtonWithPopover.test.js.map +0 -1
  64. package/dist/ButtonWithPopover/ButtonWithPopover.types.js +0 -2
  65. package/dist/ButtonWithPopover/ButtonWithPopover.types.js.map +0 -1
  66. package/dist/ButtonWithPopover/index.js +0 -2
  67. package/dist/ButtonWithPopover/index.js.map +0 -1
  68. package/dist/Carousel/Carousel.js +0 -75
  69. package/dist/Carousel/Carousel.js.map +0 -1
  70. package/dist/Carousel/Carousel.stories.js +0 -63
  71. package/dist/Carousel/Carousel.stories.js.map +0 -1
  72. package/dist/Carousel/Carousel.test.js +0 -48
  73. package/dist/Carousel/Carousel.test.js.map +0 -1
  74. package/dist/Carousel/Carousel.types.js +0 -2
  75. package/dist/Carousel/Carousel.types.js.map +0 -1
  76. package/dist/Carousel/index.js +0 -2
  77. package/dist/Carousel/index.js.map +0 -1
  78. package/dist/Checkbox/Checkbox.js +0 -24
  79. package/dist/Checkbox/Checkbox.js.map +0 -1
  80. package/dist/Checkbox/Checkbox.stories.js +0 -12
  81. package/dist/Checkbox/Checkbox.stories.js.map +0 -1
  82. package/dist/Checkbox/Checkbox.test.js +0 -94
  83. package/dist/Checkbox/Checkbox.test.js.map +0 -1
  84. package/dist/Checkbox/Checkbox.types.js +0 -2
  85. package/dist/Checkbox/Checkbox.types.js.map +0 -1
  86. package/dist/Checkbox/index.js +0 -2
  87. package/dist/Checkbox/index.js.map +0 -1
  88. package/dist/Collapse/Collapse.js +0 -17
  89. package/dist/Collapse/Collapse.js.map +0 -1
  90. package/dist/Collapse/Collapse.stories.js +0 -15
  91. package/dist/Collapse/Collapse.stories.js.map +0 -1
  92. package/dist/Collapse/Collapse.test.js +0 -17
  93. package/dist/Collapse/Collapse.test.js.map +0 -1
  94. package/dist/Collapse/Collapse.types.js +0 -2
  95. package/dist/Collapse/Collapse.types.js.map +0 -1
  96. package/dist/Collapse/index.js +0 -2
  97. package/dist/Collapse/index.js.map +0 -1
  98. package/dist/Icon/Icon.js +0 -55
  99. package/dist/Icon/Icon.js.map +0 -1
  100. package/dist/Icon/Icon.stories.js +0 -15
  101. package/dist/Icon/Icon.stories.js.map +0 -1
  102. package/dist/Icon/Icon.test.js +0 -55
  103. package/dist/Icon/Icon.test.js.map +0 -1
  104. package/dist/Icon/Icon.types.js +0 -16
  105. package/dist/Icon/Icon.types.js.map +0 -1
  106. package/dist/Icon/index.js +0 -2
  107. package/dist/Icon/index.js.map +0 -1
  108. package/dist/InputGroup/InputGroup.js +0 -34
  109. package/dist/InputGroup/InputGroup.js.map +0 -1
  110. package/dist/InputGroup/InputGroup.stories.js +0 -129
  111. package/dist/InputGroup/InputGroup.stories.js.map +0 -1
  112. package/dist/InputGroup/InputGroup.test.js +0 -42
  113. package/dist/InputGroup/InputGroup.test.js.map +0 -1
  114. package/dist/InputGroup/InputGroup.types.js +0 -2
  115. package/dist/InputGroup/InputGroup.types.js.map +0 -1
  116. package/dist/InputGroup/index.js +0 -2
  117. package/dist/InputGroup/index.js.map +0 -1
  118. package/dist/Modal/Modal.js +0 -76
  119. package/dist/Modal/Modal.js.map +0 -1
  120. package/dist/Modal/Modal.stories.js +0 -44
  121. package/dist/Modal/Modal.stories.js.map +0 -1
  122. package/dist/Modal/Modal.test.js +0 -108
  123. package/dist/Modal/Modal.test.js.map +0 -1
  124. package/dist/Modal/Modal.types.js +0 -2
  125. package/dist/Modal/Modal.types.js.map +0 -1
  126. package/dist/Modal/index.js +0 -2
  127. package/dist/Modal/index.js.map +0 -1
  128. package/dist/ProgressBar/ProgressBar.js +0 -72
  129. package/dist/ProgressBar/ProgressBar.js.map +0 -1
  130. package/dist/ProgressBar/ProgressBar.stories.js +0 -35
  131. package/dist/ProgressBar/ProgressBar.stories.js.map +0 -1
  132. package/dist/ProgressBar/ProgressBar.test.js +0 -43
  133. package/dist/ProgressBar/ProgressBar.test.js.map +0 -1
  134. package/dist/ProgressBar/ProgressBar.types.js +0 -2
  135. package/dist/ProgressBar/ProgressBar.types.js.map +0 -1
  136. package/dist/ProgressBar/index.js +0 -2
  137. package/dist/ProgressBar/index.js.map +0 -1
  138. package/dist/SeeqActionDropdown/SeeqActionDropdown.js +0 -39
  139. package/dist/SeeqActionDropdown/SeeqActionDropdown.js.map +0 -1
  140. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js +0 -56
  141. package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js.map +0 -1
  142. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js +0 -73
  143. package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js.map +0 -1
  144. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js +0 -2
  145. package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js.map +0 -1
  146. package/dist/SeeqActionDropdown/index.js +0 -2
  147. package/dist/SeeqActionDropdown/index.js.map +0 -1
  148. package/dist/SeeqActionDropdown/variants.js +0 -29
  149. package/dist/SeeqActionDropdown/variants.js.map +0 -1
  150. package/dist/Select/Select.js +0 -177
  151. package/dist/Select/Select.js.map +0 -1
  152. package/dist/Select/Select.stories.js +0 -40
  153. package/dist/Select/Select.stories.js.map +0 -1
  154. package/dist/Select/Select.test.js +0 -175
  155. package/dist/Select/Select.test.js.map +0 -1
  156. package/dist/Select/Select.types.js +0 -2
  157. package/dist/Select/Select.types.js.map +0 -1
  158. package/dist/Select/index.js +0 -3
  159. package/dist/Select/index.js.map +0 -1
  160. package/dist/Slider/Slider.js +0 -10
  161. package/dist/Slider/Slider.js.map +0 -1
  162. package/dist/Slider/Slider.stories.js +0 -14
  163. package/dist/Slider/Slider.stories.js.map +0 -1
  164. package/dist/Slider/Slider.test.js +0 -32
  165. package/dist/Slider/Slider.test.js.map +0 -1
  166. package/dist/Slider/Slider.types.js +0 -2
  167. package/dist/Slider/Slider.types.js.map +0 -1
  168. package/dist/Slider/index.js +0 -2
  169. package/dist/Slider/index.js.map +0 -1
  170. package/dist/SvgIcon/SvgIcon.js +0 -28
  171. package/dist/SvgIcon/SvgIcon.js.map +0 -1
  172. package/dist/SvgIcon/SvgIcon.stories.js +0 -18
  173. package/dist/SvgIcon/SvgIcon.stories.js.map +0 -1
  174. package/dist/SvgIcon/SvgIcon.test.js +0 -41
  175. package/dist/SvgIcon/SvgIcon.test.js.map +0 -1
  176. package/dist/SvgIcon/SvgIcon.types.js +0 -6
  177. package/dist/SvgIcon/SvgIcon.types.js.map +0 -1
  178. package/dist/SvgIcon/index.js +0 -2
  179. package/dist/SvgIcon/index.js.map +0 -1
  180. package/dist/Tabs/Tabs.js +0 -17
  181. package/dist/Tabs/Tabs.js.map +0 -1
  182. package/dist/Tabs/Tabs.stories.js +0 -73
  183. package/dist/Tabs/Tabs.stories.js.map +0 -1
  184. package/dist/Tabs/Tabs.test.js +0 -86
  185. package/dist/Tabs/Tabs.test.js.map +0 -1
  186. package/dist/Tabs/Tabs.types.js +0 -2
  187. package/dist/Tabs/Tabs.types.js.map +0 -1
  188. package/dist/Tabs/index.js +0 -2
  189. package/dist/Tabs/index.js.map +0 -1
  190. package/dist/TextArea/TextArea.js +0 -25
  191. package/dist/TextArea/TextArea.js.map +0 -1
  192. package/dist/TextArea/TextArea.stories.js +0 -10
  193. package/dist/TextArea/TextArea.stories.js.map +0 -1
  194. package/dist/TextArea/TextArea.test.js +0 -68
  195. package/dist/TextArea/TextArea.test.js.map +0 -1
  196. package/dist/TextArea/TextArea.types.js +0 -2
  197. package/dist/TextArea/TextArea.types.js.map +0 -1
  198. package/dist/TextArea/index.js +0 -2
  199. package/dist/TextArea/index.js.map +0 -1
  200. package/dist/TextField/TextField.js +0 -85
  201. package/dist/TextField/TextField.js.map +0 -1
  202. package/dist/TextField/TextField.stories.js +0 -11
  203. package/dist/TextField/TextField.stories.js.map +0 -1
  204. package/dist/TextField/TextField.test.js +0 -41
  205. package/dist/TextField/TextField.test.js.map +0 -1
  206. package/dist/TextField/TextField.types.js +0 -2
  207. package/dist/TextField/TextField.types.js.map +0 -1
  208. package/dist/TextField/index.js +0 -2
  209. package/dist/TextField/index.js.map +0 -1
  210. package/dist/ToolbarButton/ToolbarButton.js +0 -57
  211. package/dist/ToolbarButton/ToolbarButton.js.map +0 -1
  212. package/dist/ToolbarButton/ToolbarButton.stories.js +0 -28
  213. package/dist/ToolbarButton/ToolbarButton.stories.js.map +0 -1
  214. package/dist/ToolbarButton/ToolbarButton.test.js +0 -85
  215. package/dist/ToolbarButton/ToolbarButton.test.js.map +0 -1
  216. package/dist/ToolbarButton/ToolbarButton.types.js +0 -2
  217. package/dist/ToolbarButton/ToolbarButton.types.js.map +0 -1
  218. package/dist/ToolbarButton/index.js +0 -2
  219. package/dist/ToolbarButton/index.js.map +0 -1
  220. package/dist/Tooltip/QTip.stories.js +0 -18
  221. package/dist/Tooltip/QTip.stories.js.map +0 -1
  222. package/dist/Tooltip/QTip.types.js +0 -2
  223. package/dist/Tooltip/QTip.types.js.map +0 -1
  224. package/dist/Tooltip/QTipPerformance.stories.js +0 -26
  225. package/dist/Tooltip/QTipPerformance.stories.js.map +0 -1
  226. package/dist/Tooltip/Qtip.js +0 -168
  227. package/dist/Tooltip/Qtip.js.map +0 -1
  228. package/dist/Tooltip/Tooltip.js +0 -34
  229. package/dist/Tooltip/Tooltip.js.map +0 -1
  230. package/dist/Tooltip/Tooltip.stories.js +0 -15
  231. package/dist/Tooltip/Tooltip.stories.js.map +0 -1
  232. package/dist/Tooltip/Tooltip.types.js +0 -3
  233. package/dist/Tooltip/Tooltip.types.js.map +0 -1
  234. package/dist/Tooltip/TooltipPerformance.stories.js +0 -26
  235. package/dist/Tooltip/TooltipPerformance.stories.js.map +0 -1
  236. package/dist/Tooltip/index.js +0 -3
  237. package/dist/Tooltip/index.js.map +0 -1
  238. package/dist/Tooltip/qTip.utilities.js +0 -11
  239. package/dist/Tooltip/qTip.utilities.js.map +0 -1
  240. package/dist/setupTests.d.ts +0 -1
  241. package/dist/setupTests.js +0 -6
  242. package/dist/setupTests.js.map +0 -1
  243. package/dist/types.js +0 -2
  244. package/dist/types.js.map +0 -1
  245. package/dist/utils/browserId.js +0 -29
  246. package/dist/utils/browserId.js.map +0 -1
  247. package/dist/utils/svg.js +0 -20
  248. package/dist/utils/svg.js.map +0 -1
  249. package/dist/utils/validateStyleDimension.js +0 -14
  250. package/dist/utils/validateStyleDimension.js.map +0 -1
  251. package/dist/utils/validateStyleDimension.test.js +0 -20
  252. package/dist/utils/validateStyleDimension.test.js.map +0 -1
package/dist/styles.css CHANGED
@@ -2278,6 +2278,10 @@ ol,
2278
2278
  max-width: 72rem;
2279
2279
  }
2280
2280
 
2281
+ .tw-max-w-96 {
2282
+ max-width: 24rem;
2283
+ }
2284
+
2281
2285
  .tw-max-w-full {
2282
2286
  max-width: 100%;
2283
2287
  }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sources":["../src/Button/Button.types.ts","../src/Icon/Icon.types.ts","../src/Tooltip/Tooltip.types.ts"],"sourcesContent":["import { TooltipProps } from '../Tooltip/Tooltip.types';\nimport { IconType } from '../Icon/Icon.types';\nimport React from 'react';\n\nexport const buttonTypes = ['button', 'reset', 'submit', 'link'] as const;\nexport const buttonSizes = ['sm', 'lg'] as const;\nexport const buttonVariants = ['outline', 'theme', 'theme-light', 'warning', 'danger', 'no-border'] as const;\nexport const iconPositions = ['left', 'right'];\n\nexport type ButtonType = (typeof buttonTypes)[number];\nexport type ButtonSize = (typeof buttonSizes)[number];\nexport type ButtonVariant = (typeof buttonVariants)[number];\nexport type IconPosition = (typeof iconPositions)[number];\n\nexport interface ButtonProps {\n /**\n * Callback function triggered when the button is clicked.\n * Receives the mouse event as a parameter for additional event handling.\n * Use this to define the primary action the button should perform.\n */\n onClick?: (e: React.MouseEvent) => void;\n\n /**\n * The text, element, or content to display inside the button.\n * Can be a string for simple text, a translation key, or any React element/node\n * for more complex content like formatted text or inline elements.\n */\n label?: string | React.JSX.Element | React.ReactNode;\n\n /**\n * Visual style variant that determines the button's appearance and color scheme:\n * - `outline`: White background with border, suitable for secondary actions\n * - `theme`: Primary theme colors, typically for main call-to-action buttons\n * - `theme-light`: Lighter version of theme colors for subtle primary actions\n * - `warning`: Yellow/orange styling for caution-related actions\n * - `danger`: Red styling for destructive or critical actions\n * - `no-border`: Borderless styling for minimal, text-like buttons\n * @default 'outline'\n */\n variant?: ButtonVariant;\n\n /**\n * HTML button type attribute that determines the button's behavior in forms:\n * - `button`: Standard button with no special form behavior (default)\n * - `submit`: Submits the parent form when clicked\n * - `reset`: Resets the parent form fields to their initial values\n * - `link`: Behaves like a button but renders as button type for Firefox compatibility\n * @default 'button'\n */\n type?: ButtonType;\n\n /**\n * Size variant that controls the button's dimensions and text size:\n * - `sm`: Small button with compact padding and smaller text (default)\n * - `lg`: Large button with generous padding and larger text\n * @default 'sm'\n */\n size?: ButtonSize;\n\n /**\n * When true, disables the button preventing user interaction.\n * Disabled buttons are visually dimmed and do not respond to clicks or focus.\n * The button will also have `pointer-events: none` applied via CSS.\n */\n disabled?: boolean;\n\n /**\n * Additional CSS classes to apply to the button element.\n * These classes are combined with the component's built-in styling classes.\n * Use this to customize appearance beyond the standard variants.\n */\n extraClassNames?: string;\n\n /**\n * Icon class name to display alongside the button text.\n * Typically uses FontAwesome classes (e.g., 'fc-zoom', 'fc-delete').\n * The icon is automatically styled to match the button's text color.\n */\n icon?: string;\n\n /**\n * Determines how the icon should be styled and colored:\n * - `text`: Uses the button's text color (default)\n * - `white`: Forces white color regardless of button variant\n * - `theme`: Uses theme-specific colors\n * - `color`: Uses a custom color specified in `iconColor`\n * @default 'text'\n */\n iconStyle?: IconType;\n\n /**\n * Custom color for the icon when `iconStyle` is set to 'color'.\n * Can be any valid CSS color value (hex, rgb, color name, etc.).\n * This property is required when iconStyle is 'color'.\n */\n iconColor?: string;\n\n /**\n * Position of the icon relative to the button text:\n * - `left`: Icon appears before the text with right margin\n * - `right`: Icon appears after the text with left margin\n * @default 'left'\n */\n iconPosition?: IconPosition;\n\n /**\n * Custom prefix for the icon class when not using standard FontAwesome icons.\n * By default, icons are prefixed with 'fa-sharp fa-regular', but some icons\n * require different prefixes. Use this to override the default behavior.\n */\n iconPrefix?: string;\n\n /**\n * HTML ID attribute for the button element.\n * Should be unique across the entire page for proper HTML semantics.\n * Also used as a prefix for the icon's test ID when an icon is present.\n */\n id?: string;\n\n /**\n * Test ID attribute for the button element used in automated testing.\n * Applied to the `data-testid` attribute for element selection in test suites.\n */\n testId?: string;\n\n /**\n * Controls whether the click event should stop propagation to parent elements.\n * When true (default), prevents the click from bubbling up the DOM tree.\n * Set to false if you need parent elements to also handle the click event.\n * @default true\n */\n stopPropagation?: boolean;\n\n /**\n * Tooltip text to display when hovering over the button.\n * When provided, the button will show a tooltip with this text on hover.\n * The tooltip appearance and behavior can be customized with `tooltipOptions`.\n */\n tooltip?: string;\n\n /**\n * When true, the tooltip text is rendered as HTML allowing for rich content.\n * When false (default), the tooltip text is treated as plain text for security.\n * Only set to true if you trust the tooltip content source.\n * @default false\n */\n isHtmlTooltip?: boolean;\n\n /**\n * Test ID attribute specifically for the tooltip element.\n * Used for automated testing to identify and interact with the tooltip.\n * Helpful when you need to test tooltip-specific behavior separately from the button.\n */\n tooltipTestId?: string;\n\n /**\n * Configuration options for customizing tooltip behavior and appearance.\n * Omits the 'text' property since that's handled by the `tooltip` prop.\n * Includes options like position, delay, and other tooltip-specific settings.\n */\n tooltipOptions?: Omit<TooltipProps, 'text'>;\n\n /**\n * When true, prevents the blur event from occurring on mouse down.\n * Useful when you want to keep focus on the current element after clicking the button.\n * Commonly used in scenarios where button clicks shouldn't interrupt form input focus.\n * @default false\n */\n preventBlur?: boolean;\n}\n","import { TooltipComponentProps } from '../Tooltip/Tooltip.types';\n\nexport const iconTypes = [\n 'theme',\n 'white',\n 'dark-gray',\n 'darkish-gray',\n 'gray',\n 'color',\n 'info',\n 'text',\n 'warning',\n 'inherit',\n 'danger',\n 'theme-light',\n 'success',\n] as const;\n\nexport type IconType = (typeof iconTypes)[number];\n\n/**\n * Props for the Icon component that renders customizable icons with various styling options.\n * Extends TooltipComponentProps to support tooltip functionality on the icon.\n */\nexport interface IconProps extends TooltipComponentProps {\n /**\n * Icon class name to display, typically from FontAwesome.\n * Examples: 'fc-zoom', 'fc-delete', 'fc-save'. This determines which icon is rendered.\n */\n icon: string;\n\n /**\n * Custom prefix for the icon class when not using standard FontAwesome icons.\n * By default, icons are prefixed with 'fa-sharp fa-regular', but some icons\n * from different icon sets require specific prefixes. Use this to override the default.\n */\n iconPrefix?: string;\n\n /**\n * Visual style type that determines the icon's color and appearance:\n * - `theme`: Uses primary theme colors (default)\n * - `white`: Pure white color\n * - `text`: Uses standard text color\n * - `dark-gray`: Dark gray color\n * - `darkish-gray`: Medium-dark gray color\n * - `gray`: Standard gray color\n * - `color`: Uses custom color specified in `color` prop\n * - `info`: Blue informational color\n * - `warning`: Yellow/orange warning color\n * - `danger`: Red error/danger color\n * - `success`: Green success color\n * - `theme-light`: Lighter version of theme color\n * - `inherit`: Inherits color from parent element\n * @default 'theme'\n */\n type?: IconType;\n\n /**\n * Custom color value for the icon when `type` is set to 'color'.\n * Can be any valid CSS color (hex, rgb, color names, etc.).\n * This property is required when type is 'color'.\n */\n color?: string;\n\n /**\n * Callback function triggered when the icon is clicked.\n * Receives the mouse event as a parameter. Use this to make icons interactive\n * for actions like opening menus, triggering functions, or navigation.\n */\n onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => any;\n\n /**\n * Additional CSS classes to apply to the icon element.\n * Use this to customize the icon's appearance, spacing, or behavior beyond built-in options.\n */\n extraClassNames?: string;\n\n /**\n * HTML ID attribute for the icon element.\n * Should be unique across the page for proper HTML semantics and accessibility.\n */\n id?: string;\n\n /**\n * When true, applies the 'fa-lg' class to make the icon larger than normal size.\n * Cannot be used together with the `small` prop. Useful for emphasis or better visibility.\n */\n large?: boolean;\n\n /**\n * When true, applies the 'fa-sm' class to make the icon smaller than normal size.\n * Cannot be used together with the `large` prop. Useful for compact layouts or inline text.\n */\n small?: boolean;\n\n /**\n * Test ID attribute for the icon element used in automated testing.\n * Applied to the `data-testid` attribute for element selection in test suites.\n */\n testId?: string;\n\n /**\n * Custom identifier placed in the `data-customid` attribute on the icon element.\n * Useful for identifying the specific icon in event handlers when multiple icons\n * share the same click handler. Helps distinguish which icon was clicked.\n */\n customId?: string;\n\n /**\n * Numeric value associated with the icon, purpose depends on specific use case.\n * Can be used for ordering, counting, or any numeric data related to the icon.\n */\n number?: number;\n}\n","export const DEFAULT_TOOL_TIP_DELAY = 500;\nexport const tooltipPositions = ['top', 'left', 'right', 'bottom'] as const;\nimport React from 'react';\n\nexport type TooltipPosition = (typeof tooltipPositions)[number];\n\nexport interface TooltipProps {\n position?: TooltipPosition;\n children?: React.JSX.Element | string;\n text: React.JSX.Element | string;\n delay?: number;\n}\n\nexport interface TooltipComponentProps {\n /** text to display on tooltip */\n tooltip?: string;\n /** number of milliseconds to wait before showing a tooltip on-hover */\n tooltipDelay?: number;\n /** one of four possible tooltip positions */\n tooltipPlacement?: TooltipPosition;\n /** true if the provided tooltip text should be rendered as HTML */\n isHtmlTooltip?: boolean;\n /** optional testId applied to the tooltip - useful for testing */\n tooltipTestId?: string;\n}\n"],"names":[],"mappings":";;AAIO,MAAM,WAAW,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAW;MAC7D,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAW;AACpC,MAAA,cAAc,GAAG,CAAC,SAAS,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAW;MAChG,aAAa,GAAG,CAAC,MAAM,EAAE,OAAO;;ACLhC,MAAA,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;;;ACfJ,MAAM,sBAAsB,GAAG,IAAI;AACnC,MAAM,gBAAgB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seeqdev/qomponents",
3
- "version": "0.0.158",
3
+ "version": "0.0.159",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.esm.js",
6
6
  "types": "dist/index.js",
@@ -18,7 +18,6 @@
18
18
  "description": "A library that allows you to build native UIs ... TODO",
19
19
  "scripts": {
20
20
  "build": "rollup -c --bundleConfigAsCjs",
21
- "postinstall": "node ./node_modules/patch-package/index.js --patch-dir=patches",
22
21
  "watchRollup": "rollup -c --bundleConfigAsCjs --watch",
23
22
  "test": "jest",
24
23
  "test:watch": "jest --watch",
@@ -82,7 +81,6 @@
82
81
  "dompurify": "3.2.3",
83
82
  "framer-motion": "12.17.0",
84
83
  "motion": "12.17.0",
85
- "patch-package": "8.0.0",
86
84
  "postcss": "8.4.35",
87
85
  "react-select": "5.10.1",
88
86
  "rooks": "8.0.1",
@@ -1,7 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Root, Item, Trigger, Content } from '@radix-ui/react-accordion';
3
- const Accordion = ({ accordionItems, defaultValue, value, onItemSelect, disabled, extraClassNames, testId, }) => {
4
- return (_jsx(Root, { className: `tw-rounded-md tw-w-full focus-visible:tw-outline-none ${extraClassNames || ''}`, type: "single", defaultValue: defaultValue, value: value, collapsible: true, "data-testid": testId, onValueChange: (_value) => onItemSelect(_value), children: accordionItems.map((item) => (_jsxs(Item, { className: `tw-bg-transparent tw-p-0 tw-flex tw-flex-col tw-w-full`, disabled: disabled, value: item.value, children: [_jsx(Trigger, { disabled: disabled, className: `tw-w-full tw-cursor-default focus-visible:tw-outline-none`, children: item.trigger }), _jsx(Content, { className: `data-[state=open]:tw-animate-slideDown data-[state=closed]:tw-animate-slideUp tw-overflow-hidden focus-visible:tw-outline-none ${item.contentClassNames || ''}`, children: item.content })] }, item.value))) }));
5
- };
6
- export default Accordion;
7
- //# sourceMappingURL=Accordion.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAGzE,MAAM,SAAS,GAA4C,CAAC,EAC1D,cAAc,EACd,YAAY,EACZ,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,eAAe,EACf,MAAM,GACP,EAAE,EAAE;IACH,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,yDAAyD,eAAe,IAAI,EAAE,EAAE,EAC3F,IAAI,EAAC,QAAQ,EACb,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,EACZ,WAAW,uBACE,MAAM,EACnB,aAAa,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,YAC9C,cAAc,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5B,MAAC,IAAI,IACH,SAAS,EAAE,wDAAwD,EAEnE,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,aACjB,KAAC,OAAO,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,2DAA2D,YAChG,IAAI,CAAC,OAAO,GACL,EACV,KAAC,OAAO,IACN,SAAS,EAAE,kIACT,IAAI,CAAC,iBAAiB,IAAI,EAC5B,EAAE,YACD,IAAI,CAAC,OAAO,GACL,KAXL,IAAI,CAAC,KAAK,CAYV,CACR,CAAC,GACG,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,75 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import React from 'react';
3
- import Accordion from './Accordion';
4
- import { QTip } from '../Tooltip/Qtip';
5
- import Icon from '../Icon';
6
- import Tabs from '../Tabs';
7
- import Button from '../Button';
8
- export default {
9
- title: 'Accordion',
10
- };
11
- const Trigger = ({ label }) => (_jsxs("div", { className: "tw-flex tw-justify-start tw-items-center tw-border-b tw-px-2 tw-text-sq-color-dark", children: [_jsx(Icon, { icon: "fc-arrow-dropdown", extraClassNames: "tw-text-sq-color-dark tw-mr-[0.5rem] tw-text-[0.75rem]", type: "text" }), label] }));
12
- const TriggerSecond = ({ label }) => (_jsxs("div", { className: "tw-flex tw-justify-between tw-items-center tw-border-b tw-px-2 tw-text-sq-color-dark tw-py-2", children: [label, _jsx(Icon, { icon: "fc-arrow-dropdown", extraClassNames: "tw-text-sq-color-dark tw-mr-[0.5rem] tw-text-[0.75rem]", type: "text" })] }));
13
- const renderData = () => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: "This is a data tab to show details about your data. You can make changes to your account" }), _jsx(Button, { variant: "outline", label: "Save data" })] }));
14
- const renderTools = () => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: "Make changes to your account here. Click save when you're done." }), _jsx(Button, { variant: "outline", label: "Save tools" })] }));
15
- const renderJournal = () => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: "Make changes to your account here. Click save when you're done." }), _jsx(Button, { variant: "outline", label: "Save journal" })] }));
16
- const tabsList = [
17
- {
18
- id: 'data',
19
- label: 'Data',
20
- icon: 'fc-data',
21
- content: renderData(),
22
- },
23
- {
24
- id: 'tools',
25
- label: 'Tools',
26
- icon: 'fc-gears-2',
27
- content: renderTools(),
28
- },
29
- {
30
- id: 'journal',
31
- label: 'Journal',
32
- icon: 'fc-workbook-lock',
33
- content: renderJournal(),
34
- },
35
- ];
36
- export const AllAccordionVariants = () => {
37
- const [activeTab, setActiveTab] = React.useState('data');
38
- const [value, setValue] = React.useState('oranges');
39
- const accordionItems = [
40
- {
41
- value: 'oranges',
42
- id: 'oranges',
43
- itemTestId: 'oranges',
44
- trigger: _jsx(Trigger, { label: "Oranges" }),
45
- content: (_jsx("div", { className: "tw-p-2 tw-text-[0.8125rem] dark:tw-text-sq-white", children: "Oranges are the fruit of the citrus species Citrus \u00D7 sinensis in the family Rutaceae. They are also called sweet oranges to distinguish them from the related Citrus \u00D7 aurantium, referred to as bitter oranges. They are round and orange, and usually have a sour or bitter taste. Oranges are a good source of vitamin C." })),
46
- },
47
- {
48
- value: 'apples',
49
- id: 'apples',
50
- itemTestId: 'apples',
51
- trigger: _jsx(Trigger, { label: "Apples" }),
52
- content: (_jsx("div", { children: _jsx("div", { className: "tw-p-4", children: _jsx(Tabs, { stretchTabs: true, activeTab: activeTab, onTabSelect: setActiveTab, defaultActiveTab: "data", tabs: tabsList }) }) })),
53
- },
54
- {
55
- value: 'bananas',
56
- id: 'bananas',
57
- trigger: _jsx(Trigger, { label: "Bananas" }),
58
- itemTestId: 'bananas',
59
- content: (_jsx("div", { children: "A banana is an elongated, edible fruit \u2013 botanically a berry \u2013 produced by several kinds of large herbaceous flowering plants in the genus Musa. In some countries, bananas used for cooking may be called \"plantains\", distinguishing them from dessert bananas. The fruit is variable in size, color, and firmness, but is usually elongated and curved, with soft flesh rich in starch covered with a rind, which may be green, yellow, red, purple, or brown when ripe." })),
60
- },
61
- {
62
- value: 'pineapples',
63
- id: 'pineapples',
64
- trigger: _jsx(Trigger, { label: "Pineapples" }),
65
- itemTestId: 'pineapples',
66
- content: (_jsx("div", { children: "The pineapple is a tropical plant with an edible fruit and the most economically significant plant in the family Bromeliaceae. The pineapple is indigenous to South America, where it has been cultivated for many centuries. The introduction of the pineapple to Europe in the 17th century made it a significant cultural icon of luxury. Since the 1820s, pineapple has been commercially grown in greenhouses and many tropical plantations." })),
67
- },
68
- ];
69
- const allAccordions = (isDark) => (_jsx("div", { className: isDark ? 'tw-dark tw-bg-sq-dark-background' : '', children: _jsx("div", { className: "tw-p-5 ", children: _jsx(Accordion, { accordionItems: isDark
70
- ? accordionItems
71
- : accordionItems.map((item) => ({ ...item, trigger: _jsx(TriggerSecond, { label: item.value.toUpperCase() }) })), value: value, testId: "basic-accordion1", onItemSelect: (value) => setValue(value) }) }) }));
72
- const renderAllVariations = (isDark) => _jsx("div", { className: "tw-p-4", children: allAccordions(isDark) });
73
- return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsx(QTip, {}), _jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations()] })] }), _jsxs("div", { className: "tw-dark tw-bg-sq-dark-background tw-grid tw-grid-cols-4 tw-gap-4 tw-py-4", children: [_jsxs("div", { className: "color_topic dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations(true)] }), _jsxs("div", { className: "color_analysis dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations(true)] }), _jsxs("div", { className: "color_datalab dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations(true)] }), _jsxs("div", { className: "color_vantage dark:tw-text-sq-white tw-text-center", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations(true)] })] })] }));
74
- };
75
- //# sourceMappingURL=Accordion.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.stories.tsx"],"names":[],"mappings":"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"}
@@ -1,55 +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 Accordion from './Accordion';
6
- describe('Accordion', () => {
7
- const mockOnItemSelect = jest.fn();
8
- class Context {
9
- testId = 'buttonTestId';
10
- label = 'button label';
11
- props = {
12
- accordionItems: [
13
- {
14
- id: 'item1',
15
- value: 'item1',
16
- trigger: 'Item 1',
17
- content: 'Content 1',
18
- },
19
- {
20
- id: 'item2',
21
- value: 'item2',
22
- trigger: 'Item 2',
23
- content: 'Content 2',
24
- },
25
- ],
26
- defaultValue: 'item1',
27
- value: 'item1',
28
- onItemSelect: (key) => mockOnItemSelect(key),
29
- disabled: false,
30
- extraClassNames: 'extra-class',
31
- testId: this.testId,
32
- };
33
- }
34
- let tc;
35
- beforeEach(() => {
36
- tc = new Context();
37
- });
38
- const renderAccordion = (props) => render(_jsx(Accordion, { ...props }));
39
- it('renders accordion items', () => {
40
- renderAccordion(tc.props);
41
- expect(screen.getByText('Item 1')).toBeInTheDocument();
42
- expect(screen.getByText('Item 2')).toBeInTheDocument();
43
- });
44
- it('renders accordion content', () => {
45
- renderAccordion(tc.props);
46
- expect(screen.getByText('Content 1')).toBeInTheDocument();
47
- expect(screen.queryByText('Content 2')).not.toBeInTheDocument();
48
- });
49
- it('calls onItemSelect when an item is selected', async () => {
50
- renderAccordion(tc.props);
51
- await userEvent.click(screen.getByText('Item 2'));
52
- expect(mockOnItemSelect).toHaveBeenCalledWith('item2');
53
- });
54
- });
55
- //# sourceMappingURL=Accordion.test.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Accordion.test.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.test.tsx"],"names":[],"mappings":";AACA,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AAEpD,OAAO,SAAS,MAAM,aAAa,CAAC;AAGpC,QAAQ,CAAC,WAAW,EAAE,GAAG,EAAE;IACzB,MAAM,gBAAgB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;IACnC,MAAM,OAAO;QACX,MAAM,GAAG,cAAc,CAAC;QACxB,KAAK,GAAG,cAAc,CAAC;QACvB,KAAK,GAAmB;YACtB,cAAc,EAAE;gBACd;oBACE,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,QAAQ;oBACjB,OAAO,EAAE,WAAW;iBACrB;gBACD;oBACE,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,QAAQ;oBACjB,OAAO,EAAE,WAAW;iBACrB;aACF;YACD,YAAY,EAAE,OAAO;YACrB,KAAK,EAAE,OAAO;YACd,YAAY,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,gBAAgB,CAAC,GAAG,CAAC;YAC5C,QAAQ,EAAE,KAAK;YACf,eAAe,EAAE,aAAa;YAC9B,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;KACH;IAED,IAAI,EAAW,CAAC;IAChB,UAAU,CAAC,GAAG,EAAE;QACd,EAAE,GAAG,IAAI,OAAO,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,MAAM,eAAe,GAAG,CAAC,KAAqB,EAAE,EAAE,CAAC,MAAM,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC,CAAC;IAEpF,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;QACjC,eAAe,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QAC1B,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QACvD,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;QACnC,eAAe,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QAC1B,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QAC1D,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC;IAClE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,6CAA6C,EAAE,KAAK,IAAI,EAAE;QAC3D,eAAe,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QAC1B,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;QAClD,MAAM,CAAC,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC;IACzD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=Accordion.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Accordion.types.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.types.ts"],"names":[],"mappings":""}
@@ -1,2 +0,0 @@
1
- export { default } from './Accordion';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC"}
@@ -1,32 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import '../styles.css';
3
- import Icon from '../Icon';
4
- const baseClasses = 'tw-mx-auto tw-p-4 tw-leading-normal tw-outline-none tw-py-2 tw-px-3 tw-rounded-[10px] tw-w-full tw-relative' +
5
- ' tw-border-solid tw-border tw-text-sm tw-flex tw-flex-col tw-justify-center tw-items-center';
6
- const darkTheme = 'dark:tw-bg-sq-colored-hover-dark dark:tw-text-sq-dark-text';
7
- const lightTheme = 'tw-text-sq-text-color tw-bg-sq-colored-hover';
8
- const errorClasses = 'tw-border-sq-danger-color';
9
- const borderColorClasses = 'tw-border-sq-color-dark';
10
- /**
11
- * Alert.
12
- */
13
- export const Alert = ({ children, dismissible = true, onClose, show = true, variant, testId = 'alert-id', id, extraClassNames, ...tooltipProps }) => {
14
- const appliedTheme = {
15
- theme: `${lightTheme} ${darkTheme}`,
16
- danger: 'tw-text-sq-text-color tw-bg-sq-danger-color',
17
- warning: 'tw-bg-sq-bg-warning-color tw-text-sq-text-color',
18
- gray: 'tw-bg-sq-light-gray tw-text-sq-text-color dark:tw-bg-sq-worksheetspanel-gray-dark dark:tw-text-sq-dark-text',
19
- };
20
- const appliedBorderTheme = {
21
- theme: borderColorClasses,
22
- danger: errorClasses,
23
- warning: 'tw-border-none',
24
- gray: 'tw-border-sq-darkish-gray',
25
- };
26
- const appliedClasses = `${baseClasses} ${appliedTheme[variant]} ${extraClassNames} ${appliedBorderTheme[variant]}`;
27
- if (!show) {
28
- return _jsx("div", {});
29
- }
30
- return (_jsxs("div", { "data-testid": testId, id: id, className: appliedClasses, children: [children, dismissible && (_jsx(Icon, { icon: "fc-delete", type: variant.match(/danger|warning/) ? 'color' : 'theme', color: variant.match(/danger|warning/) ? 'inherit' : undefined, extraClassNames: `tw-self-end tw-text-[0.6875rem] tw-cursor-pointer tw-absolute tw-right-[10px] tw-top-[10px] ${variant.match(/danger|warning|gray/) ? 'tw-text-sq-text-color dark:tw-text-sq-dark-text' : ''}`, testId: `${testId}-close-btn`, onClick: onClose, ...tooltipProps }))] }));
31
- };
32
- //# sourceMappingURL=Alert.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/Alert/Alert.tsx"],"names":[],"mappings":";AACA,OAAO,eAAe,CAAC;AACvB,OAAO,IAAI,MAAM,SAAS,CAAC;AAG3B,MAAM,WAAW,GACf,6GAA6G;IAC7G,6FAA6F,CAAC;AAEhG,MAAM,SAAS,GAAG,4DAA4D,CAAC;AAC/E,MAAM,UAAU,GAAG,8CAA8C,CAAC;AAElE,MAAM,YAAY,GAAG,2BAA2B,CAAC;AAEjD,MAAM,kBAAkB,GAAG,yBAAyB,CAAC;AAErD;;GAEG;AACH,MAAM,CAAC,MAAM,KAAK,GAAwC,CAAC,EACzD,QAAQ,EACR,WAAW,GAAG,IAAI,EAClB,OAAO,EACP,IAAI,GAAG,IAAI,EACX,OAAO,EACP,MAAM,GAAG,UAAU,EACnB,EAAE,EACF,eAAe,EACf,GAAG,YAAY,EAChB,EAAE,EAAE;IACH,MAAM,YAAY,GAA0C;QAC1D,KAAK,EAAE,GAAG,UAAU,IAAI,SAAS,EAAE;QACnC,MAAM,EAAE,6CAA6C;QACrD,OAAO,EAAE,iDAAiD;QAC1D,IAAI,EAAE,6GAA6G;KACpH,CAAC;IACF,MAAM,kBAAkB,GAA0C;QAChE,KAAK,EAAE,kBAAkB;QACzB,MAAM,EAAE,YAAY;QACpB,OAAO,EAAE,gBAAgB;QACzB,IAAI,EAAE,2BAA2B;KAClC,CAAC;IACF,MAAM,cAAc,GAAG,GAAG,WAAW,IAAI,YAAY,CAAC,OAAO,CAAC,IAAI,eAAe,IAAI,kBAAkB,CAAC,OAAO,CAAC,EAAE,CAAC;IAEnH,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,OAAO,eAAO,CAAC;IACjB,CAAC;IACD,OAAO,CACL,8BAAkB,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,cAAc,aACxD,QAAQ,EACR,WAAW,IAAI,CACd,KAAC,IAAI,IACH,IAAI,EAAC,WAAW,EAChB,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EACzD,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAC9D,eAAe,EAAE,+FACf,OAAO,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,iDAAiD,CAAC,CAAC,CAAC,EAC7F,EAAE,EACF,MAAM,EAAE,GAAG,MAAM,YAAY,EAC7B,OAAO,EAAE,OAAO,KACZ,YAAY,GAChB,CACH,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -1,57 +0,0 @@
1
- import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
2
- import { Alert } from './Alert';
3
- import { QTip } from '../Tooltip';
4
- const Template = ({ variant }) => {
5
- return (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsxs("h3", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal", children: ["This is a ", variant, " alert, it looks very pleasing and is very useful for showing alerts to the user"] }), _jsx(Alert, { variant: variant, dismissible: true, show: true, extraClassNames: "tw-h-[200px]", tooltip: "This is a small close alert icon", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, children: "This is a dismissible alert, it looks very pleasing and is very useful for showing alerts to the user" }), _jsx(QTip, {})] }));
6
- };
7
- export const ThemedAlert = Template.bind({});
8
- ThemedAlert.args = {
9
- variant: "theme",
10
- };
11
- export const WarningAlert = Template.bind({});
12
- WarningAlert.args = {
13
- variant: "warning",
14
- };
15
- export const DangerAlert = Template.bind({});
16
- DangerAlert.args = {
17
- variant: "danger",
18
- };
19
- export const GrayAlert = Template.bind({});
20
- GrayAlert.args = {
21
- variant: "gray",
22
- };
23
- const colors = ['topic', 'analysis', 'datalab', 'vantage'];
24
- const renderAlert = ({ text, dismissable, variant, }) => (_jsxs("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white", children: [_jsx("p", { className: "tw-mb-5 tw-text-[0.9375rem] tw-leading-normal" }), _jsx(Alert, { variant: variant, dismissible: dismissable, show: true, extraClassNames: "tw-h-[200px]", tooltip: "This is a small close alert icon", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, children: text })] }));
25
- export const AllAlertsVariants = () => {
26
- const renderAllVariations = (color) => (_jsxs("div", { children: [_jsx("div", { className: "tw-p-4", children: renderAlert({
27
- text: 'This is a dismissible alert, it looks very pleasing and is very useful for showing alerts to the user',
28
- dismissable: true,
29
- variant: 'theme',
30
- }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
31
- text: 'This is a non dismissable alert, it looks very pleasing and is very useful for showing alerts to the user',
32
- dismissable: false,
33
- variant: 'theme',
34
- }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
35
- text: 'This is a warning alert, it is used to display a warning',
36
- dismissable: false,
37
- variant: 'warning',
38
- }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
39
- text: 'This is an error alert, it is used to display an error',
40
- dismissable: false,
41
- variant: 'danger',
42
- }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
43
- text: 'This is a gray alert, it is used to display a neutral alert',
44
- dismissable: true,
45
- variant: 'gray',
46
- }) }), _jsx("div", { className: "tw-p-4", children: renderAlert({
47
- text: 'This is an error alert that is dismissible, it is used to display an error',
48
- dismissable: true,
49
- variant: 'danger',
50
- }) })] }, color + '_wrapper'));
51
- return (_jsxs("div", { children: [_jsx(QTip, {}), _jsx("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: colors.map((color) => {
52
- return _jsx("div", { className: `color_${color}`, children: renderAllVariations(color) });
53
- }) }), _jsx("div", { className: "tw-dark tw-bg-sq-dark-background tw-grid tw-grid-cols-4 tw-gap-4", children: colors.map((color) => {
54
- return _jsx("div", { className: `color_${color}`, children: renderAllVariations(color) });
55
- }) })] }));
56
- };
57
- //# sourceMappingURL=Alert.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Alert.stories.js","sourceRoot":"","sources":["../../src/Alert/Alert.stories.tsx"],"names":[],"mappings":"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"}
@@ -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,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,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,89 +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-py-1 tw-px-2.5 tw-rounded-md focus:tw-ring-0 focus-visible:tw-outline-none disabled:tw-pointer-events-none';
13
- const baseClassesByVariant = {
14
- 'outline': 'disabled:tw-opacity-50 tw-border-solid tw-border',
15
- 'theme': 'disabled:tw-opacity-50 tw-border-solid tw-border',
16
- 'danger': 'tw-bg-sq-danger-color hover:tw-bg-sq-danger-color-hover disabled:tw-opacity-50 tw-border-solid tw-border ' +
17
- 'tw-border-sq-danger-color hover:tw-border-sq-danger-color-hover',
18
- 'theme-light': 'disabled:tw-opacity-50 tw-border-solid tw-border',
19
- 'no-border': 'disabled:tw-opacity-50',
20
- 'warning': 'tw-bg-sq-warning-color tw-border-solid tw-border tw-border-sq-warning-color',
21
- };
22
- const textClassesByVariantLightTheme = {
23
- 'outline': 'tw-text-sq-text-color',
24
- 'theme': 'tw-text-white',
25
- 'theme-light': 'tw-text-white',
26
- 'danger': 'tw-text-white',
27
- 'no-border': 'tw-text-sq-text-color',
28
- 'warning': 'tw-text-white',
29
- };
30
- const textClassesByVariantDarkTheme = {
31
- 'outline': 'dark:tw-text-sq-dark-text',
32
- 'theme': 'dark:tw-text-white',
33
- 'theme-light': 'dark:tw-text-white',
34
- 'danger': 'dark:tw-text-white',
35
- 'no-border': 'dark:tw-text-sq-dark-text',
36
- 'warning': 'dark:tw-text-white',
37
- };
38
- const classesByVariantLightTheme = {
39
- 'outline': 'tw-bg-white dark:tw-bg-sq-dark-background tw-border-sq-disabled-gray hover:tw-bg-sq-light-gray' +
40
- ' focus:tw-bg-sq-dark-gray active:tw-bg-sq-dark-gray focus:tw-border-sq-color-dark active:tw-border-sq-color-dark',
41
- 'theme': 'tw-bg-sq-color-dark hover:tw-bg-sq-color-highlight tw-border-sq-color-dark' +
42
- ' hover:tw-border-sq-color-highlight',
43
- 'danger': '',
44
- 'theme-light': 'tw-bg-sq-icon hover:tw-bg-sq-link tw-border-sq-icon hover:tw-border-sq-link',
45
- 'no-border': '',
46
- 'warning': '',
47
- };
48
- const classesByVariantDarkTheme = {
49
- 'outline': 'dark:tw-border-sq-dark-disabled-gray dark:hover:tw-bg-sq-highlight-color-dark' +
50
- ' dark:focus:tw-bg-sq-multi-gray-dark dark:active:tw-bg-sq-multi-gray-dark dark:focus:tw-border-sq-color-dark' +
51
- ' dark:active:tw-border-sq-color-dark',
52
- 'theme': 'dark:tw-bg-sq-color-dark dark:hover:tw-bg-sq-color-highlight dark:tw-border-sq-color-dark' +
53
- ' dark:hover:tw-border-sq-color-highlight',
54
- 'danger': '',
55
- 'theme-light': 'dark:tw-bg-sq-icon-dark dark:hover:tw-bg-sq-link-dark dark:tw-border-sq-icon-dark' +
56
- ' dark:hover:tw-border-sq-link-dark',
57
- 'no-border': '',
58
- 'warning': '',
59
- };
60
- const sizeClasses = {
61
- sm: 'tw-text-sm',
62
- lg: 'tw-text-xl',
63
- };
64
- const appliedClasses = `${baseClasses} ${baseClassesByVariant[variant]} ${sizeClasses[size]} ${classesByVariantLightTheme[variant]} ${classesByVariantDarkTheme[variant]} ${textClassesByVariantLightTheme[variant]} ${textClassesByVariantDarkTheme[variant]} ${extraClassNames}`;
65
- let tooltipData = undefined;
66
- if (tooltip) {
67
- tooltipData = {
68
- 'data-qtip-text': tooltip,
69
- 'data-qtip-placement': tooltipOptions?.position,
70
- 'data-qtip-is-html': isHtmlTooltip,
71
- 'data-qtip-testid': tooltipTestId,
72
- 'data-qtip-delay': tooltipOptions?.delay ?? DEFAULT_TOOL_TIP_DELAY,
73
- };
74
- }
75
- const iconClass = iconPosition === 'left' ? 'tw-mr-1' : 'tw-ml-1';
76
- const iconElement = icon && (_jsx(Icon, { icon: icon, iconPrefix: iconPrefix, type: iconStyle, color: iconColor, extraClassNames: label
77
- ? `${iconClass} ${textClassesByVariantLightTheme[variant]} ${textClassesByVariantDarkTheme[variant]}`
78
- : '', testId: `${id}_spinner` }));
79
- return (_jsxs("button", { id: id, ...tooltipData, disabled: disabled, "data-testid": testId, type: type === 'link' || (type === 'submit' && browserIsFirefox) ? 'button' : type, onClick: (e) => {
80
- stopPropagation && e.stopPropagation();
81
- onClick && onClick(e);
82
- }, onMouseDown: (e) => {
83
- if (preventBlur) {
84
- e.preventDefault();
85
- }
86
- }, className: appliedClasses, children: [iconPosition === 'left' && iconElement, label, iconPosition === 'right' && iconElement] }));
87
- };
88
- export default Button;
89
- //# sourceMappingURL=Button.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -1,25 +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 } from './Button.types';
4
- import { QTip } from '../Tooltip';
5
- export default {
6
- title: 'Button',
7
- };
8
- export const AllButtonVariants = () => {
9
- const renderAllVariations = () => (_jsx(_Fragment, { children: buttonVariants.map((variant) => (_jsxs("div", { className: "tw-grid tw-grid-cols-2 tw-gap-4", children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { label: `Variant: ${variant}`, onClick: () => { }, variant: variant }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { label: `Variant: ${variant}`, onClick: () => { }, variant: variant }) })] }, `{variant_${variant}`))) }));
10
- return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations()] })] }));
11
- };
12
- export const ButtonWithTooltip = () => {
13
- const renderButtonWithTooltip = () => (_jsxs(_Fragment, { children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { tooltip: "Helpful tooltip", variant: "theme", label: "Hover me" }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { tooltip: "Helpful tooltip", variant: "theme", label: "Hover me" }) })] }));
14
- return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsx(QTip, {}), _jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderButtonWithTooltip()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderButtonWithTooltip()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderButtonWithTooltip()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderButtonWithTooltip()] })] }));
15
- };
16
- export const ButtonWithIcon = () => {
17
- const renderButtonWithIcon = () => (_jsxs(_Fragment, { children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { icon: "fc-search-power", variant: "theme", label: "With Icon" }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { icon: "fc-search-power", variant: "theme", label: "With Icon" }) })] }));
18
- const renderButtonWithIconOnRight = () => (_jsxs(_Fragment, { children: [_jsx("div", { className: "tw-p-4", children: _jsx(Button, { icon: "fc-search-power", iconPosition: "right", variant: "theme", label: "With Icon On Right" }) }), _jsx("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: _jsx(Button, { icon: "fc-search-power", iconPosition: "right", variant: "theme", label: "With Icon On Right" }) })] }));
19
- return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderButtonWithIcon()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderButtonWithIcon()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderButtonWithIcon()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderButtonWithIcon()] }), _jsx("div", { className: "color_topic", children: renderButtonWithIconOnRight() }), _jsx("div", { className: "color_analysis", children: renderButtonWithIconOnRight() }), _jsx("div", { className: "color_datalab", children: renderButtonWithIconOnRight() }), _jsx("div", { className: "color_vantage", children: renderButtonWithIconOnRight() })] }));
20
- };
21
- export const DisabledButton = () => {
22
- const renderDisabledButton = () => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "tw-p-4", children: [_jsx(Button, { disabled: true, variant: "theme", label: "Disabled Button" }), _jsx(Button, { extraClassNames: "tw-m-5", disabled: true, label: "Disabled Button" })] }), _jsxs("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: [_jsx(Button, { disabled: true, variant: "theme", label: "Disabled Button" }), _jsx(Button, { extraClassNames: "tw-m-5", disabled: true, label: "Disabled Button" })] })] }));
23
- return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderDisabledButton()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderDisabledButton()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderDisabledButton()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderDisabledButton()] })] }));
24
- };
25
- //# sourceMappingURL=Button.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../src/Button/Button.stories.tsx"],"names":[],"mappings":"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"}