@reykjavik/hanna-react 0.10.134 → 0.10.135

package/CHANGELOG.md

@@ -4,6 +4,12 @@
 
 - ... <!-- Add new lines here. -->
 
+## 0.10.135
+
+_2024-09-03_
+
+- feat: Add prop `variant="light"` to `MainMenu2`
+
 ## 0.10.134
 
 _2024-08-19_

package/MainMenu2.d.ts

@@ -101,6 +101,8 @@ export type MainMenu2Props = {
         relatedTitle?: string;
         related?: MainMenu2ButtonItemList;
     };
+    /** Visual type */
+    variant?: 'default' | 'light';
     /**
      * NOTE: Clicking a MainMenu2 item will automatically close HannaUIState's
      * "Hamburger menu" (a.k.a. "Mobile menu")

package/MainMenu2.js

@@ -117,7 +117,7 @@ const getRenderers = (props) => {
 };
 // eslint-disable-next-line complexity
 const MainMenu2 = (props) => {
-    const { homeLink = '/', items, onItemClick, illustration, imageUrl, wrapperProps = {}, } = props;
+    const { homeLink = '/', items, onItemClick, illustration, imageUrl, variant, wrapperProps = {}, } = props;
     const domid = (0, utils_js_1.useDomid)(wrapperProps.id);
     const isBrowser = (0, utils_js_1.useIsBrowserSide)(props.ssr);
     const [isMenuOpen, setIsMenuOpen] = (0, react_1.useState)(false);
@@ -198,7 +198,10 @@ const MainMenu2 = (props) => {
         : homeLink)), { modifier: 'home' });
     const menuImageUrl = imageUrl || (illustration && (0, assets_1.getIllustrationUrl)(illustration));
     const menuId = `${domid}-menu`;
-    return (react_1.default.createElement("nav", Object.assign({}, props.wrapperProps, { className: (0, classUtils_1.modifiedClass)('MainMenu2', isBrowser && (isMenuOpen ? 'open' : 'closed'), wrapperProps.className), style: menuImageUrl
+    return (react_1.default.createElement("nav", Object.assign({}, props.wrapperProps, { className: (0, classUtils_1.modifiedClass)('MainMenu2', [
+            isBrowser && (isMenuOpen ? 'open' : 'closed'),
+            variant && variant !== 'default' ? `variant--${variant}` : undefined,
+        ], wrapperProps.className), style: menuImageUrl
             ? Object.assign(Object.assign({}, wrapperProps.style), { '--menu-image': `url(${menuImageUrl})` })
             : wrapperProps.style, ref: wrapperRef, "aria-label": txt.title, "data-sprinkled": isBrowser, id: menuId }),
         isMenuOpen && react_1.default.createElement(FocusTrap_js_1.FocusTrap, { atTop: true }),

package/esm/MainMenu2.d.ts

@@ -101,6 +101,8 @@ export type MainMenu2Props = {
         relatedTitle?: string;
         related?: MainMenu2ButtonItemList;
     };
+    /** Visual type */
+    variant?: 'default' | 'light';
     /**
      * NOTE: Clicking a MainMenu2 item will automatically close HannaUIState's
      * "Hamburger menu" (a.k.a. "Mobile menu")

package/esm/MainMenu2.js

@@ -113,7 +113,7 @@ const getRenderers = (props) => {
 };
 // eslint-disable-next-line complexity
 export const MainMenu2 = (props) => {
-    const { homeLink = '/', items, onItemClick, illustration, imageUrl, wrapperProps = {}, } = props;
+    const { homeLink = '/', items, onItemClick, illustration, imageUrl, variant, wrapperProps = {}, } = props;
     const domid = useDomid(wrapperProps.id);
     const isBrowser = useIsBrowserSide(props.ssr);
     const [isMenuOpen, setIsMenuOpen] = useState(false);
@@ -194,7 +194,10 @@ export const MainMenu2 = (props) => {
         : homeLink)), { modifier: 'home' });
     const menuImageUrl = imageUrl || (illustration && getIllustrationUrl(illustration));
     const menuId = `${domid}-menu`;
-    return (React.createElement("nav", Object.assign({}, props.wrapperProps, { className: modifiedClass('MainMenu2', isBrowser && (isMenuOpen ? 'open' : 'closed'), wrapperProps.className), style: menuImageUrl
+    return (React.createElement("nav", Object.assign({}, props.wrapperProps, { className: modifiedClass('MainMenu2', [
+            isBrowser && (isMenuOpen ? 'open' : 'closed'),
+            variant && variant !== 'default' ? `variant--${variant}` : undefined,
+        ], wrapperProps.className), style: menuImageUrl
             ? Object.assign(Object.assign({}, wrapperProps.style), { '--menu-image': `url(${menuImageUrl})` })
             : wrapperProps.style, ref: wrapperRef, "aria-label": txt.title, "data-sprinkled": isBrowser, id: menuId }),
         isMenuOpen && React.createElement(FocusTrap, { atTop: true }),

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@reykjavik/hanna-react",
-	"version": "0.10.134",
+	"version": "0.10.135",
 	"author": "Reykjavík (http://www.reykjavik.is)",
 	"contributors": [
 		"Hugsmiðjan ehf (http://www.hugsmidjan.is)",
@@ -18,7 +18,7 @@
 		"@hugsmidjan/qj": "^4.22.1",
 		"@hugsmidjan/react": "^0.4.32",
 		"@reykjavik/hanna-css": "^0.4.14",
-		"@reykjavik/hanna-utils": "^0.2.15",
+		"@reykjavik/hanna-utils": "^0.2.16",
 		"@types/react-autosuggest": "^10.1.0",
 		"@types/react-datepicker": "^4.8.0",
 		"@types/react-transition-group": "^4.4.0",