@conduction/components 2.1.34 → 2.1.36

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 (131) hide show
  1. package/.github/workflows/npm-publish.yml +39 -39
  2. package/.prettierrc +30 -30
  3. package/README.md +4 -0
  4. package/lib/components/badgeCounter/BadgeCounter.d.ts +8 -8
  5. package/lib/components/badgeCounter/BadgeCounter.js +4 -4
  6. package/lib/components/badgeCounter/BadgeCounter.module.css +27 -27
  7. package/lib/components/card/cardHeader/CardHeader.d.ts +4 -0
  8. package/lib/components/card/cardHeader/CardHeader.js +14 -0
  9. package/lib/components/card/cardHeader/CardHeader.module.css +36 -0
  10. package/lib/components/card/cardWrapper/CardWrapper.d.ts +2 -0
  11. package/lib/components/card/cardWrapper/CardWrapper.js +6 -0
  12. package/lib/components/card/cardWrapper/CardWrapper.module.css +32 -0
  13. package/lib/components/card/detailsCard/DetailsCard.d.ts +14 -13
  14. package/lib/components/card/detailsCard/DetailsCard.js +11 -11
  15. package/lib/components/card/downloadCard/DownloadCard.d.ts +11 -10
  16. package/lib/components/card/downloadCard/DownloadCard.js +9 -9
  17. package/lib/components/card/horizontalImageCard/HorizontalImageCard.d.ts +13 -12
  18. package/lib/components/card/horizontalImageCard/HorizontalImageCard.js +9 -9
  19. package/lib/components/card/horizontalImageCard/HorizontalImageCard.module.css +34 -34
  20. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.d.ts +14 -13
  21. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.js +10 -10
  22. package/lib/components/card/index.d.ts +9 -7
  23. package/lib/components/card/index.js +9 -7
  24. package/lib/components/card/infoCard/InfoCard.d.ts +8 -7
  25. package/lib/components/card/infoCard/InfoCard.js +6 -6
  26. package/lib/components/card/infoCard/InfoCard.module.css +26 -26
  27. package/lib/components/card/richContentCard/RichContentCard.d.ts +19 -18
  28. package/lib/components/card/richContentCard/RichContentCard.js +16 -16
  29. package/lib/components/card/richContentCard/RichContentCard.module.css +93 -93
  30. package/lib/components/codeBlock/CodeBlock.d.ts +6 -5
  31. package/lib/components/codeBlock/CodeBlock.js +3 -3
  32. package/lib/components/codeBlock/CodeBlock.module.css +6 -6
  33. package/lib/components/container/Container.d.ts +6 -6
  34. package/lib/components/container/Container.js +4 -4
  35. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  36. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.d.ts +17 -16
  37. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.js +20 -20
  38. package/lib/components/denhaag-wrappers/pagination/Pagination.css +120 -120
  39. package/lib/components/denhaag-wrappers/pagination/Pagination.d.ts +9 -8
  40. package/lib/components/denhaag-wrappers/pagination/Pagination.js +15 -15
  41. package/lib/components/editableTableRow/EditableTableRow.d.ts +14 -13
  42. package/lib/components/editableTableRow/EditableTableRow.js +31 -31
  43. package/lib/components/editableTableRow/EditableTableRow.module.css +25 -25
  44. package/lib/components/formFields/checkbox/Checkbox.module.css +7 -7
  45. package/lib/components/formFields/checkbox/checkbox.d.ts +9 -8
  46. package/lib/components/formFields/checkbox/checkbox.js +3 -3
  47. package/lib/components/formFields/createKeyValue/CreateKeyValue.d.ts +23 -22
  48. package/lib/components/formFields/createKeyValue/CreateKeyValue.js +42 -42
  49. package/lib/components/formFields/date/Date.d.ts +12 -11
  50. package/lib/components/formFields/date/Date.js +10 -10
  51. package/lib/components/formFields/date/Date.module.css +12 -12
  52. package/lib/components/formFields/errorMessage/ErrorMessage.d.ts +5 -4
  53. package/lib/components/formFields/errorMessage/ErrorMessage.js +3 -3
  54. package/lib/components/formFields/index.d.ts +8 -8
  55. package/lib/components/formFields/index.js +8 -8
  56. package/lib/components/formFields/input.d.ts +21 -21
  57. package/lib/components/formFields/input.js +12 -12
  58. package/lib/components/formFields/radio.d.ts +9 -8
  59. package/lib/components/formFields/radio.js +3 -3
  60. package/lib/components/formFields/select/select.d.ts +23 -22
  61. package/lib/components/formFields/select/select.js +22 -22
  62. package/lib/components/formFields/textarea.d.ts +9 -8
  63. package/lib/components/formFields/textarea.js +4 -4
  64. package/lib/components/formFields/types.d.ts +6 -6
  65. package/lib/components/formFields/types.js +1 -1
  66. package/lib/components/imageDivider/ImageDivider.d.ts +7 -6
  67. package/lib/components/imageDivider/ImageDivider.js +6 -6
  68. package/lib/components/imageDivider/imageDivider.module.css +5 -5
  69. package/lib/components/logo/Logo.d.ts +8 -7
  70. package/lib/components/logo/Logo.js +10 -10
  71. package/lib/components/logo/Logo.module.css +15 -15
  72. package/lib/components/metaIcon/MetaIcon.d.ts +7 -6
  73. package/lib/components/metaIcon/MetaIcon.js +3 -3
  74. package/lib/components/metaIcon/MetaIcon.module.css +29 -29
  75. package/lib/components/notificationPopUp/NotificationPopUp.d.ts +26 -25
  76. package/lib/components/notificationPopUp/NotificationPopUp.js +34 -34
  77. package/lib/components/privateRoute/PrivateRoute.d.ts +6 -6
  78. package/lib/components/privateRoute/PrivateRoute.js +15 -15
  79. package/lib/components/quoteWrapper/QuoteWrapper.d.ts +7 -7
  80. package/lib/components/quoteWrapper/QuoteWrapper.js +5 -5
  81. package/lib/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  82. package/lib/components/statusSteps/StatusSteps.d.ts +13 -0
  83. package/lib/components/statusSteps/StatusSteps.js +5 -0
  84. package/lib/components/tag/Tag.d.ts +10 -9
  85. package/lib/components/tag/Tag.js +6 -6
  86. package/lib/components/tag/Tag.module.css +44 -44
  87. package/lib/components/toolTip/ToolTip.d.ts +9 -9
  88. package/lib/components/toolTip/ToolTip.js +8 -8
  89. package/lib/components/topNav/index.d.ts +3 -3
  90. package/lib/components/topNav/index.js +3 -3
  91. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.d.ts +20 -19
  92. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.js +17 -17
  93. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.d.ts +12 -11
  94. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.js +7 -7
  95. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.module.css +63 -63
  96. package/lib/index.d.ts +26 -25
  97. package/lib/index.js +19 -19
  98. package/package.json +1 -1
  99. package/src/components/badgeCounter/BadgeCounter.module.css +27 -27
  100. package/src/components/card/cardHeader/CardHeader.module.css +36 -0
  101. package/src/components/card/cardHeader/CardHeader.tsx +20 -0
  102. package/src/components/card/cardWrapper/CardWrapper.module.css +32 -0
  103. package/src/components/card/cardWrapper/CardWrapper.tsx +8 -0
  104. package/src/components/card/horizontalImageCard/HorizontalImageCard.module.css +34 -34
  105. package/src/components/card/index.js +5 -5
  106. package/src/components/card/index.tsx +21 -8
  107. package/src/components/card/infoCard/InfoCard.module.css +26 -26
  108. package/src/components/card/richContentCard/RichContentCard.module.css +93 -93
  109. package/src/components/codeBlock/CodeBlock.module.css +6 -6
  110. package/src/components/container/Container.js +3 -3
  111. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  112. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.js +84 -84
  113. package/src/components/denhaag-wrappers/pagination/Pagination.css +120 -120
  114. package/src/components/editableTableRow/EditableTableRow.module.css +25 -25
  115. package/src/components/formFields/checkbox/Checkbox.module.css +7 -7
  116. package/src/components/formFields/date/Date.module.css +12 -12
  117. package/src/components/formFields/index.js +4 -4
  118. package/src/components/formFields/textarea.js +3 -3
  119. package/src/components/formFields/types.js +1 -1
  120. package/src/components/imageDivider/ImageDivider.js +6 -6
  121. package/src/components/imageDivider/imageDivider.module.css +5 -5
  122. package/src/components/logo/Logo.js +10 -10
  123. package/src/components/logo/Logo.module.css +15 -15
  124. package/src/components/metaIcon/MetaIcon.js +3 -3
  125. package/src/components/metaIcon/MetaIcon.module.css +29 -29
  126. package/src/components/privateRoute/PrivateRoute.js +15 -15
  127. package/src/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  128. package/src/components/tag/Tag.module.css +44 -44
  129. package/src/components/topNav/index.ts +4 -4
  130. package/src/components/topNav/secondaryTopNav/SecondaryTopNav.module.css +63 -63
  131. package/src/custom.d.ts +4 -4
@@ -1,29 +1,29 @@
1
- :root {
2
- --conduction-meta-icon-icon-size: var(--skeleton-size-lg);
3
- --conduction-meta-icon-icon-color: var(--skeleton-color-secondary-4);
4
- }
5
-
6
- .container {
7
- display: flex;
8
- align-items: center;
9
- flex-direction: column;
10
- }
11
-
12
- .container > *:not(:last-child) {
13
- margin-block-end: var(--skeleton-size-xs);
14
- }
15
-
16
- .icon {
17
- color: var(--conduction-meta-icon-icon-color);
18
- height: var(--conduction-meta-icon-icon-size);
19
- width: var(--conduction-meta-icon-icon-size);
20
- }
21
-
22
- .icon > svg {
23
- height: 100%;
24
- width: 100%;
25
- }
26
-
27
- .value {
28
- font-weight: var(--skeleton-font-weight-bold);
29
- }
1
+ :root {
2
+ --conduction-meta-icon-icon-size: var(--skeleton-size-lg);
3
+ --conduction-meta-icon-icon-color: var(--skeleton-color-secondary-4);
4
+ }
5
+
6
+ .container {
7
+ display: flex;
8
+ align-items: center;
9
+ flex-direction: column;
10
+ }
11
+
12
+ .container > *:not(:last-child) {
13
+ margin-block-end: var(--skeleton-size-xs);
14
+ }
15
+
16
+ .icon {
17
+ color: var(--conduction-meta-icon-icon-color);
18
+ height: var(--conduction-meta-icon-icon-size);
19
+ width: var(--conduction-meta-icon-icon-size);
20
+ }
21
+
22
+ .icon > svg {
23
+ height: 100%;
24
+ width: 100%;
25
+ }
26
+
27
+ .value {
28
+ font-weight: var(--skeleton-font-weight-bold);
29
+ }
@@ -1,15 +1,15 @@
1
- import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
2
- import React from "react";
3
- import { navigate } from "gatsby";
4
- export const PrivateRoute = ({ children, isLoggedIn }) => {
5
- const [authenticated, setAuthenticated] = React.useState(false);
6
- React.useEffect(() => {
7
- if (!isLoggedIn && window.location.pathname !== "/login") {
8
- navigate("/login");
9
- }
10
- isLoggedIn && setAuthenticated(true);
11
- }, [isLoggedIn]);
12
- if (!authenticated)
13
- return _jsx(_Fragment, {});
14
- return _jsx(_Fragment, { children: children });
15
- };
1
+ import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
2
+ import React from "react";
3
+ import { navigate } from "gatsby";
4
+ export const PrivateRoute = ({ children, isLoggedIn }) => {
5
+ const [authenticated, setAuthenticated] = React.useState(false);
6
+ React.useEffect(() => {
7
+ if (!isLoggedIn && window.location.pathname !== "/login") {
8
+ navigate("/login");
9
+ }
10
+ isLoggedIn && setAuthenticated(true);
11
+ }, [isLoggedIn]);
12
+ if (!authenticated)
13
+ return _jsx(_Fragment, {});
14
+ return _jsx(_Fragment, { children: children });
15
+ };
@@ -1,12 +1,12 @@
1
- :root {
2
- --conduction-quote-wrapper-border-width: var(--skeleton-size-sm);
3
- --conduction-quote-wrapper-border-color: var(--skeleton-color-grey-1);
4
- --conduction-quote-wrapper-padding-inline: var(--skeleton-size-lg);
5
- }
6
-
7
- .container {
8
- border-left-width: var(--conduction-quote-wrapper-border-width);
9
- border-left-style: solid;
10
- border-left-color: var(--conduction-quote-wrapper-border-color);
11
- padding-inline-start: var(--conduction-quote-wrapper-padding-inline);
12
- }
1
+ :root {
2
+ --conduction-quote-wrapper-border-width: var(--skeleton-size-sm);
3
+ --conduction-quote-wrapper-border-color: var(--skeleton-color-grey-1);
4
+ --conduction-quote-wrapper-padding-inline: var(--skeleton-size-lg);
5
+ }
6
+
7
+ .container {
8
+ border-left-width: var(--conduction-quote-wrapper-border-width);
9
+ border-left-style: solid;
10
+ border-left-color: var(--conduction-quote-wrapper-border-color);
11
+ padding-inline-start: var(--conduction-quote-wrapper-padding-inline);
12
+ }
@@ -1,44 +1,44 @@
1
- :root {
2
- --conduction-tag-font-size: var(--skeleton-font-size-sm);
3
- --conduction-tag-color: var(--skeleton-black);
4
- --conduction-tag-background-color: var(--skeleton-color-grey-1);
5
- --conduction-tag-border-radius: var(--skeleton-border-radius-md);
6
- --conduction-tag-padding: var(--skeleton-size-xs);
7
- --conduction-tag-icon-margin-inline-end: var(--skeleton-size-2xs);
8
- --conduction-tag-remove-background-color: #ffbdad;
9
- --conduction-tag-remove-text-color: #e44f2a;
10
- }
11
-
12
- .tag {
13
- display: inline-block;
14
- width: fit-content;
15
- font-size: var(--conduction-tag-font-size);
16
- color: var(--conduction-tag-color);
17
- background-color: var(--conduction-tag-background-color);
18
- padding-inline-start: var(--conduction-tag-padding);
19
- padding-inline-end: var(--conduction-tag-padding);
20
- padding-block-start: var(--conduction-tag-padding);
21
- padding-block-end: var(--conduction-tag-padding);
22
- }
23
-
24
- .tag > *:not(:last-child) {
25
- margin-inline-end: var(--conduction-tag-icon-margin-inline-end);
26
- }
27
-
28
- .clickable :hover {
29
- cursor: pointer;
30
- }
31
-
32
- .remove {
33
- padding-inline-end: 4px;
34
- }
35
-
36
- .tagContainer {
37
- display: flex;
38
- }
39
-
40
- .removeTag:hover {
41
- cursor: pointer;
42
- background-color: var(--conduction-tag-remove-background-color);
43
- color: var(--conduction-tag-remove-text-color);
44
- }
1
+ :root {
2
+ --conduction-tag-font-size: var(--skeleton-font-size-sm);
3
+ --conduction-tag-color: var(--skeleton-black);
4
+ --conduction-tag-background-color: var(--skeleton-color-grey-1);
5
+ --conduction-tag-border-radius: var(--skeleton-border-radius-md);
6
+ --conduction-tag-padding: var(--skeleton-size-xs);
7
+ --conduction-tag-icon-margin-inline-end: var(--skeleton-size-2xs);
8
+ --conduction-tag-remove-background-color: #ffbdad;
9
+ --conduction-tag-remove-text-color: #e44f2a;
10
+ }
11
+
12
+ .tag {
13
+ display: inline-block;
14
+ width: fit-content;
15
+ font-size: var(--conduction-tag-font-size);
16
+ color: var(--conduction-tag-color);
17
+ background-color: var(--conduction-tag-background-color);
18
+ padding-inline-start: var(--conduction-tag-padding);
19
+ padding-inline-end: var(--conduction-tag-padding);
20
+ padding-block-start: var(--conduction-tag-padding);
21
+ padding-block-end: var(--conduction-tag-padding);
22
+ }
23
+
24
+ .tag > *:not(:last-child) {
25
+ margin-inline-end: var(--conduction-tag-icon-margin-inline-end);
26
+ }
27
+
28
+ .clickable :hover {
29
+ cursor: pointer;
30
+ }
31
+
32
+ .remove {
33
+ padding-inline-end: 4px;
34
+ }
35
+
36
+ .tagContainer {
37
+ display: flex;
38
+ }
39
+
40
+ .removeTag:hover {
41
+ cursor: pointer;
42
+ background-color: var(--conduction-tag-remove-background-color);
43
+ color: var(--conduction-tag-remove-text-color);
44
+ }
@@ -1,4 +1,4 @@
1
- import { PrimaryTopNav } from "./primaryTopNav/PrimaryTopNav";
2
- import { SecondaryTopNav } from "./secondaryTopNav/SecondaryTopNav";
3
-
4
- export { PrimaryTopNav, SecondaryTopNav };
1
+ import { PrimaryTopNav } from "./primaryTopNav/PrimaryTopNav";
2
+ import { SecondaryTopNav } from "./secondaryTopNav/SecondaryTopNav";
3
+
4
+ export { PrimaryTopNav, SecondaryTopNav };
@@ -1,63 +1,63 @@
1
- :root {
2
- --conduction-secondary-top-nav-item-padding: var(--skeleton-size-md);
3
- --conduction-secondary-top-nav-font-size: var(--skeleton-font-size-md);
4
- --conduction-secondary-top-nav-color: var(--skeleton-color-white);
5
- --conduction-secondary-top-nav-background-color: var(--skeleton-color-secondary-5);
6
- --conduction-secondary-top-nav-background-color-hover: rgba(0, 0, 0, 0.1);
7
- --conduction-secondary-top-nav-font-weight: var(--skeleton-font-weight-light);
8
- --conduction-secondary-top-nav-color-active: rgba(0, 0, 0, 0.1);
9
- --conduction-secondary-top-nav-box-shadow-active: inset 0 -4px black;
10
- --conduction-secondary-top-nav-item-icon-margin: var(--skeleton-size-2x);
11
- }
12
-
13
- .secondary:hover {
14
- cursor: pointer;
15
- }
16
-
17
- .ul {
18
- margin: unset;
19
- display: flex;
20
- padding-inline-start: unset;
21
- align-items: center;
22
- }
23
-
24
- .li {
25
- list-style-type: none;
26
- display: block;
27
- padding-inline-start: var(--conduction-secondary-top-nav-item-padding);
28
- padding-inline-end: var(--conduction-secondary-top-nav-item-padding);
29
- padding-block-start: var(--conduction-secondary-top-nav-item-padding);
30
- padding-block-end: var(--conduction-secondary-top-nav-item-padding);
31
- }
32
-
33
- .li:hover {
34
- background-color: var(--conduction-secondary-top-nav-background-color-hover);
35
- }
36
-
37
- .current {
38
- background-color: var(--conduction-secondary-top-nav-color-active);
39
- box-shadow: var(--conduction-secondary-top-nav-box-shadow-active);
40
- }
41
-
42
- .secondary {
43
- font-weight: var(--conduction-secondary-top-nav-font-weight);
44
- width: fit-content;
45
- font-size: var(--conduction-secondary-top-nav-font-size);
46
- background-color: var(--conduction-secondary-top-nav-background-color);
47
- }
48
-
49
- .secondary .link {
50
- color: var(--conduction-secondary-top-nav-color);
51
- display: block;
52
- }
53
-
54
- .label {
55
- overflow: hidden;
56
- max-width: 37ch;
57
- text-overflow: ellipsis;
58
- white-space: nowrap;
59
- }
60
-
61
- .label > :not(:last-child) {
62
- margin-inline-end: var(--conduction-secondary-top-nav-item-icon-margin);
63
- }
1
+ :root {
2
+ --conduction-secondary-top-nav-item-padding: var(--skeleton-size-md);
3
+ --conduction-secondary-top-nav-font-size: var(--skeleton-font-size-md);
4
+ --conduction-secondary-top-nav-color: var(--skeleton-color-white);
5
+ --conduction-secondary-top-nav-background-color: var(--skeleton-color-secondary-5);
6
+ --conduction-secondary-top-nav-background-color-hover: rgba(0, 0, 0, 0.1);
7
+ --conduction-secondary-top-nav-font-weight: var(--skeleton-font-weight-light);
8
+ --conduction-secondary-top-nav-color-active: rgba(0, 0, 0, 0.1);
9
+ --conduction-secondary-top-nav-box-shadow-active: inset 0 -4px black;
10
+ --conduction-secondary-top-nav-item-icon-margin: var(--skeleton-size-2x);
11
+ }
12
+
13
+ .secondary:hover {
14
+ cursor: pointer;
15
+ }
16
+
17
+ .ul {
18
+ margin: unset;
19
+ display: flex;
20
+ padding-inline-start: unset;
21
+ align-items: center;
22
+ }
23
+
24
+ .li {
25
+ list-style-type: none;
26
+ display: block;
27
+ padding-inline-start: var(--conduction-secondary-top-nav-item-padding);
28
+ padding-inline-end: var(--conduction-secondary-top-nav-item-padding);
29
+ padding-block-start: var(--conduction-secondary-top-nav-item-padding);
30
+ padding-block-end: var(--conduction-secondary-top-nav-item-padding);
31
+ }
32
+
33
+ .li:hover {
34
+ background-color: var(--conduction-secondary-top-nav-background-color-hover);
35
+ }
36
+
37
+ .current {
38
+ background-color: var(--conduction-secondary-top-nav-color-active);
39
+ box-shadow: var(--conduction-secondary-top-nav-box-shadow-active);
40
+ }
41
+
42
+ .secondary {
43
+ font-weight: var(--conduction-secondary-top-nav-font-weight);
44
+ width: fit-content;
45
+ font-size: var(--conduction-secondary-top-nav-font-size);
46
+ background-color: var(--conduction-secondary-top-nav-background-color);
47
+ }
48
+
49
+ .secondary .link {
50
+ color: var(--conduction-secondary-top-nav-color);
51
+ display: block;
52
+ }
53
+
54
+ .label {
55
+ overflow: hidden;
56
+ max-width: 37ch;
57
+ text-overflow: ellipsis;
58
+ white-space: nowrap;
59
+ }
60
+
61
+ .label > :not(:last-child) {
62
+ margin-inline-end: var(--conduction-secondary-top-nav-item-icon-margin);
63
+ }
package/src/custom.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- declare module "*.svg";
2
- declare module "*.jpg";
3
- declare module "*.png";
4
- declare module "*.module.css";
1
+ declare module "*.svg";
2
+ declare module "*.jpg";
3
+ declare module "*.png";
4
+ declare module "*.module.css";