@conduction/components 2.0.33 → 2.1.0

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 (172) hide show
  1. package/.github/workflows/npm-publish.yml +39 -39
  2. package/.prettierrc +30 -30
  3. package/README.md +70 -65
  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/detailsCard/DetailsCard.d.ts +14 -14
  8. package/lib/components/card/detailsCard/DetailsCard.js +10 -10
  9. package/lib/components/card/detailsCard/DetailsCard.module.css +51 -51
  10. package/lib/components/card/downloadCard/DownloadCard.d.ts +11 -11
  11. package/lib/components/card/downloadCard/DownloadCard.js +8 -8
  12. package/lib/components/card/downloadCard/DownloadCard.module.css +27 -27
  13. package/lib/components/card/horizontalImageCard/HorizontalImageCard.d.ts +13 -13
  14. package/lib/components/card/horizontalImageCard/HorizontalImageCard.js +9 -9
  15. package/lib/components/card/horizontalImageCard/HorizontalImageCard.module.css +34 -34
  16. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.d.ts +14 -14
  17. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.js +9 -9
  18. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.module.css +63 -63
  19. package/lib/components/card/index.d.ts +7 -7
  20. package/lib/components/card/index.js +7 -7
  21. package/lib/components/card/infoCard/InfoCard.d.ts +8 -8
  22. package/lib/components/card/infoCard/InfoCard.js +6 -6
  23. package/lib/components/card/infoCard/InfoCard.module.css +26 -26
  24. package/lib/components/card/richContentCard/RichContentCard.d.ts +19 -19
  25. package/lib/components/card/richContentCard/RichContentCard.js +15 -15
  26. package/lib/components/card/richContentCard/RichContentCard.module.css +93 -93
  27. package/lib/components/codeBlock/CodeBlock.d.ts +6 -6
  28. package/lib/components/codeBlock/CodeBlock.js +3 -3
  29. package/lib/components/codeBlock/CodeBlock.module.css +6 -6
  30. package/lib/components/container/Container.d.ts +6 -6
  31. package/lib/components/container/Container.js +4 -4
  32. package/lib/components/container/Container.module.css +9 -9
  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.d.ts +9 -9
  43. package/lib/components/formFields/checkbox.js +3 -3
  44. package/lib/components/formFields/createKeyValue/CreateKeyValue.d.ts +17 -17
  45. package/lib/components/formFields/createKeyValue/CreateKeyValue.js +31 -31
  46. package/lib/components/formFields/createKeyValue/CreateKeyValue.module.css +43 -43
  47. package/lib/components/formFields/index.d.ts +7 -7
  48. package/lib/components/formFields/index.js +7 -7
  49. package/lib/components/formFields/input.d.ts +24 -22
  50. package/lib/components/formFields/input.js +19 -16
  51. package/lib/components/formFields/radio.d.ts +9 -9
  52. package/lib/components/formFields/radio.js +3 -3
  53. package/lib/components/formFields/select/select.d.ts +18 -18
  54. package/lib/components/formFields/select/select.js +21 -21
  55. package/lib/components/formFields/select/select.module.css +38 -38
  56. package/lib/components/formFields/textarea.d.ts +8 -8
  57. package/lib/components/formFields/textarea.js +3 -3
  58. package/lib/components/formFields/types.d.ts +6 -6
  59. package/lib/components/formFields/types.js +1 -1
  60. package/lib/components/imageDivider/ImageDivider.d.ts +7 -7
  61. package/lib/components/imageDivider/ImageDivider.js +6 -6
  62. package/lib/components/imageDivider/imageDivider.module.css +5 -5
  63. package/lib/components/logo/Logo.d.ts +8 -8
  64. package/lib/components/logo/Logo.js +10 -10
  65. package/lib/components/logo/Logo.module.css +15 -15
  66. package/lib/components/metaIcon/MetaIcon.d.ts +7 -7
  67. package/lib/components/metaIcon/MetaIcon.js +3 -3
  68. package/lib/components/metaIcon/MetaIcon.module.css +29 -29
  69. package/lib/components/notificationPopUp/NotificationPopUp.d.ts +24 -24
  70. package/lib/components/notificationPopUp/NotificationPopUp.js +31 -31
  71. package/lib/components/notificationPopUp/NotificationPopUp.module.css +61 -61
  72. package/lib/components/privateRoute/PrivateRoute.d.ts +6 -6
  73. package/lib/components/privateRoute/PrivateRoute.js +15 -15
  74. package/lib/components/quoteWrapper/QuoteWrapper.d.ts +7 -7
  75. package/lib/components/quoteWrapper/QuoteWrapper.js +5 -5
  76. package/lib/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  77. package/lib/components/statusSteps/StatusSteps.d.ts +13 -13
  78. package/lib/components/statusSteps/StatusSteps.js +5 -5
  79. package/lib/components/tag/Tag.d.ts +10 -10
  80. package/lib/components/tag/Tag.js +6 -6
  81. package/lib/components/tag/Tag.module.css +44 -44
  82. package/lib/components/toolTip/ToolTip.d.ts +9 -9
  83. package/lib/components/toolTip/ToolTip.js +7 -7
  84. package/lib/components/toolTip/ToolTip.module.css +4 -4
  85. package/lib/components/topNav/index.d.ts +3 -3
  86. package/lib/components/topNav/index.js +3 -3
  87. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.d.ts +20 -20
  88. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.js +17 -17
  89. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.module.css +141 -141
  90. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.d.ts +12 -12
  91. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.js +7 -7
  92. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.module.css +63 -63
  93. package/lib/index.d.ts +27 -27
  94. package/lib/index.js +20 -20
  95. package/package.json +46 -51
  96. package/src/components/badgeCounter/BadgeCounter.module.css +27 -27
  97. package/src/components/badgeCounter/BadgeCounter.tsx +16 -16
  98. package/src/components/card/detailsCard/DetailsCard.module.css +51 -51
  99. package/src/components/card/detailsCard/DetailsCard.tsx +56 -56
  100. package/src/components/card/downloadCard/DownloadCard.js +10 -10
  101. package/src/components/card/downloadCard/DownloadCard.module.css +27 -27
  102. package/src/components/card/downloadCard/DownloadCard.tsx +40 -40
  103. package/src/components/card/horizontalImageCard/HorizontalImageCard.js +9 -9
  104. package/src/components/card/horizontalImageCard/HorizontalImageCard.module.css +34 -34
  105. package/src/components/card/horizontalImageCard/HorizontalImageCard.tsx +37 -37
  106. package/src/components/card/imageAndDetailsCard/ImageAndDetailsCard.js +9 -9
  107. package/src/components/card/imageAndDetailsCard/ImageAndDetailsCard.module.css +63 -63
  108. package/src/components/card/imageAndDetailsCard/ImageAndDetailsCard.tsx +49 -49
  109. package/src/components/card/index.js +5 -5
  110. package/src/components/card/index.tsx +8 -8
  111. package/src/components/card/infoCard/InfoCard.module.css +26 -26
  112. package/src/components/card/infoCard/InfoCard.tsx +19 -19
  113. package/src/components/card/richContentCard/RichContentCard.js +17 -17
  114. package/src/components/card/richContentCard/RichContentCard.module.css +93 -93
  115. package/src/components/card/richContentCard/RichContentCard.tsx +98 -98
  116. package/src/components/codeBlock/CodeBlock.module.css +6 -6
  117. package/src/components/codeBlock/CodeBlock.tsx +8 -8
  118. package/src/components/container/Container.js +3 -3
  119. package/src/components/container/Container.module.css +9 -9
  120. package/src/components/container/Container.tsx +11 -11
  121. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  122. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.js +20 -20
  123. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.tsx +89 -89
  124. package/src/components/denhaag-wrappers/pagination/Pagination.css +120 -120
  125. package/src/components/denhaag-wrappers/pagination/Pagination.tsx +112 -112
  126. package/src/components/editableTableRow/EditableTableRow.js +34 -34
  127. package/src/components/editableTableRow/EditableTableRow.module.css +25 -25
  128. package/src/components/editableTableRow/EditableTableRow.tsx +138 -138
  129. package/src/components/formFields/checkbox.js +3 -3
  130. package/src/components/formFields/checkbox.tsx +30 -30
  131. package/src/components/formFields/createKeyValue/CreateKeyValue.module.css +43 -43
  132. package/src/components/formFields/createKeyValue/CreateKeyValue.tsx +125 -125
  133. package/src/components/formFields/index.js +4 -4
  134. package/src/components/formFields/index.tsx +33 -32
  135. package/src/components/formFields/input.js +12 -12
  136. package/src/components/formFields/input.tsx +179 -176
  137. package/src/components/formFields/radio.tsx +21 -21
  138. package/src/components/formFields/select/select.module.css +38 -38
  139. package/src/components/formFields/select/select.tsx +107 -105
  140. package/src/components/formFields/textarea.js +3 -3
  141. package/src/components/formFields/textarea.tsx +17 -17
  142. package/src/components/formFields/types.js +1 -1
  143. package/src/components/formFields/types.ts +7 -7
  144. package/src/components/imageDivider/ImageDivider.js +6 -6
  145. package/src/components/imageDivider/ImageDivider.tsx +12 -12
  146. package/src/components/imageDivider/imageDivider.module.css +5 -5
  147. package/src/components/logo/Logo.js +10 -10
  148. package/src/components/logo/Logo.module.css +15 -15
  149. package/src/components/logo/Logo.tsx +25 -25
  150. package/src/components/metaIcon/MetaIcon.js +3 -3
  151. package/src/components/metaIcon/MetaIcon.module.css +29 -29
  152. package/src/components/metaIcon/MetaIcon.tsx +18 -18
  153. package/src/components/notificationPopUp/NotificationPopUp.module.css +61 -61
  154. package/src/components/notificationPopUp/NotificationPopUp.tsx +87 -87
  155. package/src/components/privateRoute/PrivateRoute.js +15 -15
  156. package/src/components/privateRoute/PrivateRoute.tsx +22 -22
  157. package/src/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  158. package/src/components/quoteWrapper/QuoteWrapper.tsx +15 -15
  159. package/src/components/statusSteps/StatusSteps.js +5 -5
  160. package/src/components/statusSteps/StatusSteps.tsx +54 -54
  161. package/src/components/tag/Tag.module.css +44 -44
  162. package/src/components/tag/Tag.tsx +37 -37
  163. package/src/components/toolTip/ToolTip.module.css +4 -4
  164. package/src/components/toolTip/ToolTip.tsx +24 -24
  165. package/src/components/topNav/index.ts +4 -4
  166. package/src/components/topNav/primaryTopNav/PrimaryTopNav.module.css +141 -141
  167. package/src/components/topNav/primaryTopNav/PrimaryTopNav.tsx +81 -81
  168. package/src/components/topNav/secondaryTopNav/SecondaryTopNav.module.css +63 -63
  169. package/src/components/topNav/secondaryTopNav/SecondaryTopNav.tsx +27 -27
  170. package/src/custom.d.ts +4 -4
  171. package/src/index.js +14 -14
  172. package/src/index.ts +79 -79
@@ -1,39 +1,39 @@
1
- # This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
2
- # For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
3
-
4
- name: Node.js Package
5
-
6
- on:
7
- push:
8
- branches:
9
- - development
10
-
11
- jobs:
12
- build:
13
- runs-on: ubuntu-latest
14
- steps:
15
- - uses: actions/checkout@v3
16
- - uses: actions/setup-node@v3
17
- with:
18
- node-version: 16
19
-
20
- publish-npm:
21
- needs: build
22
- runs-on: ubuntu-latest
23
- steps:
24
- - uses: actions/checkout@v3
25
- - uses: actions/setup-node@v3
26
- with:
27
- node-version: 16
28
- registry-url: https://registry.npmjs.org/
29
- - run: |
30
- git --version
31
- git config user.name "GitHub Version patch"
32
- git config user.email "<>"
33
- git checkout development
34
- git clean -f -n
35
- - run: npm install
36
- - run: npm version patch
37
- - run: npm publish
38
- env:
39
- NODE_AUTH_TOKEN: ${{secrets.npm_token}}
1
+ # This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
2
+ # For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
3
+
4
+ name: Node.js Package
5
+
6
+ on:
7
+ push:
8
+ branches:
9
+ - development
10
+
11
+ jobs:
12
+ build:
13
+ runs-on: ubuntu-latest
14
+ steps:
15
+ - uses: actions/checkout@v3
16
+ - uses: actions/setup-node@v3
17
+ with:
18
+ node-version: 16
19
+
20
+ publish-npm:
21
+ needs: build
22
+ runs-on: ubuntu-latest
23
+ steps:
24
+ - uses: actions/checkout@v3
25
+ - uses: actions/setup-node@v3
26
+ with:
27
+ node-version: 16
28
+ registry-url: https://registry.npmjs.org/
29
+ - run: |
30
+ git --version
31
+ git config user.name "GitHub Version patch"
32
+ git config user.email "<>"
33
+ git checkout development
34
+ git clean -f -n
35
+ - run: npm install
36
+ - run: npm version patch
37
+ - run: npm publish
38
+ env:
39
+ NODE_AUTH_TOKEN: ${{secrets.npm_token}}
package/.prettierrc CHANGED
@@ -1,30 +1,30 @@
1
- {
2
- "overrides": [
3
- {
4
- "files": ["*.json"],
5
- "options": {
6
- "parser": "json",
7
- "printWidth": 120,
8
- "tabWidth": 2
9
- }
10
- },
11
- {
12
- "files": ["*.ts", "*.tsx"],
13
- "options": {
14
- "parser": "typescript",
15
- "printWidth": 120,
16
- "trailingComma": "all",
17
- "tabWidth": 2,
18
- "singleQuote": false
19
- }
20
- },
21
- {
22
- "files": ["*.css", "*.scss"],
23
- "options": {
24
- "parser": "css",
25
- "tabWidth": 2,
26
- "printWidth": 180
27
- }
28
- }
29
- ]
30
- }
1
+ {
2
+ "overrides": [
3
+ {
4
+ "files": ["*.json"],
5
+ "options": {
6
+ "parser": "json",
7
+ "printWidth": 120,
8
+ "tabWidth": 2
9
+ }
10
+ },
11
+ {
12
+ "files": ["*.ts", "*.tsx"],
13
+ "options": {
14
+ "parser": "typescript",
15
+ "printWidth": 120,
16
+ "trailingComma": "all",
17
+ "tabWidth": 2,
18
+ "singleQuote": false
19
+ }
20
+ },
21
+ {
22
+ "files": ["*.css", "*.scss"],
23
+ "options": {
24
+ "parser": "css",
25
+ "tabWidth": 2,
26
+ "printWidth": 180
27
+ }
28
+ }
29
+ ]
30
+ }
package/README.md CHANGED
@@ -1,65 +1,70 @@
1
- # Conduction Components
2
-
3
- ## Changelog
4
-
5
- - **Version 2**
6
-
7
- - 2.0.33: PrimaryTopNav sub items doesn't overlap main navbar anymore
8
- - 2.0.32:
9
- - SelectSingle update to include defaultValue in react-hook-form controller.
10
- - 2.0.31:
11
- - PrimaryTopNav clickbox now includes padding of nav items.
12
- - 2.0.30:
13
- - Selects now have an z-index.
14
- - Checkboxes now automatically have an id wich is a camelCase of "checkbox" plus the label, "checkboxLabel".
15
- - Removed styles warning on tag.
16
- - 2.0.29:
17
- - Added remove option to tags.
18
- - SelectSingle now removes selected option if filter deselect it.
19
- - 2.0.27 & 2.0.28: Cleanup
20
- - 2.0.26: Added Select element error states.
21
- - 2.0.25: Added InputURL component.
22
- - 2.0.24: Bugfix: @conduction not showing.
23
- - 2.0.23:
24
- - Added optional boxshadow to PrimaryTopNav.
25
- - Added maxLength to both TopNavs and added a gap to the icon and label of a TopNav item.
26
- - 2.0.22: Refactor InputNumber and InputFloat to return number type.
27
- - 2.0.21: Add InputDateTime component.
28
- - 2.0.20: Bugfix Textarea component to include correct field validation.
29
- - 2.0.19: Add disabled state to Textarea and InputCheckbox components.
30
- - 2.0.17 & 2.0.18: Refactor PrimaryTopNav styling.
31
- - 2.0.16: Remove styling warnings.
32
- - 2.0.15: Added mobile support to PrimaryTopNav.
33
- - 2.0.14: Refactored SelectCreate placeholder text.
34
- - 2.0.13: removed round borders of tag.
35
- - 2.0.11 & 2.0.12:
36
- - Added disabled state to SelectSingle component.
37
- - 2.0.10:
38
- - Added InputFloat (.00 decimals) component.
39
- - 2.0.9:
40
- - Added optional defaultChecked to InputCheckbox.
41
- - Added CreateKeyValue input.
42
- - Added CreateSelect input.
43
- - 2.0.8:
44
- - Added new Tooltip component using React-tooltip.
45
- - Added active status to PrimaryTopNav.
46
- - Added active status to SecondaryTopNav.
47
- - 2.0.7:
48
- - Added new BadgeCounter component.
49
- - Added CodeBlock component.
50
- - 2.0.6:
51
- - Added optional icon with default icon to the primary and secondary button in NotificationPopUp.
52
- - Added a handleClick function to the DownloadCard.
53
- - Added clickFunction, layoutClassName and renamed tag to label in the Tag component.
54
- - Edited DetailsCard to accommodate changes made to Tag component.
55
- - Edited RichContentCard to accommodate changes made to Tag component.
56
- - 2.0.5: wrong camelcase in npm publish/build fix.
57
- - 2.0.4: added layoutClassName to InfoCard.
58
- - 2.0.3: Bugfix: --conduction-container typo removed.
59
- - 2.0.2: Refactor SelectSingle formField with optional props.
60
- - 2.0.1: Refactor SecondaryTopNav css module import.
61
- - 2.0.0: components are now dependent on `--skeleton` design tokens, currently found [here](https://github.com/OpenCatalogi/web-app/blob/development/pwa/src/styling/design-tokens/skeleton-design-tokens.css).
62
-
63
- - **Version 1**
64
-
65
- - No changelog available.
1
+ # Conduction Components
2
+
3
+ ## Changelog
4
+
5
+ - **Version 2.1 (breaking changes from 2.0.x)**
6
+
7
+ - 2.1.0: InputDate now includes Den Haag InputDate component, requiring react-hook-form controls.
8
+
9
+ - **Version 2**
10
+
11
+ - 2.0.34: SelectMultiple and SelectCreate update to include defaultValue in react-hook-form controller.
12
+ - 2.0.33: PrimaryTopNav sub items doesn't overlap main navbar anymore
13
+ - 2.0.32:
14
+ - SelectSingle update to include defaultValue in react-hook-form controller.
15
+ - 2.0.31:
16
+ - PrimaryTopNav clickbox now includes padding of nav items.
17
+ - 2.0.30:
18
+ - Selects now have an z-index.
19
+ - Checkboxes now automatically have an id wich is a camelCase of "checkbox" plus the label, "checkboxLabel".
20
+ - Removed styles warning on tag.
21
+ - 2.0.29:
22
+ - Added remove option to tags.
23
+ - SelectSingle now removes selected option if filter deselect it.
24
+ - 2.0.27 & 2.0.28: Cleanup
25
+ - 2.0.26: Added Select element error states.
26
+ - 2.0.25: Added InputURL component.
27
+ - 2.0.24: Bugfix: @conduction not showing.
28
+ - 2.0.23:
29
+ - Added optional boxshadow to PrimaryTopNav.
30
+ - Added maxLength to both TopNavs and added a gap to the icon and label of a TopNav item.
31
+ - 2.0.22: Refactor InputNumber and InputFloat to return number type.
32
+ - 2.0.21: Add InputDateTime component.
33
+ - 2.0.20: Bugfix Textarea component to include correct field validation.
34
+ - 2.0.19: Add disabled state to Textarea and InputCheckbox components.
35
+ - 2.0.17 & 2.0.18: Refactor PrimaryTopNav styling.
36
+ - 2.0.16: Remove styling warnings.
37
+ - 2.0.15: Added mobile support to PrimaryTopNav.
38
+ - 2.0.14: Refactored SelectCreate placeholder text.
39
+ - 2.0.13: removed round borders of tag.
40
+ - 2.0.11 & 2.0.12:
41
+ - Added disabled state to SelectSingle component.
42
+ - 2.0.10:
43
+ - Added InputFloat (.00 decimals) component.
44
+ - 2.0.9:
45
+ - Added optional defaultChecked to InputCheckbox.
46
+ - Added CreateKeyValue input.
47
+ - Added CreateSelect input.
48
+ - 2.0.8:
49
+ - Added new Tooltip component using React-tooltip.
50
+ - Added active status to PrimaryTopNav.
51
+ - Added active status to SecondaryTopNav.
52
+ - 2.0.7:
53
+ - Added new BadgeCounter component.
54
+ - Added CodeBlock component.
55
+ - 2.0.6:
56
+ - Added optional icon with default icon to the primary and secondary button in NotificationPopUp.
57
+ - Added a handleClick function to the DownloadCard.
58
+ - Added clickFunction, layoutClassName and renamed tag to label in the Tag component.
59
+ - Edited DetailsCard to accommodate changes made to Tag component.
60
+ - Edited RichContentCard to accommodate changes made to Tag component.
61
+ - 2.0.5: wrong camelcase in npm publish/build fix.
62
+ - 2.0.4: added layoutClassName to InfoCard.
63
+ - 2.0.3: Bugfix: --conduction-container typo removed.
64
+ - 2.0.2: Refactor SelectSingle formField with optional props.
65
+ - 2.0.1: Refactor SecondaryTopNav css module import.
66
+ - 2.0.0: components are now dependent on `--skeleton` design tokens, currently found [here](https://github.com/OpenCatalogi/web-app/blob/development/pwa/src/styling/design-tokens/skeleton-design-tokens.css).
67
+
68
+ - **Version 1**
69
+
70
+ - No changelog available.
@@ -1,8 +1,8 @@
1
- import * as React from "react";
2
- interface BadgeCounterProps {
3
- number: string;
4
- children: React.ReactNode;
5
- layoutClassName?: string;
6
- }
7
- export declare const BadgeCounter: React.FC<BadgeCounterProps>;
8
- export {};
1
+ import * as React from "react";
2
+ interface BadgeCounterProps {
3
+ number: string;
4
+ children: React.ReactNode;
5
+ layoutClassName?: string;
6
+ }
7
+ export declare const BadgeCounter: React.FC<BadgeCounterProps>;
8
+ export {};
@@ -1,4 +1,4 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import * as styles from "./BadgeCounter.module.css";
3
- import clsx from "clsx";
4
- export const BadgeCounter = ({ number, children, layoutClassName }) => (_jsxs("div", { className: styles.content, children: [children, _jsx("span", { className: clsx([layoutClassName && layoutClassName], styles.badge), children: number })] }));
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as styles from "./BadgeCounter.module.css";
3
+ import clsx from "clsx";
4
+ export const BadgeCounter = ({ number, children, layoutClassName }) => (_jsxs("div", { className: styles.content, children: [children, _jsx("span", { className: clsx([layoutClassName && layoutClassName], styles.badge), children: number })] }));
@@ -1,27 +1,27 @@
1
- :root {
2
- --conduction-badge-counter-color: hsl(0 0% 0%);
3
- --conduction-badge-counter-background-color: var(--skeleton-color-grey-1);
4
- --conduction-badge-counter-height: var(--skeleton-size-md);
5
- --conduction-badge-counter-width: var(--skeleton-size-md);
6
- --conduction-badge-counter-font-size: var(--skeleton-font-size-xs);
7
- --conduction-badge-counter-max-number-font-size: var(--skeleton-font-size-2xs);
8
- }
9
-
10
- .content {
11
- display: flex;
12
- }
13
-
14
- .badge {
15
- height: var(--conduction-badge-counter-height);
16
- width: var(--conduction-badge-counter-width);
17
- border-radius: 50%;
18
- font-size: var(--conduction-badge-counter-font-size);
19
- display: flex;
20
- align-items: center;
21
- justify-content: space-around;
22
- background-color: var(--conduction-badge-counter-background-color);
23
- color: var(--conduction-badge-counter-color);
24
- }
25
- .maxNumber {
26
- font-size: var(--conduction-badge-counter-max-number-font-size);
27
- }
1
+ :root {
2
+ --conduction-badge-counter-color: hsl(0 0% 0%);
3
+ --conduction-badge-counter-background-color: var(--skeleton-color-grey-1);
4
+ --conduction-badge-counter-height: var(--skeleton-size-md);
5
+ --conduction-badge-counter-width: var(--skeleton-size-md);
6
+ --conduction-badge-counter-font-size: var(--skeleton-font-size-xs);
7
+ --conduction-badge-counter-max-number-font-size: var(--skeleton-font-size-2xs);
8
+ }
9
+
10
+ .content {
11
+ display: flex;
12
+ }
13
+
14
+ .badge {
15
+ height: var(--conduction-badge-counter-height);
16
+ width: var(--conduction-badge-counter-width);
17
+ border-radius: 50%;
18
+ font-size: var(--conduction-badge-counter-font-size);
19
+ display: flex;
20
+ align-items: center;
21
+ justify-content: space-around;
22
+ background-color: var(--conduction-badge-counter-background-color);
23
+ color: var(--conduction-badge-counter-color);
24
+ }
25
+ .maxNumber {
26
+ font-size: var(--conduction-badge-counter-max-number-font-size);
27
+ }
@@ -1,14 +1,14 @@
1
- import * as React from "react";
2
- interface DetailsCardProps {
3
- title: string;
4
- introduction?: string;
5
- link: {
6
- href: string;
7
- label: string;
8
- };
9
- tags?: string[];
10
- subHeader?: string;
11
- layoutClassName?: string;
12
- }
13
- export declare const DetailsCard: React.FC<DetailsCardProps>;
14
- export {};
1
+ import * as React from "react";
2
+ interface DetailsCardProps {
3
+ title: string;
4
+ introduction?: string;
5
+ link: {
6
+ href: string;
7
+ label: string;
8
+ };
9
+ tags?: string[];
10
+ subHeader?: string;
11
+ layoutClassName?: string;
12
+ }
13
+ export declare const DetailsCard: React.FC<DetailsCardProps>;
14
+ export {};
@@ -1,10 +1,10 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import * as styles from "./DetailsCard.module.css";
3
- import clsx from "clsx";
4
- import { Link } from "@gemeente-denhaag/components-react";
5
- import { navigate } from "gatsby";
6
- import { ArrowRightIcon } from "@gemeente-denhaag/icons";
7
- import { Tag } from "../../tag/Tag";
8
- export const DetailsCard = ({ title, subHeader, introduction, link, tags, layoutClassName, }) => {
9
- return (_jsx("div", { className: clsx(styles.container, [layoutClassName && layoutClassName]), onClick: () => navigate(link.href), children: _jsxs("div", { className: styles.content, children: [_jsxs("div", { children: [_jsx("div", { className: styles.title, children: title }), _jsx("span", { className: styles.subHeader, children: subHeader })] }), tags && (_jsx("div", { className: styles.tags, children: tags.map((tag, idx) => (_jsx(Tag, { label: tag }, idx))) })), _jsx("div", { className: styles.introduction, children: introduction }), _jsx("div", { className: styles.link, children: _jsx(Link, { icon: _jsx(ArrowRightIcon, {}), iconAlign: "start", children: link.label }) })] }) }));
10
- };
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as styles from "./DetailsCard.module.css";
3
+ import clsx from "clsx";
4
+ import { Link } from "@gemeente-denhaag/components-react";
5
+ import { navigate } from "gatsby";
6
+ import { ArrowRightIcon } from "@gemeente-denhaag/icons";
7
+ import { Tag } from "../../tag/Tag";
8
+ export const DetailsCard = ({ title, subHeader, introduction, link, tags, layoutClassName, }) => {
9
+ return (_jsx("div", { className: clsx(styles.container, [layoutClassName && layoutClassName]), onClick: () => navigate(link.href), children: _jsxs("div", { className: styles.content, children: [_jsxs("div", { children: [_jsx("div", { className: styles.title, children: title }), _jsx("span", { className: styles.subHeader, children: subHeader })] }), tags && (_jsx("div", { className: styles.tags, children: tags.map((tag, idx) => (_jsx(Tag, { label: tag }, idx))) })), _jsx("div", { className: styles.introduction, children: introduction }), _jsx("div", { className: styles.link, children: _jsx(Link, { icon: _jsx(ArrowRightIcon, {}), iconAlign: "start", children: link.label }) })] }) }));
10
+ };
@@ -1,51 +1,51 @@
1
- :root {
2
- --conduction-details-card-border: 1px solid var(--skeleton-color-grey-2);
3
- --conduction-details-card-introduction-lines-clamp: 3;
4
- }
5
-
6
- .container {
7
- cursor: pointer;
8
- overflow: hidden;
9
- border-radius: var(--skeleton-border-radius-md);
10
- }
11
-
12
- .content {
13
- display: flex;
14
- flex-direction: column;
15
- padding-inline-start: var(--skeleton-size-md);
16
- padding-inline-end: var(--skeleton-size-md);
17
- padding-block-start: var(--skeleton-size-md);
18
- padding-block-end: var(--skeleton-size-md);
19
- border: var(--conduction-details-card-border);
20
- }
21
-
22
- .content > *:not(:last-child) {
23
- margin-block-end: var(--skeleton-size-md);
24
- }
25
-
26
- .title {
27
- font-size: var(--skeleton-font-size-xl);
28
- font-weight: var(--skeleton-font-weight-bold);
29
- }
30
-
31
- .subHeader {
32
- color: var(--skeleton-color-grey-3);
33
- font-size: var(--skeleton-font-size-sm);
34
- }
35
-
36
- .tags > *:not(:last-child) {
37
- margin-inline-end: var(--skeleton-size-sm);
38
- }
39
-
40
- .introduction {
41
- overflow: hidden;
42
- text-overflow: ellipsis;
43
- display: -webkit-box;
44
- -webkit-line-clamp: var(--conduction-details-card-introduction-lines-clamp);
45
- -webkit-box-orient: vertical;
46
- }
47
-
48
- .link {
49
- display: flex;
50
- justify-content: flex-end;
51
- }
1
+ :root {
2
+ --conduction-details-card-border: 1px solid var(--skeleton-color-grey-2);
3
+ --conduction-details-card-introduction-lines-clamp: 3;
4
+ }
5
+
6
+ .container {
7
+ cursor: pointer;
8
+ overflow: hidden;
9
+ border-radius: var(--skeleton-border-radius-md);
10
+ }
11
+
12
+ .content {
13
+ display: flex;
14
+ flex-direction: column;
15
+ padding-inline-start: var(--skeleton-size-md);
16
+ padding-inline-end: var(--skeleton-size-md);
17
+ padding-block-start: var(--skeleton-size-md);
18
+ padding-block-end: var(--skeleton-size-md);
19
+ border: var(--conduction-details-card-border);
20
+ }
21
+
22
+ .content > *:not(:last-child) {
23
+ margin-block-end: var(--skeleton-size-md);
24
+ }
25
+
26
+ .title {
27
+ font-size: var(--skeleton-font-size-xl);
28
+ font-weight: var(--skeleton-font-weight-bold);
29
+ }
30
+
31
+ .subHeader {
32
+ color: var(--skeleton-color-grey-3);
33
+ font-size: var(--skeleton-font-size-sm);
34
+ }
35
+
36
+ .tags > *:not(:last-child) {
37
+ margin-inline-end: var(--skeleton-size-sm);
38
+ }
39
+
40
+ .introduction {
41
+ overflow: hidden;
42
+ text-overflow: ellipsis;
43
+ display: -webkit-box;
44
+ -webkit-line-clamp: var(--conduction-details-card-introduction-lines-clamp);
45
+ -webkit-box-orient: vertical;
46
+ }
47
+
48
+ .link {
49
+ display: flex;
50
+ justify-content: flex-end;
51
+ }
@@ -1,11 +1,11 @@
1
- import * as React from "react";
2
- interface DownloadCardProps {
3
- icon: JSX.Element;
4
- label: string;
5
- sizeKb: string;
6
- downloadLabel: string;
7
- layoutClassName?: string;
8
- handleClick: () => any;
9
- }
10
- export declare const DownloadCard: React.FC<DownloadCardProps>;
11
- export {};
1
+ import * as React from "react";
2
+ interface DownloadCardProps {
3
+ icon: JSX.Element;
4
+ label: string;
5
+ sizeKb: string;
6
+ downloadLabel: string;
7
+ layoutClassName?: string;
8
+ handleClick: () => any;
9
+ }
10
+ export declare const DownloadCard: React.FC<DownloadCardProps>;
11
+ export {};
@@ -1,8 +1,8 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import * as styles from "./DownloadCard.module.css";
3
- import { DownloadIcon } from "@gemeente-denhaag/icons";
4
- import { Link } from "@gemeente-denhaag/components-react";
5
- import clsx from "clsx";
6
- export const DownloadCard = ({ icon, label, sizeKb, layoutClassName, downloadLabel, handleClick, }) => {
7
- return (_jsxs("div", { className: clsx(styles.container, [layoutClassName && layoutClassName]), children: [_jsxs("div", { className: styles.content, children: [_jsx("div", { className: styles.icon, children: icon }), _jsxs("div", { children: [label, " (", sizeKb, "kb)"] })] }), _jsx("div", { onClick: handleClick, children: _jsx(Link, { icon: _jsx(DownloadIcon, {}), iconAlign: "start", children: downloadLabel }) })] }));
8
- };
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as styles from "./DownloadCard.module.css";
3
+ import { DownloadIcon } from "@gemeente-denhaag/icons";
4
+ import { Link } from "@gemeente-denhaag/components-react";
5
+ import clsx from "clsx";
6
+ export const DownloadCard = ({ icon, label, sizeKb, layoutClassName, downloadLabel, handleClick, }) => {
7
+ return (_jsxs("div", { className: clsx(styles.container, [layoutClassName && layoutClassName]), children: [_jsxs("div", { className: styles.content, children: [_jsx("div", { className: styles.icon, children: icon }), _jsxs("div", { children: [label, " (", sizeKb, "kb)"] })] }), _jsx("div", { onClick: handleClick, children: _jsx(Link, { icon: _jsx(DownloadIcon, {}), iconAlign: "start", children: downloadLabel }) })] }));
8
+ };
@@ -1,27 +1,27 @@
1
- :root {
2
- --conduction-download-card-border: 1px solid var(--skeleton-color-grey-2);
3
- }
4
-
5
- .container {
6
- display: flex;
7
- align-items: center;
8
- justify-content: space-between;
9
- border: var(--conduction-download-card-border);
10
- border-radius: var(--skeleton-border-radius-md);
11
- padding-inline-end: var(--skeleton-size-sm);
12
- }
13
-
14
- .content {
15
- display: flex;
16
- align-items: center;
17
- }
18
-
19
- .content > *:not(:last-child) {
20
- margin-inline-end: var(--skeleton-size-sm);
21
- }
22
-
23
- .icon {
24
- padding-inline: var(--skeleton-size-sm);
25
- padding-block: var(--skeleton-size-sm);
26
- background-color: var(--skeleton-color-grey-1);
27
- }
1
+ :root {
2
+ --conduction-download-card-border: 1px solid var(--skeleton-color-grey-2);
3
+ }
4
+
5
+ .container {
6
+ display: flex;
7
+ align-items: center;
8
+ justify-content: space-between;
9
+ border: var(--conduction-download-card-border);
10
+ border-radius: var(--skeleton-border-radius-md);
11
+ padding-inline-end: var(--skeleton-size-sm);
12
+ }
13
+
14
+ .content {
15
+ display: flex;
16
+ align-items: center;
17
+ }
18
+
19
+ .content > *:not(:last-child) {
20
+ margin-inline-end: var(--skeleton-size-sm);
21
+ }
22
+
23
+ .icon {
24
+ padding-inline: var(--skeleton-size-sm);
25
+ padding-block: var(--skeleton-size-sm);
26
+ background-color: var(--skeleton-color-grey-1);
27
+ }
@@ -1,13 +1,13 @@
1
- import * as React from "react";
2
- interface HorizontalImageCardProps {
3
- iconOrImage: JSX.Element;
4
- title: string;
5
- link: {
6
- label: string;
7
- href: string;
8
- };
9
- layoutClassName?: string;
10
- external?: boolean;
11
- }
12
- export declare const HorizontalImageCard: React.FC<HorizontalImageCardProps>;
13
- export {};
1
+ import * as React from "react";
2
+ interface HorizontalImageCardProps {
3
+ iconOrImage: JSX.Element;
4
+ title: string;
5
+ link: {
6
+ label: string;
7
+ href: string;
8
+ };
9
+ layoutClassName?: string;
10
+ external?: boolean;
11
+ }
12
+ export declare const HorizontalImageCard: React.FC<HorizontalImageCardProps>;
13
+ export {};