@conduction/components 2.2.16 → 2.2.18

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 (133) hide show
  1. package/.prettierrc +30 -30
  2. package/README.md +6 -0
  3. package/lib/components/Pagination/Pagination.d.ts +14 -9
  4. package/lib/components/Pagination/Pagination.js +12 -12
  5. package/lib/components/Pagination/Pagination.module.css +1 -1
  6. package/lib/components/badgeCounter/BadgeCounter.d.ts +8 -8
  7. package/lib/components/badgeCounter/BadgeCounter.js +4 -4
  8. package/lib/components/badgeCounter/BadgeCounter.module.css +27 -27
  9. package/lib/components/card/cardHeader/CardHeader.d.ts +4 -4
  10. package/lib/components/card/cardHeader/CardHeader.js +14 -14
  11. package/lib/components/card/cardWrapper/CardWrapper.d.ts +2 -2
  12. package/lib/components/card/cardWrapper/CardWrapper.js +6 -6
  13. package/lib/components/card/detailsCard/DetailsCard.d.ts +14 -14
  14. package/lib/components/card/detailsCard/DetailsCard.js +11 -11
  15. package/lib/components/card/downloadCard/DownloadCard.d.ts +11 -11
  16. package/lib/components/card/downloadCard/DownloadCard.js +9 -9
  17. package/lib/components/card/horizontalImageCard/HorizontalImageCard.d.ts +13 -13
  18. package/lib/components/card/horizontalImageCard/HorizontalImageCard.js +10 -10
  19. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.d.ts +14 -14
  20. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.js +10 -10
  21. package/lib/components/card/index.d.ts +8 -8
  22. package/lib/components/card/index.js +8 -8
  23. package/lib/components/card/infoCard/InfoCard.d.ts +8 -8
  24. package/lib/components/card/infoCard/InfoCard.js +6 -6
  25. package/lib/components/card/infoCard/InfoCard.module.css +26 -26
  26. package/lib/components/card/richContentCard/RichContentCard.d.ts +19 -19
  27. package/lib/components/card/richContentCard/RichContentCard.js +16 -15
  28. package/lib/components/codeBlock/CodeBlock.d.ts +6 -6
  29. package/lib/components/codeBlock/CodeBlock.js +3 -3
  30. package/lib/components/codeBlock/CodeBlock.module.css +6 -6
  31. package/lib/components/container/Container.d.ts +6 -6
  32. package/lib/components/container/Container.js +4 -4
  33. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  34. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.d.ts +17 -17
  35. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.js +20 -20
  36. package/lib/components/denhaag-wrappers/pagination/Pagination.css +120 -120
  37. package/lib/components/denhaag-wrappers/pagination/Pagination.d.ts +9 -9
  38. package/lib/components/denhaag-wrappers/pagination/Pagination.js +15 -15
  39. package/lib/components/editableTableRow/EditableTableRow.d.ts +14 -14
  40. package/lib/components/editableTableRow/EditableTableRow.js +31 -31
  41. package/lib/components/editableTableRow/EditableTableRow.module.css +25 -25
  42. package/lib/components/formFields/checkbox/Checkbox.module.css +7 -7
  43. package/lib/components/formFields/checkbox/checkbox.d.ts +9 -9
  44. package/lib/components/formFields/checkbox/checkbox.js +3 -3
  45. package/lib/components/formFields/createKeyValue/CreateKeyValue.d.ts +23 -23
  46. package/lib/components/formFields/createKeyValue/CreateKeyValue.js +40 -40
  47. package/lib/components/formFields/date/Date.d.ts +12 -12
  48. package/lib/components/formFields/date/Date.js +10 -10
  49. package/lib/components/formFields/date/Date.module.css +12 -12
  50. package/lib/components/formFields/errorMessage/ErrorMessage.d.ts +5 -5
  51. package/lib/components/formFields/errorMessage/ErrorMessage.js +3 -3
  52. package/lib/components/formFields/index.d.ts +7 -7
  53. package/lib/components/formFields/index.js +7 -7
  54. package/lib/components/formFields/input.d.ts +22 -22
  55. package/lib/components/formFields/input.js +12 -12
  56. package/lib/components/formFields/radio.d.ts +9 -9
  57. package/lib/components/formFields/radio.js +3 -3
  58. package/lib/components/formFields/select/select.d.ts +24 -24
  59. package/lib/components/formFields/select/select.js +74 -110
  60. package/lib/components/formFields/select/select.module.css +5 -0
  61. package/lib/components/formFields/textarea.d.ts +10 -10
  62. package/lib/components/formFields/textarea.js +4 -4
  63. package/lib/components/formFields/types.d.ts +6 -6
  64. package/lib/components/formFields/types.js +1 -1
  65. package/lib/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.d.ts +10 -0
  66. package/lib/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.js +36 -0
  67. package/lib/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.module.css +41 -0
  68. package/lib/components/imageDivider/ImageDivider.d.ts +7 -7
  69. package/lib/components/imageDivider/ImageDivider.js +6 -6
  70. package/lib/components/imageDivider/imageDivider.module.css +5 -5
  71. package/lib/components/logo/Logo.d.ts +8 -8
  72. package/lib/components/logo/Logo.js +10 -10
  73. package/lib/components/logo/Logo.module.css +15 -15
  74. package/lib/components/metaIcon/MetaIcon.d.ts +7 -7
  75. package/lib/components/metaIcon/MetaIcon.js +3 -3
  76. package/lib/components/metaIcon/MetaIcon.module.css +29 -29
  77. package/lib/components/notificationPopUp/NotificationPopUp.d.ts +26 -26
  78. package/lib/components/notificationPopUp/NotificationPopUp.js +32 -32
  79. package/lib/components/privateRoute/PrivateRoute.d.ts +6 -6
  80. package/lib/components/privateRoute/PrivateRoute.js +15 -15
  81. package/lib/components/quoteWrapper/QuoteWrapper.d.ts +7 -7
  82. package/lib/components/quoteWrapper/QuoteWrapper.js +5 -5
  83. package/lib/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  84. package/lib/components/tableWrapper/TableWrapper.d.ts +4 -4
  85. package/lib/components/tableWrapper/TableWrapper.js +30 -30
  86. package/lib/components/tabs/Tabs.d.ts +5 -5
  87. package/lib/components/tabs/Tabs.js +49 -43
  88. package/lib/components/tag/Tag.d.ts +10 -10
  89. package/lib/components/tag/Tag.js +6 -6
  90. package/lib/components/tag/Tag.module.css +44 -44
  91. package/lib/components/temp/Temp.d.ts +5 -0
  92. package/lib/components/temp/Temp.js +14 -0
  93. package/lib/components/toolTip/ToolTip.d.ts +14 -14
  94. package/lib/components/toolTip/ToolTip.js +14 -14
  95. package/lib/components/topNav/index.d.ts +3 -3
  96. package/lib/components/topNav/index.js +3 -3
  97. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.d.ts +20 -20
  98. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.js +34 -34
  99. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.d.ts +12 -12
  100. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.js +7 -7
  101. package/lib/index.d.ts +27 -27
  102. package/lib/index.js +20 -20
  103. package/package.json +1 -1
  104. package/src/components/Pagination/Pagination.module.css +1 -1
  105. package/src/components/Pagination/Pagination.tsx +17 -3
  106. package/src/components/badgeCounter/BadgeCounter.module.css +27 -27
  107. package/src/components/card/infoCard/InfoCard.module.css +26 -26
  108. package/src/components/codeBlock/CodeBlock.module.css +6 -6
  109. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  110. package/src/components/formFields/checkbox/Checkbox.module.css +7 -7
  111. package/src/components/formFields/date/Date.module.css +12 -12
  112. package/src/components/formFields/input.tsx +1 -1
  113. package/src/components/formFields/select/select.module.css +5 -0
  114. package/src/components/formFields/select/select.tsx +29 -65
  115. package/src/components/formFields/textarea.tsx +1 -1
  116. package/src/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.module.css +41 -0
  117. package/src/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.tsx +80 -0
  118. package/src/components/imageDivider/imageDivider.module.css +5 -5
  119. package/src/components/logo/Logo.module.css +15 -15
  120. package/src/components/metaIcon/MetaIcon.module.css +29 -29
  121. package/src/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  122. package/src/components/tabs/Tabs.tsx +10 -2
  123. package/src/components/tag/Tag.module.css +44 -44
  124. package/src/components/topNav/index.ts +4 -4
  125. package/src/custom.d.ts +4 -4
  126. package/src/index.ts +2 -2
  127. package/tsconfig.json +5 -16
  128. package/lib/components/statusSteps/StatusSteps.d.ts +0 -13
  129. package/lib/components/statusSteps/StatusSteps.js +0 -5
  130. package/lib/custom.d copy.d.ts +0 -5
  131. package/lib/custom.d copy.js +0 -1
  132. package/src/components/tableWrapper/TableWrapper.module.css +0 -67
  133. package/src/components/tableWrapper/TableWrapper.tsx +0 -56
package/src/components/tableWrapper/TableWrapper.module.css DELETED
@@ -1,67 +0,0 @@
1
- :root {
2
- --conduction-table-wrapper-scroll-button-background-color: #ffffff;
3
- --conduction-table-wrapper-scroll-button-color: #000000;
4
- --conduction-table-wrapper-scroll-button-padding-inline-start: 14px;
5
- --conduction-table-wrapper-scroll-button-padding-inline-end: 14px;
6
- /* --conduction-table-wrapper-scroll-button-padding-block-start: 10px; */
7
- /* --conduction-table-wrapper-scroll-button-padding-block-end: 10px; */
8
- /* --conduction-table-wrapper-scroll-button-border-color: 1px; */
9
- /* --conduction-table-wrapper-scroll-button-border-color: solid; */
10
- /* --conduction-table-wrapper-scroll-button-border-color: #000000; */
11
-
12
- --conduction-table-wrapper-scroll-button-hover-background-color: #ffffff;
13
- --conduction-table-wrapper-scroll-button-hover-color: #4376fc;
14
- }
15
- .container {
16
- position: relative;
17
- }
18
-
19
- .wrapper,
20
- .wrapperTouchscreen {
21
- overflow-x: scroll;
22
- }
23
-
24
- .scrollRightButton,
25
- .scrollLeftButton {
26
- top: 0%;
27
- position: absolute;
28
- display: flex;
29
- height: 100%;
30
- background-color: var(--conduction-table-wrapper-scroll-button-background-color);
31
- color: var(--conduction-table-wrapper-scroll-button-color);
32
- padding-inline-start: var(--conduction-table-wrapper-scroll-button-padding-inline-start);
33
- padding-inline-end: var(--conduction-table-wrapper-scroll-button-padding-inline-end);
34
- padding-block-start: var(--conduction-table-wrapper-scroll-button-padding-block-start);
35
- padding-block-end: var(--conduction-table-wrapper-scroll-button-padding-block-end);
36
- border-width: var(--conduction-table-wrapper-scroll-button-border-width);
37
- border-style: var(--conduction-table-wrapper-scroll-button-border-style);
38
- border-color: var(--conduction-table-wrapper-scroll-button-border-color);
39
- }
40
-
41
- .scrollLeftButton:hover,
42
- .scrollRightButton:hover {
43
- background-color: var(--conduction-table-wrapper-scroll-button-hover-background-color);
44
- color: var(--conduction-table-wrapper-scroll-button-hover-color);
45
- cursor: pointer;
46
- }
47
-
48
- .scrollRightButton {
49
- right: 0;
50
- }
51
-
52
- .scrollLeftButton {
53
- left: 0;
54
- }
55
-
56
- .scrollButton {
57
- align-self: center;
58
- }
59
-
60
- /* Hide scrollbar */
61
- .wrapper::-webkit-scrollbar {
62
- display: none;
63
- }
64
- .wrapper {
65
- -ms-overflow-style: none;
66
- scrollbar-width: none;
67
- }
package/src/components/tableWrapper/TableWrapper.tsx DELETED
@@ -1,56 +0,0 @@
1
- import React, { useState, useEffect } from "react";
2
- import * as styles from "./TableWrapper.module.css";
3
- import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
4
- import { faChevronLeft, faChevronRight } from "@fortawesome/free-solid-svg-icons";
5
-
6
- export const TableWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => {
7
- const [canScrollRight, setCanScrollRight] = useState(false);
8
- const [canScrollLeft, setCanScrollLeft] = useState(false);
9
-
10
- const wrapperRef = React.useRef<HTMLDivElement | null>(null);
11
-
12
- const handleScroll = () => {
13
- if (wrapperRef.current) {
14
- setCanScrollLeft(wrapperRef.current.scrollLeft > 0);
15
- setCanScrollRight(
16
- wrapperRef.current.scrollWidth - wrapperRef.current.scrollLeft > wrapperRef.current.clientWidth,
17
- );
18
- }
19
- };
20
-
21
- const handleScrollRight = () => {
22
- if (wrapperRef.current) wrapperRef.current.scrollTo({ left: wrapperRef.current.scrollWidth, behavior: "smooth" });
23
- };
24
-
25
- const handleScrollLeft = () => {
26
- if (wrapperRef.current) wrapperRef.current.scrollTo({ left: 0, behavior: "smooth" });
27
- };
28
-
29
- useEffect(() => {
30
- if (wrapperRef.current) {
31
- setCanScrollRight(wrapperRef.current.scrollWidth > wrapperRef.current.clientWidth); // initiate scroll
32
- }
33
- }, []);
34
-
35
- return (
36
- <div className={styles.container}>
37
- <div onScroll={handleScroll} ref={wrapperRef} className={styles.wrapper}>
38
- {canScrollLeft && (
39
- <div onClick={handleScrollLeft} className={styles.scrollLeftButton}>
40
- <div className={styles.scrollButton}>
41
- <FontAwesomeIcon icon={faChevronLeft} />
42
- </div>
43
- </div>
44
- )}
45
- {children}
46
- {canScrollRight && (
47
- <div onClick={handleScrollRight} className={styles.scrollRightButton}>
48
- <div className={styles.scrollButton}>
49
- <FontAwesomeIcon icon={faChevronRight} />
50
- </div>
51
- </div>
52
- )}
53
- </div>
54
- </div>
55
- );
56
- };