@conduction/components 2.2.19 → 2.2.21

package/lib/components/htmlParser/ParsedHTML.module.css

@@ -0,0 +1,7 @@
+.container {
+  margin-block-start: var(--utrecht-space-block-3xl);
+}
+
+.container > div > article > *:not(:last-child) {
+  margin-block-end: var(--utrecht-space-block-lg);
+}

package/lib/components/htmlParser/parser/alert/getAlert.d.ts

@@ -0,0 +1 @@
+export declare const getAlert: (children: any, options: any, type: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/alert/getAlert.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as styles from "./getAlert.module.css";
+import { Alert } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getAlert = (children, options, type) => {
+    switch (true) {
+        case type.includes("note") || type.includes("info"):
+            return (_jsx(Alert, { className: styles.info, type: "info", children: domToReact(children, options) }));
+        case type.includes("error"):
+            return (_jsx(Alert, { className: styles.error, type: "error", children: domToReact(children, options) }));
+        case type.includes("warning"):
+            return (_jsx(Alert, { className: styles.warning, type: "warning", children: domToReact(children, options) }));
+        case type.includes("succes") || type.includes("ok"):
+            return (_jsx(Alert, { className: styles.ok, type: "ok", children: domToReact(children, options) }));
+        default:
+            return _jsx(Alert, { type: "info", children: domToReact(children, options) });
+    }
+};

package/lib/components/htmlParser/parser/alert/getAlert.module.css

@@ -0,0 +1,28 @@
+.info svg {
+  fill: var(--utrecht-alert-icon-info-color);
+}
+.info p {
+  color: var(--utrecht-alert-info-color);
+}
+
+.warning svg {
+  fill: var(--utrecht-alert-icon-warning-color);
+}
+.warning p {
+  color: var(--utrecht-alert-warning-color);
+}
+
+.error svg {
+  fill: var(--utrecht-alert-icon-error-color);
+}
+.error p {
+  color: var(--utrecht-alert-error-color);
+}
+
+.ok svg {
+  fill: var(--utrecht-alert-icon-ok-color);
+}
+.ok p {
+  color: var(--utrecht-alert-ok-color);
+}
+

package/lib/components/htmlParser/parser/anchor/getAnchor.d.ts

@@ -0,0 +1,2 @@
+import { TGitHubDirectory } from "../../useGitHubDirectories";
+export declare const getAnchor: (props: any, children: any, options: any, directories: TGitHubDirectory[], location: string) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/anchor/getAnchor.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import _ from "lodash";
+import { Link } from "@utrecht/component-library-react/dist/css-module";
+import { navigate } from "gatsby";
+import { domToReact } from "html-react-parser";
+export const getAnchor = (props, children, options, directories, location) => {
+    const handleClick = (e) => {
+        e.preventDefault();
+        const targetFile = _.upperFirst(props.href.substring(props.href.lastIndexOf("/") + 1).replace(".md", ""));
+        // No link
+        if (!props.href) {
+            navigate("#");
+            return;
+        }
+        // Anchor Links
+        if (props.className === "anchor" || Array.from(props.href)[0] === "#") {
+            handleAnchorClick(props); // handles on-page scroll anchors
+            return;
+        }
+        // Internal Links
+        if (!props.href.includes("://")) {
+            handleInternalLinks(props, targetFile, location, directories);
+            return;
+        }
+        // External Links
+        if (props.href.includes("://")) {
+            open(props.href);
+            return;
+        }
+    };
+    const attributes = {
+        ...props,
+        onClick: handleClick,
+    };
+    return _jsx(Link, { ...attributes, children: domToReact(children, options) });
+};
+const handleInternalLinks = (props, targetFile, location, directories) => {
+    // Internal Links: same directory
+    if (!props.href.includes("/")) {
+        const targetDirectory = _.upperFirst(location.split("/").reverse()[1]);
+        navigate(`/pages/${targetDirectory}/${targetFile}`);
+        return; // ensure no other flow is triggered
+    }
+    // Internal Links: homepage
+    if (props.href.includes("/") && location === "/") {
+        const directoryFound = directories.some((directory) => directory.location === props.href);
+        if (directoryFound)
+            navigate(`/pages/${targetFile}`);
+        return; // ensure no other flow is triggered
+    }
+    // Internal Links: different directory
+    if (props.href.includes("/")) {
+        const targetDirectory = props.href.split("/").reverse()[1];
+        const directoryFound = directories.some((directory) => directory.location.substring(directory.location.lastIndexOf("/") + 1) === targetDirectory);
+        // Internal Link exists: redirect to page
+        if (directoryFound) {
+            navigate(`/pages/${_.upperFirst(targetDirectory)}/${targetFile}`);
+        }
+        // Internal Link does not exist: redirect to online GitHub environment (TODO)
+        if (!directoryFound) {
+            const hrefWithLeadingSlash = !props.href.startsWith("/") ? `/${props.href}` : props.href;
+            open(`${process.env.GATSBY_GITHUB_REPOSITORY_URL}/blob/master${hrefWithLeadingSlash}`);
+        }
+        return; // ensure no other flow is triggered
+    }
+};
+const handleAnchorClick = (props) => {
+    const targetId = props.id ?? props.href.replace("#", "user-content-");
+    const target = document.getElementById(targetId);
+    const headerHeight = document.getElementById("header")?.clientHeight ?? 100;
+    if (target) {
+        window.scrollTo({ top: target.offsetTop - (headerHeight + 24), behavior: "smooth" }); // +24 simply adds some padding
+    }
+};

package/lib/components/htmlParser/parser/code/getCode.d.ts

@@ -0,0 +1 @@
+export declare const getCode: (name: string, props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element | undefined;

package/lib/components/htmlParser/parser/code/getCode.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Code, CodeBlock } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getCode = (name, props, children, options) => {
+    switch (name) {
+        case "code":
+            return _jsx(Code, { ...props, children: domToReact(children, options) });
+        case "pre":
+            return _jsx(CodeBlock, { ...props, children: domToReact(children, options) });
+    }
+};

package/lib/components/htmlParser/parser/getBlockquote/getBlockquote.d.ts

@@ -0,0 +1 @@
+export declare const getBlockquote: (children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/getBlockquote/getBlockquote.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Alert } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getBlockquote = (children, options) => {
+    return _jsx(Alert, { children: domToReact(children, options) });
+};

package/lib/components/htmlParser/parser/header/getHeader.d.ts

@@ -0,0 +1 @@
+export declare const getHeader: (name: string, props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element | undefined;

package/lib/components/htmlParser/parser/header/getHeader.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Heading1, Heading2, Heading3, Heading4 } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getHeader = (name, props, children, options) => {
+    switch (name) {
+        case "h1":
+            return _jsx(Heading1, { ...props, children: domToReact(children, options) });
+        case "h2":
+            return _jsx(Heading2, { ...props, children: domToReact(children, options) });
+        case "h3":
+            return _jsx(Heading3, { ...props, children: domToReact(children, options) });
+        case "h4":
+            return _jsx(Heading4, { ...props, children: domToReact(children, options) });
+    }
+};

package/lib/components/htmlParser/parser/image/getImage.d.ts

@@ -0,0 +1 @@
+export declare const getImage: (props: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/image/getImage.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Image } from "@utrecht/component-library-react/dist/css-module";
+export const getImage = (props) => {
+    let src = props.src;
+    if (!props.src.includes("https://" || "http://")) {
+        const sessionUrl = process.env.GATSBY_GITHUB_REPOSITORY_URL;
+        const url = sessionUrl?.replace("https://github.com/", "");
+        src = `https://raw.githubusercontent.com/${url}/master/docs/features/${props.src}`;
+    }
+    let alt = props.alt;
+    if (!props.alt) {
+        alt = props.title;
+    }
+    if (!props.alt && !props.title) {
+        alt = props.src;
+    }
+    const attributes = {
+        ...props,
+        src,
+        alt,
+        href: "",
+        onClick: (e) => {
+            e.stopPropagation();
+            open(src);
+        },
+    };
+    return _jsx(Image, { ...attributes });
+};

package/lib/components/htmlParser/parser/list/getList.d.ts

@@ -0,0 +1 @@
+export declare const getList: (name: string, props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element | undefined;

package/lib/components/htmlParser/parser/list/getList.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as styles from "./getList.module.css";
+import { OrderedList, UnorderedList } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getList = (name, props, children, options) => {
+    switch (name) {
+        case "ol":
+            return (_jsx(OrderedList, { className: styles.list, ...props, children: domToReact(children, options) }));
+        case "ul":
+            return (_jsx(UnorderedList, { className: styles.list, ...props, children: domToReact(children, options) }));
+    }
+};

package/lib/components/htmlParser/parser/list/getList.module.css

@@ -0,0 +1,3 @@
+.list {
+  width: 100% !important;
+}

package/lib/components/htmlParser/parser/listItem/getListItem.d.ts

@@ -0,0 +1 @@
+export declare const getListItem: (props: any, parent: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element | undefined;

package/lib/components/htmlParser/parser/listItem/getListItem.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { OrderedListItem, UnorderedListItem } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getListItem = (props, parent, children, options) => {
+    switch (parent.name) {
+        case "ol":
+            return _jsx(OrderedListItem, { ...props, children: domToReact(children, options) });
+        case "ul":
+            return _jsx(UnorderedListItem, { ...props, children: domToReact(children, options) });
+    }
+    return;
+};

package/lib/components/htmlParser/parser/paragraph/getParagraph.d.ts

@@ -0,0 +1 @@
+export declare const getParagraph: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/paragraph/getParagraph.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Paragraph } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getParagraph = (props, children, options) => {
+    return _jsx(Paragraph, { ...props, children: domToReact(children, options) });
+};

package/lib/components/htmlParser/parser/svg/getSvg.d.ts

@@ -0,0 +1 @@
+export declare const getSvg: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/svg/getSvg.js

@@ -0,0 +1,8 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { domToReact } from "html-react-parser";
+export const getSvg = (props, children, options) => {
+    if (props.className.includes("octicon octicon-link")) {
+        return _jsx(_Fragment, {});
+    }
+    return _jsx("svg", { ...props, children: domToReact(children, options) });
+};

package/lib/components/htmlParser/parser/table/getTable.d.ts

@@ -0,0 +1 @@
+export declare const getTable: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/table/getTable.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as styles from "./getTable.module.css";
+import { Table } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getTable = (props, children, options) => {
+    return (_jsx(Table, { className: styles.table, ...props, children: domToReact(children, options) }));
+};

package/lib/components/htmlParser/parser/table/getTable.module.css

@@ -0,0 +1,3 @@
+.table {
+  background-color: var(--utrecht-table-background-color) !important;
+}

package/lib/components/htmlParser/parser/tableBody/getTableBody.d.ts

@@ -0,0 +1 @@
+export declare const getTableBody: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/tableBody/getTableBody.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as styles from "./getTableBody.module.css";
+import { TableBody } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getTableBody = (props, children, options) => {
+    return (_jsx(TableBody, { className: styles.tableBody, ...props, children: domToReact(children, options) }));
+};

package/lib/components/htmlParser/parser/tableBody/getTableBody.module.css

@@ -0,0 +1,3 @@
+.tableBody {
+  border: var(--utrecht-table-body-border);
+}

package/lib/components/htmlParser/parser/tableCell/getTableCell.d.ts

@@ -0,0 +1 @@
+export declare const getTableCell: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/tableCell/getTableCell.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as styles from "./getTableCell.module.css";
+import { TableCell } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getTableCell = (props, children, options) => {
+    return (_jsx(TableCell, { className: styles.tableCell, ...props, children: domToReact(children, options) }));
+};

package/lib/components/htmlParser/parser/tableCell/getTableCell.module.css

@@ -0,0 +1,3 @@
+.tableCell {
+  vertical-align: middle !important;
+}

package/lib/components/htmlParser/parser/tableHeader/getTableHeader.d.ts

@@ -0,0 +1 @@
+export declare const getTableHeader: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/tableHeader/getTableHeader.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as styles from "./getTableHeader.module.css";
+import { TableHeader } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getTableHeader = (props, children, options) => {
+    return (_jsx(TableHeader, { className: styles.tableHeader, ...props, children: domToReact(children, options) }));
+};

package/lib/components/htmlParser/parser/tableHeader/getTableHeader.module.css

@@ -0,0 +1,28 @@
+.tableHeader {
+  font-family: var(--utrecht-table-header-font-family);
+}
+
+.tableHeader > * {
+  border-block-end: var(--utrecht-table-header-border-block-end-width) solid
+    var(--utrecht-table-header-border-block-end-color);
+}
+
+.tableHeader > tr:nth-child(odd) {
+  background-color: inherit;
+  color: inherit;
+}
+
+.tableHeader > tr:nth-child(odd):hover {
+  background-color: inherit;
+  color: inherit;
+}
+
+.tableHeader > tr:nth-child(even) {
+  background-color: inherit;
+  color: inherit;
+}
+
+.tableHeader > tr:nth-child(even):hover {
+  background-color: inherit;
+  color: inherit;
+}

package/lib/components/htmlParser/parser/tableHeaderCell/getTableHeaderCell.d.ts

@@ -0,0 +1 @@
+export declare const getTableHeaderCell: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/tableHeaderCell/getTableHeaderCell.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TableHeaderCell } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getTableHeaderCell = (props, children, options) => {
+    return _jsx(TableHeaderCell, { ...props, children: domToReact(children, options) });
+};

package/lib/components/htmlParser/parser/tableRow/getTableRow.d.ts

@@ -0,0 +1 @@
+export declare const getTableRow: (props: any, children: any, options: any) => import("react/jsx-runtime").JSX.Element;

package/lib/components/htmlParser/parser/tableRow/getTableRow.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as styles from "./getTableRow.module.css";
+import { TableRow } from "@utrecht/component-library-react/dist/css-module";
+import { domToReact } from "html-react-parser";
+export const getTableRow = (props, children, options) => {
+    return (_jsx(TableRow, { className: styles.tableRow, ...props, children: domToReact(children, options) }));
+};

package/lib/components/htmlParser/parser/tableRow/getTableRow.module.css

@@ -0,0 +1,29 @@
+.tableRow:nth-child(odd) {
+  background-color: var(--utrecht-table-row-alternate-odd-background-color);
+  color: var(--utrecht-table-row-alternate-odd-color);
+}
+
+.tableRow:nth-child(odd):hover {
+  background-color: var(--utrecht-table-row-hover-background-color);
+  color: var(--utrecht-table-row-hover-color);
+}
+
+.tableRow:nth-child(even) {
+  background-color: var(--utrecht-table-row-alternate-even-background-color);
+  color: var(--utrecht-table-row-alternate-even-color);
+}
+
+.tableRow:nth-child(even):hover {
+  background-color: var(--utrecht-table-row-hover-background-color);
+  color: var(--utrecht-table-row-hover-color);
+}
+
+.tableRow:nth-child(even) {
+  background-color: var(--utrecht-table-row-alternate-even-background-color);
+  color: var(--utrecht-table-row-alternate-even-color);
+}
+
+.tableRow:nth-child(even):hover {
+  background-color: var(--utrecht-table-row-hover-background-color);
+  color: var(--utrecht-table-row-hover-color);
+}

package/lib/components/htmlParser/parser/useHtmlParser.d.ts

@@ -0,0 +1,5 @@
+export declare const useHtmlParser: (location: string, directoriesJson: string) => {
+    options: {
+        replace: ({ attribs, parent, children, name }: any) => import("react/jsx-runtime").JSX.Element | undefined;
+    };
+};

package/lib/components/htmlParser/parser/useHtmlParser.js

@@ -0,0 +1,78 @@
+import { attributesToProps } from "html-react-parser";
+import { getHeader } from "./header/getHeader";
+import { getAnchor } from "./anchor/getAnchor";
+import { getListItem } from "./listItem/getListItem";
+import { getImage } from "./image/getImage";
+import { getList } from "./list/getList";
+import { getParagraph } from "./paragraph/getParagraph";
+import { getBlockquote } from "./getBlockquote/getBlockquote";
+import { getTable } from "./table/getTable";
+import { getTableRow } from "./tableRow/getTableRow";
+import { getTableHeader } from "./tableHeader/getTableHeader";
+import { getTableHeaderCell } from "./tableHeaderCell/getTableHeaderCell";
+import { getTableBody } from "./tableBody/getTableBody";
+import { getTableCell } from "./tableCell/getTableCell";
+import { getCode } from "./code/getCode";
+import { getAlert } from "./alert/getAlert";
+import { useGitHubDirectories } from "../useGitHubDirectories";
+import { getSvg } from "./svg/getSvg";
+export const useHtmlParser = (location, directoriesJson) => {
+    const { directories } = useGitHubDirectories(directoriesJson);
+    const options = {
+        replace: ({ attribs, parent, children, name }) => {
+            if (!attribs) {
+                return;
+            }
+            const props = attributesToProps(attribs);
+            if (attribs && (name === "h1" || name === "h2" || name === "h3" || name === "h4")) {
+                return getHeader(name, props, children, options);
+            }
+            if (attribs && name === "p") {
+                return getParagraph(props, children, options);
+            }
+            if (attribs && name === "a") {
+                return getAnchor(props, children, options, directories, location);
+            }
+            if (attribs && (name === "ol" || name === "ul")) {
+                return getList(name, props, children, options);
+            }
+            if (attribs && name === "li") {
+                return getListItem(props, parent, children, options);
+            }
+            if (attribs && name === "img") {
+                return getImage(props);
+            }
+            if (attribs && name === "blockquote") {
+                return getBlockquote(children, options);
+            }
+            if (attribs && name === "div" && attribs.class?.includes("markdown-alert")) {
+                return getAlert(children, options, attribs.class);
+            }
+            if (attribs && name === "table") {
+                return getTable(props, children, options);
+            }
+            if (attribs && name === "tr") {
+                return getTableRow(props, children, options);
+            }
+            if (attribs && name === "thead") {
+                return getTableHeader(props, children, options);
+            }
+            if (attribs && name === "th") {
+                return getTableHeaderCell(props, children, options);
+            }
+            if (attribs && name === "tbody") {
+                return getTableBody(props, children, options);
+            }
+            if (attribs && name === "td") {
+                return getTableCell(props, children, options);
+            }
+            if (attribs && name === "svg") {
+                return getSvg(props, children, options);
+            }
+            if (attribs && (name === "code" || name === "pre")) {
+                return getCode(name, props, children, options);
+            }
+        },
+    };
+    return { options };
+};

package/lib/components/htmlParser/useGitHubDirectories.d.ts

@@ -0,0 +1,10 @@
+export declare type TGitHubDirectory = {
+    name: string;
+    location: string;
+};
+export declare const useGitHubDirectories: (test: string) => {
+    directories: TGitHubDirectory[];
+    getSlugFromName: (name: string) => string;
+    getDirectoryReadMeLocation: (pageSlug: string) => string;
+    getDetailMdLocation: (pageSlug: string, detailPageSlug: string) => string;
+};

package/lib/components/htmlParser/useGitHubDirectories.js

@@ -0,0 +1,31 @@
+import * as React from "react";
+export const useGitHubDirectories = (test) => {
+    const [directories, setDirectories] = React.useState([]);
+    React.useEffect(() => {
+        const gitHubDirectoryPathsString = test;
+        if (!gitHubDirectoryPathsString)
+            return;
+        try {
+            const directories = JSON.parse(gitHubDirectoryPathsString);
+            setDirectories(directories);
+        }
+        catch {
+            console.warn("Something went wrong parsing the GitHub directories.");
+        }
+    }, []);
+    const getSlugFromName = (name) => name.replace(" ", "-");
+    const getNameFromSlug = (slug) => slug.replace("-", " "); // internal function
+    const getDirectoryReadMeLocation = (pageSlug) => {
+        const directory = directories.find((directory) => directory.name === getNameFromSlug(pageSlug));
+        if (!directory)
+            return "";
+        return `${directory.location}/README.md`;
+    };
+    const getDetailMdLocation = (pageSlug, detailPageSlug) => {
+        const directory = directories.find((directory) => directory.name === getNameFromSlug(pageSlug));
+        if (!directory)
+            return "";
+        return `${directory.location}/${getNameFromSlug(detailPageSlug)}.md`;
+    };
+    return { directories, getSlugFromName, getDirectoryReadMeLocation, getDetailMdLocation };
+};

package/lib/components/imageDivider/ImageDivider.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-interface ImageDividerProps {
-    image: string;
-    layoutClassName: string;
-}
-export declare const ImageDivider: ({ image, layoutClassName }: ImageDividerProps) => JSX.Element;
-export {};
+/// <reference types="react" />
+interface ImageDividerProps {
+    image: string;
+    layoutClassName: string;
+}
+export declare const ImageDivider: ({ image, layoutClassName }: ImageDividerProps) => JSX.Element;
+export {};

package/lib/components/imageDivider/ImageDivider.js

@@ -1,6 +1,6 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import clsx from "clsx";
-import * as styles from "./imageDivider.module.css";
-export const ImageDivider = ({ image, layoutClassName }) => {
-    return _jsx("img", { src: image, className: clsx(styles.divider, layoutClassName) });
-};
+import { jsx as _jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import * as styles from "./imageDivider.module.css";
+export const ImageDivider = ({ image, layoutClassName }) => {
+    return _jsx("img", { src: image, className: clsx(styles.divider, layoutClassName) });
+};

package/lib/components/imageDivider/imageDivider.module.css

@@ -1,5 +1,5 @@
-.divider {
-  display: block;
-  object-fit: cover;
-  width: 100%;
-}
+.divider {
+  display: block;
+  object-fit: cover;
+  width: 100%;
+}

package/lib/components/jumbotron/Jumbotron.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+interface JumbotronProps {
+    title: string;
+    ariaLabel: {
+        container: string;
+        card: string;
+    };
+    role: string;
+    subTitle?: string;
+    description?: string;
+    image?: {
+        placement: "false" | "background" | "right";
+        url: string;
+    };
+    isCard?: boolean;
+    searchForm?: {
+        element: JSX.Element;
+        show: boolean;
+    };
+}
+export declare const Jumbotron: React.FC<JumbotronProps>;
+export {};