Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

GlobalNavigationBarDropdown not showing sub menu items #3026

Open
darrenparkinson opened this issue Apr 7, 2022 · 1 comment
Open

GlobalNavigationBarDropdown not showing sub menu items #3026

darrenparkinson opened this issue Apr 7, 2022 · 1 comment

Comments

@darrenparkinson
Copy link

The documented GlobalNavigationBarDropdown in the Global Navigation Bar doesn't seem to work as expected. The menu appears and the chevron appears now that the utility-sprite folder is directly under assets, but the menu does not expand to show the sub menu items.

I should mention that I'm using this in next.js:

    "@salesforce-ux/design-system": "^2.17.5",
    "@salesforce/design-system-react": "^0.10.46",
    "next": "12.1.4",
    "react": "18.0.0",
    "react-dom": "18.0.0"

Any thoughts greatly appreciated. Snippet below, copied directly from the example.

import GlobalNavigationBar from '@salesforce/design-system-react/components/global-navigation-bar';
import GlobalNavigationBarRegion from '@salesforce/design-system-react/components/global-navigation-bar/region';
import GlobalNavigationBarLink from '@salesforce/design-system-react/components/global-navigation-bar/link';
import GlobalNavigationBarDropdown from '@salesforce/design-system-react/components/global-navigation-bar/dropdown';
export default function Navbar() {
    const dropdownCollection = [
        {
	    label: 'Menu Item One',
	    value: '1',
	    iconCategory: 'utility',
	    iconName: 'table',
	    href: 'http://www.google.com',
	},
    ];
    return (
        <>
           <GlobalNavigationBar>
               <GlobalNavigationBarRegion region="secondary" navigation>
                        <GlobalNavigationBarLink active href="/" label="Home" id="home-link" />
                        <GlobalNavigationBarDropdown
                               assistiveText={{ icon: 'Open menu item submenu' }}
                               id="primaryDropdown"
                               label="Menu Item"
                               options={dropdownCollection}
			/>
            </GlobalNavigationBarRegion>
        </GlobalNavigationBar>               
    </>
    )
}
@welcome
Copy link

welcome bot commented Apr 7, 2022

Thanks for opening your first issue! 👋
If you have found this library helpful, please star it. A maintainer will try to respond within 7 days. If you haven’t heard anything by then, please bump this thread.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant