@seeqdev/qomponents 0.0.70 → 0.0.71

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 (165) hide show
  1. package/README.md +135 -135
  2. package/dist/Button/Button.types.d.ts +1 -5
  3. package/dist/Select/Select.types.d.ts +6 -0
  4. package/dist/example/.eslintrc.cjs +14 -14
  5. package/dist/example/README.md +33 -33
  6. package/dist/example/index.html +13 -13
  7. package/dist/example/package.json +30 -30
  8. package/dist/example/src/ComplexSelectExample.tsx +81 -81
  9. package/dist/example/src/Example.tsx +167 -167
  10. package/dist/example/src/index.css +102 -102
  11. package/dist/example/src/main.tsx +10 -10
  12. package/dist/example/src/vite-env.d.ts +1 -1
  13. package/dist/example/tsconfig.json +33 -33
  14. package/dist/example/tsconfig.node.json +12 -12
  15. package/dist/example/vite.config.ts +12 -12
  16. package/dist/index.esm.js +19 -19
  17. package/dist/index.esm.js.map +1 -1
  18. package/dist/index.js +19 -19
  19. package/dist/index.js.map +1 -1
  20. package/dist/styles.css +3281 -3281
  21. package/package.json +83 -83
  22. package/dist/Accordion/Accordion.js +0 -9
  23. package/dist/Accordion/Accordion.js.map +0 -1
  24. package/dist/Accordion/Accordion.stories.js +0 -109
  25. package/dist/Accordion/Accordion.stories.js.map +0 -1
  26. package/dist/Accordion/Accordion.test.js +0 -55
  27. package/dist/Accordion/Accordion.test.js.map +0 -1
  28. package/dist/Accordion/Accordion.types.js +0 -2
  29. package/dist/Accordion/Accordion.types.js.map +0 -1
  30. package/dist/Accordion/index.js +0 -2
  31. package/dist/Accordion/index.js.map +0 -1
  32. package/dist/Button/Button.js +0 -90
  33. package/dist/Button/Button.js.map +0 -1
  34. package/dist/Button/Button.stories.js +0 -85
  35. package/dist/Button/Button.stories.js.map +0 -1
  36. package/dist/Button/Button.test.js +0 -49
  37. package/dist/Button/Button.test.js.map +0 -1
  38. package/dist/Button/Button.types.js +0 -5
  39. package/dist/Button/Button.types.js.map +0 -1
  40. package/dist/Button/index.js +0 -2
  41. package/dist/Button/index.js.map +0 -1
  42. package/dist/ButtonWithDropdown/ButtonWithDropdown.js +0 -60
  43. package/dist/ButtonWithDropdown/ButtonWithDropdown.js.map +0 -1
  44. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js +0 -81
  45. package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js.map +0 -1
  46. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js +0 -72
  47. package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js.map +0 -1
  48. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js +0 -2
  49. package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js.map +0 -1
  50. package/dist/ButtonWithDropdown/index.js +0 -2
  51. package/dist/ButtonWithDropdown/index.js.map +0 -1
  52. package/dist/ButtonWithPopover/ButtonWithPopover.js +0 -52
  53. package/dist/ButtonWithPopover/ButtonWithPopover.js.map +0 -1
  54. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js +0 -72
  55. package/dist/ButtonWithPopover/ButtonWithPopover.stories.js.map +0 -1
  56. package/dist/ButtonWithPopover/ButtonWithPopover.test.js +0 -87
  57. package/dist/ButtonWithPopover/ButtonWithPopover.test.js.map +0 -1
  58. package/dist/ButtonWithPopover/ButtonWithPopover.types.js +0 -2
  59. package/dist/ButtonWithPopover/ButtonWithPopover.types.js.map +0 -1
  60. package/dist/ButtonWithPopover/index.js +0 -2
  61. package/dist/ButtonWithPopover/index.js.map +0 -1
  62. package/dist/Checkbox/Checkbox.js +0 -26
  63. package/dist/Checkbox/Checkbox.js.map +0 -1
  64. package/dist/Checkbox/Checkbox.stories.js +0 -34
  65. package/dist/Checkbox/Checkbox.stories.js.map +0 -1
  66. package/dist/Checkbox/Checkbox.test.js +0 -94
  67. package/dist/Checkbox/Checkbox.test.js.map +0 -1
  68. package/dist/Checkbox/Checkbox.types.js +0 -2
  69. package/dist/Checkbox/Checkbox.types.js.map +0 -1
  70. package/dist/Checkbox/index.js +0 -2
  71. package/dist/Checkbox/index.js.map +0 -1
  72. package/dist/Icon/Icon.js +0 -55
  73. package/dist/Icon/Icon.js.map +0 -1
  74. package/dist/Icon/Icon.stories.js +0 -41
  75. package/dist/Icon/Icon.stories.js.map +0 -1
  76. package/dist/Icon/Icon.test.js +0 -55
  77. package/dist/Icon/Icon.test.js.map +0 -1
  78. package/dist/Icon/Icon.types.js +0 -16
  79. package/dist/Icon/Icon.types.js.map +0 -1
  80. package/dist/Icon/index.js +0 -2
  81. package/dist/Icon/index.js.map +0 -1
  82. package/dist/Modal/Modal.js +0 -99
  83. package/dist/Modal/Modal.js.map +0 -1
  84. package/dist/Modal/Modal.stories.js +0 -176
  85. package/dist/Modal/Modal.stories.js.map +0 -1
  86. package/dist/Modal/Modal.test.js +0 -108
  87. package/dist/Modal/Modal.test.js.map +0 -1
  88. package/dist/Modal/Modal.types.js +0 -2
  89. package/dist/Modal/Modal.types.js.map +0 -1
  90. package/dist/Modal/index.js +0 -2
  91. package/dist/Modal/index.js.map +0 -1
  92. package/dist/Select/Select.js +0 -168
  93. package/dist/Select/Select.js.map +0 -1
  94. package/dist/Select/Select.stories.js +0 -72
  95. package/dist/Select/Select.stories.js.map +0 -1
  96. package/dist/Select/Select.test.js +0 -161
  97. package/dist/Select/Select.test.js.map +0 -1
  98. package/dist/Select/Select.types.js +0 -2
  99. package/dist/Select/Select.types.js.map +0 -1
  100. package/dist/Select/index.js +0 -2
  101. package/dist/Select/index.js.map +0 -1
  102. package/dist/Tabs/Tabs.js +0 -22
  103. package/dist/Tabs/Tabs.js.map +0 -1
  104. package/dist/Tabs/Tabs.stories.js +0 -91
  105. package/dist/Tabs/Tabs.stories.js.map +0 -1
  106. package/dist/Tabs/Tabs.test.js +0 -91
  107. package/dist/Tabs/Tabs.test.js.map +0 -1
  108. package/dist/Tabs/Tabs.types.js +0 -2
  109. package/dist/Tabs/Tabs.types.js.map +0 -1
  110. package/dist/Tabs/index.js +0 -2
  111. package/dist/Tabs/index.js.map +0 -1
  112. package/dist/TextArea/TextArea.js +0 -23
  113. package/dist/TextArea/TextArea.js.map +0 -1
  114. package/dist/TextArea/TextArea.stories.js +0 -39
  115. package/dist/TextArea/TextArea.stories.js.map +0 -1
  116. package/dist/TextArea/TextArea.test.js +0 -68
  117. package/dist/TextArea/TextArea.test.js.map +0 -1
  118. package/dist/TextArea/TextArea.types.js +0 -2
  119. package/dist/TextArea/TextArea.types.js.map +0 -1
  120. package/dist/TextArea/index.js +0 -2
  121. package/dist/TextArea/index.js.map +0 -1
  122. package/dist/TextField/TextField.js +0 -64
  123. package/dist/TextField/TextField.js.map +0 -1
  124. package/dist/TextField/TextField.stories.js +0 -41
  125. package/dist/TextField/TextField.stories.js.map +0 -1
  126. package/dist/TextField/TextField.test.js +0 -35
  127. package/dist/TextField/TextField.test.js.map +0 -1
  128. package/dist/TextField/TextField.types.js +0 -2
  129. package/dist/TextField/TextField.types.js.map +0 -1
  130. package/dist/TextField/index.js +0 -2
  131. package/dist/TextField/index.js.map +0 -1
  132. package/dist/ToolbarButton/ToolbarButton.js +0 -73
  133. package/dist/ToolbarButton/ToolbarButton.js.map +0 -1
  134. package/dist/ToolbarButton/ToolbarButton.stories.js +0 -89
  135. package/dist/ToolbarButton/ToolbarButton.stories.js.map +0 -1
  136. package/dist/ToolbarButton/ToolbarButton.test.js +0 -93
  137. package/dist/ToolbarButton/ToolbarButton.test.js.map +0 -1
  138. package/dist/ToolbarButton/ToolbarButton.types.js +0 -2
  139. package/dist/ToolbarButton/ToolbarButton.types.js.map +0 -1
  140. package/dist/ToolbarButton/index.js +0 -2
  141. package/dist/ToolbarButton/index.js.map +0 -1
  142. package/dist/Tooltip/QTip.stories.js +0 -40
  143. package/dist/Tooltip/QTip.stories.js.map +0 -1
  144. package/dist/Tooltip/QTip.types.js +0 -2
  145. package/dist/Tooltip/QTip.types.js.map +0 -1
  146. package/dist/Tooltip/QTipPerformance.stories.js +0 -30
  147. package/dist/Tooltip/QTipPerformance.stories.js.map +0 -1
  148. package/dist/Tooltip/Qtip.js +0 -154
  149. package/dist/Tooltip/Qtip.js.map +0 -1
  150. package/dist/Tooltip/Tooltip.js +0 -36
  151. package/dist/Tooltip/Tooltip.js.map +0 -1
  152. package/dist/Tooltip/Tooltip.stories.js +0 -32
  153. package/dist/Tooltip/Tooltip.stories.js.map +0 -1
  154. package/dist/Tooltip/Tooltip.types.js +0 -3
  155. package/dist/Tooltip/Tooltip.types.js.map +0 -1
  156. package/dist/Tooltip/TooltipPerformance.stories.js +0 -30
  157. package/dist/Tooltip/TooltipPerformance.stories.js.map +0 -1
  158. package/dist/Tooltip/index.js +0 -3
  159. package/dist/Tooltip/index.js.map +0 -1
  160. package/dist/Tooltip/qTip.utilities.js +0 -11
  161. package/dist/Tooltip/qTip.utilities.js.map +0 -1
  162. package/dist/types.js +0 -2
  163. package/dist/types.js.map +0 -1
  164. package/dist/utils/browserId.js +0 -29
  165. package/dist/utils/browserId.js.map +0 -1
@@ -1,176 +0,0 @@
1
- import React, { useEffect, useState } from 'react';
2
- import Modal from './Modal';
3
- import Button from '../Button';
4
- export default {
5
- title: 'Modal',
6
- };
7
- const modalBody = React.createElement("div", null, "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.");
8
- const ModalComponent = ({ bodyClass = '', title: originalTitle, titleIcon, isTitleEditable, children, hideCloseIcon, disableSubmitButton, size, buttonLabel = 'Open Modal', customButton, customButtonLabel, }) => {
9
- const [open, setOpen] = useState(false);
10
- const [title, setTitle] = useState(originalTitle);
11
- useEffect(() => {
12
- return () => {
13
- document.body.className = '';
14
- };
15
- }, []);
16
- const onClose = () => {
17
- document.body.className = '';
18
- setOpen(false);
19
- };
20
- return (React.createElement("div", { className: "tw-p-4" },
21
- React.createElement(Button, { onClick: () => {
22
- document.body.className = bodyClass;
23
- setOpen(true);
24
- }, label: buttonLabel }),
25
- React.createElement(Modal, { open: open, onClose: onClose, title: title, titleIcon: titleIcon, isTitleEditable: isTitleEditable, onTitleChanged: (event) => setTitle(event.target.value), hideCloseIcon: hideCloseIcon, disableSubmitButton: disableSubmitButton, size: size, customButton: customButton, customButtonLabel: customButtonLabel }, children)));
26
- };
27
- export const AllModalsVariants = () => (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
28
- React.createElement("div", null,
29
- React.createElement("b", null, "Topic Colors"),
30
- React.createElement("div", { className: "tw-p-4 light" },
31
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "xs", buttonLabel: "Open xsmall size modal" }),
32
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "sm", buttonLabel: "Open small size modal" }),
33
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "md", buttonLabel: "Open medium size modal" }),
34
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "lg", buttonLabel: "Open large size modal" }),
35
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "xl", buttonLabel: "Open xl size modal" }),
36
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "2xl", buttonLabel: "Open 2xl size modal" }),
37
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "3xl", buttonLabel: "Open 3xl size modal" }),
38
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "4xl", buttonLabel: "Open 4xl size modal" }),
39
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "5xl", buttonLabel: "Open 5xl size modal" }),
40
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal example", children: modalBody, size: "6xl", buttonLabel: "Open 6xl size modal" })),
41
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
42
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "xs", buttonLabel: "Open xsmall size modal" }),
43
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "sm", buttonLabel: "Open small size modal" }),
44
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "md", buttonLabel: "Open medium size modal" }),
45
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "lg", buttonLabel: "Open large size modal" }),
46
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "xl", buttonLabel: "Open xl size modal" }),
47
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "2xl", buttonLabel: "Open 2xl size modal" }),
48
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "3xl", buttonLabel: "Open 3xl size modal" }),
49
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "4xl", buttonLabel: "Open 4xl size modal" }),
50
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "5xl", buttonLabel: "Open 5xl size modal" }),
51
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "6xl", buttonLabel: "Open 6xl size modal" }))),
52
- React.createElement("div", null,
53
- React.createElement("b", null, "Analysis Colors"),
54
- React.createElement("div", { className: "tw-p-4 light" },
55
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "xs", buttonLabel: "Open xsmall size modal" }),
56
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "sm", buttonLabel: "Open small size modal" }),
57
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "md", buttonLabel: "Open medium size modal" }),
58
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "lg", buttonLabel: "Open large size modal" }),
59
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "xl", buttonLabel: "Open xl size modal" }),
60
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "2xl", buttonLabel: "Open 2xl size modal" }),
61
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "3xl", buttonLabel: "Open 3xl size modal" }),
62
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "4xl", buttonLabel: "Open 4xl size modal" }),
63
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "5xl", buttonLabel: "Open 5xl size modal" }),
64
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal example", children: modalBody, size: "6xl", buttonLabel: "Open 6xl size modal" })),
65
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
66
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "xs", buttonLabel: "Open xsmall size modal" }),
67
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "sm", buttonLabel: "Open small size modal" }),
68
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "md", buttonLabel: "Open medium size modal" }),
69
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "lg", buttonLabel: "Open large size modal" }),
70
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "xl", buttonLabel: "Open xl size modal" }),
71
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "2xl", buttonLabel: "Open 2xl size modal" }),
72
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "3xl", buttonLabel: "Open 3xl size modal" }),
73
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "4xl", buttonLabel: "Open 4xl size modal" }),
74
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "5xl", buttonLabel: "Open 5xl size modal" }),
75
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "6xl", buttonLabel: "Open 6xl size modal" }))),
76
- React.createElement("div", null,
77
- React.createElement("b", null, "Datalab Colors"),
78
- React.createElement("div", { className: "tw-p-4 light" },
79
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "xs", buttonLabel: "Open xsmall size modal" }),
80
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "sm", buttonLabel: "Open small size modal" }),
81
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "md", buttonLabel: "Open medium size modal" }),
82
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "lg", buttonLabel: "Open large size modal" }),
83
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "xl", buttonLabel: "Open xl size modal" }),
84
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "2xl", buttonLabel: "Open 2xl size modal" }),
85
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "3xl", buttonLabel: "Open 3xl size modal" }),
86
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "4xl", buttonLabel: "Open 4xl size modal" }),
87
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "5xl", buttonLabel: "Open 5xl size modal" }),
88
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal example", children: modalBody, size: "6xl", buttonLabel: "Open 6xl size modal" })),
89
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
90
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "xs", buttonLabel: "Open xsmall size modal" }),
91
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "sm", buttonLabel: "Open small size modal" }),
92
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "md", buttonLabel: "Open medium size modal" }),
93
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "lg", buttonLabel: "Open large size modal" }),
94
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "xl", buttonLabel: "Open xl size modal" }),
95
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "2xl", buttonLabel: "Open 2xl size modal" }),
96
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "3xl", buttonLabel: "Open 3xl size modal" }),
97
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "4xl", buttonLabel: "Open 4xl size modal" }),
98
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "5xl", buttonLabel: "Open 5xl size modal" }),
99
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal example", children: modalBody, size: "6xl", buttonLabel: "Open 6xl size modal" })))));
100
- export const ModalsWithDisabledSubmit = () => (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
101
- React.createElement("div", null,
102
- React.createElement("b", null, "Topic Colors"),
103
- React.createElement("div", { className: "tw-p-4 light" },
104
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Disabled submit button example", disableSubmitButton: true, children: modalBody })),
105
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
106
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Disabled submit button example", disableSubmitButton: true, children: modalBody }))),
107
- React.createElement("div", null,
108
- React.createElement("b", null, "Analysis Colors"),
109
- React.createElement("div", { className: "tw-p-4 light" },
110
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Disabled submit button example", disableSubmitButton: true, children: modalBody })),
111
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
112
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Disabled submit button example", disableSubmitButton: true, children: modalBody }))),
113
- React.createElement("div", null,
114
- React.createElement("b", null, "Datalab Colors"),
115
- React.createElement("div", { className: "tw-p-4 light" },
116
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Disabled submit button example", disableSubmitButton: true, children: modalBody })),
117
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
118
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Disabled submit button example", disableSubmitButton: true, children: modalBody })))));
119
- export const ModalsWithEditableTitle = () => (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
120
- React.createElement("div", null,
121
- React.createElement("b", null, "Topic Colors"),
122
- React.createElement("div", { className: "tw-p-4 light" },
123
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Editable title example", isTitleEditable: true, titleIcon: "fc-check", children: modalBody, hideCloseIcon: true })),
124
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
125
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Editable title example", titleIcon: "fc-check", isTitleEditable: true, children: modalBody, hideCloseIcon: true }))),
126
- React.createElement("div", null,
127
- React.createElement("b", null, "Analysis Colors"),
128
- React.createElement("div", { className: "tw-p-4 light" },
129
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Editable title example", isTitleEditable: true, titleIcon: "fc-check", children: modalBody, hideCloseIcon: true })),
130
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
131
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Editable title example", titleIcon: "fc-check", isTitleEditable: true, children: modalBody, hideCloseIcon: true }))),
132
- React.createElement("div", null,
133
- React.createElement("b", null, "Datalab Colors"),
134
- React.createElement("div", { className: "tw-p-4 light" },
135
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Editable title example", isTitleEditable: true, titleIcon: "fc-check", children: modalBody, hideCloseIcon: true })),
136
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
137
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Editable title example", titleIcon: "fc-check", isTitleEditable: true, children: modalBody, hideCloseIcon: true })))));
138
- export const ModalsWithIcon = () => (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
139
- React.createElement("div", null,
140
- React.createElement("b", null, "Topic Colors"),
141
- React.createElement("div", { className: "tw-p-4 light" },
142
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal title with icon example", titleIcon: "fc-check", children: modalBody })),
143
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
144
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal title with example", titleIcon: "fc-circle_info", children: modalBody }))),
145
- React.createElement("div", null,
146
- React.createElement("b", null, "Analysis Colors"),
147
- React.createElement("div", { className: "tw-p-4 light" },
148
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal title with example", titleIcon: "fc-check", children: modalBody })),
149
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
150
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal title with example", titleIcon: "fc-circle_info", children: modalBody }))),
151
- React.createElement("div", null,
152
- React.createElement("b", null, "Datalab Colors"),
153
- React.createElement("div", { className: "tw-p-4 light" },
154
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal title with example", titleIcon: "fc-check", children: modalBody })),
155
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
156
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal title with example", titleIcon: "fc-circle_info", children: modalBody })))));
157
- export const ModalsWithCustomButton = () => (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
158
- React.createElement("div", null,
159
- React.createElement("b", null, "Topic Colors"),
160
- React.createElement("div", { className: "tw-p-4 light" },
161
- React.createElement(ModalComponent, { bodyClass: "color_topic", title: "Modal with custom button", children: modalBody, customButton: true, customButtonLabel: "Back" })),
162
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
163
- React.createElement(ModalComponent, { bodyClass: "color_topic tw-dark color_analysis_dark", title: "Modal with custom button", children: modalBody, customButton: true, customButtonLabel: "Back" }))),
164
- React.createElement("div", null,
165
- React.createElement("b", null, "Analysis Colors"),
166
- React.createElement("div", { className: "tw-p-4 light" },
167
- React.createElement(ModalComponent, { bodyClass: "color_analysis", title: "Modal with custom button", children: modalBody, customButton: true, customButtonLabel: "Back" })),
168
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
169
- React.createElement(ModalComponent, { bodyClass: "color_analysis tw-dark color_analysis_dark", title: "Modal with custom button", children: modalBody, customButton: true, customButtonLabel: "Back" }))),
170
- React.createElement("div", null,
171
- React.createElement("b", null, "Datalab Colors"),
172
- React.createElement("div", { className: "tw-p-4 light" },
173
- React.createElement(ModalComponent, { bodyClass: "color_datalab", title: "Modal with custom button", children: modalBody, customButton: true, customButtonLabel: "Back" })),
174
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
175
- React.createElement(ModalComponent, { bodyClass: "color_datalab tw-dark color_analysis_dark", title: "Modal with custom button", children: modalBody, customButton: true, customButtonLabel: "Back" })))));
176
- //# sourceMappingURL=Modal.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Modal.stories.js","sourceRoot":"","sources":["../../src/Modal/Modal.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,MAAM,MAAM,WAAW,CAAC;AAG/B,eAAe;IACb,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,SAAS,GAAG,kmBAKc,CAAC;AAQjC,MAAM,cAAc,GAAiD,CAAC,EACpE,SAAS,GAAG,EAAE,EACd,KAAK,EAAE,aAAa,EACpB,SAAS,EACT,eAAe,EACf,QAAQ,EACR,aAAa,EACb,mBAAmB,EACnB,IAAI,EACJ,WAAW,GAAG,YAAY,EAC1B,YAAY,EACZ,iBAAiB,GAClB,EAAE,EAAE;IACH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;QAC/B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,QAAQ,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;QAC7B,OAAO,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,CACL,6BAAK,SAAS,EAAC,QAAQ;QACrB,oBAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE;gBACpB,QAAQ,CAAC,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;gBACpC,OAAO,CAAC,IAAI,CAAC,CAAC;YAChB,CAAC,EAAE,KAAK,EAAE,WAAW,GAAI;QACzB,oBAAC,KAAK,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EACrE,eAAe,EAAE,eAAe,EAAE,cAAc,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACzF,aAAa,EAAE,aAAa,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY,EAC9G,iBAAiB,EAAE,iBAAiB,IACnC,QAAQ,CACH,CACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAA4B,GAAG,EAAE,CAAC,CAC9D,6BAAK,SAAS,EAAC,iCAAiC;IAC9C;QACE,8CAAmB;QACnB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC1F,WAAW,EAAC,wBAAwB,GAAG;YACzC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC1F,WAAW,EAAC,uBAAuB,GAAG;YACxC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC1F,WAAW,EAAC,wBAAwB,GAAG;YACzC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC1F,WAAW,EAAC,uBAAuB,GAAG;YACxC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC1F,WAAW,EAAC,oBAAoB,GAAG;YACrC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC3F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC3F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC3F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC3F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC3F,WAAW,EAAC,qBAAqB,GAAG,CAClC;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,wBAAwB,GAAG;YACxE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,uBAAuB,GAAG;YACvE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,wBAAwB,GAAG;YACxE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,uBAAuB,GAAG;YACvE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,oBAAoB,GAAG;YACpE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,eAAe,EACvF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG,CAClE,CACF;IAEN;QACE,iDAAsB;QACtB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC7F,WAAW,EAAC,wBAAwB,GAAG;YACzC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC7F,WAAW,EAAC,uBAAuB,GAAG;YACxC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC7F,WAAW,EAAC,wBAAwB,GAAG;YACzC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC7F,WAAW,EAAC,uBAAuB,GAAG;YACxC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC7F,WAAW,EAAC,oBAAoB,GAAG;YACrC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC9F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC9F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC9F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC9F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC9F,WAAW,EAAC,qBAAqB,GAAG,CAClC;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,wBAAwB,GAAG;YACxE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,uBAAuB,GAAG;YACvE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,wBAAwB,GAAG;YACxE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,uBAAuB,GAAG;YACvE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,oBAAoB,GAAG;YACpE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,eAAe,EAC1F,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG,CAClE,CACF;IAEN;QACE,gDAAqB;QACrB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC5F,WAAW,EAAC,wBAAwB,GAAG;YACzC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC5F,WAAW,EAAC,uBAAuB,GAAG;YACxC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC5F,WAAW,EAAC,wBAAwB,GAAG;YACzC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC5F,WAAW,EAAC,uBAAuB,GAAG;YACxC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAC5F,WAAW,EAAC,oBAAoB,GAAG;YACrC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC7F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC7F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC7F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC7F,WAAW,EAAC,qBAAqB,GAAG;YACtC,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAC7F,WAAW,EAAC,qBAAqB,GAAG,CAClC;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,wBAAwB,GAAG;YACxE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,uBAAuB,GAAG;YACvE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,wBAAwB,GAAG;YACxE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,uBAAuB,GAAG;YACvE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,oBAAoB,GAAG;YACpE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG;YACtE,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,eAAe,EACzF,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAC,KAAK,EAAC,WAAW,EAAC,qBAAqB,GAAG,CAClE,CACF,CACF,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAA4B,GAAG,EAAE,CAAC,CACrE,6BAAK,SAAS,EAAC,iCAAiC;IAC9C;QACE,8CAAmB;QACnB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,gCAAgC,EAAC,mBAAmB,EAAE,IAAI,EACtG,QAAQ,EAAE,SAAS,GAAI,CACrB;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,gCAAgC,EACxG,mBAAmB,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,GAAI,CAChD,CACF;IAEN;QACE,iDAAsB;QACtB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,gCAAgC,EAAC,mBAAmB,EAAE,IAAI,EACzG,QAAQ,EAAE,SAAS,GAAI,CACrB;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,gCAAgC,EAC3G,mBAAmB,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,GAAI,CAChD,CACF;IAEN;QACE,gDAAqB;QACrB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,gCAAgC,EAAC,mBAAmB,EAAE,IAAI,EACxG,QAAQ,EAAE,SAAS,GAAI,CACrB;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,gCAAgC,EAC1G,mBAAmB,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,GAAI,CAChD,CACF,CACF,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAA4B,GAAG,EAAE,CAAC,CACpE,6BAAK,SAAS,EAAC,iCAAiC;IAC9C;QACE,8CAAmB;QACnB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,wBAAwB,EAAC,eAAe,EAAE,IAAI,EAC1F,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAE,SAAS,EAAE,aAAa,SAAG,CACxD;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,wBAAwB,EAChG,SAAS,EAAC,UAAU,EAAC,eAAe,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,SAAG,CAC/E,CACF;IAEN;QACE,iDAAsB;QACtB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,wBAAwB,EAAC,eAAe,EAAE,IAAI,EAC7F,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAE,SAAS,EAAE,aAAa,SAAG,CACxD;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,wBAAwB,EACnG,SAAS,EAAC,UAAU,EAAC,eAAe,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,SAAG,CAC/E,CACF;IAEN;QACE,gDAAqB;QACrB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,wBAAwB,EAAC,eAAe,EAAE,IAAI,EAC5F,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAE,SAAS,EAAE,aAAa,SAAG,CACxD;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,wBAAwB,EAClG,SAAS,EAAC,UAAU,EAAC,eAAe,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,SAAG,CAC/E,CACF,CACF,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAA4B,GAAG,EAAE,CAAC,CAC3D,6BAAK,SAAS,EAAC,iCAAiC;IAC9C;QACE,8CAAmB;QACnB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,+BAA+B,EAC3E,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAE,SAAS,GAAI,CAC1C;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,0BAA0B,EAClG,SAAS,EAAC,gBAAgB,EAAC,QAAQ,EAAE,SAAS,GAAI,CAChD,CACF;IAEN;QACE,iDAAsB;QACtB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,0BAA0B,EACzE,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAE,SAAS,GAAI,CAC1C;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,0BAA0B,EACrG,SAAS,EAAC,gBAAgB,EAAC,QAAQ,EAAE,SAAS,GAAI,CAChD,CACF;IAEN;QACE,gDAAqB;QACrB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,0BAA0B,EACxE,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAE,SAAS,GAAI,CAC1C;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,0BAA0B,EACpG,SAAS,EAAC,gBAAgB,EAAC,QAAQ,EAAE,SAAS,GAAI,CAChD,CACF,CACF,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAA4B,GAAG,EAAE,CAAC,CACnE,6BAAK,SAAS,EAAC,iCAAiC;IAC9C;QACE,8CAAmB;QACnB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAC,0BAA0B,EACtE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,iBAAiB,EAAC,MAAM,GAAG,CAClE;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,EAAC,KAAK,EAAC,0BAA0B,EAClG,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,iBAAiB,EAAC,MAAM,GAAG,CAClE,CACF;IAEN;QACE,iDAAsB;QACtB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAC,0BAA0B,EACzE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,iBAAiB,EAAC,MAAM,GAAG,CAClE;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,4CAA4C,EAAC,KAAK,EAAC,0BAA0B,EACrG,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,iBAAiB,EAAC,MAAM,GAAG,CAClE,CACF;IAEN;QACE,gDAAqB;QACrB,6BAAK,SAAS,EAAC,cAAc;YAC3B,oBAAC,cAAc,IAAC,SAAS,EAAC,eAAe,EAAC,KAAK,EAAC,0BAA0B,EACxE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,iBAAiB,EAAC,MAAM,GAAG,CAClE;QACN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,oBAAC,cAAc,IAAC,SAAS,EAAC,2CAA2C,EAAC,KAAK,EAAC,0BAA0B,EACpG,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,iBAAiB,EAAC,MAAM,GAAG,CAClE,CACF,CACF,CACP,CAAC"}
@@ -1,108 +0,0 @@
1
- import React from 'react';
2
- import '@testing-library/jest-dom';
3
- import { render, screen } from '@testing-library/react';
4
- import userEvent from '@testing-library/user-event';
5
- import Modal from './Modal';
6
- describe('Modal', () => {
7
- class Context {
8
- props = {
9
- onTitleChanged: jest.fn(),
10
- disableSubmitButton: false,
11
- title: 'Testing Modal Dialog',
12
- children: React.createElement("div", null, "Modal content"),
13
- open: true,
14
- };
15
- }
16
- let tc;
17
- beforeEach(() => {
18
- tc = new Context();
19
- });
20
- const renderModal = (props) => render(React.createElement(Modal, { ...props }));
21
- describe('renders Modal', () => {
22
- it('doesn\'t render the modal if the open state is false', () => {
23
- const open = false;
24
- renderModal({ ...tc.props, open });
25
- expect(screen.queryByTestId('modal')).not.toBeInTheDocument();
26
- });
27
- it('renders the modal if the open state is true', () => {
28
- renderModal(tc.props);
29
- expect(screen.getByTestId('modal')).toBeInTheDocument();
30
- expect(screen.getByTestId('modal')).toHaveClass('tw-max-w-xl');
31
- });
32
- it('calls onClose modal when close button is clicked', async () => {
33
- const onClose = jest.fn();
34
- const { getByTestId } = renderModal({ ...tc.props, onClose });
35
- expect(screen.getByTestId('modal')).toBeInTheDocument();
36
- await userEvent.click(getByTestId('closeButton'));
37
- expect(onClose).toHaveBeenCalled();
38
- });
39
- it('hides close button', () => {
40
- const hideCloseIcon = true;
41
- const { queryByTestId } = renderModal({ ...tc.props, hideCloseIcon });
42
- expect(queryByTestId('closeButton')).not.toBeInTheDocument();
43
- });
44
- it('renders modal size based on the size prop', () => {
45
- const size = 'lg';
46
- renderModal({ ...tc.props, size });
47
- expect(screen.getByTestId('modal')).toHaveClass('tw-max-w-lg');
48
- });
49
- it('renders not editable title', () => {
50
- renderModal(tc.props);
51
- expect(screen.getByTestId('modalTitle')).not.toHaveAttribute('value');
52
- });
53
- it('renders editable title', () => {
54
- const isTitleEditable = true;
55
- const { getByTestId } = renderModal({ ...tc.props, isTitleEditable });
56
- expect(getByTestId('modalTitle')).toHaveAttribute('value');
57
- });
58
- it('calls onChange when title is modified', async () => {
59
- const isTitleEditable = true;
60
- const { getByTestId } = renderModal({ ...tc.props, isTitleEditable });
61
- await userEvent.type(getByTestId('modalTitle'), 'a');
62
- expect(tc.props.onTitleChanged).toHaveBeenCalled();
63
- });
64
- it('displays icon title', () => {
65
- const titleIcon = 'fc-check';
66
- const { getByTestId } = renderModal({ ...tc.props, titleIcon });
67
- expect(getByTestId('modalTitleIcon')).toBeInTheDocument();
68
- });
69
- it('calls onSubmit when submit button is clicked', async () => {
70
- const onSubmit = jest.fn();
71
- const { getByTestId } = renderModal({ ...tc.props, onSubmit });
72
- expect(getByTestId('submitButton')).not.toBeDisabled();
73
- await userEvent.click(getByTestId('submitButton'));
74
- expect(onSubmit).toHaveBeenCalled();
75
- });
76
- it('displays the disabled submit button', async () => {
77
- const onSubmit = jest.fn();
78
- const disableSubmitButton = true;
79
- const { getByTestId } = renderModal({ ...tc.props, onSubmit, disableSubmitButton });
80
- expect(getByTestId('submitButton')).toBeDisabled();
81
- await userEvent.click(getByTestId('submitButton'));
82
- expect(onSubmit).not.toHaveBeenCalled();
83
- });
84
- it('calls onClose when cancel button is clicked', async () => {
85
- const onClose = jest.fn();
86
- const { getByTestId } = renderModal({ ...tc.props, onClose });
87
- expect(getByTestId('cancelButton')).not.toBeDisabled();
88
- await userEvent.click(getByTestId('cancelButton'));
89
- expect(onClose).toHaveBeenCalled();
90
- });
91
- it('displays custom button', () => {
92
- const customButton = true;
93
- const customButtonLabel = 'Back';
94
- const { getByTestId } = renderModal({ ...tc.props, customButton, customButtonLabel });
95
- expect(getByTestId('customButton')).toBeInTheDocument();
96
- });
97
- it('calls onClickCustomButton when custom button is clicked', async () => {
98
- const customButton = true;
99
- const customButtonLabel = 'Back';
100
- const onClickCustomButton = jest.fn();
101
- const { getByTestId } = renderModal({ ...tc.props, customButtonLabel, customButton, onClickCustomButton });
102
- expect(getByTestId('customButton')).toBeInTheDocument();
103
- await userEvent.click(getByTestId('customButton'));
104
- expect(onClickCustomButton).toHaveBeenCalled();
105
- });
106
- });
107
- });
108
- //# sourceMappingURL=Modal.test.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Modal.test.js","sourceRoot":"","sources":["../../src/Modal/Modal.test.tsx"],"names":[],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=Modal.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Modal.types.js","sourceRoot":"","sources":["../../src/Modal/Modal.types.ts"],"names":[],"mappings":""}
@@ -1,2 +0,0 @@
1
- export { default } from './Modal';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC"}
@@ -1,168 +0,0 @@
1
- import React from 'react';
2
- import '../styles.css';
3
- import { createFilter, default as ReactSelect } from 'react-select';
4
- import CreatableSelect from 'react-select/creatable';
5
- const baseClasses = ['focus:tw-ring-0', 'disabled:tw-cursor-not-allowed'].join(' ');
6
- const containerStyles = ['tw-bg-white', 'dark:tw-bg-sq-dark-background'].join(' ');
7
- const errorClasses = 'tw-border-sq-danger-color';
8
- const borderColorClasses = ['tw-border-sq-disabled-gray', 'dark:tw-border-sq-dark-disabled-gray'].join(' ');
9
- const borderStyles = [
10
- 'tw-border-solid',
11
- 'tw-border',
12
- 'hover:tw-border-sq-color-dark',
13
- 'focus:tw-border-sq-color-dark',
14
- 'active:tw-border-sq-color-dark',
15
- 'dark:hover:tw-border-sq-color-dark-dark',
16
- 'dark:focus:tw-border-sq-color-dark-dark',
17
- 'dark:active:tw-border-sq-color-dark-dark',
18
- ].join(' ');
19
- const textStyles = ['tw-text-sq-text-color', 'dark:tw-text-sq-dark-text', 'tw-text-sm'].join(' ');
20
- const textActiveStyles = [
21
- 'hover:tw-text-sq-color-dark',
22
- 'focus:tw-text-sq-color-dark',
23
- 'active:tw-text-sq-color-dark',
24
- 'dark:tw-text-sq-dark-disabled-gray',
25
- 'dark:hover:tw-text-sq-color-dark-dark',
26
- 'dark:focus:tw-text-sq-color-dark-dark',
27
- 'dark:active:tw-text-sq-color-dark-dark',
28
- ].join(' ');
29
- const menuStyles = [
30
- 'tw-border-solid',
31
- 'tw-border',
32
- 'tw-rounded-b',
33
- 'tw-border-sq-disabled-gray',
34
- 'dark:tw-border-sq-dark-disabled-gray',
35
- 'tw-whitespace-nowrap',
36
- 'tw-min-w-fit',
37
- '!tw-z-[9999]',
38
- ].join(' ');
39
- const menuListStyles = [
40
- 'tw-rounded-b',
41
- 'tw-bg-white',
42
- 'dark:tw-bg-sq-dark-background',
43
- 'tw-min-w-fit',
44
- '!tw-z-[9999]',
45
- 'specSelectMenu',
46
- ].join(' ');
47
- const groupHeadingStyles = [
48
- 'tw-bg-sq-light-gray',
49
- 'dark:tw-bg-sq-dark-disabled-gray',
50
- 'tw-text-sq-darkish-gray',
51
- 'tw-py-1',
52
- 'tw-px-2.5',
53
- 'specSelectGroupHeading',
54
- ].join(' ');
55
- const optionStyles = [
56
- 'hover:tw-bg-sq-gray-highlight',
57
- 'hover:tw-cursor-pointer',
58
- 'dark:hover:tw-bg-sq-gray-highlight-dark',
59
- 'tw-py-1',
60
- 'tw-px-2.5',
61
- 'specSelectOption',
62
- ].join(' ');
63
- const disabledClasses = ['tw-bg-sq-field-disabled-gray', 'tw-cursor-not-allowed'].join(' ');
64
- const dropDownIndicatorStyles = `tw-text-sq-disabled-gray ${textActiveStyles} specOpenIt`;
65
- const placeholderStyles = ['tw-text-gray-400', 'dark:tw-text-sq-dark-text-lighter', 'specOpenSelect'].join(' ');
66
- const multiValueStyles = [
67
- 'tw-bg-sq-disabled-gray',
68
- 'dark:tw-bg-sq-multi-gray-dark',
69
- 'tw-text-sm',
70
- 'tw-py-0.5',
71
- 'tw-px-1',
72
- 'tw-m-0.5',
73
- 'tw-rounded-sm',
74
- 'specOpenSelect',
75
- ].join(' ');
76
- /**
77
- * Select Component
78
- * - based on react-select (https://react-select.com/)
79
- *
80
- * For ease of testing most of the elements of this select can be identified by classNames prefixed with "spec".
81
- *
82
- */
83
- const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no matching options', isSearchable = true, creatable = false, isMulti = false, isClearable = false, closeMenuOnSelect = true, id, inputId, menuPortalTarget, getOptionLabel, getSelectedValueLabel, getOptionValue, onChange, menuIsOpen, menuPlacement = 'auto', extraClassNames, inputGroup, filterConfig, filterOption, small = false, isDisabled = false, showError = false, isLoading = false, formatGroupLabel, onRemove, defaultValue, }) => {
84
- const getOptionOrSelectedLabel = (option, { context }) => {
85
- const getSelectedOptionLabel = getSelectedValueLabel ? getSelectedValueLabel : getOptionLabel;
86
- if (getOptionLabel || getSelectedValueLabel) {
87
- if (context === 'value') {
88
- return getSelectedOptionLabel ? getSelectedOptionLabel(option) : option.label;
89
- }
90
- else {
91
- return getOptionLabel ? getOptionLabel(option) : option.label;
92
- }
93
- }
94
- else {
95
- return option.label;
96
- }
97
- };
98
- const interceptOnChange = (newValue, actionMeta) => {
99
- if (isMulti && onRemove && actionMeta.action === 'remove-value') {
100
- onRemove({ id: actionMeta.removedValue });
101
- return;
102
- }
103
- onChange(newValue);
104
- };
105
- const props = {
106
- id,
107
- value,
108
- inputId,
109
- placeholder,
110
- closeMenuOnSelect,
111
- blurInputOnSelect: closeMenuOnSelect,
112
- isSearchable: creatable ? true : isSearchable,
113
- isMulti,
114
- isClearable,
115
- isLoading,
116
- defaultValue,
117
- noOptionsMessage: () => noOptionsMessage,
118
- menuPortalTarget,
119
- menuIsOpen,
120
- onChange: interceptOnChange,
121
- unstyled: true,
122
- menuPlacement,
123
- formatOptionLabel: getOptionOrSelectedLabel,
124
- formatGroupLabel,
125
- getOptionValue,
126
- options,
127
- isDisabled,
128
- hideSelectedOptions: isMulti,
129
- filterOption: filterOption ? filterOption : filterConfig ? createFilter(filterConfig) : undefined,
130
- classNames: {
131
- control: ({ menuIsOpen }) => {
132
- let border = menuIsOpen ? 'tw-rounded-t-sm' : 'tw-rounded-sm';
133
- // if it's on the left side of the input group make sure the right side is straight and not curved
134
- if (inputGroup === 'left') {
135
- border = menuIsOpen ? 'tw-rounded-tl-sm' : 'tw-rounded-l-sm';
136
- }
137
- else if (inputGroup === 'right') {
138
- border = menuIsOpen ? 'tw-rounded-tr-sm' : 'tw-rounded-r-sm';
139
- }
140
- const appliedClasses = `${borderStyles} ${border} ${showError ? errorClasses : borderColorClasses} ${small ? 'reactSelectMinHeightSmall' : 'reactSelectMinHeight'} `;
141
- return `${appliedClasses} ${baseClasses} specSelectControl ${isDisabled ? disabledClasses : ''} ${small ? 'tw-pl-2 tw-pr-1' : 'tw-pl-2.5 tw-pr-1.5'}`;
142
- },
143
- placeholder: () => placeholderStyles,
144
- container: () => `${textStyles} ${containerStyles} ${extraClassNames}`,
145
- input: () => textStyles + ' specSelectInput',
146
- menuList: () => menuListStyles,
147
- menu: () => menuStyles,
148
- menuPortal: () => '!tw-z-[9000]',
149
- dropdownIndicator: () => dropDownIndicatorStyles,
150
- option: ({ isSelected, isDisabled }) => {
151
- let classes = optionStyles;
152
- if (isDisabled) {
153
- classes += ' specDisabledOption ';
154
- }
155
- return isSelected ? classes + ' tw-bg-sq-colored-hover dark:tw-bg-sq-colored-hover-dark' : classes;
156
- },
157
- singleValue: () => 'specOpenSelect',
158
- multiValue: () => multiValueStyles,
159
- multiValueRemove: () => 'hover:tw-text-sq-danger-color specSelectMultiValueRemove',
160
- clearIndicator: () => 'tw-text-sq-disabled-gray hover:tw-text-sq-danger-color specClearSelect',
161
- group: () => 'specSelectGroup',
162
- groupHeading: () => groupHeadingStyles,
163
- },
164
- };
165
- return creatable ? React.createElement(CreatableSelect, { ...props }) : React.createElement(ReactSelect, { ...props });
166
- };
167
- export default Select;
168
- //# sourceMappingURL=Select.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Select.js","sourceRoot":"","sources":["../../src/Select/Select.tsx"],"names":[],"mappings":"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"}
@@ -1,72 +0,0 @@
1
- import React from 'react';
2
- import Select from './Select';
3
- import TextField from '../TextField';
4
- export default {
5
- title: 'Select',
6
- };
7
- export const AllSelectVariants = () => {
8
- const options = [
9
- { value: 'a', label: 'Chocolate' },
10
- { value: 'b', label: 'Strawberry' },
11
- { value: 'c', label: 'Vanilla' },
12
- { value: 'd', label: 'Rocky Road' },
13
- { value: 'e', label: 'Crazy Cow' },
14
- { value: 'f', label: 'Almond Joy' },
15
- { value: 'g', label: 'All of the above' },
16
- ];
17
- const colorOptions = [
18
- { value: 'h', label: 'pink' },
19
- { value: 'i', label: 'purple' },
20
- { value: 'j', label: 'green' },
21
- { value: 'k', label: 'red' },
22
- ];
23
- const groupedOptions = [
24
- {
25
- label: 'Ice Cream Flavors',
26
- options: options,
27
- },
28
- {
29
- label: 'Colors',
30
- options: colorOptions,
31
- },
32
- ];
33
- const allSelects = () => (React.createElement(React.Fragment, null,
34
- React.createElement("div", { className: "tw-p-5" },
35
- React.createElement(Select, { id: "hello", onChange: () => { }, options: options, placeholder: "single value" })),
36
- React.createElement("div", { className: "tw-p-5" },
37
- React.createElement(Select, { id: "hello", onChange: () => { }, options: options, placeholder: "single value - small", small: true })),
38
- React.createElement("div", { className: "tw-p-5" },
39
- React.createElement(Select, { id: "disabled", onChange: () => { }, options: options, placeholder: "disabled", isDisabled: true })),
40
- React.createElement("div", { className: "tw-p-5" },
41
- React.createElement(Select, { id: "error", onChange: () => { }, options: options, placeholder: "error", showError: true })),
42
- React.createElement("div", { className: "tw-p-5" },
43
- React.createElement(Select, { onChange: () => { }, options: options, placeholder: "stays open", closeMenuOnSelect: false, creatable: true })),
44
- React.createElement("div", { className: "tw-p-5" },
45
- React.createElement(Select, { onChange: () => { }, options: groupedOptions, placeholder: "grouped" })),
46
- React.createElement("div", { className: "tw-p-5" },
47
- React.createElement(Select, { onChange: () => { }, options: options, creatable: true, placeholder: "create option" })),
48
- React.createElement("div", { className: "tw-p-5" },
49
- React.createElement(Select, { onChange: () => { }, options: options, isClearable: true, placeholder: "clearable" })),
50
- React.createElement("div", { className: "tw-p-5" },
51
- React.createElement(Select, { onChange: () => { }, options: options, placeholder: "multi-select", isMulti: true, isSearchable: false })),
52
- React.createElement("div", { className: "tw-p-5" },
53
- React.createElement(Select, { onChange: () => { }, placeholder: "type to search", options: options, isSearchable: true })),
54
- React.createElement("div", { className: "tw-p-5 tw-flex tw-flex-row" },
55
- React.createElement(Select, { onChange: () => { }, placeholder: "type to search", options: options, inputGroup: "left", extraClassNames: "tw-w-[200px]" }),
56
- React.createElement(TextField, { onChange: () => { }, placeholder: "text goes here", inputGroup: "right" }))));
57
- const renderAllVariations = () => (React.createElement(React.Fragment, null,
58
- React.createElement("div", { className: "tw-grid tw-gap-4" },
59
- allSelects(),
60
- React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background" }, allSelects()))));
61
- return (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
62
- React.createElement("div", { className: "color_topic" },
63
- React.createElement("b", null, "Topic Colors"),
64
- renderAllVariations()),
65
- React.createElement("div", { className: "color_analysis" },
66
- React.createElement("b", null, "Analysis Colors"),
67
- renderAllVariations()),
68
- React.createElement("div", { className: "color_datalab" },
69
- React.createElement("b", null, "Datalab Colors"),
70
- renderAllVariations())));
71
- };
72
- //# sourceMappingURL=Select.stories.js.map