@ilo-org/react 0.12.0 → 0.14.0

package/lib/cjs/components/Cards/TextCard/index.js

@@ -1,25 +1,30 @@
 'use strict';
 
-var jsxRuntime = require('react/jsx-runtime');
-var classNames = require('classnames');
-var hooks_useGlobalSettings = require('../../../hooks/useGlobalSettings.js');
-var components_Profile_Profile = require('../../Profile/Profile.js');
+var components_Cards_TextCard_TextCard = require('./TextCard.js');
+require('react/jsx-runtime');
+require('classnames');
+require('../../../hooks/useGlobalSettings.js');
 require('tslib');
 require('react');
 require('../../../GlobalCtx-10114bdd.js');
+require('../../Profile/Profile.js');
 
-const TextCard = ({ eyebrow, title, theme, size, date, profile, link, }) => {
-    const { prefix } = hooks_useGlobalSettings();
-    const baseClass = `${prefix}--card`;
-    const wrapperClass = classNames(`${baseClass}--wrapper`);
-    const cardClasses = classNames(baseClass, `${baseClass}__type__text`, {
-        [`${baseClass}__action`]: link,
-        [`${baseClass}__size__${size}`]: size,
-        [`${baseClass}__theme__${theme}`]: theme,
-    });
-    console.log("heloo");
-    console.log(profile);
-    return (jsxRuntime.jsx("div", Object.assign({ className: wrapperClass }, { children: jsxRuntime.jsxs("div", Object.assign({ className: cardClasses }, { children: [link && (jsxRuntime.jsx("a", Object.assign({ className: `${baseClass}--link`, href: link, title: title }, { children: jsxRuntime.jsx("span", Object.assign({ className: `${baseClass}--link--text` }, { children: title })) }))), jsxRuntime.jsx("div", Object.assign({ className: `${baseClass}--wrap` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--content` }, { children: [eyebrow && jsxRuntime.jsx("p", Object.assign({ className: `${baseClass}--eyebrow` }, { children: eyebrow })), title && jsxRuntime.jsx("h5", Object.assign({ className: `${baseClass}--title` }, { children: title })), date && (jsxRuntime.jsx("time", Object.assign({ className: `${baseClass}--date`, dateTime: date.unix }, { children: date.human }))), profile && profile.avatar && (jsxRuntime.jsx(components_Profile_Profile, { avatar: profile.avatar, description: profile.description, link: profile.link, name: profile.name, role: profile.role, className: `${prefix}--profile--contents--${theme}` }))] })) }))] })) })));
+const TextCardArgs = {
+    title: "Why we need greater social justice",
+    eyebrow: "Podcast",
+    date: {
+        human: "20 September 2022",
+        unix: "1670389200",
+    },
+    theme: "light",
+    link: "https:/www.ilo.org",
+    profile: {
+        avatar: "/ilo-dg.jpg",
+        description: "Gilbert Houngbo is the Director-General of the International Labour Organization",
+        name: "Gilbert Houngbo",
+        role: "ILO Director-General",
+    },
 };
 
-module.exports = TextCard;
+exports.TextCard = components_Cards_TextCard_TextCard;
+exports.TextCardArgs = TextCardArgs;

package/lib/cjs/components/Footer/Footer.js

@@ -18,7 +18,7 @@ const Footer = ({ className, logo, tagline, subtagline, address, linkgroup, soci
     const { prefix } = hooks_useGlobalSettings();
     const baseClass = `${prefix}--footer`;
     const footerClasses = classNames(className, baseClass);
-    return (jsxRuntime.jsxs("footer", Object.assign({ className: footerClasses }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--main` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: "site--info" }, { children: [jsxRuntime.jsx("img", { className: `${baseClass}--logo`, src: logo, alt: "ILO Logo" }), jsxRuntime.jsx("h3", Object.assign({ className: `${baseClass}--headline` }, { children: tagline })), jsxRuntime.jsx("h4", Object.assign({ className: `${baseClass}--subhead` }, { children: subtagline }))] })), address && (jsxRuntime.jsx("div", Object.assign({ className: "address" }, { children: address.map((line, i) => (jsxRuntime.jsx("p", Object.assign({ className: "address--line" }, { children: line }), i))) }))), linkgroup && (jsxRuntime.jsx("nav", Object.assign({ className: "links" }, { children: jsxRuntime.jsx(components_LinkList_LinkList, { linkgroup: linkgroup, theme: "dark" }) }))), (socialmedia || subscribe) && (jsxRuntime.jsxs("div", Object.assign({ className: "connect" }, { children: [socialmedia && (jsxRuntime.jsx("div", Object.assign({ className: "social--links" }, { children: jsxRuntime.jsx(components_SocialMedia_SocialMedia, Object.assign({}, socialmedia, { theme: "dark" })) }))), subscribe && (jsxRuntime.jsx(components_Button_Button, { label: subscribe === null || subscribe === void 0 ? void 0 : subscribe.label, url: subscribe === null || subscribe === void 0 ? void 0 : subscribe.url, type: "primary", size: "large", target: "_blank" }))] })))] })), jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--secondary` }, { children: [jsxRuntime.jsx("div", Object.assign({ className: "legal" }, { children: legal })), secondarylinks && (jsxRuntime.jsx("nav", Object.assign({ className: "secondarylinks" }, { children: jsxRuntime.jsx("ul", Object.assign({ className: "secondarylinks--list" }, { children: secondarylinks.map((link, i) => (jsxRuntime.jsx("li", Object.assign({ className: "secondarylinks--list--item" }, { children: jsxRuntime.jsx("a", Object.assign({ href: link.url, className: "secondarylinks--list--link" }, { children: link === null || link === void 0 ? void 0 : link.label }), i) })))) })) }))), jsxRuntime.jsx("a", Object.assign({ href: anchorlink === null || anchorlink === void 0 ? void 0 : anchorlink.url, className: "anchorlink" }, { children: anchorlink === null || anchorlink === void 0 ? void 0 : anchorlink.label }))] }))] })));
+    return (jsxRuntime.jsxs("footer", Object.assign({ className: footerClasses }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--main ${prefix}--container` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: "site--info" }, { children: [jsxRuntime.jsx("img", { className: `${baseClass}--logo`, src: logo, alt: "ILO Logo" }), jsxRuntime.jsx("h3", Object.assign({ className: `${baseClass}--headline` }, { children: tagline })), jsxRuntime.jsx("h4", Object.assign({ className: `${baseClass}--subhead` }, { children: subtagline }))] })), address && (jsxRuntime.jsx("div", Object.assign({ className: "address" }, { children: address.map((line, i) => (jsxRuntime.jsx("p", Object.assign({ className: "address--line" }, { children: line }), i))) }))), linkgroup && (jsxRuntime.jsx("nav", Object.assign({ className: "links" }, { children: jsxRuntime.jsx(components_LinkList_LinkList, { linkgroup: linkgroup, theme: "dark" }) }))), socialmedia && (jsxRuntime.jsx("div", Object.assign({ className: "connect" }, { children: jsxRuntime.jsx("div", Object.assign({ className: "social--links" }, { children: jsxRuntime.jsx(components_SocialMedia_SocialMedia, Object.assign({}, socialmedia, { theme: "dark" })) })) }))), subscribe && (jsxRuntime.jsx("div", Object.assign({ className: "subscribe" }, { children: jsxRuntime.jsx(components_Button_Button, { label: subscribe === null || subscribe === void 0 ? void 0 : subscribe.label, url: subscribe === null || subscribe === void 0 ? void 0 : subscribe.url, type: "primary", size: "large", target: "_blank" }) })))] })), jsxRuntime.jsx("div", Object.assign({ className: `${baseClass}--secondary` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--container` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--secondary--details` }, { children: [jsxRuntime.jsx("div", Object.assign({ className: "legal" }, { children: legal })), secondarylinks && (jsxRuntime.jsx("nav", Object.assign({ className: "secondarylinks" }, { children: jsxRuntime.jsx("ul", Object.assign({ className: "secondarylinks--list" }, { children: secondarylinks.map((link, i) => (jsxRuntime.jsx("li", Object.assign({ className: "secondarylinks--list--item" }, { children: jsxRuntime.jsx("a", Object.assign({ href: link.url, className: "secondarylinks--list--link" }, { children: link === null || link === void 0 ? void 0 : link.label }), i) })))) })) })))] })), jsxRuntime.jsx("a", Object.assign({ href: anchorlink === null || anchorlink === void 0 ? void 0 : anchorlink.url, className: "anchorlink" }, { children: anchorlink === null || anchorlink === void 0 ? void 0 : anchorlink.label }))] })) }))] })));
 };
 
 module.exports = Footer;

package/lib/cjs/components/List/List.js

@@ -2,24 +2,22 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var classNames = require('classnames');
-var React = require('react');
 var hooks_useGlobalSettings = require('../../hooks/useGlobalSettings.js');
-var ListCtx = require('../../ListCtx-14aa546f.js');
 require('tslib');
+require('react');
 require('../../GlobalCtx-10114bdd.js');
 
-const List = ({ children, className, alignment, ordered, title, }) => {
+const List = ({ children, className, alignment = "default", ordered = "unstyled", title, }) => {
     const { prefix } = hooks_useGlobalSettings();
     const baseClass = `${prefix}--list`;
-    const [activeItems] = React.useState([]);
-    const listClasses = classNames(className, {
-        [baseClass]: true,
-        [`${baseClass}--${alignment}`]: alignment,
-        [`${baseClass}--${ordered}`]: true,
+    const unstyledClass = `${baseClass}__unstyled`;
+    const horizontalClass = `${baseClass}__horizontal`;
+    const titleClass = `${baseClass}--title`;
+    const listClasses = classNames(className, baseClass, {
+        [unstyledClass]: ordered === "unstyled",
+        [horizontalClass]: alignment === "horizontal",
     });
-    return (jsxRuntime.jsx(ListCtx.ListContext.Provider, Object.assign({ value: {
-            activeItems,
-        } }, { children: jsxRuntime.jsxs("div", Object.assign({ className: listClasses }, { children: [title && jsxRuntime.jsx("h5", Object.assign({ className: `${baseClass}__title` }, { children: title })), ordered && ordered === "ordered" && jsxRuntime.jsx("ol", { children: children }), ordered && ordered !== "ordered" && (jsxRuntime.jsx("ul", Object.assign({ className: `${baseClass}--${alignment}` }, { children: children })))] })) })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: listClasses }, { children: [title && jsxRuntime.jsx("h2", Object.assign({ className: titleClass }, { children: title })), ordered && ordered === "ordered" ? (jsxRuntime.jsx("ol", { children: children })) : (jsxRuntime.jsx("ul", { children: children }))] })));
 };
 
 module.exports = List;

package/lib/cjs/components/List/ListItem.js

@@ -4,18 +4,15 @@ var tslib = require('tslib');
 var jsxRuntime = require('react/jsx-runtime');
 var classNames = require('classnames');
 var hooks_useGlobalSettings = require('../../hooks/useGlobalSettings.js');
-var ListCtx = require('../../ListCtx-14aa546f.js');
 require('react');
 require('../../GlobalCtx-10114bdd.js');
 
 const ListItem = (_a) => {
-    var { children, id, className } = _a, rest = tslib.__rest(_a, ["children", "id", "className"]);
+    var { children, className } = _a, rest = tslib.__rest(_a, ["children", "className"]);
     const { prefix } = hooks_useGlobalSettings();
-    const baseClass = `${prefix}--list__item`;
-    const listItemClasses = classNames(className, {
-        [baseClass]: true,
-    });
-    return (jsxRuntime.jsx(ListCtx.ListItemContext.Provider, Object.assign({ value: { id } }, { children: jsxRuntime.jsx("li", Object.assign({ className: listItemClasses }, rest, { children: children })) })));
+    const baseClass = `${prefix}--list--item`;
+    const listItemClasses = classNames(className, baseClass);
+    return (jsxRuntime.jsx("li", Object.assign({ className: listItemClasses }, rest, { children: children })));
 };
 
 module.exports = ListItem;

package/lib/cjs/components/List/index.js

@@ -4,11 +4,10 @@ var components_List_List = require('./List.js');
 var components_List_ListItem = require('./ListItem.js');
 require('react/jsx-runtime');
 require('classnames');
-require('react');
 require('../../hooks/useGlobalSettings.js');
 require('tslib');
+require('react');
 require('../../GlobalCtx-10114bdd.js');
-require('../../ListCtx-14aa546f.js');
 
 
 

package/lib/cjs/components/Navigation/Navigation.js

@@ -41,10 +41,10 @@ const Navigation = ({ logo, mobilelogo, siteurl, tagline, primarynav, subnav, me
     const handleSubnavToggle = () => {
         setSubnavToggleOpen(!toggleSubnavOpen);
     };
-    return (jsxRuntime.jsxs("header", Object.assign({ className: NavigationClasses }, { children: [jsxRuntime.jsx("div", Object.assign({ className: `${baseClass}--utility-bar` }, { children: jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--language-switcher` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--language-switcher--wrap` }, { children: [jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--language-switcher--button`, type: "button" }, { children: languagelabel })), jsxRuntime.jsx(components_ContextMenu_ContextMenu, { links: languagecontextmenu === null || languagecontextmenu === void 0 ? void 0 : languagecontextmenu.links })] })) })) })), jsxRuntime.jsx("div", Object.assign({ className: `${baseClass}--logo-bar` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--inner` }, { children: [jsxRuntime.jsx("a", Object.assign({ href: siteurl, className: `${baseClass}--logo-link` }, { children: jsxRuntime.jsx("img", { className: `${baseClass}--logo`, src: logo, alt: "ILO Logo" }) })), jsxRuntime.jsxs("p", Object.assign({ className: `${baseClass}--logo-tagline` }, { children: [tagline === null || tagline === void 0 ? void 0 : tagline.tag, jsxRuntime.jsx("span", Object.assign({ className: `${baseClass}--logo-tagline--small` }, { children: tagline === null || tagline === void 0 ? void 0 : tagline.small }))] })), jsxRuntime.jsx("button", Object.assign({ className: `${baseClass}--menu`, onClick: handleMenuToggle }, { children: menulabel }))] })) })), jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--navigation` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--inner` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--nav` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--nav--logo` }, { children: [jsxRuntime.jsx("a", Object.assign({ href: siteurl, className: `${baseClass}--logo-link` }, { children: jsxRuntime.jsx("img", { className: `${baseClass}--logo`, src: mobilelogo, alt: "ILO Logo" }) })), jsxRuntime.jsx("button", Object.assign({ className: `${baseClass}--menu--close`, onClick: handleMenuToggle }, { children: menucloselabel }))] })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--nav--search` }, { children: jsxRuntime.jsx(components_SearchField_SearchField, { input: searchfield === null || searchfield === void 0 ? void 0 : searchfield.input, action: searchfield === null || searchfield === void 0 ? void 0 : searchfield.action }) })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--nav--language--switcher` }, { children: jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--mobile--nav--language--switcher--button`, onClick: handleLanguageToggle, type: "button" }, { children: languagelabel })) })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--nav--language--select` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--inner` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--subnav--menu` }, { children: [jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--mobile--subnav--back`, onClick: handleLanguageToggle, type: "button" }, { children: subnav === null || subnav === void 0 ? void 0 : subnav.mobilebacklabel })), jsxRuntime.jsx("button", Object.assign({ className: `${baseClass}--menu--close`, onClick: handleMenuToggle }, { children: subnav === null || subnav === void 0 ? void 0 : subnav.mobilecloselabel })), jsxRuntime.jsx("h6", Object.assign({ className: `${prefix}--mobile--subnav--label` }, { children: languagelabel }))] })), jsxRuntime.jsx("ul", Object.assign({ className: `${prefix}--nav--set` }, { children: (languagecontextmenu === null || languagecontextmenu === void 0 ? void 0 : languagecontextmenu.links) &&
+    return (jsxRuntime.jsxs("header", Object.assign({ className: NavigationClasses }, { children: [jsxRuntime.jsx("div", Object.assign({ className: `${baseClass}--utility-bar` }, { children: jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--language-switcher` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--language-switcher--wrap` }, { children: [jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--language-switcher--button`, type: "button" }, { children: languagelabel })), jsxRuntime.jsx(components_ContextMenu_ContextMenu, { links: languagecontextmenu === null || languagecontextmenu === void 0 ? void 0 : languagecontextmenu.links })] })) })) })), jsxRuntime.jsx("div", Object.assign({ className: `${baseClass}--logo-bar` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--inner ${prefix}--container` }, { children: [jsxRuntime.jsx("a", Object.assign({ href: siteurl, className: `${baseClass}--logo-link` }, { children: jsxRuntime.jsx("img", { className: `${baseClass}--logo`, src: logo, alt: "ILO Logo" }) })), jsxRuntime.jsxs("p", Object.assign({ className: `${baseClass}--logo-tagline` }, { children: [tagline === null || tagline === void 0 ? void 0 : tagline.tag, jsxRuntime.jsx("span", Object.assign({ className: `${baseClass}--logo-tagline--small` }, { children: tagline === null || tagline === void 0 ? void 0 : tagline.small }))] })), jsxRuntime.jsx("button", Object.assign({ className: `${baseClass}--menu`, onClick: handleMenuToggle }, { children: menulabel }))] })) })), jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--navigation` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--inner ${prefix}--container` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--nav` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--nav--logo` }, { children: [jsxRuntime.jsx("a", Object.assign({ href: siteurl, className: `${baseClass}--logo-link` }, { children: jsxRuntime.jsx("img", { className: `${baseClass}--logo`, src: mobilelogo, alt: "ILO Logo" }) })), jsxRuntime.jsx("button", Object.assign({ className: `${baseClass}--menu--close`, onClick: handleMenuToggle }, { children: menucloselabel }))] })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--nav--search` }, { children: jsxRuntime.jsx(components_SearchField_SearchField, { input: searchfield === null || searchfield === void 0 ? void 0 : searchfield.input, action: searchfield === null || searchfield === void 0 ? void 0 : searchfield.action }) })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--nav--language--switcher` }, { children: jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--mobile--nav--language--switcher--button`, onClick: handleLanguageToggle, type: "button" }, { children: languagelabel })) })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--nav--language--select` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--inner ${prefix}--container` }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--subnav--menu` }, { children: [jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--mobile--subnav--back`, onClick: handleLanguageToggle, type: "button" }, { children: subnav === null || subnav === void 0 ? void 0 : subnav.mobilebacklabel })), jsxRuntime.jsx("button", Object.assign({ className: `${baseClass}--menu--close`, onClick: handleMenuToggle }, { children: subnav === null || subnav === void 0 ? void 0 : subnav.mobilecloselabel })), jsxRuntime.jsx("h6", Object.assign({ className: `${prefix}--mobile--subnav--label` }, { children: languagelabel }))] })), jsxRuntime.jsx("ul", Object.assign({ className: `${prefix}--nav--set` }, { children: (languagecontextmenu === null || languagecontextmenu === void 0 ? void 0 : languagecontextmenu.links) &&
                                                         languagecontextmenu.links.map((item, index) => (jsxRuntime.jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsxRuntime.jsx("a", Object.assign({ href: item.url, className: `${prefix}--nav--link ${prefix}--nav--language` }, { children: item.label })) }), index))) }))] })) }))] })), jsxRuntime.jsxs("nav", Object.assign({ className: `${prefix}--nav`, "aria-labelledby": "primary-navigation" }, { children: [jsxRuntime.jsx("h2", Object.assign({ className: `${prefix}--nav--label`, id: "primary-navigation" }, { children: primarynav === null || primarynav === void 0 ? void 0 : primarynav.navlabel })), jsxRuntime.jsxs("ul", Object.assign({ className: `${prefix}--nav--set` }, { children: [(primarynav === null || primarynav === void 0 ? void 0 : primarynav.items) &&
-                                                primarynav.items.map((item, index) => (jsxRuntime.jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsxRuntime.jsx("a", Object.assign({ href: item.url, className: `${prefix}--nav--link` }, { children: item.label })) }), index))), subnav && (jsxRuntime.jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--nav--trigger`, onClick: handleSubnavToggle }, { children: subnav.buttonlabel })) })))] }))] })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--search` }, { children: jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--search--button`, type: "button", onClick: handleSearchToggle }, { children: searchlabel })) }))] })), subnav && (jsxRuntime.jsx("nav", Object.assign({ className: `${prefix}--subnav`, "aria-labelledby": "secondary-navigation" }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--subnav--inner` }, { children: [jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--subnav` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--subnav--menu` }, { children: [jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--mobile--subnav--back`, onClick: handleSubnavToggle, type: "button" }, { children: subnav.mobilebacklabel })), jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--header--menu--close`, onClick: handleMenuToggle }, { children: subnav.mobilecloselabel })), jsxRuntime.jsx("h6", Object.assign({ className: `${prefix}--mobile--subnav--label` }, { children: subnav.buttonlabel }))] })) })), jsxRuntime.jsx("h2", Object.assign({ className: `${prefix}--nav--label`, id: "secondary-navigation" }, { children: subnav.navlabel })), jsxRuntime.jsx("ul", Object.assign({ className: `${prefix}--subnav--set` }, { children: (subnav === null || subnav === void 0 ? void 0 : subnav.items) &&
-                                        subnav.items.map((item, index) => (jsxRuntime.jsx("li", Object.assign({ className: `${prefix}--subnav--items` }, { children: jsxRuntime.jsx("a", Object.assign({ href: item.url, className: `${prefix}--subnav--link` }, { children: item.label })) }), index))) }))] })) }))), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--search-box` }, { children: jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--header--inner` }, { children: jsxRuntime.jsx(components_SearchField_SearchField, { input: searchfield === null || searchfield === void 0 ? void 0 : searchfield.input, action: searchfield === null || searchfield === void 0 ? void 0 : searchfield.action }) })) }))] }))] })));
+                                                primarynav.items.map((item, index) => (jsxRuntime.jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsxRuntime.jsx("a", Object.assign({ href: item.url, className: `${prefix}--nav--link` }, { children: item.label })) }), index))), subnav && (jsxRuntime.jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--nav--trigger`, onClick: handleSubnavToggle }, { children: subnav.buttonlabel })) })))] }))] })), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--search` }, { children: jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--search--button`, type: "button", onClick: handleSearchToggle }, { children: searchlabel })) }))] })), subnav && (jsxRuntime.jsx("nav", Object.assign({ className: `${prefix}--subnav`, "aria-labelledby": "secondary-navigation" }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--subnav--inner ${prefix}--container` }, { children: [jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--mobile--subnav` }, { children: jsxRuntime.jsxs("div", Object.assign({ className: `${prefix}--mobile--subnav--menu` }, { children: [jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--mobile--subnav--back`, onClick: handleSubnavToggle, type: "button" }, { children: subnav.mobilebacklabel })), jsxRuntime.jsx("button", Object.assign({ className: `${prefix}--header--menu--close`, onClick: handleMenuToggle }, { children: subnav.mobilecloselabel })), jsxRuntime.jsx("h6", Object.assign({ className: `${prefix}--mobile--subnav--label` }, { children: subnav.buttonlabel }))] })) })), jsxRuntime.jsx("h2", Object.assign({ className: `${prefix}--nav--label`, id: "secondary-navigation" }, { children: subnav.navlabel })), jsxRuntime.jsx("ul", Object.assign({ className: `${prefix}--subnav--set` }, { children: (subnav === null || subnav === void 0 ? void 0 : subnav.items) &&
+                                        subnav.items.map((item, index) => (jsxRuntime.jsx("li", Object.assign({ className: `${prefix}--subnav--items` }, { children: jsxRuntime.jsx("a", Object.assign({ href: item.url, className: `${prefix}--subnav--link` }, { children: item.label })) }), index))) }))] })) }))), jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--search-box` }, { children: jsxRuntime.jsx("div", Object.assign({ className: `${prefix}--header--inner ${prefix}--container` }, { children: jsxRuntime.jsx(components_SearchField_SearchField, { input: searchfield === null || searchfield === void 0 ? void 0 : searchfield.input, action: searchfield === null || searchfield === void 0 ? void 0 : searchfield.action }) })) }))] }))] })));
 };
 
 module.exports = Navigation;

package/lib/cjs/components/Pagination/Pagination.js

@@ -43,7 +43,7 @@ const Pagination = ({ className, callback, currentPage, firstPageUrl, firstPageT
             callback(e);
         }
     };
-    return (jsxRuntime.jsxs("div", Object.assign({ className: paginationClasses }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--previous-set` }, { children: [jsxRuntime.jsx("a", Object.assign({ className: firstClasses, onClick: (e) => handleClick(e), href: firstPageUrl, title: firstPageTitle }, { children: firstPageTitle })), jsxRuntime.jsx("a", Object.assign({ className: prevClasses, onClick: (e) => handleClick(e), href: prevPageUrl, title: prevPageTitle }, { children: prevPageTitle }))] })), jsxRuntime.jsxs("p", Object.assign({ className: `${baseClass}--page` }, { children: [jsxRuntime.jsx("span", { children: currentPage + 1 }), " ", pageCountPreposition, " ", jsxRuntime.jsx("span", { children: totalPages })] })), jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--next-set` }, { children: [jsxRuntime.jsx("a", Object.assign({ className: nextClasses, onClick: (e) => handleClick(e), href: nextPageUrl, title: nextPageTitle }, { children: nextPageTitle })), jsxRuntime.jsx("a", Object.assign({ className: lastClasses, onClick: (e) => handleClick(e), href: lastPageUrl, title: lastPageTitle }, { children: lastPageTitle }))] }))] })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: paginationClasses }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--previous-set` }, { children: [jsxRuntime.jsx("a", Object.assign({ className: firstClasses, onClick: (e) => handleClick(e), href: firstPageUrl, title: firstPageTitle }, { children: firstPageTitle })), jsxRuntime.jsx("a", Object.assign({ className: prevClasses, onClick: (e) => handleClick(e), href: prevPageUrl, title: prevPageTitle }, { children: prevPageTitle }))] })), jsxRuntime.jsxs("p", Object.assign({ className: `${baseClass}--page` }, { children: [jsxRuntime.jsx("span", { children: currentPage + 1 }), jsxRuntime.jsx("span", { children: pageCountPreposition }), jsxRuntime.jsx("span", { children: totalPages })] })), jsxRuntime.jsxs("div", Object.assign({ className: `${baseClass}--next-set` }, { children: [jsxRuntime.jsx("a", Object.assign({ className: nextClasses, onClick: (e) => handleClick(e), href: nextPageUrl, title: nextPageTitle }, { children: nextPageTitle })), jsxRuntime.jsx("a", Object.assign({ className: lastClasses, onClick: (e) => handleClick(e), href: lastPageUrl, title: lastPageTitle }, { children: lastPageTitle }))] }))] })));
 };
 
 module.exports = Pagination;

package/lib/cjs/components/index.js

@@ -46,14 +46,12 @@ var components_Video_Video = require('./Video/Video.js');
 var components_Dropdown_Dropdown = require('./Dropdown/Dropdown.js');
 var components_Icon_Icon = require('./Icon/Icon.js');
 var components_List_List = require('./List/List.js');
-require('../ListCtx-14aa546f.js');
 var components_Profile_Profile = require('./Profile/Profile.js');
 var components_TableOfContents_TableOfContents = require('./TableOfContents/TableOfContents.js');
 var components_Footer_Footer = require('./Footer/Footer.js');
 var components_LocalNav_LocalNav = require('./LocalNav/LocalNav.js');
 var components_Navigation_Navigation = require('./Navigation/Navigation.js');
-var components_Cards_Card = require('./Cards/Card.js');
-var components_Cards_CardGroup = require('./Cards/CardGroup.js');
+var components_Cards_CardGroup_CardGroup = require('./Cards/CardGroup/CardGroup.js');
 var components_Breadcrumb_Breadcrumb = require('./Breadcrumb/Breadcrumb.js');
 var components_Tabs_Tabs = require('./Tabs/Tabs.js');
 require('../hooks/useGlobalSettings.js');
@@ -79,15 +77,15 @@ require('videojs-youtube');
 require('video.js');
 require('@ilo-org/icons-react');
 require('./Logo/Logo.js');
-require('./Cards/FeatureCard/index.js');
-require('./Cards/DataCard/index.js');
-require('./Cards/DetailCard/index.js');
-require('./Cards/FactlistCard/index.js');
+require('./Cards/DataCard/DataCard.js');
+require('./Cards/DetailCard/DetailCard.js');
+require('./Cards/FactlistCard/FactListCard.js');
 require('./List/ListItem.js');
-require('./Cards/MultilinkCard/index.js');
-require('./Cards/PromoCard/index.js');
-require('./Cards/StatCard/index.js');
-require('./Cards/TextCard/index.js');
+require('./Cards/FeatureCard/FeatureCard.js');
+require('./Cards/MultilinkCard/MultiLinkCard.js');
+require('./Cards/PromoCard/PromoCard.js');
+require('./Cards/StatCard/StatCard.js');
+require('./Cards/TextCard/TextCard.js');
 
 
 
@@ -132,7 +130,6 @@ exports.TableOfContents = components_TableOfContents_TableOfContents;
 exports.Footer = components_Footer_Footer;
 exports.LocalNav = components_LocalNav_LocalNav;
 exports.Navigation = components_Navigation_Navigation;
-exports.Card = components_Cards_Card;
-exports.CardGroup = components_Cards_CardGroup;
+exports.CardGroup = components_Cards_CardGroup_CardGroup;
 exports.Breadcrumb = components_Breadcrumb_Breadcrumb;
 exports.Tabs = components_Tabs_Tabs;

package/lib/cjs/index.js

@@ -46,14 +46,12 @@ var components_Video_Video = require('./components/Video/Video.js');
 var components_Dropdown_Dropdown = require('./components/Dropdown/Dropdown.js');
 var components_Icon_Icon = require('./components/Icon/Icon.js');
 var components_List_List = require('./components/List/List.js');
-require('./ListCtx-14aa546f.js');
 var components_Profile_Profile = require('./components/Profile/Profile.js');
 var components_TableOfContents_TableOfContents = require('./components/TableOfContents/TableOfContents.js');
 var components_Footer_Footer = require('./components/Footer/Footer.js');
 var components_LocalNav_LocalNav = require('./components/LocalNav/LocalNav.js');
 var components_Navigation_Navigation = require('./components/Navigation/Navigation.js');
-var components_Cards_Card = require('./components/Cards/Card.js');
-var components_Cards_CardGroup = require('./components/Cards/CardGroup.js');
+var components_Cards_CardGroup_CardGroup = require('./components/Cards/CardGroup/CardGroup.js');
 var components_Breadcrumb_Breadcrumb = require('./components/Breadcrumb/Breadcrumb.js');
 var components_Tabs_Tabs = require('./components/Tabs/Tabs.js');
 require('./hooks/useGlobalSettings.js');
@@ -79,15 +77,15 @@ require('./components/Video/VideoPlayer.js');
 require('videojs-youtube');
 require('video.js');
 require('./components/Logo/Logo.js');
-require('./components/Cards/FeatureCard/index.js');
-require('./components/Cards/DataCard/index.js');
-require('./components/Cards/DetailCard/index.js');
-require('./components/Cards/FactlistCard/index.js');
+require('./components/Cards/DataCard/DataCard.js');
+require('./components/Cards/DetailCard/DetailCard.js');
+require('./components/Cards/FactlistCard/FactListCard.js');
 require('./components/List/ListItem.js');
-require('./components/Cards/MultilinkCard/index.js');
-require('./components/Cards/PromoCard/index.js');
-require('./components/Cards/StatCard/index.js');
-require('./components/Cards/TextCard/index.js');
+require('./components/Cards/FeatureCard/FeatureCard.js');
+require('./components/Cards/MultilinkCard/MultiLinkCard.js');
+require('./components/Cards/PromoCard/PromoCard.js');
+require('./components/Cards/StatCard/StatCard.js');
+require('./components/Cards/TextCard/TextCard.js');
 
 
 
@@ -132,7 +130,6 @@ exports.TableOfContents = components_TableOfContents_TableOfContents;
 exports.Footer = components_Footer_Footer;
 exports.LocalNav = components_LocalNav_LocalNav;
 exports.Navigation = components_Navigation_Navigation;
-exports.Card = components_Cards_Card;
-exports.CardGroup = components_Cards_CardGroup;
+exports.CardGroup = components_Cards_CardGroup_CardGroup;
 exports.Breadcrumb = components_Breadcrumb_Breadcrumb;
 exports.Tabs = components_Tabs_Tabs;

package/lib/esm/components/Cards/CardGroup/CardGroup.js

@@ -0,0 +1,39 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import classNames from 'classnames';
+import useGlobalSettings from '../../../hooks/useGlobalSettings.js';
+import DataCard from '../DataCard/DataCard.js';
+import DetailCard from '../DetailCard/DetailCard.js';
+import FactlistCard from '../FactlistCard/FactListCard.js';
+import FeatureCard from '../FeatureCard/FeatureCard.js';
+import MultilinkCard from '../MultilinkCard/MultiLinkCard.js';
+import PromoCard from '../PromoCard/PromoCard.js';
+import StatCard from '../StatCard/StatCard.js';
+import TextCard from '../TextCard/TextCard.js';
+import 'tslib';
+import 'react';
+import '../../../GlobalCtx-7fb23cfa.js';
+import '../../Link/Link.js';
+import '../../List/List.js';
+import '../../List/ListItem.js';
+import '../../LinkList/LinkList.js';
+import '../../Profile/Profile.js';
+
+const cardMapper = {
+    stat: StatCard,
+    multilink: MultilinkCard,
+    text: TextCard,
+    promo: PromoCard,
+    feature: FeatureCard,
+    detail: DetailCard,
+    factlist: FactlistCard,
+    data: DataCard,
+};
+const CardGroup = ({ cards, cardCount, cta, type }) => {
+    const Cards = cardMapper[type];
+    const { prefix } = useGlobalSettings();
+    const baseClass = `${prefix}--cardgroup`;
+    const cardGroupClasses = classNames(baseClass, `${baseClass}__count__${cardCount}`);
+    return (jsxs("div", Object.assign({ className: cardGroupClasses }, { children: [jsx("div", Object.assign({ className: `${baseClass}--inner` }, { children: cards && cards.map((card, index) => jsx(Cards, Object.assign({}, card), index)) })), cta && (jsx("div", Object.assign({ className: `${baseClass}--button-wrap` }, { children: jsx("a", Object.assign({ className: `${prefix}--button ${prefix}--button--medium ${prefix}--button--secondary`, href: cta.url }, { children: jsx("span", Object.assign({ className: "button__label" }, { children: cta.label })) })) })))] })));
+};
+
+export { CardGroup as default };