wip

docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/components/menu-level-0.tsx

@@ -0,0 +1,53 @@
+const MenuLevel0 = ({...props}) => {
+    return (
+
+        <MenuItemContainer open={submenuOpen} level={level}>
+        {!isNoLink &&
+          <MenuLink
+            href={url}
+            aria-current={isCurrent ? "page" : undefined}
+            level={level}
+            isCurrent={isCurrent}
+            inTrail={inTrail}
+          >
+            {title}
+          </MenuLink>
+        }
+        {isNoLink &&
+          <NoLink open={submenuOpen}>{title}</NoLink>
+        }
+
+        {items && level === 0  ? (
+            <Button
+              ref={buttonRef}
+              onClick={() => setSubmenuOpen(!submenuOpen)}
+              aria-expanded={submenuOpen}
+              aria-label={(submenuOpen ? "Close" : "Open") + ` ${title} Submenu`}
+            >
+              <Caret style={{
+                transform: submenuOpen ? "rotate(180deg)" : "",
+                transition: "transform 0.2s ease-in-out",
+                width: "16px",
+              }}
+              />
+            </Button>
+          ) : ""
+        }
+      </MenuItemContainer>
+
+      {items &&
+
+        <MenuListWrapper>
+          <MenuList open={submenuOpen} level={level}>
+
+            {items.map(item =>
+              <MenuItem key={item.id} {...item} level={level + 1}/>
+            )}
+
+          </MenuList>
+        </MenuListWrapper>
+      }
+
+    )
+  }
+  export default MenuLevel0;

docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/main-menu.island.tsx

@@ -466,8 +466,7 @@ const MenuItem = ({title, url, items, level = 0}: { title: string, url: string,
           <NoLink open={submenuOpen}>{title}</NoLink>
         }
 
-        {items && level ===0  ? (
-          <>
+        {items && level === 0  ? (
             <Button
               ref={buttonRef}
               onClick={() => setSubmenuOpen(!submenuOpen)}
@@ -481,7 +480,6 @@ const MenuItem = ({title, url, items, level = 0}: { title: string, url: string,
               }}
               />
             </Button>
-          </>
         ) : ""
         }
       </MenuItemContainer>
@@ -498,6 +496,7 @@ const MenuItem = ({title, url, items, level = 0}: { title: string, url: string,
           </MenuList>
         </MenuListWrapper>
       }
+
     </OutsideClickHandler>
 
   )