PrimaryNav

Data-Driven

Instead of children, you can define your items and use the selectedIndex property to set which item is currently being viewed.

() => {
  const items = [
    {
      href: '/malachite',
      text: 'Malachite'
    },
    {
      href: '/fluorite',
      text: 'Fluorite'
    },
    {
      href: '/magnetite',
      text: 'Magnetite'
    }
  ];

  return <PrimaryNav items={items} selectedIndex={1} />;
}