@ilo-org/react 0.2.0 → 0.3.0

package/lib/esm/{Vidyard-6185c490.js → Vidyard-57e2834a.js}

@@ -1,6 +1,5 @@
-import { a as getDefaultExportFromCjs } from './_commonjsHelpers-849bcf65.js';
+import { g as getDefaultExportFromCjs, p as patterns, u as utils } from './VideoPlayer-62e0ce79.js';
 import require$$0 from 'react';
-import { p as patterns, u as utils } from './patterns-53247c1d.js';
 
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

package/lib/esm/{Vimeo-a807e7e1.js → Vimeo-faa058a2.js}

@@ -1,6 +1,5 @@
-import { a as getDefaultExportFromCjs } from './_commonjsHelpers-849bcf65.js';
+import { g as getDefaultExportFromCjs, p as patterns, u as utils } from './VideoPlayer-62e0ce79.js';
 import require$$0 from 'react';
-import { p as patterns, u as utils } from './patterns-53247c1d.js';
 
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

package/lib/esm/{Wistia-eef03ce2.js → Wistia-24fb5120.js}

@@ -1,6 +1,5 @@
-import { a as getDefaultExportFromCjs } from './_commonjsHelpers-849bcf65.js';
+import { g as getDefaultExportFromCjs, p as patterns, u as utils } from './VideoPlayer-62e0ce79.js';
 import require$$0 from 'react';
-import { p as patterns, u as utils } from './patterns-53247c1d.js';
 
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

package/lib/esm/{YouTube-e030042e.js → YouTube-01b3e51f.js}

@@ -1,6 +1,5 @@
-import { a as getDefaultExportFromCjs } from './_commonjsHelpers-849bcf65.js';
+import { g as getDefaultExportFromCjs, p as patterns, u as utils } from './VideoPlayer-62e0ce79.js';
 import require$$0 from 'react';
-import { p as patterns, u as utils } from './patterns-53247c1d.js';
 
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

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

@@ -0,0 +1,46 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } 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 'react-dom';
+import '../FormElement/FormElement.js';
+
+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 [toggleSubnavOpen, setSubnavToggleOpen] = useState(false);
+    const [toggleLanguageOpen, setLanguageToggleOpen] = useState(false);
+    const baseClass = `${prefix}--header`;
+    const NavigationClasses = classNames(baseClass, {
+        [`${prefix}--mobile--open`]: toggleMenuOpen,
+        [`${prefix}--select--open`]: toggleLanguageOpen,
+        [`${prefix}--search--open`]: toggleSearchOpen,
+        [`${prefix}--subnav--open`]: toggleSubnavOpen,
+    });
+    const handleMenuToggle = () => {
+        setMenuToggleOpen(!toggleMenuOpen);
+    };
+    const handleLanguageToggle = () => {
+        setLanguageToggleOpen(!toggleLanguageOpen);
+    };
+    const handleSearchToggle = () => {
+        setSearchToggleOpen(!toggleSearchOpen);
+    };
+    const handleSubnavToggle = () => {
+        setSubnavToggleOpen(!toggleSubnavOpen);
+    };
+    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" }, { 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` }, { 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` }, { 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` }, { 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({ className: `${prefix}--subnav`, "aria-labelledby": "secondary-navigation" }, { children: jsxs("div", Object.assign({ className: `${prefix}--subnav--inner` }, { 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({ className: `${prefix}--search-box` }, { children: jsx("div", Object.assign({ className: `${prefix}--header--inner` }, { children: jsx(SearchField, { input: searchfield === null || searchfield === void 0 ? void 0 : searchfield.input, action: searchfield === null || searchfield === void 0 ? void 0 : searchfield.action }) })) }))] }))] })));
+};
+
+export { Navigation as default };

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

@@ -0,0 +1,14 @@
+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 'react-dom';
+import '../FormElement/FormElement.js';

package/lib/esm/components/Video/Video.js

@@ -1,12 +1,10 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import classNames from 'classnames';
 import useGlobalSettings from '../../hooks/useGlobalSettings.js';
-import VideoPlayer from './VideoPlayer.js';
+import { V as VideoPlayer } from '../../VideoPlayer-62e0ce79.js';
 import 'tslib';
 import 'react';
 import '../../GlobalCtx-7fb23cfa.js';
-import '../../_commonjsHelpers-849bcf65.js';
-import '../../patterns-53247c1d.js';
 import '../../index-8ebb2cc1.js';
 import 'react-dom';
 import '../../utils/hoursMinutesSeconds.js';