@ilo-org/react 0.17.7 → 0.18.0

package/lib/esm/components/Navigation/Navigation.js

@@ -1,81 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState, useRef, useCallback, useEffect } from 'react';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import ContextMenu from '../ContextMenu/ContextMenu.js';
-import SearchField from '../SearchField/SearchField.js';
-import classNames from 'classnames';
-import 'tslib';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../Input/Input.js';
-import '../Fieldset/Fieldset.js';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';
-import '../FormElement/FormElement.js';
-import '../Icon/Icon.js';
-import '@ilo-org/icons-react';
-
-const Navigation = ({ logo, mobilelogo, siteurl, tagline, primarynav, subnav, menulabel, menucloselabel, searchlabel, searchfield, languagelabel, languagecontextmenu, }) => {
-    const { prefix } = useGlobalSettings();
-    const [toggleMenuOpen, setMenuToggleOpen] = useState(false);
-    const [toggleSearchOpen, setSearchToggleOpen] = useState(false);
-    const [searchTabbable, setSearchTabbable] = useState(false);
-    const [toggleSubnavOpen, setSubnavToggleOpen] = useState(false);
-    const [subnavTabbable, setSubnavTabbable] = useState(false);
-    const [toggleLanguageOpen, setLanguageToggleOpen] = useState(false);
-    const baseClass = `${prefix}--header`;
-    const NavigationClasses = classNames(baseClass, {
-        [`${prefix}--mobile--open`]: toggleMenuOpen,
-        [`${prefix}--search--open`]: toggleSearchOpen,
-        [`${prefix}--subnav--open`]: toggleSubnavOpen,
-        [`${prefix}--select--open`]: toggleLanguageOpen,
-        [`${prefix}--context--open`]: toggleLanguageOpen,
-    });
-    const searchInputRef = useRef(null);
-    const handleSearchInputFocus = () => {
-        if (searchInputRef.current) {
-            searchInputRef.current.focus();
-        }
-    };
-    const handleMenuToggle = () => {
-        setMenuToggleOpen(!toggleMenuOpen);
-    };
-    const handleLanguageToggle = useCallback(() => {
-        setLanguageToggleOpen(!toggleLanguageOpen);
-    }, [toggleLanguageOpen]);
-    const handleSearchToggle = () => {
-        if (toggleSearchOpen) {
-            setSearchToggleOpen(false);
-            setTimeout(() => setSearchTabbable(false), 225);
-            return;
-        }
-        setSearchTabbable(true);
-        setTimeout(() => setSearchToggleOpen(true), 10);
-        setTimeout(() => handleSearchInputFocus(), 50);
-    };
-    const handleSubnavToggle = () => {
-        if (toggleSubnavOpen) {
-            setSubnavToggleOpen(false);
-            setTimeout(() => setSubnavTabbable(false), 125);
-            return;
-        }
-        setSubnavTabbable(true);
-        setTimeout(() => setSubnavToggleOpen(true), 10);
-    };
-    useEffect(() => {
-        if (window) {
-            if (toggleLanguageOpen) {
-                window.addEventListener("click", handleLanguageToggle);
-            }
-            else {
-                window.removeEventListener("click", handleLanguageToggle);
-            }
-            return () => window.removeEventListener("click", handleLanguageToggle);
-        }
-    }, [toggleLanguageOpen, handleLanguageToggle]);
-    return (jsxs("header", Object.assign({ className: NavigationClasses }, { children: [jsx("div", Object.assign({ className: `${baseClass}--utility-bar` }, { children: jsx("div", Object.assign({ className: `${prefix}--language-switcher` }, { children: jsxs("div", Object.assign({ className: `${prefix}--language-switcher--wrap` }, { children: [jsx("button", Object.assign({ className: `${prefix}--language-switcher--button`, type: "button", onClick: handleLanguageToggle }, { children: languagelabel })), jsx(ContextMenu, { links: languagecontextmenu === null || languagecontextmenu === void 0 ? void 0 : languagecontextmenu.links })] })) })) })), jsx("div", Object.assign({ className: `${baseClass}--logo-bar` }, { children: jsxs("div", Object.assign({ className: `${baseClass}--inner ${prefix}--container` }, { children: [jsx("a", Object.assign({ href: siteurl, className: `${baseClass}--logo-link` }, { children: jsx("img", { className: `${baseClass}--logo`, src: logo, alt: "ILO Logo" }) })), jsxs("p", Object.assign({ className: `${baseClass}--logo-tagline` }, { children: [tagline === null || tagline === void 0 ? void 0 : tagline.tag, jsx("span", Object.assign({ className: `${baseClass}--logo-tagline--small` }, { children: tagline === null || tagline === void 0 ? void 0 : tagline.small }))] })), jsx("button", Object.assign({ className: `${baseClass}--menu`, onClick: handleMenuToggle }, { children: menulabel }))] })) })), jsxs("div", Object.assign({ className: `${baseClass}--navigation` }, { children: [jsxs("div", Object.assign({ className: `${baseClass}--inner ${prefix}--container` }, { children: [jsxs("div", Object.assign({ className: `${prefix}--mobile--nav` }, { children: [jsxs("div", Object.assign({ className: `${prefix}--mobile--nav--logo` }, { children: [jsx("a", Object.assign({ href: siteurl, className: `${baseClass}--logo-link` }, { children: jsx("img", { className: `${baseClass}--logo`, src: mobilelogo, alt: "ILO Logo" }) })), jsx("button", Object.assign({ className: `${baseClass}--menu--close`, onClick: handleMenuToggle }, { children: menucloselabel }))] })), jsx("div", Object.assign({ className: `${prefix}--mobile--nav--search` }, { children: jsx(SearchField, { input: searchfield === null || searchfield === void 0 ? void 0 : searchfield.input, action: searchfield === null || searchfield === void 0 ? void 0 : searchfield.action }) })), jsx("div", Object.assign({ className: `${prefix}--mobile--nav--language--switcher` }, { children: jsx("button", Object.assign({ className: `${prefix}--mobile--nav--language--switcher--button`, onClick: handleLanguageToggle, type: "button" }, { children: languagelabel })) })), jsx("div", Object.assign({ className: `${prefix}--mobile--nav--language--select` }, { children: jsxs("div", Object.assign({ className: `${baseClass}--inner ${prefix}--container` }, { children: [jsxs("div", Object.assign({ className: `${prefix}--mobile--subnav--menu` }, { children: [jsx("button", Object.assign({ className: `${prefix}--mobile--subnav--back`, onClick: handleLanguageToggle, type: "button" }, { children: subnav === null || subnav === void 0 ? void 0 : subnav.mobilebacklabel })), jsx("button", Object.assign({ className: `${baseClass}--menu--close`, onClick: handleMenuToggle }, { children: subnav === null || subnav === void 0 ? void 0 : subnav.mobilecloselabel })), jsx("h6", Object.assign({ className: `${prefix}--mobile--subnav--label` }, { children: languagelabel }))] })), jsx("ul", Object.assign({ className: `${prefix}--nav--set` }, { children: (languagecontextmenu === null || languagecontextmenu === void 0 ? void 0 : languagecontextmenu.links) &&
-                                                        languagecontextmenu.links.map((item, index) => (jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsx("a", Object.assign({ href: item.url, className: `${prefix}--nav--link ${prefix}--nav--language` }, { children: item.label })) }), index))) }))] })) }))] })), jsxs("nav", Object.assign({ className: `${prefix}--nav`, "aria-labelledby": "primary-navigation" }, { children: [jsx("h2", Object.assign({ className: `${prefix}--nav--label`, id: "primary-navigation" }, { children: primarynav === null || primarynav === void 0 ? void 0 : primarynav.navlabel })), jsxs("ul", Object.assign({ className: `${prefix}--nav--set` }, { children: [(primarynav === null || primarynav === void 0 ? void 0 : primarynav.items) &&
-                                                primarynav.items.map((item, index) => (jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsx("a", Object.assign({ href: item.url, className: `${prefix}--nav--link` }, { children: item.label })) }), index))), subnav && (jsx("li", Object.assign({ className: `${prefix}--nav--items` }, { children: jsx("button", Object.assign({ className: `${prefix}--nav--trigger`, onClick: handleSubnavToggle }, { children: subnav.buttonlabel })) })))] }))] })), jsx("div", Object.assign({ className: `${prefix}--search` }, { children: jsx("button", Object.assign({ className: `${prefix}--search--button`, type: "button", onClick: handleSearchToggle }, { children: searchlabel })) }))] })), subnav && (jsx("nav", Object.assign({ style: { display: subnavTabbable ? "block" : "none" }, className: `${prefix}--subnav`, "aria-labelledby": "secondary-navigation" }, { children: jsxs("div", Object.assign({ className: `${prefix}--subnav--inner ${prefix}--container` }, { children: [jsx("div", Object.assign({ className: `${prefix}--mobile--subnav` }, { children: jsxs("div", Object.assign({ className: `${prefix}--mobile--subnav--menu` }, { children: [jsx("button", Object.assign({ className: `${prefix}--mobile--subnav--back`, onClick: handleSubnavToggle, type: "button" }, { children: subnav.mobilebacklabel })), jsx("button", Object.assign({ className: `${prefix}--header--menu--close`, onClick: handleMenuToggle }, { children: subnav.mobilecloselabel })), jsx("h6", Object.assign({ className: `${prefix}--mobile--subnav--label` }, { children: subnav.buttonlabel }))] })) })), jsx("h2", Object.assign({ className: `${prefix}--nav--label`, id: "secondary-navigation" }, { children: subnav.navlabel })), jsx("ul", Object.assign({ className: `${prefix}--subnav--set` }, { children: (subnav === null || subnav === void 0 ? void 0 : subnav.items) &&
-                                        subnav.items.map((item, index) => (jsx("li", Object.assign({ className: `${prefix}--subnav--items` }, { children: jsx("a", Object.assign({ href: item.url, className: `${prefix}--subnav--link` }, { children: item.label })) }), index))) }))] })) }))), jsx("div", Object.assign({ style: { display: searchTabbable ? "block" : "none" }, className: `${prefix}--search-box` }, { children: jsx("div", Object.assign({ className: `${prefix}--header--inner ${prefix}--container` }, { children: jsx(SearchField, { input: searchfield === null || searchfield === void 0 ? void 0 : searchfield.input, action: searchfield === null || searchfield === void 0 ? void 0 : searchfield.action, ref: searchInputRef }) })) }))] }))] })));
-};
-
-export { Navigation as default };

package/lib/esm/components/Navigation/index.js

@@ -1,16 +0,0 @@
-export { default as Navigation } from './Navigation.js';
-import 'react/jsx-runtime';
-import 'react';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../ContextMenu/ContextMenu.js';
-import 'classnames';
-import '../SearchField/SearchField.js';
-import '../Input/Input.js';
-import '../Fieldset/Fieldset.js';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';
-import '../FormElement/FormElement.js';
-import '../Icon/Icon.js';
-import '@ilo-org/icons-react';

package/lib/esm/components/Notification/Notification.js

@@ -1,39 +0,0 @@
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import { useState } from 'react';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import Button from '../Button/Button.js';
-import 'tslib';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../Link/Link.js';
-import '../Icon/Icon.js';
-import '@ilo-org/icons-react';
-
-const Notification = ({ className, closelabel, copy, cta, headline, placement, timestamp, type, }) => {
-    const { prefix } = useGlobalSettings();
-    const [display, setDisplay] = useState(true);
-    const baseClass = `${prefix}--notification`;
-    const notificationClasses = classNames(className, {
-        [baseClass]: true,
-        [`${baseClass}--${placement}`]: placement,
-        [`icon icon--${type}`]: type,
-    });
-    const ctaprops = {
-        callback: () => { },
-        className: `${baseClass}--cta`,
-        children: false,
-        label: cta === null || cta === void 0 ? void 0 : cta.label,
-        size: "small",
-        type: "secondary",
-        url: cta === null || cta === void 0 ? void 0 : cta.url,
-    };
-    /**
-     * On click, close
-     */
-    const handleClick = () => {
-        setDisplay(false);
-    };
-    return (jsx(Fragment, { children: display && (jsxs("div", Object.assign({ className: notificationClasses, role: "status", "aria-live": "polite", "aria-relevant": "additions" }, { children: [jsxs("div", Object.assign({ className: `${baseClass}--content` }, { children: [jsx("h2", Object.assign({ className: `${baseClass}--headline` }, { children: headline })), jsx("p", Object.assign({ className: `${baseClass}--copy` }, { children: copy })), timestamp && (jsx("time", Object.assign({ className: `${baseClass}--date`, dateTime: timestamp.unix }, { children: timestamp.human }))), cta && jsx(Button, Object.assign({}, ctaprops))] })), jsx("button", Object.assign({ className: `${baseClass}--close`, type: "button", onClick: () => handleClick() }, { children: jsx("span", { children: closelabel }) }))] }))) }));
-};
-
-export { Notification as default };

package/lib/esm/components/Notification/index.js

@@ -1,11 +0,0 @@
-export { default as Notification } from './Notification.js';
-import 'react/jsx-runtime';
-import 'react';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../Button/Button.js';
-import '../Link/Link.js';
-import '../Icon/Icon.js';
-import '@ilo-org/icons-react';

package/lib/esm/components/NumberPicker/NumberPicker.js

@@ -1,35 +0,0 @@
-import { __rest } from 'tslib';
-import { jsx } from 'react/jsx-runtime';
-import React from 'react';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import FormControl, { useFormControl } from '../FormControl/FormControl.js';
-import '../../GlobalCtx-7fb23cfa.js';
-import 'nanoid';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';
-
-const NumberPicker = React.forwardRef(({ onChange, onBlur, disabled = false, error, id, name, placeholder, required, max, min, step, }, ref) => {
-    const { prefix } = useGlobalSettings();
-    const formControlCtx = useFormControl();
-    const { ariaDescribedBy } = formControlCtx;
-    const inputClass = `${prefix}--input`;
-    const baseClass = `${prefix}--numberpicker`;
-    const hasError = !disabled && !!error;
-    const numberPickerClasses = classNames(inputClass, baseClass, {
-        error: hasError,
-    });
-    const handleChange = (e) => {
-        if (onChange) {
-            onChange(e);
-        }
-    };
-    return (jsx("input", { ref: ref, id: id ? id : name, name: name, onChange: handleChange, onBlur: onBlur, disabled: disabled, placeholder: placeholder, required: required, type: "number", className: numberPickerClasses, pattern: "[0-9]*", inputMode: "numeric", "aria-describedby": ariaDescribedBy, max: max, min: min, step: step }));
-});
-const LabelledNumberPicker = React.forwardRef((props, ref) => {
-    const { style, inputStyle, className } = props, rest = __rest(props, ["style", "inputStyle", "className"]);
-    const fieldId = props.id ? props.id : props.name;
-    return (jsx(FormControl, Object.assign({ fieldId: fieldId, style: style, className: className }, rest, { children: jsx(NumberPicker, Object.assign({ ref: ref, style: inputStyle }, rest)) })));
-});
-
-export { LabelledNumberPicker as default };

package/lib/esm/components/NumberPicker/index.js

@@ -1,11 +0,0 @@
-export { default as NumberPicker } from './NumberPicker.js';
-import 'tslib';
-import 'react/jsx-runtime';
-import 'react';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../FormControl/FormControl.js';
-import 'nanoid';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';

package/lib/esm/components/Pagination/Pagination.js

@@ -1,47 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';
-
-const Pagination = ({ className, callback, currentPage, firstPageUrl, firstPageTitle = "First page", lastPageUrl, lastPageTitle = "Last page", nextPageUrl, nextPageTitle = "Next page", pageCountPreposition = "of", prevPageUrl, prevPageTitle = "Previous page", totalPages, }) => {
-    const { prefix } = useGlobalSettings();
-    const baseClass = `${prefix}--pagination`;
-    const paginationClasses = classNames(className, {
-        [baseClass]: true,
-    });
-    const isFirst = currentPage === 0;
-    const isLast = currentPage + 1 === totalPages;
-    const firstClasses = classNames(className, {
-        [`${baseClass}--first-page`]: true,
-        [`${baseClass}--link`]: true,
-        [`${baseClass}--disable`]: isFirst,
-    });
-    const prevClasses = classNames(className, {
-        [`${baseClass}--prev-page`]: true,
-        [`${baseClass}--link`]: true,
-        [`${baseClass}--disable`]: isFirst,
-    });
-    const nextClasses = classNames(className, {
-        [`${baseClass}--next-page`]: true,
-        [`${baseClass}--link`]: true,
-        [`${baseClass}--disable`]: isLast,
-    });
-    const lastClasses = classNames(className, {
-        [`${baseClass}--last-page`]: true,
-        [`${baseClass}--link`]: true,
-        [`${baseClass}--disable`]: isLast,
-    });
-    /**
-     * On click, if there is a callback, call it
-     */
-    const handleClick = (e) => {
-        if (callback) {
-            callback(e);
-        }
-    };
-    return (jsxs("div", Object.assign({ className: paginationClasses }, { children: [jsxs("div", Object.assign({ className: `${baseClass}--previous-set` }, { children: [jsx("a", Object.assign({ className: firstClasses, onClick: (e) => handleClick(e), href: firstPageUrl, title: firstPageTitle }, { children: firstPageTitle })), jsx("a", Object.assign({ className: prevClasses, onClick: (e) => handleClick(e), href: prevPageUrl, title: prevPageTitle }, { children: prevPageTitle }))] })), jsxs("p", Object.assign({ className: `${baseClass}--page` }, { children: [jsx("span", { children: currentPage + 1 }), jsx("span", { children: pageCountPreposition }), jsx("span", { children: totalPages })] })), jsxs("div", Object.assign({ className: `${baseClass}--next-set` }, { children: [jsx("a", Object.assign({ className: nextClasses, onClick: (e) => handleClick(e), href: nextPageUrl, title: nextPageTitle }, { children: nextPageTitle })), jsx("a", Object.assign({ className: lastClasses, onClick: (e) => handleClick(e), href: lastPageUrl, title: lastPageTitle }, { children: lastPageTitle }))] }))] })));
-};
-
-export { Pagination as default };

package/lib/esm/components/Pagination/index.js

@@ -1,7 +0,0 @@
-export { default as Pagination } from './Pagination.js';
-import 'react/jsx-runtime';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';

package/lib/esm/components/Profile/Profile.js

@@ -1,19 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';
-
-const Profile = ({ avatar, className, description, link, name, role, theme = "light", size = "large", }) => {
-    const { prefix } = useGlobalSettings();
-    const baseClass = `${prefix}--profile`;
-    const profileClasses = classNames(className, {
-        [baseClass]: true,
-        [`${baseClass}__theme__${theme}`]: theme,
-        [`${baseClass}__size__${size}`]: size,
-    });
-    return (jsxs("figure", Object.assign({ className: profileClasses }, { children: [jsx("img", { className: `${baseClass}--avatar`, src: avatar, alt: `Avatar for ${name}` }), jsx("figcaption", { children: jsxs("div", Object.assign({ className: `${baseClass}--figcaption--content` }, { children: [jsx("div", Object.assign({ className: `${baseClass}--name` }, { children: name })), role && jsx("div", Object.assign({ className: `${baseClass}--role` }, { children: role }))] })) }), description && (jsx("p", Object.assign({ className: `${baseClass}--description` }, { children: description }))), link && (jsx("div", Object.assign({ className: `${baseClass}--link` }, { children: jsx("a", Object.assign({ href: link.url, target: "__blank", rel: "noopener noreferrer" }, { children: jsx("span", Object.assign({ className: `${baseClass}--link--label` }, { children: link.label })) })) })))] })));
-};
-
-export { Profile as default };

package/lib/esm/components/Profile/index.js

@@ -1,7 +0,0 @@
-export { default as Profile } from './Profile.js';
-import 'react/jsx-runtime';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';

package/lib/esm/components/Radio/Radio.js

@@ -1,45 +0,0 @@
-import { __rest } from 'tslib';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import React, { useEffect } from 'react';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import { useFieldsetError } from '../Fieldset/Fieldset.js';
-import FormControl, { useFormControl } from '../FormControl/FormControl.js';
-import { usePrevious } from '../../hooks/usePrevious.js';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';
-import 'nanoid';
-
-const Radio = React.forwardRef(({ onChange, onBlur, disabled = false, error, id, name, required, checked, defaultChecked = false, value, }, ref) => {
-    const { prefix } = useGlobalSettings();
-    const { setHasError } = useFieldsetError();
-    const formControlCtx = useFormControl();
-    const prevError = usePrevious(error);
-    useEffect(() => {
-        if (error !== prevError) {
-            setHasError(!!error);
-        }
-    }, [error, prevError, setHasError]);
-    const { ariaDescribedBy } = formControlCtx;
-    const handleChange = (e) => {
-        console.log(e.target.value);
-        if (onChange) {
-            onChange(e);
-        }
-    };
-    const baseClass = `${prefix}--radio`;
-    const controlClass = `${baseClass}--control`;
-    const errorClass = `${baseClass}__error`;
-    const RadioClasses = classNames(baseClass, {
-        [errorClass]: error,
-    });
-    return (jsxs("div", Object.assign({ className: RadioClasses }, { children: [jsx("input", { ref: ref, id: id ? id : name, name: name, onChange: handleChange, onBlur: onBlur, disabled: disabled, required: required, type: "radio", defaultChecked: defaultChecked, "aria-describedby": ariaDescribedBy, checked: checked, value: value }), jsx("span", { className: controlClass })] })));
-});
-const LabelledRadio = React.forwardRef((props, ref) => {
-    const { style, inputStyle, className, labelPlacement = "end", labelSize = "small" } = props, rest = __rest(props, ["style", "inputStyle", "className", "labelPlacement", "labelSize"]);
-    const fieldId = props.id ? props.id : props.name;
-    return (jsx(FormControl, Object.assign({ fieldId: fieldId, style: style, className: className, labelPlacement: labelPlacement, labelSize: labelSize }, rest, { children: jsx(Radio, Object.assign({ ref: ref, style: inputStyle }, rest)) })));
-});
-
-export { LabelledRadio as default };

package/lib/esm/components/Radio/index.js

@@ -1,26 +0,0 @@
-export { default as Radio } from './Radio.js';
-import 'tslib';
-import 'react/jsx-runtime';
-import 'react';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../Fieldset/Fieldset.js';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';
-import '../FormControl/FormControl.js';
-import 'nanoid';
-import '../../hooks/usePrevious.js';
-
-const basic = {
-    className: "Radio",
-    name: "radio",
-};
-/**
- * Sample prop definitions Radio's enumerable properties (imported in stories and test)
- */
-const RadioArgs = {
-    basic,
-};
-
-export { RadioArgs };

package/lib/esm/components/ReadMore/ReadMore.js

@@ -1,36 +0,0 @@
-import { __rest } from 'tslib';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState } from 'react';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import RichText from '../RichText/RichText.js';
-import '../../GlobalCtx-7fb23cfa.js';
-
-const ReadMore = (_a) => {
-    var { buttonlabel, className, excerpt, fulltext, openatstart } = _a, rest = __rest(_a, ["buttonlabel", "className", "excerpt", "fulltext", "openatstart"]);
-    const { prefix } = useGlobalSettings();
-    const baseClass = `${prefix}--read-more`;
-    const [content, setContent] = useState(openatstart ? fulltext : excerpt);
-    const [isopen, setOpen] = useState(openatstart);
-    const readMoreClasses = classNames(className, {
-        [baseClass]: true,
-        [`${baseClass}--open`]: isopen,
-    });
-    const readmoreButtonClasses = classNames(className, {
-        [`${baseClass}--button`]: true,
-        [`${baseClass}--button--open`]: isopen,
-    });
-    /**
-     * On click, toggle state vars
-     */
-    const handleClick = () => {
-        const nextcontent = content === excerpt ? fulltext : excerpt;
-        setContent(nextcontent);
-        setOpen(!isopen);
-    };
-    return (jsxs("div", Object.assign({ className: readMoreClasses }, { children: [jsx(RichText, Object.assign({ content: content }, rest)), jsx("button", Object.assign({ className: readmoreButtonClasses, "aria-expanded": isopen, onClick: () => handleClick() }, { children: isopen
-                    ? `${buttonlabel && buttonlabel.opened}`
-                    : `${buttonlabel && buttonlabel.closed}` }))] })));
-};
-
-export { ReadMore as default };

package/lib/esm/components/ReadMore/index.js

@@ -1,8 +0,0 @@
-export { default as ReadMore } from './ReadMore.js';
-import 'tslib';
-import 'react/jsx-runtime';
-import 'react';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../RichText/RichText.js';

package/lib/esm/components/RichText/RichText.js

@@ -1,17 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';
-
-const RichText = ({ className, content }) => {
-    const { prefix } = useGlobalSettings();
-    const baseClass = `${prefix}--richtext`;
-    const richTextClasses = classNames(className, {
-        [baseClass]: true,
-    });
-    return (jsx("div", { className: richTextClasses, dangerouslySetInnerHTML: { __html: content } }));
-};
-
-export { RichText as default };

package/lib/esm/components/RichText/index.js

@@ -1,7 +0,0 @@
-export { default as RichText } from './RichText.js';
-import 'react/jsx-runtime';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';

package/lib/esm/components/SearchField/SearchField.js

@@ -1,46 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, useState } from 'react';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import Input from '../Input/Input.js';
-import Icon from '../Icon/Icon.js';
-import 'tslib';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../Fieldset/Fieldset.js';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';
-import '../FormElement/FormElement.js';
-import '@ilo-org/icons-react';
-
-const SearchField = forwardRef(({ action, callback, className, input }, ref) => {
-    const [searchValue, setSearchValue] = useState("");
-    const { prefix } = useGlobalSettings();
-    const baseClass = `${prefix}--searchfield`;
-    const buttonClass = `${baseClass}--button`;
-    const clearButtonClass = `${baseClass}--clear-button ${searchValue.trim() !== "" && "show"}`;
-    const fieldSetClass = `${prefix}--fieldset`;
-    const SearchFieldClasses = classNames(className, {
-        [baseClass]: true,
-        [`haslabel`]: input === null || input === void 0 ? void 0 : input.label,
-    });
-    const handleClick = (e) => {
-        if (callback) {
-            callback(e);
-        }
-    };
-    // handle click for clear button in search
-    const handleClearButtonClick = () => {
-        setSearchValue("");
-    };
-    // Update search value on input
-    const onKeyPress = (e) => {
-        setSearchValue(e.target.value);
-    };
-    const inputHasType = !!(input === null || input === void 0 ? void 0 : input.type);
-    if (!inputHasType) {
-        throw new Error("SearchField: Input must have type prop");
-    }
-    return inputHasType ? (jsxs("form", Object.assign({ className: SearchFieldClasses, action: action }, { children: [jsxs("div", Object.assign({ className: fieldSetClass }, { children: [jsx(Input, { id: input === null || input === void 0 ? void 0 : input.id, name: input === null || input === void 0 ? void 0 : input.name, disabled: input === null || input === void 0 ? void 0 : input.disabled, callback: onKeyPress, error: input === null || input === void 0 ? void 0 : input.error, helper: input === null || input === void 0 ? void 0 : input.helper, label: input === null || input === void 0 ? void 0 : input.label, placeholder: input === null || input === void 0 ? void 0 : input.placeholder, type: input === null || input === void 0 ? void 0 : input.type, value: searchValue, className: `${prefix}--input`, ref: ref }), jsx("span", Object.assign({ onClick: handleClearButtonClick, className: clearButtonClass }, { children: jsx(Icon, { name: "close", hidden: true }) }))] })), jsx("input", { className: buttonClass, disabled: input === null || input === void 0 ? void 0 : input.disabled, type: "submit", onClick: handleClick })] }))) : null;
-});
-
-export { SearchField as default };

package/lib/esm/components/SearchField/index.js

@@ -1,14 +0,0 @@
-export { default as SearchField } from './SearchField.js';
-import 'react/jsx-runtime';
-import 'react';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import '../../GlobalCtx-7fb23cfa.js';
-import '../Input/Input.js';
-import '../Fieldset/Fieldset.js';
-import '../Tooltip/Tooltip.js';
-import '@popperjs/core';
-import '../FormElement/FormElement.js';
-import '../Icon/Icon.js';
-import '@ilo-org/icons-react';

package/lib/esm/components/SocialMedia/SocialMedia.js

@@ -1,24 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';
-
-const SocialMedia = ({ className, theme = "light", justify = "start", headline, icons, iconSize = "normal", }) => {
-    const { prefix } = useGlobalSettings();
-    // Classes to be applied to the outer element
-    const baseClass = `${prefix}--social-media`;
-    const themeClass = `${baseClass}__theme__${theme}`;
-    const justifyClass = `${baseClass}__justify__${justify}`;
-    const classes = classNames(baseClass, themeClass, justifyClass, className);
-    // Classes to be applied to inner elements
-    const headlineClass = `${baseClass}--headline`;
-    const listClass = `${baseClass}--list`;
-    const listItemClass = `${listClass}--item`;
-    const iconClass = `${listItemClass}--icon`;
-    const iconSizeClass = `${listItemClass}--icon__${iconSize}`;
-    return (jsxs("div", Object.assign({ className: classes }, { children: [headline && jsx("h5", Object.assign({ className: headlineClass }, { children: headline })), jsx("ul", Object.assign({ className: listClass }, { children: icons.map((item) => (jsx("li", Object.assign({ className: listItemClass }, { children: jsx("a", Object.assign({ title: item.label, className: classNames(iconClass, iconSizeClass, `${iconClass}__${item.icon}`), href: item.url }, { children: item.label })) })))) }))] })));
-};
-
-export { SocialMedia as default };

package/lib/esm/components/SocialMedia/index.js

@@ -1,55 +0,0 @@
-export { default as SocialMedia } from './SocialMedia.js';
-import 'react/jsx-runtime';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';
-
-const defaultArgs = {
-    headline: "Follow us on social media",
-    theme: "light",
-    justify: "start",
-    iconSize: "normal",
-    icons: [
-        {
-            icon: "facebook",
-            url: "https://www.facebook.com/ilo.org",
-            label: "Facebook",
-        },
-        {
-            icon: "x",
-            url: "https://x.com/ilo",
-            label: "x",
-        },
-        {
-            icon: "instagram",
-            url: "https://www.instagram.com/ilo.org/",
-            label: "Instagram",
-        },
-        {
-            icon: "linkedin",
-            url: "https://www.linkedin.com/company/international-labour-organization-ilo",
-            label: "LinkedIn",
-        },
-        {
-            icon: "youtube",
-            url: "https://www.youtube.com/channel/UCQsVmhSa4X-G3lHlUtejzLA",
-            label: "YouTube",
-        },
-        {
-            icon: "tiktok",
-            url: "https://www.tiktok.com/@ilo",
-            label: "TikTok",
-        },
-        {
-            icon: "flickr",
-            url: "https://www.flickr.com/photos/ilopictures/albums",
-            label: "TikTok",
-        },
-    ],
-};
-Object.assign(Object.assign({}, defaultArgs), { theme: "dark" });
-Object.assign(Object.assign({}, defaultArgs), { justify: "center" });
-
-export { defaultArgs };

package/lib/esm/components/TableOfContents/TableOfContents.js

@@ -1,20 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import classNames from 'classnames';
-import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';
-
-const TableOfContents = ({ className, items }) => {
-    const { prefix } = useGlobalSettings();
-    const baseClass = `${prefix}--table-of-contents`;
-    const TableOfContentsClasses = classNames(className, {
-        [baseClass]: true,
-    });
-    return (jsx("nav", Object.assign({ className: TableOfContentsClasses }, { children: jsx("ul", Object.assign({ className: `${baseClass}--list` }, { children: items &&
-                items.map((item, index) => {
-                    return (jsx("li", Object.assign({ className: `${baseClass}--list--item` }, { children: jsx("a", Object.assign({ className: `${baseClass}--link`, href: item.href }, { children: item.label })) }), index));
-                }) })) })));
-};
-
-export { TableOfContents as default };

package/lib/esm/components/TableOfContents/index.js

@@ -1,7 +0,0 @@
-export { default as TableOfContents } from './TableOfContents.js';
-import 'react/jsx-runtime';
-import 'classnames';
-import '../../hooks/useGlobalSettings.js';
-import 'tslib';
-import 'react';
-import '../../GlobalCtx-7fb23cfa.js';