Contents

import React from "react";
import { Nav, NavItem } from '../..'

const CollapsibleNav = (props) => {
  return (
    <Nav variant="subtle">
      <NavItem
          collapsible 
          iconLeft="city" 
          iconRight={["plus", "minus"]}
          link="#" 
          text="Overview" 
          {...props}
      >
        <NavItem
            link="#" 
            text="City"
            {...props}
        />
        <NavItem
            link="#"
            text="People"
            {...props}
        />
        <NavItem 
            link="#" 
            text="Business" 
            {...props}
        />
      </NavItem>
      <NavItem 
          active 
          collapsible 
          iconLeft="theater-masks"
          iconRight={["plus", "minus"]}
          link="#" 
          text="Albums" 
          {...props}
      >
        <NavItem 
            link="#" 
            text="Entertainment" 
            {...props}
        />
        <NavItem 
            link="#" 
            text="Food" 
            {...props}
        />
        <NavItem 
            link="#" 
            text="Style" 
            {...props}
        />
      </NavItem>
      <NavItem 
          collapsible 
          iconLeft="city" 
          iconRight={["plus", "minus"]}
          link="#" 
          text="Similar Artists" 
          {...props}
      >
        <NavItem 
            link="#" 
            text="City"
            {...props} 
        />
        <NavItem
            link="#"
            text="People"
            {...props}
        />
        <NavItem 
            link="#" 
            text="Business" 
            {...props}
        />
      </NavItem>
    </Nav>
  );
};

export default CollapsibleNav

Version data entries

2 entries across 2 versions & 2 rubygems

Version	Path
playbook_ui_docs-12.37.0.pre.alpha.PLAY951collapsiblenav31062	app/pb_kits/playbook/pb_nav/docs/_collapsible_nav.jsx
playbook_ui-12.37.0.pre.alpha.PLAY951collapsiblenav31062	app/pb_kits/playbook/pb_nav/docs/_collapsible_nav.jsx