@conduction/components 2.2.4 → 2.2.6

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 (122) hide show
  1. package/.prettierrc +30 -30
  2. package/README.md +2 -0
  3. package/lib/components/Pagination/Pagination.d.ts +9 -9
  4. package/lib/components/Pagination/Pagination.js +12 -12
  5. package/lib/components/badgeCounter/BadgeCounter.d.ts +8 -8
  6. package/lib/components/badgeCounter/BadgeCounter.js +4 -4
  7. package/lib/components/badgeCounter/BadgeCounter.module.css +27 -27
  8. package/lib/components/card/cardHeader/CardHeader.d.ts +4 -4
  9. package/lib/components/card/cardHeader/CardHeader.js +14 -14
  10. package/lib/components/card/cardWrapper/CardWrapper.d.ts +2 -2
  11. package/lib/components/card/cardWrapper/CardWrapper.js +6 -6
  12. package/lib/components/card/detailsCard/DetailsCard.d.ts +14 -14
  13. package/lib/components/card/detailsCard/DetailsCard.js +11 -11
  14. package/lib/components/card/downloadCard/DownloadCard.d.ts +11 -11
  15. package/lib/components/card/downloadCard/DownloadCard.js +9 -9
  16. package/lib/components/card/horizontalImageCard/HorizontalImageCard.d.ts +13 -13
  17. package/lib/components/card/horizontalImageCard/HorizontalImageCard.js +10 -10
  18. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.d.ts +14 -14
  19. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.js +10 -10
  20. package/lib/components/card/index.d.ts +8 -8
  21. package/lib/components/card/index.js +8 -8
  22. package/lib/components/card/infoCard/InfoCard.d.ts +8 -8
  23. package/lib/components/card/infoCard/InfoCard.js +6 -6
  24. package/lib/components/card/infoCard/InfoCard.module.css +26 -26
  25. package/lib/components/card/richContentCard/RichContentCard.d.ts +19 -19
  26. package/lib/components/card/richContentCard/RichContentCard.js +15 -16
  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/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  33. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.d.ts +17 -17
  34. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.js +20 -20
  35. package/lib/components/denhaag-wrappers/pagination/Pagination.css +120 -120
  36. package/lib/components/denhaag-wrappers/pagination/Pagination.d.ts +9 -9
  37. package/lib/components/denhaag-wrappers/pagination/Pagination.js +15 -15
  38. package/lib/components/editableTableRow/EditableTableRow.d.ts +14 -14
  39. package/lib/components/editableTableRow/EditableTableRow.js +31 -31
  40. package/lib/components/editableTableRow/EditableTableRow.module.css +25 -25
  41. package/lib/components/formFields/checkbox/Checkbox.module.css +7 -7
  42. package/lib/components/formFields/checkbox/checkbox.d.ts +9 -9
  43. package/lib/components/formFields/checkbox/checkbox.js +3 -3
  44. package/lib/components/formFields/createKeyValue/CreateKeyValue.d.ts +23 -23
  45. package/lib/components/formFields/createKeyValue/CreateKeyValue.js +40 -40
  46. package/lib/components/formFields/date/Date.d.ts +12 -12
  47. package/lib/components/formFields/date/Date.js +10 -10
  48. package/lib/components/formFields/date/Date.module.css +12 -12
  49. package/lib/components/formFields/errorMessage/ErrorMessage.d.ts +5 -5
  50. package/lib/components/formFields/errorMessage/ErrorMessage.js +3 -3
  51. package/lib/components/formFields/index.d.ts +7 -7
  52. package/lib/components/formFields/index.js +7 -7
  53. package/lib/components/formFields/input.d.ts +21 -21
  54. package/lib/components/formFields/input.js +12 -12
  55. package/lib/components/formFields/radio.d.ts +9 -9
  56. package/lib/components/formFields/radio.js +3 -3
  57. package/lib/components/formFields/select/select.d.ts +23 -23
  58. package/lib/components/formFields/select/select.js +58 -58
  59. package/lib/components/formFields/textarea.d.ts +9 -9
  60. package/lib/components/formFields/textarea.js +4 -4
  61. package/lib/components/formFields/types.d.ts +6 -6
  62. package/lib/components/formFields/types.js +1 -1
  63. package/lib/components/imageDivider/ImageDivider.d.ts +7 -7
  64. package/lib/components/imageDivider/ImageDivider.js +6 -6
  65. package/lib/components/imageDivider/imageDivider.module.css +5 -5
  66. package/lib/components/logo/Logo.d.ts +8 -8
  67. package/lib/components/logo/Logo.js +10 -10
  68. package/lib/components/logo/Logo.module.css +15 -15
  69. package/lib/components/metaIcon/MetaIcon.d.ts +7 -7
  70. package/lib/components/metaIcon/MetaIcon.js +3 -3
  71. package/lib/components/metaIcon/MetaIcon.module.css +29 -29
  72. package/lib/components/notificationPopUp/NotificationPopUp.d.ts +26 -26
  73. package/lib/components/notificationPopUp/NotificationPopUp.js +32 -32
  74. package/lib/components/privateRoute/PrivateRoute.d.ts +6 -6
  75. package/lib/components/privateRoute/PrivateRoute.js +15 -15
  76. package/lib/components/quoteWrapper/QuoteWrapper.d.ts +7 -7
  77. package/lib/components/quoteWrapper/QuoteWrapper.js +5 -5
  78. package/lib/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  79. package/lib/components/statusSteps/StatusSteps.d.ts +13 -0
  80. package/lib/components/statusSteps/StatusSteps.js +5 -0
  81. package/lib/components/tableWrapper/TableWrapper.d.ts +8 -0
  82. package/lib/components/tableWrapper/TableWrapper.js +31 -0
  83. package/lib/components/tableWrapper/TableWrapper.module.css +63 -0
  84. package/lib/components/tabs/Tabs.d.ts +5 -14
  85. package/lib/components/tabs/Tabs.js +43 -7
  86. package/lib/components/tabs/Tabs.module.css +202 -81
  87. package/lib/components/tag/Tag.d.ts +10 -10
  88. package/lib/components/tag/Tag.js +6 -6
  89. package/lib/components/tag/Tag.module.css +44 -44
  90. package/lib/components/toolTip/ToolTip.d.ts +13 -13
  91. package/lib/components/toolTip/ToolTip.js +13 -13
  92. package/lib/components/topNav/index.d.ts +3 -3
  93. package/lib/components/topNav/index.js +3 -3
  94. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.d.ts +20 -20
  95. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.js +17 -17
  96. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.d.ts +12 -12
  97. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.js +7 -7
  98. package/lib/custom.d copy.d.ts +5 -0
  99. package/lib/custom.d copy.js +1 -0
  100. package/lib/index.d.ts +27 -26
  101. package/lib/index.js +20 -19
  102. package/package.json +1 -1
  103. package/src/components/badgeCounter/BadgeCounter.module.css +27 -27
  104. package/src/components/card/infoCard/InfoCard.module.css +26 -26
  105. package/src/components/codeBlock/CodeBlock.module.css +6 -6
  106. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  107. package/src/components/formFields/checkbox/Checkbox.module.css +7 -7
  108. package/src/components/formFields/date/Date.module.css +12 -12
  109. package/src/components/imageDivider/imageDivider.module.css +5 -5
  110. package/src/components/logo/Logo.module.css +15 -15
  111. package/src/components/metaIcon/MetaIcon.module.css +29 -29
  112. package/src/components/quoteWrapper/QuoteWrapper.module.css +12 -12
  113. package/src/components/tableWrapper/TableWrapper.module.css +63 -0
  114. package/src/components/tableWrapper/TableWrapper.tsx +68 -0
  115. package/src/components/tabs/Tabs.module.css +202 -81
  116. package/src/components/tabs/Tabs.tsx +104 -33
  117. package/src/components/tag/Tag.module.css +44 -44
  118. package/src/components/topNav/index.ts +4 -4
  119. package/src/custom.d.ts +4 -4
  120. package/src/index.ts +7 -2
  121. package/lib/components/temp/Temp.d.ts +0 -5
  122. package/lib/components/temp/Temp.js +0 -14
package/lib/index.d.ts CHANGED
@@ -1,26 +1,27 @@
1
- /// <reference types="react" />
2
- import { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard } from "./components/card";
3
- import { Container } from "./components/container/Container";
4
- import { Breadcrumbs } from "./components/denhaag-wrappers/breadcrumbs/Breadcrumbs";
5
- import { InputText, InputPassword, InputEmail, InputDate, InputNumber, Textarea, InputCheckbox, InputFile, SelectMultiple, SelectSingle } from "./components/formFields";
6
- import { ImageDivider } from "./components/imageDivider/ImageDivider";
7
- import { AuthenticatedLogo, UnauthenticatedLogo } from "./components/logo/Logo";
8
- import { MetaIcon } from "./components/metaIcon/MetaIcon";
9
- import { PrivateRoute } from "./components/privateRoute/PrivateRoute";
10
- import { PrimaryTopNav, SecondaryTopNav } from "./components/topNav";
11
- import { Tag } from "./components/tag/Tag";
12
- declare const NotificationPopUp: {
13
- controller: () => {
14
- isVisible: boolean;
15
- show: () => void;
16
- hide: () => void;
17
- };
18
- NotificationPopUp: ({ title, description, isVisible, hide, primaryButton, secondaryButton, layoutClassName, }: import("./components/notificationPopUp/NotificationPopUp").NotificationPopUpProps) => JSX.Element | null;
19
- };
20
- import { QuoteWrapper } from "./components/quoteWrapper/QuoteWrapper";
21
- import { BadgeCounter } from "./components/badgeCounter/BadgeCounter";
22
- import { CodeBlock } from "./components/codeBlock/CodeBlock";
23
- import { ToolTip } from "./components/toolTip/ToolTip";
24
- import { Pagination } from "./components/Pagination/Pagination";
25
- import { TabContext } from "./components/tabs/Tabs";
26
- export { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard, Container, Breadcrumbs, InputText, InputPassword, InputEmail, InputDate, InputNumber, InputFile, Textarea, InputCheckbox, SelectMultiple, SelectSingle, ImageDivider, AuthenticatedLogo, UnauthenticatedLogo, MetaIcon, PrivateRoute, PrimaryTopNav, SecondaryTopNav, Tag, NotificationPopUp, QuoteWrapper, Pagination, BadgeCounter, CodeBlock, ToolTip, TabContext, };
1
+ /// <reference types="react" />
2
+ import { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard } from "./components/card";
3
+ import { Container } from "./components/container/Container";
4
+ import { Breadcrumbs } from "./components/denhaag-wrappers/breadcrumbs/Breadcrumbs";
5
+ import { InputText, InputPassword, InputEmail, InputDate, InputNumber, Textarea, InputCheckbox, InputFile, SelectMultiple, SelectSingle } from "./components/formFields";
6
+ import { ImageDivider } from "./components/imageDivider/ImageDivider";
7
+ import { AuthenticatedLogo, UnauthenticatedLogo } from "./components/logo/Logo";
8
+ import { MetaIcon } from "./components/metaIcon/MetaIcon";
9
+ import { PrivateRoute } from "./components/privateRoute/PrivateRoute";
10
+ import { PrimaryTopNav, SecondaryTopNav } from "./components/topNav";
11
+ import { Tag } from "./components/tag/Tag";
12
+ declare const NotificationPopUp: {
13
+ controller: () => {
14
+ isVisible: boolean;
15
+ show: () => void;
16
+ hide: () => void;
17
+ };
18
+ NotificationPopUp: ({ title, description, isVisible, hide, primaryButton, secondaryButton, layoutClassName, }: import("./components/notificationPopUp/NotificationPopUp").NotificationPopUpProps) => JSX.Element | null;
19
+ };
20
+ import { QuoteWrapper } from "./components/quoteWrapper/QuoteWrapper";
21
+ import { BadgeCounter } from "./components/badgeCounter/BadgeCounter";
22
+ import { CodeBlock } from "./components/codeBlock/CodeBlock";
23
+ import { ToolTip } from "./components/toolTip/ToolTip";
24
+ import { Pagination } from "./components/Pagination/Pagination";
25
+ import { Tabs, TabList, Tab, TabPanel } from "./components/tabs/Tabs";
26
+ import { TableWrapper } from "./components/tableWrapper/TableWrapper";
27
+ export { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard, Container, Breadcrumbs, InputText, InputPassword, InputEmail, InputDate, InputNumber, InputFile, Textarea, InputCheckbox, SelectMultiple, SelectSingle, ImageDivider, AuthenticatedLogo, UnauthenticatedLogo, MetaIcon, PrivateRoute, PrimaryTopNav, SecondaryTopNav, Tag, NotificationPopUp, QuoteWrapper, Pagination, BadgeCounter, CodeBlock, ToolTip, Tabs, TabList, Tab, TabPanel, TableWrapper };
package/lib/index.js CHANGED
@@ -1,19 +1,20 @@
1
- import { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard } from "./components/card";
2
- import { Container } from "./components/container/Container";
3
- import { Breadcrumbs } from "./components/denhaag-wrappers/breadcrumbs/Breadcrumbs";
4
- import { InputText, InputPassword, InputEmail, InputDate, InputNumber, Textarea, InputCheckbox, InputFile, SelectMultiple, SelectSingle, } from "./components/formFields";
5
- import { ImageDivider } from "./components/imageDivider/ImageDivider";
6
- import { AuthenticatedLogo, UnauthenticatedLogo } from "./components/logo/Logo";
7
- import { MetaIcon } from "./components/metaIcon/MetaIcon";
8
- import { PrivateRoute } from "./components/privateRoute/PrivateRoute";
9
- import { PrimaryTopNav, SecondaryTopNav } from "./components/topNav";
10
- import { Tag } from "./components/tag/Tag";
11
- import { NotificationPopUpController, NotificationPopUp as _NotificationPopUp, } from "./components/notificationPopUp/NotificationPopUp";
12
- const NotificationPopUp = { controller: NotificationPopUpController, NotificationPopUp: _NotificationPopUp };
13
- import { QuoteWrapper } from "./components/quoteWrapper/QuoteWrapper";
14
- import { BadgeCounter } from "./components/badgeCounter/BadgeCounter";
15
- import { CodeBlock } from "./components/codeBlock/CodeBlock";
16
- import { ToolTip } from "./components/toolTip/ToolTip";
17
- import { Pagination } from "./components/Pagination/Pagination";
18
- import { TabContext } from "./components/tabs/Tabs";
19
- export { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard, Container, Breadcrumbs, InputText, InputPassword, InputEmail, InputDate, InputNumber, InputFile, Textarea, InputCheckbox, SelectMultiple, SelectSingle, ImageDivider, AuthenticatedLogo, UnauthenticatedLogo, MetaIcon, PrivateRoute, PrimaryTopNav, SecondaryTopNav, Tag, NotificationPopUp, QuoteWrapper, Pagination, BadgeCounter, CodeBlock, ToolTip, TabContext, };
1
+ import { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard } from "./components/card";
2
+ import { Container } from "./components/container/Container";
3
+ import { Breadcrumbs } from "./components/denhaag-wrappers/breadcrumbs/Breadcrumbs";
4
+ import { InputText, InputPassword, InputEmail, InputDate, InputNumber, Textarea, InputCheckbox, InputFile, SelectMultiple, SelectSingle, } from "./components/formFields";
5
+ import { ImageDivider } from "./components/imageDivider/ImageDivider";
6
+ import { AuthenticatedLogo, UnauthenticatedLogo } from "./components/logo/Logo";
7
+ import { MetaIcon } from "./components/metaIcon/MetaIcon";
8
+ import { PrivateRoute } from "./components/privateRoute/PrivateRoute";
9
+ import { PrimaryTopNav, SecondaryTopNav } from "./components/topNav";
10
+ import { Tag } from "./components/tag/Tag";
11
+ import { NotificationPopUpController, NotificationPopUp as _NotificationPopUp, } from "./components/notificationPopUp/NotificationPopUp";
12
+ const NotificationPopUp = { controller: NotificationPopUpController, NotificationPopUp: _NotificationPopUp };
13
+ import { QuoteWrapper } from "./components/quoteWrapper/QuoteWrapper";
14
+ import { BadgeCounter } from "./components/badgeCounter/BadgeCounter";
15
+ import { CodeBlock } from "./components/codeBlock/CodeBlock";
16
+ import { ToolTip } from "./components/toolTip/ToolTip";
17
+ import { Pagination } from "./components/Pagination/Pagination";
18
+ import { Tabs, TabList, Tab, TabPanel } from "./components/tabs/Tabs";
19
+ import { TableWrapper } from "./components/tableWrapper/TableWrapper";
20
+ export { DownloadCard, HorizontalImageCard, ImageAndDetailsCard, DetailsCard, InfoCard, Container, Breadcrumbs, InputText, InputPassword, InputEmail, InputDate, InputNumber, InputFile, Textarea, InputCheckbox, SelectMultiple, SelectSingle, ImageDivider, AuthenticatedLogo, UnauthenticatedLogo, MetaIcon, PrivateRoute, PrimaryTopNav, SecondaryTopNav, Tag, NotificationPopUp, QuoteWrapper, Pagination, BadgeCounter, CodeBlock, ToolTip, Tabs, TabList, Tab, TabPanel, TableWrapper };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@conduction/components",
3
- "version": "2.2.4",
3
+ "version": "2.2.6",
4
4
  "description": "React (Gatsby) components used within the Conduction Skeleton Application (and its implementations)",
5
5
  "main": "lib/index.js",
6
6
  "scripts": {
@@ -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,26 +1,26 @@
1
- .container {
2
- background-color: var(--skeleton-color-grey-1);
3
- border-radius: var(--skeleton-border-radius-md);
4
- padding-inline-start: var(--skeleton-size-md);
5
- padding-inline-end: var(--skeleton-size-md);
6
- padding-block-start: var(--skeleton-size-md);
7
- padding-block-end: var(--skeleton-size-md);
8
- }
9
-
10
- .container > * {
11
- display: block;
12
- }
13
-
14
- .container > *:not(:last-child) {
15
- margin-block-end: var(--skeleton-size-xs);
16
- }
17
-
18
- .container > .title {
19
- font-weight: var(--skeleton-font-weight-bold);
20
- font-size: var(--skeleton-font-size-xl);
21
- color: var(--skeleton-color-black);
22
- }
23
-
24
- .content {
25
- color: var(--skeleton-color-black);
26
- }
1
+ .container {
2
+ background-color: var(--skeleton-color-grey-1);
3
+ border-radius: var(--skeleton-border-radius-md);
4
+ padding-inline-start: var(--skeleton-size-md);
5
+ padding-inline-end: var(--skeleton-size-md);
6
+ padding-block-start: var(--skeleton-size-md);
7
+ padding-block-end: var(--skeleton-size-md);
8
+ }
9
+
10
+ .container > * {
11
+ display: block;
12
+ }
13
+
14
+ .container > *:not(:last-child) {
15
+ margin-block-end: var(--skeleton-size-xs);
16
+ }
17
+
18
+ .container > .title {
19
+ font-weight: var(--skeleton-font-weight-bold);
20
+ font-size: var(--skeleton-font-size-xl);
21
+ color: var(--skeleton-color-black);
22
+ }
23
+
24
+ .content {
25
+ color: var(--skeleton-color-black);
26
+ }
@@ -1,6 +1,6 @@
1
- .code {
2
- margin-block: var(--skeleton-size-sm);
3
- background-color: var(--skeleton-color-grey-1);
4
- border-radius: var(--skeleton-size-2xs);
5
- padding: var(--skeleton-size-lg);
6
- }
1
+ .code {
2
+ margin-block: var(--skeleton-size-sm);
3
+ background-color: var(--skeleton-color-grey-1);
4
+ border-radius: var(--skeleton-size-2xs);
5
+ padding: var(--skeleton-size-lg);
6
+ }