@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
package/package.json CHANGED
@@ -1,83 +1,83 @@
1
- {
2
- "name": "@seeqdev/qomponents",
3
- "version": "0.0.70",
4
- "main": "dist/index.js",
5
- "module": "dist/index.esm.js",
6
- "types": "dist/index.js",
7
- "skip-lib-check": true,
8
- "files": [
9
- "dist"
10
- ],
11
- "repository": {
12
- "type": "git",
13
- "url": "TOOD"
14
- },
15
- "publishConfig": {
16
- "access": "public"
17
- },
18
- "description": "A library that allows you to build native UIs ... TODO",
19
- "scripts": {
20
- "build": "rollup -c --bundleConfigAsCjs",
21
- "watchRollup": "rollup -c --bundleConfigAsCjs --watch",
22
- "test": "jest",
23
- "test:watch": "jest --watch",
24
- "dev": "ladle serve"
25
- },
26
- "author": "Seeq",
27
- "license": "MIT",
28
- "bugs": {
29
- "url": "TODO"
30
- },
31
- "homepage": "https://seeq12.github.io/qomponents-documentation/",
32
- "peerDependencies": {
33
- "react": ">=17.0.0",
34
- "react-dom": ">=17.0.0"
35
- },
36
- "devDependencies": {
37
- "@ladle/react": "2.9.0",
38
- "@react-types/shared": "3.19.0",
39
- "@rollup/plugin-commonjs": "24.0.1",
40
- "@rollup/plugin-node-resolve": "15.0.1",
41
- "@tailwindcss/forms": "0.5.3",
42
- "@testing-library/jest-dom": "5.16.5",
43
- "@testing-library/react": "14.0.0",
44
- "@testing-library/user-event": "14.4.3",
45
- "@types/dompurify": "^3.0.2",
46
- "@types/jest": "29.4.0",
47
- "@types/react": "18.0.27",
48
- "@types/react-dom": "18.0.11",
49
- "autoprefixer": "10.4.13",
50
- "color": "4.2.3",
51
- "identity-obj-proxy": "3.0.0",
52
- "jest": "29.4.3",
53
- "jest-cli": "29.1.1",
54
- "jest-environment-jsdom": "29.4.3",
55
- "jest-junit": "15.0.0",
56
- "jest-silent-reporter": "0.5.0",
57
- "postcss-import": "15.1.0",
58
- "react": "18.2.0",
59
- "react-dom": "18.2.0",
60
- "rollup": "3.17.2",
61
- "rollup-plugin-copy": "3.4.0",
62
- "rollup-plugin-peer-deps-external": "2.2.4",
63
- "rollup-plugin-postcss": "4.0.2",
64
- "rollup-plugin-typescript2": "0.34.1",
65
- "tailwindcss": "3.2.7",
66
- "ts-jest": "29.0.5",
67
- "ts-node": "10.9.1",
68
- "typescript": "4.9.5",
69
- "typescript-strict-plugin": "2.1.0"
70
- },
71
- "dependencies": {
72
- "@floating-ui/dom": "^1.5.1",
73
- "@radix-ui/react-accordion": "1.1.2",
74
- "@radix-ui/react-dialog": "1.0.5",
75
- "@radix-ui/react-dropdown-menu": "^2.0.6",
76
- "@radix-ui/react-popover": "1.0.7",
77
- "@radix-ui/react-tabs": "1.0.4",
78
- "dompurify": "^3.0.5",
79
- "postcss": "8.4.21",
80
- "react-select": "5.7.3",
81
- "rooks": "7.14.1"
82
- }
83
- }
1
+ {
2
+ "name": "@seeqdev/qomponents",
3
+ "version": "0.0.71",
4
+ "main": "dist/index.js",
5
+ "module": "dist/index.esm.js",
6
+ "types": "dist/index.js",
7
+ "skip-lib-check": true,
8
+ "files": [
9
+ "dist"
10
+ ],
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "TOOD"
14
+ },
15
+ "publishConfig": {
16
+ "access": "public"
17
+ },
18
+ "description": "A library that allows you to build native UIs ... TODO",
19
+ "scripts": {
20
+ "build": "rollup -c --bundleConfigAsCjs",
21
+ "watchRollup": "rollup -c --bundleConfigAsCjs --watch",
22
+ "test": "jest",
23
+ "test:watch": "jest --watch",
24
+ "dev": "ladle serve"
25
+ },
26
+ "author": "Seeq",
27
+ "license": "MIT",
28
+ "bugs": {
29
+ "url": "TODO"
30
+ },
31
+ "homepage": "https://seeq12.github.io/qomponents-documentation/",
32
+ "peerDependencies": {
33
+ "react": ">=17.0.0",
34
+ "react-dom": ">=17.0.0"
35
+ },
36
+ "devDependencies": {
37
+ "@ladle/react": "2.9.0",
38
+ "@react-types/shared": "3.19.0",
39
+ "@rollup/plugin-commonjs": "24.0.1",
40
+ "@rollup/plugin-node-resolve": "15.0.1",
41
+ "@tailwindcss/forms": "0.5.3",
42
+ "@testing-library/jest-dom": "5.16.5",
43
+ "@testing-library/react": "14.0.0",
44
+ "@testing-library/user-event": "14.4.3",
45
+ "@types/dompurify": "^3.0.2",
46
+ "@types/jest": "29.4.0",
47
+ "@types/react": "18.0.27",
48
+ "@types/react-dom": "18.0.11",
49
+ "autoprefixer": "10.4.13",
50
+ "color": "4.2.3",
51
+ "identity-obj-proxy": "3.0.0",
52
+ "jest": "29.4.3",
53
+ "jest-cli": "29.1.1",
54
+ "jest-environment-jsdom": "29.4.3",
55
+ "jest-junit": "15.0.0",
56
+ "jest-silent-reporter": "0.5.0",
57
+ "postcss-import": "15.1.0",
58
+ "react": "18.2.0",
59
+ "react-dom": "18.2.0",
60
+ "rollup": "3.17.2",
61
+ "rollup-plugin-copy": "3.4.0",
62
+ "rollup-plugin-peer-deps-external": "2.2.4",
63
+ "rollup-plugin-postcss": "4.0.2",
64
+ "rollup-plugin-typescript2": "0.34.1",
65
+ "tailwindcss": "3.2.7",
66
+ "ts-jest": "29.0.5",
67
+ "ts-node": "10.9.1",
68
+ "typescript": "4.9.5",
69
+ "typescript-strict-plugin": "2.1.0"
70
+ },
71
+ "dependencies": {
72
+ "@floating-ui/dom": "^1.5.1",
73
+ "@radix-ui/react-accordion": "1.1.2",
74
+ "@radix-ui/react-dialog": "1.0.5",
75
+ "@radix-ui/react-dropdown-menu": "^2.0.6",
76
+ "@radix-ui/react-popover": "1.0.7",
77
+ "@radix-ui/react-tabs": "1.0.4",
78
+ "dompurify": "^3.0.5",
79
+ "postcss": "8.4.21",
80
+ "react-select": "5.7.3",
81
+ "rooks": "7.14.1"
82
+ }
83
+ }
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- import { Root, Item, Trigger, Content } from '@radix-ui/react-accordion';
3
- const Accordion = ({ accordionItems, defaultValue, value, onItemSelect, disabled, extraClassNames, testId, }) => {
4
- return (React.createElement(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) }, accordionItems.map((item) => (React.createElement(Item, { className: `tw-bg-transparent tw-p-0 tw-flex tw-flex-col tw-w-full`, key: item.value, disabled: disabled, value: item.value },
5
- React.createElement(Trigger, { disabled: disabled, className: `tw-w-full tw-cursor-default focus-visible:tw-outline-none` }, item.trigger),
6
- React.createElement(Content, { className: `data-[state=open]:tw-animate-slideDown data-[state=closed]:tw-animate-slideUp tw-overflow-hidden focus-visible:tw-outline-none ${item.contentClassNames || ''}` }, item.content))))));
7
- };
8
- export default Accordion;
9
- //# sourceMappingURL=Accordion.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,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,oBAAC,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,IAC9C,cAAc,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5B,oBAAC,IAAI,IACH,SAAS,EAAE,wDAAwD,EACnE,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,oBAAC,OAAO,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,2DAA2D,IAChG,IAAI,CAAC,OAAO,CACL;QACV,oBAAC,OAAO,IACN,SAAS,EAAE,kIACT,IAAI,CAAC,iBAAiB,IAAI,EAC5B,EAAE,IACD,IAAI,CAAC,OAAO,CACL,CACL,CACR,CAAC,CACG,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,109 +0,0 @@
1
- import React from 'react';
2
- import Accordion from './Accordion';
3
- import { QTip } from '../Tooltip/Qtip';
4
- import Icon from '../Icon';
5
- import Tabs from '../Tabs';
6
- import Button from '../Button';
7
- export default {
8
- title: 'Accordion',
9
- };
10
- const Trigger = ({ label }) => (React.createElement("div", { className: "tw-flex tw-justify-start tw-items-center tw-border-b tw-px-2 tw-text-sq-color-dark" },
11
- React.createElement(Icon, { icon: "fc-arrow-dropdown", extraClassNames: "tw-text-sq-color-dark tw-mr-[0.5rem] tw-text-[12px]", type: "text" }),
12
- label));
13
- const TriggerSecond = ({ label }) => (React.createElement("div", { className: "tw-flex tw-justify-between tw-items-center tw-border-b tw-px-2 tw-text-sq-color-dark tw-py-2" },
14
- label,
15
- React.createElement(Icon, { icon: "fc-arrow-dropdown", extraClassNames: "tw-text-sq-color-dark tw-mr-[0.5rem] tw-text-[12px]", type: "text" })));
16
- const renderData = () => (React.createElement("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white" },
17
- React.createElement("p", { className: "tw-mb-5 tw-text-[15px] tw-leading-normal" }, "This is a data tab to show details about your data. You can make changes to your account"),
18
- React.createElement(Button, { variant: "outline", label: "Save data" })));
19
- const renderTools = () => (React.createElement("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white" },
20
- React.createElement("p", { className: "tw-mb-5 tw-text-[15px] tw-leading-normal" }, "Make changes to your account here. Click save when you're done."),
21
- React.createElement(Button, { variant: "outline", label: "Save tools" })));
22
- const renderJournal = () => (React.createElement("div", { className: "tw-text-sq-color-gray dark:tw-text-sq-white" },
23
- React.createElement("p", { className: "tw-mb-5 tw-text-[15px] tw-leading-normal" }, "Make changes to your account here. Click save when you're done."),
24
- React.createElement(Button, { variant: "outline", label: "Save journal" })));
25
- const tabsList = [
26
- {
27
- id: 'data',
28
- label: 'Data',
29
- icon: 'fc-data',
30
- content: renderData(),
31
- },
32
- {
33
- id: 'tools',
34
- label: 'Tools',
35
- icon: 'fc-gears-2',
36
- content: renderTools(),
37
- },
38
- {
39
- id: 'journal',
40
- label: 'Journal',
41
- icon: 'fc-workbook-lock',
42
- content: renderJournal(),
43
- },
44
- ];
45
- export const AllAccordionVariants = () => {
46
- const [activeTab, setActiveTab] = React.useState('data');
47
- const [value, setValue] = React.useState('oranges');
48
- const accordionItems = [
49
- {
50
- value: 'oranges',
51
- id: 'oranges',
52
- itemTestId: 'oranges',
53
- trigger: React.createElement(Trigger, { label: "Oranges" }),
54
- content: (React.createElement("div", { className: "tw-p-2 tw-text-[13px] dark:tw-text-sq-white" }, "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.")),
55
- },
56
- {
57
- value: 'apples',
58
- id: 'apples',
59
- itemTestId: 'apples',
60
- trigger: React.createElement(Trigger, { label: "Apples" }),
61
- content: (React.createElement("div", null,
62
- React.createElement("div", { className: "tw-p-4" },
63
- React.createElement(Tabs, { stretchTabs: true, activeTab: activeTab, onTabSelect: setActiveTab, defaultActiveTab: "data", tabs: tabsList })))),
64
- },
65
- {
66
- value: 'bananas',
67
- id: 'bananas',
68
- trigger: React.createElement(Trigger, { label: "Bananas" }),
69
- itemTestId: 'bananas',
70
- content: (React.createElement("div", null, "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.")),
71
- },
72
- {
73
- value: 'pineapples',
74
- id: 'pineapples',
75
- trigger: React.createElement(Trigger, { label: "Pineapples" }),
76
- itemTestId: 'pineapples',
77
- content: (React.createElement("div", null, "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.")),
78
- },
79
- ];
80
- const allAccordions = (isDark) => (React.createElement("div", { className: isDark ? 'tw-dark tw-bg-sq-dark-background' : '' },
81
- React.createElement("div", { className: "tw-p-5 " },
82
- React.createElement(Accordion, { accordionItems: isDark
83
- ? accordionItems
84
- : accordionItems.map((item) => ({ ...item, trigger: React.createElement(TriggerSecond, { label: item.value.toUpperCase() }) })), value: value, testId: "basic-accordion1", onItemSelect: (value) => setValue(value) }))));
85
- const renderAllVariations = (isDark) => React.createElement("div", { className: "tw-p-4" }, allAccordions(isDark));
86
- return (React.createElement(React.Fragment, null,
87
- React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
88
- React.createElement(QTip, null),
89
- React.createElement("div", { className: "color_topic" },
90
- React.createElement("b", null, "Topic Colors"),
91
- renderAllVariations()),
92
- React.createElement("div", { className: "color_analysis" },
93
- React.createElement("b", null, "Analysis Colors"),
94
- renderAllVariations()),
95
- React.createElement("div", { className: "color_datalab" },
96
- React.createElement("b", null, "Datalab Colors"),
97
- renderAllVariations())),
98
- React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background tw-grid tw-grid-cols-3 tw-gap-4 tw-py-4" },
99
- React.createElement("div", { className: "color_topic dark:tw-text-sq-white tw-text-center" },
100
- React.createElement("b", null, "Topic Colors"),
101
- renderAllVariations(true)),
102
- React.createElement("div", { className: "color_analysis dark:tw-text-sq-white tw-text-center" },
103
- React.createElement("b", null, "Analysis Colors"),
104
- renderAllVariations(true)),
105
- React.createElement("div", { className: "color_datalab dark:tw-text-sq-white tw-text-center" },
106
- React.createElement("b", null, "Datalab Colors"),
107
- renderAllVariations(true)))));
108
- };
109
- //# 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 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 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(React.createElement(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":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,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,oBAAC,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,90 +0,0 @@
1
- import React from 'react';
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-sm focus:tw-ring-0 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 && (React.createElement(Icon, { icon: icon, iconPrefix: iconPrefix, type: iconStyle, color: iconColor, extraClassNames: label ? `${iconClass} ${textClassesByVariantLightTheme[variant]} ${textClassesByVariantDarkTheme[variant]}` : '', testId: `${id}_spinner` }));
77
- return (React.createElement("button", { id: id, ...tooltipData, disabled: disabled, "data-testid": testId, type: type === 'link' || (type === 'submit' && browserIsFirefox) ? 'button' : type, onClick: (e) => {
78
- stopPropagation && e.stopPropagation();
79
- onClick && onClick(e);
80
- }, onMouseDown: (e) => {
81
- if (preventBlur) {
82
- e.preventDefault();
83
- }
84
- }, className: appliedClasses },
85
- iconPosition === 'left' && iconElement,
86
- label,
87
- iconPosition === 'right' && iconElement));
88
- };
89
- export default Button;
90
- //# sourceMappingURL=Button.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -1,85 +0,0 @@
1
- import React from 'react';
2
- import Button from './Button';
3
- import { buttonVariants } from './Button.types';
4
- export default {
5
- title: 'Button',
6
- };
7
- export const AllButtonVariants = () => {
8
- const renderAllVariations = () => (React.createElement(React.Fragment, null, buttonVariants.map((variant) => (React.createElement("div", { key: `{variant_${variant}`, className: "tw-grid tw-grid-cols-2 tw-gap-4" },
9
- React.createElement("div", { className: "tw-p-4" },
10
- React.createElement(Button, { label: `Variant: ${variant}`, onClick: () => { }, variant: variant })),
11
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
12
- React.createElement(Button, { label: `Variant: ${variant}`, onClick: () => { }, variant: variant })))))));
13
- return (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
14
- React.createElement("div", { className: "color_topic" },
15
- React.createElement("b", null, "Topic Colors"),
16
- renderAllVariations()),
17
- React.createElement("div", { className: "color_analysis" },
18
- React.createElement("b", null, "Analysis Colors"),
19
- renderAllVariations()),
20
- React.createElement("div", { className: "color_datalab" },
21
- React.createElement("b", null, "Datalab Colors"),
22
- renderAllVariations())));
23
- };
24
- export const ButtonWithTooltip = () => {
25
- const renderButtonWithTooltip = () => (React.createElement(React.Fragment, null,
26
- React.createElement("div", { className: "tw-p-4" },
27
- React.createElement(Button, { tooltip: "Helpful tooltip", variant: "theme", label: "Hover me" })),
28
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
29
- React.createElement(Button, { tooltip: "Helpful tooltip", variant: "theme", label: "Hover me" }))));
30
- return (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
31
- React.createElement("div", { className: "color_topic" },
32
- React.createElement("b", null, "Topic Colors"),
33
- renderButtonWithTooltip()),
34
- React.createElement("div", { className: "color_analysis" },
35
- React.createElement("b", null, "Analysis Colors"),
36
- renderButtonWithTooltip()),
37
- React.createElement("div", { className: "color_datalab" },
38
- React.createElement("b", null, "Datalab Colors"),
39
- renderButtonWithTooltip())));
40
- };
41
- export const ButtonWithIcon = () => {
42
- const renderButtonWithIcon = () => (React.createElement(React.Fragment, null,
43
- React.createElement("div", { className: "tw-p-4" },
44
- React.createElement(Button, { icon: "fc-search-power", variant: "theme", label: "With Icon" })),
45
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
46
- React.createElement(Button, { icon: "fc-search-power", variant: "theme", label: "With Icon" }))));
47
- const renderButtonWithIconOnRight = () => (React.createElement(React.Fragment, null,
48
- React.createElement("div", { className: "tw-p-4" },
49
- React.createElement(Button, { icon: "fc-search-power", iconPosition: "right", variant: "theme", label: "With Icon On Right" })),
50
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
51
- React.createElement(Button, { icon: "fc-search-power", iconPosition: "right", variant: "theme", label: "With Icon On Right" }))));
52
- return (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
53
- React.createElement("div", { className: "color_topic" },
54
- React.createElement("b", null, "Topic Colors"),
55
- renderButtonWithIcon()),
56
- React.createElement("div", { className: "color_analysis" },
57
- React.createElement("b", null, "Analysis Colors"),
58
- renderButtonWithIcon()),
59
- React.createElement("div", { className: "color_datalab" },
60
- React.createElement("b", null, "Datalab Colors"),
61
- renderButtonWithIcon()),
62
- React.createElement("div", { className: "color_topic" }, renderButtonWithIconOnRight()),
63
- React.createElement("div", { className: "color_analysis" }, renderButtonWithIconOnRight()),
64
- React.createElement("div", { className: "color_datalab" }, renderButtonWithIconOnRight())));
65
- };
66
- export const DisabledButton = () => {
67
- const renderDisabledButton = () => (React.createElement(React.Fragment, null,
68
- React.createElement("div", { className: "tw-p-4" },
69
- React.createElement(Button, { disabled: true, variant: "theme", label: "Disabled Button" }),
70
- React.createElement(Button, { extraClassNames: "tw-m-5", disabled: true, label: "Disabled Button" })),
71
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
72
- React.createElement(Button, { disabled: true, variant: "theme", label: "Disabled Button" }),
73
- React.createElement(Button, { extraClassNames: "tw-m-5", disabled: true, label: "Disabled Button" }))));
74
- return (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
75
- React.createElement("div", { className: "color_topic" },
76
- React.createElement("b", null, "Topic Colors"),
77
- renderDisabledButton()),
78
- React.createElement("div", { className: "color_analysis" },
79
- React.createElement("b", null, "Analysis Colors"),
80
- renderDisabledButton()),
81
- React.createElement("div", { className: "color_datalab" },
82
- React.createElement("b", null, "Datalab Colors"),
83
- renderDisabledButton())));
84
- };
85
- //# sourceMappingURL=Button.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../src/Button/Button.stories.tsx"],"names":[],"mappings":"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"}
@@ -1,49 +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 Button from './Button';
6
- describe('Button', () => {
7
- class Context {
8
- testId = 'buttonTestId';
9
- label = 'button label';
10
- props = {
11
- label: this.label,
12
- onClick: jest.fn(),
13
- testId: this.testId,
14
- };
15
- }
16
- let tc;
17
- beforeEach(() => {
18
- tc = new Context();
19
- });
20
- const renderButton = (props) => render(React.createElement(Button, { ...props }));
21
- it('renders button label', () => {
22
- renderButton(tc.props);
23
- expect(screen.getByText(tc.label)).toBeInTheDocument();
24
- });
25
- it('calls on click', async () => {
26
- renderButton(tc.props);
27
- await userEvent.click(screen.getByTestId(tc.testId));
28
- expect(tc.props.onClick).toHaveBeenCalled();
29
- });
30
- it('renders disabled button', () => {
31
- renderButton({ ...tc.props, disabled: true });
32
- expect(screen.getByText(tc.label)).toBeDisabled();
33
- });
34
- it('respects stopPropagation default', async () => {
35
- const callOnPropagation = jest.fn();
36
- render(React.createElement("div", { onClick: callOnPropagation },
37
- React.createElement(Button, { ...tc.props })));
38
- await userEvent.click(screen.getByTestId(tc.testId));
39
- expect(callOnPropagation).not.toHaveBeenCalled();
40
- });
41
- it('propagates click event if not told not to', async () => {
42
- const callOnPropagation = jest.fn();
43
- render(React.createElement("div", { onClick: callOnPropagation },
44
- React.createElement(Button, { ...{ ...tc.props, stopPropagation: false } })));
45
- await userEvent.click(screen.getByTestId(tc.testId));
46
- expect(callOnPropagation).toHaveBeenCalled();
47
- });
48
- });
49
- //# sourceMappingURL=Button.test.js.map