Fix: render sub-items on mobile menu via accordion toggle

[vcfvct]

Problem

The BasicMenu widget renders menu items that have children as plain links on mobile, making child pages completely inaccessible. For example, if "DrinkWare" has sub-items "Mugs" and "Tumblers", tapping "DrinkWare" on mobile navigates directly to the category page with no way to reach the children.

The root cause is the condition on line 103:

{item.children.length > 0 && !isMobile ? (
  // Desktop: NavigationMenuTrigger + NavigationMenuContent (dropdown)
) : (
  // Mobile OR no children: plain NavigationMenuLink — children are silently dropped
)}

On mobile (isMobile === true), the !isMobile check causes items with children to fall through to the else branch, which renders only the parent as a link and never renders the children.

Desktop:

Mobile(no sub menus):

Solution

Split the render into two explicit branches — mobile and desktop:

• Desktop (unchanged): NavigationMenuTrigger + NavigationMenuContent dropdown
• Mobile (new): An accordion pattern via a MobileAccordionItem component that:
  • Shows the parent name as a navigable link to the category page
  • Adds a chevron toggle button that expands/collapses child links below
  • Includes aria-expanded and aria-label for accessibility
  • Uses a 200ms rotate transition on the chevron indicator

New Mobile view:

Changes

Single file: packages/evershop/src/modules/cms/components/BasicMenu.tsx

• Extract MenuItem interface to top level (was inline, needed by both components)
• Add MobileAccordionItem component (~50 lines)
• Replace the single ternary with a isMobile ? <accordion list> : <NavigationMenu dropdown> branch
• No new dependencies

Testing

• Lint passes with 0 errors (npm run lint)
• Desktop menu behavior is identical (no changes to the NavigationMenu branch)
• On mobile (< 768px): items without children render as plain links; items with children show parent link + chevron toggle that expands children

[vcfvct]

@treoden , can you please take a look if this makes sense ?