@conduction/components 2.2.26 → 2.2.27

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 (180) hide show
  1. package/README.md +3 -0
  2. package/lib/components/Pagination/Pagination.d.ts +14 -14
  3. package/lib/components/Pagination/Pagination.js +12 -12
  4. package/lib/components/badgeCounter/BadgeCounter.d.ts +8 -8
  5. package/lib/components/badgeCounter/BadgeCounter.js +4 -4
  6. package/lib/components/card/cardHeader/CardHeader.d.ts +4 -4
  7. package/lib/components/card/cardHeader/CardHeader.js +14 -14
  8. package/lib/components/card/cardWrapper/CardWrapper.d.ts +2 -2
  9. package/lib/components/card/cardWrapper/CardWrapper.js +6 -6
  10. package/lib/components/card/detailsCard/DetailsCard.d.ts +14 -14
  11. package/lib/components/card/detailsCard/DetailsCard.js +11 -11
  12. package/lib/components/card/downloadCard/DownloadCard.d.ts +11 -11
  13. package/lib/components/card/downloadCard/DownloadCard.js +9 -9
  14. package/lib/components/card/horizontalImageCard/HorizontalImageCard.d.ts +13 -13
  15. package/lib/components/card/horizontalImageCard/HorizontalImageCard.js +10 -10
  16. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.d.ts +14 -14
  17. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.js +10 -10
  18. package/lib/components/card/index.d.ts +8 -8
  19. package/lib/components/card/index.js +8 -8
  20. package/lib/components/card/infoCard/InfoCard.d.ts +8 -8
  21. package/lib/components/card/infoCard/InfoCard.js +6 -6
  22. package/lib/components/codeBlock/CodeBlock.d.ts +6 -6
  23. package/lib/components/codeBlock/CodeBlock.js +3 -3
  24. package/lib/components/container/Container.d.ts +6 -6
  25. package/lib/components/container/Container.js +4 -4
  26. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.d.ts +17 -17
  27. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.js +20 -20
  28. package/lib/components/displaySwitch/DisplaySwitch.d.ts +18 -18
  29. package/lib/components/displaySwitch/DisplaySwitch.js +13 -13
  30. package/lib/components/formFields/checkbox/checkbox.d.ts +9 -9
  31. package/lib/components/formFields/checkbox/checkbox.js +3 -3
  32. package/lib/components/formFields/createKeyValue/CreateKeyValue.d.ts +23 -23
  33. package/lib/components/formFields/createKeyValue/CreateKeyValue.js +40 -40
  34. package/lib/components/formFields/date/Date.d.ts +12 -12
  35. package/lib/components/formFields/date/Date.js +10 -10
  36. package/lib/components/formFields/errorMessage/ErrorMessage.d.ts +5 -5
  37. package/lib/components/formFields/errorMessage/ErrorMessage.js +3 -3
  38. package/lib/components/formFields/index.d.ts +7 -7
  39. package/lib/components/formFields/index.js +7 -7
  40. package/lib/components/formFields/input.d.ts +22 -22
  41. package/lib/components/formFields/input.js +12 -12
  42. package/lib/components/formFields/select/select.d.ts +24 -24
  43. package/lib/components/formFields/select/select.js +74 -74
  44. package/lib/components/formFields/textarea.d.ts +10 -10
  45. package/lib/components/formFields/textarea.js +4 -4
  46. package/lib/components/formFields/types.d.ts +6 -6
  47. package/lib/components/formFields/types.js +1 -1
  48. package/lib/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.d.ts +10 -10
  49. package/lib/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.js +36 -36
  50. package/lib/components/imageDivider/ImageDivider.d.ts +7 -7
  51. package/lib/components/imageDivider/ImageDivider.js +6 -6
  52. package/lib/components/jumbotron/Jumbotron.d.ts +23 -23
  53. package/lib/components/jumbotron/Jumbotron.js +34 -34
  54. package/lib/components/logo/Logo.d.ts +8 -8
  55. package/lib/components/logo/Logo.js +9 -9
  56. package/lib/components/metaIcon/MetaIcon.d.ts +7 -7
  57. package/lib/components/metaIcon/MetaIcon.js +3 -3
  58. package/lib/components/notificationPopUp/NotificationPopUp.d.ts +27 -27
  59. package/lib/components/notificationPopUp/NotificationPopUp.js +34 -34
  60. package/lib/components/privateRoute/PrivateRoute.d.ts +6 -6
  61. package/lib/components/privateRoute/PrivateRoute.js +15 -15
  62. package/lib/components/quoteWrapper/QuoteWrapper.d.ts +7 -7
  63. package/lib/components/quoteWrapper/QuoteWrapper.js +5 -5
  64. package/lib/components/tabs/Tabs.d.ts +5 -5
  65. package/lib/components/tabs/Tabs.js +49 -49
  66. package/lib/components/tag/Tag.d.ts +10 -10
  67. package/lib/components/tag/Tag.js +6 -6
  68. package/lib/components/toolTip/ToolTip.d.ts +14 -14
  69. package/lib/components/toolTip/ToolTip.js +14 -14
  70. package/lib/components/topNav/index.d.ts +3 -3
  71. package/lib/components/topNav/index.js +3 -3
  72. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.d.ts +39 -39
  73. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.js +23 -23
  74. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.d.ts +12 -12
  75. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.js +7 -7
  76. package/lib/index.d.ts +29 -29
  77. package/lib/index.js +22 -22
  78. package/package.json +17 -17
  79. package/src/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +222 -222
  80. package/src/components/formFields/checkbox/Checkbox.module.css +209 -3
  81. package/src/components/formFields/checkbox/checkbox.tsx +3 -2
  82. package/src/components/formFields/createKeyValue/CreateKeyValue.tsx +2 -2
  83. package/src/components/formFields/input.tsx +14 -14
  84. package/src/components/formFields/select/select.tsx +6 -6
  85. package/src/components/formFields/textarea.tsx +3 -2
  86. package/tsconfig.json +6 -3
  87. package/lib/components/Pagination/Pagination.module.css +0 -158
  88. package/lib/components/badgeCounter/BadgeCounter.module.css +0 -27
  89. package/lib/components/card/cardHeader/CardHeader.module.css +0 -36
  90. package/lib/components/card/cardWrapper/CardWrapper.module.css +0 -47
  91. package/lib/components/card/detailsCard/DetailsCard.module.css +0 -56
  92. package/lib/components/card/downloadCard/DownloadCard.module.css +0 -27
  93. package/lib/components/card/horizontalImageCard/HorizontalImageCard.module.css +0 -38
  94. package/lib/components/card/imageAndDetailsCard/ImageAndDetailsCard.module.css +0 -68
  95. package/lib/components/card/infoCard/InfoCard.module.css +0 -26
  96. package/lib/components/card/richContentCard/RichContentCard.d.ts +0 -19
  97. package/lib/components/card/richContentCard/RichContentCard.js +0 -15
  98. package/lib/components/card/richContentCard/RichContentCard.module.css +0 -103
  99. package/lib/components/codeBlock/CodeBlock.module.css +0 -6
  100. package/lib/components/container/Container.module.css +0 -12
  101. package/lib/components/denhaag-wrappers/breadcrumbs/Breadcrumbs.css +0 -222
  102. package/lib/components/denhaag-wrappers/pagination/Pagination.css +0 -120
  103. package/lib/components/denhaag-wrappers/pagination/Pagination.d.ts +0 -9
  104. package/lib/components/denhaag-wrappers/pagination/Pagination.js +0 -15
  105. package/lib/components/displaySwitch/DisplaySwitch.module.css +0 -3
  106. package/lib/components/editableTableRow/EditableTableRow.d.ts +0 -14
  107. package/lib/components/editableTableRow/EditableTableRow.js +0 -31
  108. package/lib/components/editableTableRow/EditableTableRow.module.css +0 -25
  109. package/lib/components/formFields/checkbox/Checkbox.module.css +0 -7
  110. package/lib/components/formFields/createKeyValue/CreateKeyValue.module.css +0 -65
  111. package/lib/components/formFields/date/Date.module.css +0 -12
  112. package/lib/components/formFields/errorMessage/ErrorMessage.module.css +0 -9
  113. package/lib/components/formFields/radio.d.ts +0 -9
  114. package/lib/components/formFields/radio.js +0 -3
  115. package/lib/components/formFields/select/select.module.css +0 -58
  116. package/lib/components/horizontalOverflowWrapper/HorizontalOverflowWrapper.module.css +0 -41
  117. package/lib/components/htmlParser/ParsedHTML.d.ts +0 -10
  118. package/lib/components/htmlParser/ParsedHTML.js +0 -17
  119. package/lib/components/htmlParser/ParsedHTML.module.css +0 -7
  120. package/lib/components/htmlParser/parser/alert/getAlert.d.ts +0 -1
  121. package/lib/components/htmlParser/parser/alert/getAlert.js +0 -18
  122. package/lib/components/htmlParser/parser/alert/getAlert.module.css +0 -28
  123. package/lib/components/htmlParser/parser/anchor/getAnchor.d.ts +0 -2
  124. package/lib/components/htmlParser/parser/anchor/getAnchor.js +0 -74
  125. package/lib/components/htmlParser/parser/code/getCode.d.ts +0 -1
  126. package/lib/components/htmlParser/parser/code/getCode.js +0 -11
  127. package/lib/components/htmlParser/parser/getBlockquote/getBlockquote.d.ts +0 -1
  128. package/lib/components/htmlParser/parser/getBlockquote/getBlockquote.js +0 -6
  129. package/lib/components/htmlParser/parser/header/getHeader.d.ts +0 -1
  130. package/lib/components/htmlParser/parser/header/getHeader.js +0 -15
  131. package/lib/components/htmlParser/parser/image/getImage.d.ts +0 -1
  132. package/lib/components/htmlParser/parser/image/getImage.js +0 -28
  133. package/lib/components/htmlParser/parser/list/getList.d.ts +0 -1
  134. package/lib/components/htmlParser/parser/list/getList.js +0 -12
  135. package/lib/components/htmlParser/parser/list/getList.module.css +0 -3
  136. package/lib/components/htmlParser/parser/listItem/getListItem.d.ts +0 -1
  137. package/lib/components/htmlParser/parser/listItem/getListItem.js +0 -12
  138. package/lib/components/htmlParser/parser/paragraph/getParagraph.d.ts +0 -1
  139. package/lib/components/htmlParser/parser/paragraph/getParagraph.js +0 -6
  140. package/lib/components/htmlParser/parser/svg/getSvg.d.ts +0 -1
  141. package/lib/components/htmlParser/parser/svg/getSvg.js +0 -8
  142. package/lib/components/htmlParser/parser/table/getTable.d.ts +0 -1
  143. package/lib/components/htmlParser/parser/table/getTable.js +0 -7
  144. package/lib/components/htmlParser/parser/table/getTable.module.css +0 -3
  145. package/lib/components/htmlParser/parser/tableBody/getTableBody.d.ts +0 -1
  146. package/lib/components/htmlParser/parser/tableBody/getTableBody.js +0 -7
  147. package/lib/components/htmlParser/parser/tableBody/getTableBody.module.css +0 -3
  148. package/lib/components/htmlParser/parser/tableCell/getTableCell.d.ts +0 -1
  149. package/lib/components/htmlParser/parser/tableCell/getTableCell.js +0 -7
  150. package/lib/components/htmlParser/parser/tableCell/getTableCell.module.css +0 -3
  151. package/lib/components/htmlParser/parser/tableHeader/getTableHeader.d.ts +0 -1
  152. package/lib/components/htmlParser/parser/tableHeader/getTableHeader.js +0 -7
  153. package/lib/components/htmlParser/parser/tableHeader/getTableHeader.module.css +0 -28
  154. package/lib/components/htmlParser/parser/tableHeaderCell/getTableHeaderCell.d.ts +0 -1
  155. package/lib/components/htmlParser/parser/tableHeaderCell/getTableHeaderCell.js +0 -6
  156. package/lib/components/htmlParser/parser/tableRow/getTableRow.d.ts +0 -1
  157. package/lib/components/htmlParser/parser/tableRow/getTableRow.js +0 -7
  158. package/lib/components/htmlParser/parser/tableRow/getTableRow.module.css +0 -29
  159. package/lib/components/htmlParser/parser/useHtmlParser.d.ts +0 -5
  160. package/lib/components/htmlParser/parser/useHtmlParser.js +0 -78
  161. package/lib/components/htmlParser/useGitHubDirectories.d.ts +0 -10
  162. package/lib/components/htmlParser/useGitHubDirectories.js +0 -31
  163. package/lib/components/imageDivider/imageDivider.module.css +0 -5
  164. package/lib/components/jumbotron/Jumbotron.module.css +0 -88
  165. package/lib/components/logo/Logo.module.css +0 -31
  166. package/lib/components/metaIcon/MetaIcon.module.css +0 -29
  167. package/lib/components/notificationPopUp/NotificationPopUp.module.css +0 -70
  168. package/lib/components/quoteWrapper/QuoteWrapper.module.css +0 -12
  169. package/lib/components/statusSteps/StatusSteps.d.ts +0 -13
  170. package/lib/components/statusSteps/StatusSteps.js +0 -5
  171. package/lib/components/tableWrapper/TableWrapper.d.ts +0 -4
  172. package/lib/components/tableWrapper/TableWrapper.js +0 -30
  173. package/lib/components/tableWrapper/TableWrapper.module.css +0 -67
  174. package/lib/components/tabs/Tabs.module.css +0 -247
  175. package/lib/components/tag/Tag.module.css +0 -44
  176. package/lib/components/toolTip/ToolTip.module.css +0 -35
  177. package/lib/components/topNav/primaryTopNav/PrimaryTopNav.module.css +0 -235
  178. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.module.css +0 -80
  179. package/lib/custom.d copy.d.ts +0 -5
  180. package/lib/custom.d copy.js +0 -1
@@ -1,6 +1,6 @@
1
- import { FieldErrors, FieldValues, RegisterOptions, UseFormRegister } from "react-hook-form";
2
- export interface IReactHookFormProps {
3
- register: UseFormRegister<FieldValues>;
4
- errors: FieldErrors;
5
- validation?: Omit<RegisterOptions<FieldValues, any>, "valueAsNumber" | "valueAsDate" | "setValueAs" | "disabled">;
6
- }
1
+ import { FieldErrors, FieldValues, RegisterOptions, UseFormRegister } from "react-hook-form";
2
+ export interface IReactHookFormProps {
3
+ register: UseFormRegister<FieldValues>;
4
+ errors: FieldErrors;
5
+ validation?: Omit<RegisterOptions<FieldValues, any>, "valueAsNumber" | "valueAsDate" | "setValueAs" | "disabled">;
6
+ }
@@ -1 +1 @@
1
- export {};
1
+ export {};
@@ -1,10 +1,10 @@
1
- import * as React from "react";
2
- interface HorizontalOverflowWrapperProps {
3
- children: React.ReactNode;
4
- ariaLabels: {
5
- scrollRightButton: string;
6
- scrollLeftButton: string;
7
- };
8
- }
9
- export declare const HorizontalOverflowWrapper: React.FC<HorizontalOverflowWrapperProps>;
10
- export {};
1
+ import * as React from "react";
2
+ interface HorizontalOverflowWrapperProps {
3
+ children: React.ReactNode;
4
+ ariaLabels: {
5
+ scrollRightButton: string;
6
+ scrollLeftButton: string;
7
+ };
8
+ }
9
+ export declare const HorizontalOverflowWrapper: React.FC<HorizontalOverflowWrapperProps>;
10
+ export {};
@@ -1,36 +1,36 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import * as React from "react";
3
- import * as styles from "./HorizontalOverflowWrapper.module.css";
4
- import clsx from "clsx";
5
- import { Button } from "@utrecht/component-library-react/dist/css-module";
6
- import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
7
- import { faChevronLeft, faChevronRight } from "@fortawesome/free-solid-svg-icons";
8
- export const HorizontalOverflowWrapper = ({ children, ariaLabels }) => {
9
- const [canScrollRight, setCanScrollRight] = React.useState(false);
10
- const [canScrollLeft, setCanScrollLeft] = React.useState(false);
11
- const wrapperRef = React.useRef(null);
12
- const scrollRight = () => {
13
- wrapperRef.current?.scrollTo({
14
- left: wrapperRef.current.scrollLeft + wrapperRef.current.clientWidth * 0.9,
15
- behavior: "smooth",
16
- });
17
- };
18
- const scrollLeft = () => {
19
- wrapperRef.current?.scrollTo({
20
- left: wrapperRef.current.scrollLeft - wrapperRef.current.clientWidth * 0.9,
21
- behavior: "smooth",
22
- });
23
- };
24
- React.useEffect(() => {
25
- checkScrollDirections(); // initiate available scroll directions
26
- window.addEventListener("resize", checkScrollDirections);
27
- return () => window.removeEventListener("resize", checkScrollDirections);
28
- }, []);
29
- const checkScrollDirections = () => {
30
- if (!wrapperRef.current)
31
- return;
32
- setCanScrollRight(wrapperRef.current.scrollLeft + wrapperRef.current.clientWidth < wrapperRef.current.scrollWidth);
33
- setCanScrollLeft(wrapperRef.current.scrollLeft > 0);
34
- };
35
- return (_jsxs("div", { className: styles.container, children: [canScrollLeft && (_jsx(Button, { className: clsx(styles.scrollButton), onClick: scrollLeft, appearance: "secondary-action-button", "aria-label": ariaLabels.scrollLeftButton, children: _jsx(FontAwesomeIcon, { icon: faChevronLeft }) })), canScrollRight && (_jsx(Button, { className: clsx(styles.scrollButton, styles.right), onClick: scrollRight, appearance: "secondary-action-button", "aria-label": ariaLabels.scrollRightButton, children: _jsx(FontAwesomeIcon, { icon: faChevronRight }) })), _jsx("div", { ref: wrapperRef, className: styles.wrapper, onScroll: checkScrollDirections, children: children })] }));
36
- };
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as React from "react";
3
+ import * as styles from "./HorizontalOverflowWrapper.module.css";
4
+ import clsx from "clsx";
5
+ import { Button } from "@utrecht/component-library-react/dist/css-module";
6
+ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
7
+ import { faChevronLeft, faChevronRight } from "@fortawesome/free-solid-svg-icons";
8
+ export const HorizontalOverflowWrapper = ({ children, ariaLabels }) => {
9
+ const [canScrollRight, setCanScrollRight] = React.useState(false);
10
+ const [canScrollLeft, setCanScrollLeft] = React.useState(false);
11
+ const wrapperRef = React.useRef(null);
12
+ const scrollRight = () => {
13
+ wrapperRef.current?.scrollTo({
14
+ left: wrapperRef.current.scrollLeft + wrapperRef.current.clientWidth * 0.9,
15
+ behavior: "smooth",
16
+ });
17
+ };
18
+ const scrollLeft = () => {
19
+ wrapperRef.current?.scrollTo({
20
+ left: wrapperRef.current.scrollLeft - wrapperRef.current.clientWidth * 0.9,
21
+ behavior: "smooth",
22
+ });
23
+ };
24
+ React.useEffect(() => {
25
+ checkScrollDirections(); // initiate available scroll directions
26
+ window.addEventListener("resize", checkScrollDirections);
27
+ return () => window.removeEventListener("resize", checkScrollDirections);
28
+ }, []);
29
+ const checkScrollDirections = () => {
30
+ if (!wrapperRef.current)
31
+ return;
32
+ setCanScrollRight(wrapperRef.current.scrollLeft + wrapperRef.current.clientWidth < wrapperRef.current.scrollWidth);
33
+ setCanScrollLeft(wrapperRef.current.scrollLeft > 0);
34
+ };
35
+ return (_jsxs("div", { className: styles.container, children: [canScrollLeft && (_jsx(Button, { className: clsx(styles.scrollButton), onClick: scrollLeft, appearance: "secondary-action-button", "aria-label": ariaLabels.scrollLeftButton, children: _jsx(FontAwesomeIcon, { icon: faChevronLeft }) })), canScrollRight && (_jsx(Button, { className: clsx(styles.scrollButton, styles.right), onClick: scrollRight, appearance: "secondary-action-button", "aria-label": ariaLabels.scrollRightButton, children: _jsx(FontAwesomeIcon, { icon: faChevronRight }) })), _jsx("div", { ref: wrapperRef, className: styles.wrapper, onScroll: checkScrollDirections, children: children })] }));
36
+ };
@@ -1,7 +1,7 @@
1
- /// <reference types="react" />
2
- interface ImageDividerProps {
3
- image: string;
4
- layoutClassName: string;
5
- }
6
- export declare const ImageDivider: ({ image, layoutClassName }: ImageDividerProps) => JSX.Element;
7
- export {};
1
+ /// <reference types="react" />
2
+ interface ImageDividerProps {
3
+ image: string;
4
+ layoutClassName: string;
5
+ }
6
+ export declare const ImageDivider: ({ image, layoutClassName }: ImageDividerProps) => JSX.Element;
7
+ export {};
@@ -1,6 +1,6 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import clsx from "clsx";
3
- import * as styles from "./imageDivider.module.css";
4
- export const ImageDivider = ({ image, layoutClassName }) => {
5
- return _jsx("img", { src: image, className: clsx(styles.divider, layoutClassName) });
6
- };
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import clsx from "clsx";
3
+ import * as styles from "./imageDivider.module.css";
4
+ export const ImageDivider = ({ image, layoutClassName }) => {
5
+ return _jsx("img", { src: image, className: clsx(styles.divider, layoutClassName) });
6
+ };
@@ -1,23 +1,23 @@
1
- import * as React from "react";
2
- interface JumbotronProps {
3
- title: string;
4
- ariaLabel: {
5
- container: string;
6
- card: string;
7
- };
8
- role: string;
9
- subTitle?: string;
10
- description?: string;
11
- image?: {
12
- placement: "false" | "background" | "right";
13
- url: string;
14
- };
15
- isCard?: boolean;
16
- container?: boolean;
17
- searchForm?: {
18
- element: JSX.Element;
19
- show: boolean;
20
- };
21
- }
22
- export declare const Jumbotron: React.FC<JumbotronProps>;
23
- export {};
1
+ import * as React from "react";
2
+ interface JumbotronProps {
3
+ title: string;
4
+ ariaLabel: {
5
+ container: string;
6
+ card: string;
7
+ };
8
+ role: string;
9
+ subTitle?: string;
10
+ description?: string;
11
+ image?: {
12
+ placement: "false" | "background" | "right";
13
+ url: string;
14
+ };
15
+ isCard?: boolean;
16
+ container?: boolean;
17
+ searchForm?: {
18
+ element: JSX.Element;
19
+ show: boolean;
20
+ };
21
+ }
22
+ export declare const Jumbotron: React.FC<JumbotronProps>;
23
+ export {};
@@ -1,34 +1,34 @@
1
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
- import * as styles from "./Jumbotron.module.css";
3
- import clsx from "clsx";
4
- import { Paragraph, Page, PageContent, Heading1, Image } from "@utrecht/component-library-react/dist/css-module";
5
- import { Container } from "../container/Container";
6
- import { CardWrapper } from "../card";
7
- export const Jumbotron = ({ title, ariaLabel, role, subTitle, description, image, isCard, searchForm, container, }) => {
8
- return (_jsx(OptionalContainer, { ...{ container }, children: _jsx("div", { "aria-label": ariaLabel.container, role: role, style: {
9
- backgroundImage: image?.placement === "background" ? `url(${image.url})` : "",
10
- }, className: clsx(image?.placement === "background" && styles.backgroundImageWrapper, image?.placement === "right" && styles.rightImageWrapper), children: _jsx(Page, { children: _jsx(PageContent, { children: _jsx(ImageContainer, { image: { placement: image?.placement ?? "false", url: image?.url ?? "" }, children: _jsxs(SearchForm, { searchForm: { show: searchForm?.show ?? false, element: searchForm?.element ?? _jsx(_Fragment, {}) }, children: [isCard && (_jsx(JumbotronCard, { ...{ title, ariaLabel, role, subTitle, description, image, isCard, searchForm } })), !isCard && (_jsx(JumbotronContent, { ...{ title, ariaLabel, role, subTitle, description, image, isCard, searchForm } }))] }) }) }) }) }) }));
11
- };
12
- const OptionalContainer = ({ children, container }) => {
13
- if (container === true)
14
- return _jsx(Container, { layoutClassName: styles.wrapper, children: children });
15
- return _jsx(_Fragment, { children: children });
16
- };
17
- const ImageContainer = ({ children, image }) => {
18
- if (image.placement === "right")
19
- return (_jsxs("div", { className: styles.imageRightContainer, children: [children, _jsx(Image, { src: image.url, alt: "jumbotron-image", className: styles.image })] }));
20
- if (image.placement === "false" || image.placement === "background")
21
- return _jsx(_Fragment, { children: children });
22
- return _jsx(_Fragment, { children: children });
23
- };
24
- const SearchForm = ({ children, searchForm, }) => {
25
- if (searchForm.show)
26
- return (_jsxs("section", { className: clsx(styles.headerSearchForm), children: [children, searchForm.element] }));
27
- return _jsx(_Fragment, { children: children });
28
- };
29
- const JumbotronCard = ({ title, ariaLabel, subTitle, description, image, searchForm }) => {
30
- return (_jsxs(CardWrapper, { "aria-label": ariaLabel.card, role: "contentinfo", className: styles.card, children: [_jsxs(Heading1, { className: clsx(image?.placement === "right" ? styles.cardAndImageTitle : styles.cardTitle), children: [title, " "] }), _jsx("span", { className: styles.cardSubTitle, children: subTitle }), _jsx(Paragraph, { className: styles.cardDescription, children: description })] }));
31
- };
32
- const JumbotronContent = ({ title, subTitle, description, image, searchForm }) => {
33
- return (_jsxs("div", { children: [_jsx(Heading1, { className: clsx(clsx(styles.title, !subTitle && styles.titleSingle)), children: title }), subTitle && _jsx("span", { className: styles.subTitle, children: subTitle }), description && _jsx(Paragraph, { className: styles.description, children: description })] }));
34
- };
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as styles from "./Jumbotron.module.css";
3
+ import clsx from "clsx";
4
+ import { Paragraph, Page, PageContent, Heading1, Image } from "@utrecht/component-library-react/dist/css-module";
5
+ import { Container } from "../container/Container";
6
+ import { CardWrapper } from "../card";
7
+ export const Jumbotron = ({ title, ariaLabel, role, subTitle, description, image, isCard, searchForm, container, }) => {
8
+ return (_jsx(OptionalContainer, { container, children: _jsx("div", { "aria-label": ariaLabel.container, role: role, style: {
9
+ backgroundImage: image?.placement === "background" ? `url(${image.url})` : "",
10
+ }, className: clsx(image?.placement === "background" && styles.backgroundImageWrapper, image?.placement === "right" && styles.rightImageWrapper), children: _jsx(Page, { children: _jsx(PageContent, { children: _jsx(ImageContainer, { image: { placement: image?.placement ?? "false", url: image?.url ?? "" }, children: _jsxs(SearchForm, { searchForm: { show: searchForm?.show ?? false, element: searchForm?.element ?? _jsx(_Fragment, {}) }, children: [isCard && (_jsx(JumbotronCard, { title, ariaLabel, role, subTitle, description, image, isCard, searchForm })), !isCard && (_jsx(JumbotronContent, { title, ariaLabel, role, subTitle, description, image, isCard, searchForm }))] }) }) }) }) }) }));
11
+ };
12
+ const OptionalContainer = ({ children, container }) => {
13
+ if (container === true)
14
+ return _jsx(Container, { layoutClassName: styles.wrapper, children: children });
15
+ return _jsx(_Fragment, { children: children });
16
+ };
17
+ const ImageContainer = ({ children, image }) => {
18
+ if (image.placement === "right")
19
+ return (_jsxs("div", { className: styles.imageRightContainer, children: [children, _jsx(Image, { src: image.url, alt: "jumbotron-image", className: styles.image })] }));
20
+ if (image.placement === "false" || image.placement === "background")
21
+ return _jsx(_Fragment, { children: children });
22
+ return _jsx(_Fragment, { children: children });
23
+ };
24
+ const SearchForm = ({ children, searchForm, }) => {
25
+ if (searchForm.show)
26
+ return (_jsxs("section", { className: clsx(styles.headerSearchForm), children: [children, searchForm.element] }));
27
+ return _jsx(_Fragment, { children: children });
28
+ };
29
+ const JumbotronCard = ({ title, ariaLabel, subTitle, description, image, searchForm }) => {
30
+ return (_jsxs(CardWrapper, { "aria-label": ariaLabel.card, role: "contentinfo", className: styles.card, children: [_jsxs(Heading1, { className: clsx(image?.placement === "right" ? styles.cardAndImageTitle : styles.cardTitle), children: [title, " "] }), _jsx("span", { className: styles.cardSubTitle, children: subTitle }), _jsx(Paragraph, { className: styles.cardDescription, children: description })] }));
31
+ };
32
+ const JumbotronContent = ({ title, subTitle, description, image, searchForm }) => {
33
+ return (_jsxs("div", { children: [_jsx(Heading1, { className: clsx(clsx(styles.title, !subTitle && styles.titleSingle)), children: title }), subTitle && _jsx("span", { className: styles.subTitle, children: subTitle }), description && _jsx(Paragraph, { className: styles.description, children: description })] }));
34
+ };
@@ -1,8 +1,8 @@
1
- import * as React from "react";
2
- interface LogoProps {
3
- variant?: "header" | "footer";
4
- onClick?: () => any;
5
- layoutClassName?: string;
6
- }
7
- export declare const Logo: React.FC<LogoProps>;
8
- export {};
1
+ import * as React from "react";
2
+ interface LogoProps {
3
+ variant?: "header" | "footer";
4
+ onClick?: () => any;
5
+ layoutClassName?: string;
6
+ }
7
+ export declare const Logo: React.FC<LogoProps>;
8
+ export {};
@@ -1,9 +1,9 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import * as styles from "./Logo.module.css";
3
- import clsx from "clsx";
4
- export const Logo = ({ onClick, layoutClassName, variant = "header" }) => {
5
- return (_jsx("div", { className: clsx(styles.container, styles[variant], [
6
- onClick && styles.clickable,
7
- layoutClassName && layoutClassName,
8
- ]), ...{ onClick } }));
9
- };
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as styles from "./Logo.module.css";
3
+ import clsx from "clsx";
4
+ export const Logo = ({ onClick, layoutClassName, variant = "header" }) => {
5
+ return (_jsx("div", { className: clsx(styles.container, styles[variant], [
6
+ onClick && styles.clickable,
7
+ layoutClassName && layoutClassName,
8
+ ]), onClick }));
9
+ };
@@ -1,7 +1,7 @@
1
- /// <reference types="react" />
2
- export interface MetaIconProps {
3
- icon: JSX.Element;
4
- label: string;
5
- value: string;
6
- }
7
- export declare const MetaIcon: ({ icon, label, value }: MetaIconProps) => JSX.Element;
1
+ /// <reference types="react" />
2
+ export interface MetaIconProps {
3
+ icon: JSX.Element;
4
+ label: string;
5
+ value: string;
6
+ }
7
+ export declare const MetaIcon: ({ icon, label, value }: MetaIconProps) => JSX.Element;
@@ -1,3 +1,3 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import * as styles from "./MetaIcon.module.css";
3
- export const MetaIcon = ({ icon, label, value }) => (_jsxs("div", { className: styles.container, children: [_jsx("span", { className: styles.icon, children: icon }), _jsx("span", { children: label }), _jsx("span", { className: styles.value, children: value })] }));
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as styles from "./MetaIcon.module.css";
3
+ export const MetaIcon = ({ icon, label, value }) => (_jsxs("div", { className: styles.container, children: [_jsx("span", { className: styles.icon, children: icon }), _jsx("span", { children: label }), _jsx("span", { className: styles.value, children: value })] }));
@@ -1,27 +1,27 @@
1
- /// <reference types="react" />
2
- export interface NotificationPopUpProps {
3
- title: string;
4
- description: string | JSX.Element;
5
- isVisible: boolean;
6
- hide: () => void;
7
- primaryButton: {
8
- label: string;
9
- handleClick: () => any;
10
- icon?: JSX.Element;
11
- layoutClassName?: string;
12
- };
13
- secondaryButton?: {
14
- label: string;
15
- handleClick: () => any;
16
- href: string;
17
- icon?: JSX.Element;
18
- layoutClassName?: string;
19
- };
20
- layoutClassName?: string;
21
- }
22
- export declare const NotificationPopUp: ({ title, description, isVisible, hide, primaryButton, secondaryButton, layoutClassName, }: NotificationPopUpProps) => JSX.Element | null;
23
- export declare const NotificationPopUpController: () => {
24
- isVisible: boolean;
25
- show: () => void;
26
- hide: () => void;
27
- };
1
+ /// <reference types="react" />
2
+ export interface NotificationPopUpProps {
3
+ title: string;
4
+ description: string | JSX.Element;
5
+ isVisible: boolean;
6
+ hide: () => void;
7
+ primaryButton: {
8
+ label: string;
9
+ handleClick: () => any;
10
+ icon?: JSX.Element;
11
+ layoutClassName?: string;
12
+ };
13
+ secondaryButton?: {
14
+ label: string;
15
+ handleClick: () => any;
16
+ href: string;
17
+ icon?: JSX.Element;
18
+ layoutClassName?: string;
19
+ };
20
+ layoutClassName?: string;
21
+ }
22
+ export declare const NotificationPopUp: ({ title, description, isVisible, hide, primaryButton, secondaryButton, layoutClassName, }: NotificationPopUpProps) => JSX.Element | null;
23
+ export declare const NotificationPopUpController: () => {
24
+ isVisible: boolean;
25
+ show: () => void;
26
+ hide: () => void;
27
+ };
@@ -1,34 +1,34 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import * as React from "react";
3
- import * as styles from "./NotificationPopUp.module.css";
4
- import ReactDOM from "react-dom";
5
- import clsx from "clsx";
6
- import { Heading3, Link, Paragraph, Button } from "@utrecht/component-library-react";
7
- import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
8
- import { faArrowRight, faClose } from "@fortawesome/free-solid-svg-icons";
9
- export const NotificationPopUp = ({ title, description, isVisible, hide, primaryButton, secondaryButton, layoutClassName, }) => {
10
- const [animationVisible, setAnimationVisible] = React.useState(true);
11
- const animationDuration = parseInt(styles.animationDuration, 10);
12
- const handleClick = (clickFunction) => {
13
- setAnimationVisible(!setAnimationVisible);
14
- clickFunction && clickFunction();
15
- setTimeout(() => {
16
- hide();
17
- setAnimationVisible(true);
18
- }, animationDuration);
19
- };
20
- const modal = (_jsxs("div", { style: { animationDuration: `${animationDuration}ms` }, className: clsx(styles.modal, animationVisible && styles.visible, layoutClassName), children: [_jsx(Heading3, { children: title }), _jsx(Paragraph, { children: description }), _jsxs("div", { className: styles.buttons, children: [secondaryButton && (_jsx("div", { className: secondaryButton.layoutClassName, children: _jsxs(Link, { onClick: (e) => {
21
- e.preventDefault(), handleClick(secondaryButton.handleClick);
22
- }, className: styles.link, href: secondaryButton.href, children: [secondaryButton.icon ?? _jsx(FontAwesomeIcon, { icon: faClose }), secondaryButton.label] }) })), _jsxs(Button, { onClick: () => handleClick(primaryButton.handleClick), className: clsx(styles.button, primaryButton.layoutClassName), children: [primaryButton.icon ?? _jsx(FontAwesomeIcon, { icon: faArrowRight }), primaryButton.label] })] })] }));
23
- return isVisible ? ReactDOM.createPortal(modal, document.body) : null;
24
- };
25
- export const NotificationPopUpController = () => {
26
- const [isVisible, setIsVisible] = React.useState(false);
27
- const show = () => setIsVisible(true);
28
- const hide = () => setIsVisible(false);
29
- return {
30
- isVisible,
31
- show,
32
- hide,
33
- };
34
- };
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import * as React from "react";
3
+ import * as styles from "./NotificationPopUp.module.css";
4
+ import ReactDOM from "react-dom";
5
+ import clsx from "clsx";
6
+ import { Heading3, Link, Paragraph, Button } from "@utrecht/component-library-react";
7
+ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
8
+ import { faArrowRight, faClose } from "@fortawesome/free-solid-svg-icons";
9
+ export const NotificationPopUp = ({ title, description, isVisible, hide, primaryButton, secondaryButton, layoutClassName, }) => {
10
+ const [animationVisible, setAnimationVisible] = React.useState(true);
11
+ const animationDuration = parseInt(styles.animationDuration, 10);
12
+ const handleClick = (clickFunction) => {
13
+ setAnimationVisible(!setAnimationVisible);
14
+ clickFunction && clickFunction();
15
+ setTimeout(() => {
16
+ hide();
17
+ setAnimationVisible(true);
18
+ }, animationDuration);
19
+ };
20
+ const modal = (_jsxs("div", { style: { animationDuration: `${animationDuration}ms` }, className: clsx(styles.modal, animationVisible && styles.visible, layoutClassName), children: [_jsx(Heading3, { children: title }), _jsx(Paragraph, { children: description }), _jsxs("div", { className: styles.buttons, children: [secondaryButton && (_jsx("div", { className: secondaryButton.layoutClassName, children: _jsxs(Link, { onClick: (e) => {
21
+ e.preventDefault(), handleClick(secondaryButton.handleClick);
22
+ }, className: styles.link, href: secondaryButton.href, children: [secondaryButton.icon ?? _jsx(FontAwesomeIcon, { icon: faClose }), secondaryButton.label] }) })), _jsxs(Button, { onClick: () => handleClick(primaryButton.handleClick), className: clsx(styles.button, primaryButton.layoutClassName), children: [primaryButton.icon ?? _jsx(FontAwesomeIcon, { icon: faArrowRight }), primaryButton.label] })] })] }));
23
+ return isVisible ? ReactDOM.createPortal(modal, document.body) : null;
24
+ };
25
+ export const NotificationPopUpController = () => {
26
+ const [isVisible, setIsVisible] = React.useState(false);
27
+ const show = () => setIsVisible(true);
28
+ const hide = () => setIsVisible(false);
29
+ return {
30
+ isVisible,
31
+ show,
32
+ hide,
33
+ };
34
+ };
@@ -1,6 +1,6 @@
1
- import React from "react";
2
- interface PrivateRouteProps {
3
- authenticated: boolean;
4
- }
5
- export declare const PrivateRoute: ({ children, authenticated }: React.PropsWithChildren<PrivateRouteProps>) => JSX.Element;
6
- export {};
1
+ import React from "react";
2
+ interface PrivateRouteProps {
3
+ authenticated: boolean;
4
+ }
5
+ export declare const PrivateRoute: ({ children, authenticated }: React.PropsWithChildren<PrivateRouteProps>) => JSX.Element;
6
+ export {};
@@ -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, authenticated }) => {
5
- const [_authenticated, setAuthenticated] = React.useState(false);
6
- React.useEffect(() => {
7
- if (!authenticated && window.location.pathname !== "/login") {
8
- navigate("/login");
9
- }
10
- authenticated && setAuthenticated(true);
11
- }, [authenticated]);
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, authenticated }) => {
5
+ const [_authenticated, setAuthenticated] = React.useState(false);
6
+ React.useEffect(() => {
7
+ if (!authenticated && window.location.pathname !== "/login") {
8
+ navigate("/login");
9
+ }
10
+ authenticated && setAuthenticated(true);
11
+ }, [authenticated]);
12
+ if (!_authenticated)
13
+ return _jsx(_Fragment, {});
14
+ return _jsx(_Fragment, { children: children });
15
+ };
@@ -1,7 +1,7 @@
1
- import * as React from "react";
2
- interface QuoteWrapperProps {
3
- borderColor?: string;
4
- borderWidth?: string;
5
- }
6
- export declare const QuoteWrapper: ({ children, borderColor, borderWidth, }: React.PropsWithChildren<QuoteWrapperProps>) => JSX.Element;
7
- export {};
1
+ import * as React from "react";
2
+ interface QuoteWrapperProps {
3
+ borderColor?: string;
4
+ borderWidth?: string;
5
+ }
6
+ export declare const QuoteWrapper: ({ children, borderColor, borderWidth, }: React.PropsWithChildren<QuoteWrapperProps>) => JSX.Element;
7
+ export {};
@@ -1,5 +1,5 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import * as styles from "./QuoteWrapper.module.css";
3
- export const QuoteWrapper = ({ children, borderColor, borderWidth, }) => {
4
- return (_jsx("div", { style: { borderLeftColor: borderColor, borderLeftWidth: borderWidth }, className: styles.container, children: children }));
5
- };
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as styles from "./QuoteWrapper.module.css";
3
+ export const QuoteWrapper = ({ children, borderColor, borderWidth, }) => {
4
+ return (_jsx("div", { style: { borderLeftColor: borderColor, borderLeftWidth: borderWidth }, className: styles.container, children: children }));
5
+ };
@@ -1,5 +1,5 @@
1
- import { ReactTabsFunctionComponent, TabProps, TabPanelProps, TabListProps, TabsProps } from "react-tabs";
2
- export declare const Tabs: ReactTabsFunctionComponent<TabsProps>;
3
- export declare const TabList: ReactTabsFunctionComponent<TabListProps>;
4
- export declare const Tab: ReactTabsFunctionComponent<TabProps>;
5
- export declare const TabPanel: ReactTabsFunctionComponent<TabPanelProps>;
1
+ import { ReactTabsFunctionComponent, TabProps, TabPanelProps, TabListProps, TabsProps } from "react-tabs";
2
+ export declare const Tabs: ReactTabsFunctionComponent<TabsProps>;
3
+ export declare const TabList: ReactTabsFunctionComponent<TabListProps>;
4
+ export declare const Tab: ReactTabsFunctionComponent<TabProps>;
5
+ export declare const TabPanel: ReactTabsFunctionComponent<TabPanelProps>;