refactor(submenu mode vertical or horizontal added): submenu mode

[govindsingh55]

submenu mode vertical or horizontal added

[navin-moorthy]

@govindsingh55, I saw your implementation. Progressing good, the mode prop should be for MenuBar, not the SubMenu.

Now the SubMenu is Vertical and outside PopOver, but the MenuBarItems are still horizontal.

We need the MenuBarItems as-well in Vertical like this,

[govindsingh55]

@govindsingh55, I saw your implementation. Progressing good, the mode prop should be for MenuBar, not the SubMenu.

add the flexDirection="column" to the MenuBar

[navin-moorthy]

Adding flexDirection="column" to the MenuBar should be done in the component based on the mode prop.

[govindsingh55]

but will it contradict when the menubar is vertical one but we want the submenu to open in popper?

[navin-moorthy]

No that will not contradict that, default behavior on mode=vertical makes menubar flexdirection column and the submenu still remains popper but the Popper placement: right. Also, when isCollapsable only on mode=vertical, then instead of popper another component for the collapsed item will be rendered. Understood?

[govindsingh55]

I am not considering the navbar or hamburger case. In the case of side menubar, submenu can be a popover or collapsable container right?

[navin-moorthy]

yeah @govindsingh55 , even I am not considering the navbar. Yes. in case of side menubar, submenu can be popover by default but on isCollapsable it becomes a collapsable container. That's correct.

[govindsingh55]

so isCollapsable prop will decide to popper or collapsable container.

[navin-moorthy]

so isCollapsable prop will decide to popper or collapsable container.

Correct 💯

[navin-moorthy]

Great work Bro. Still missing the context and trigger code from [here](https://github.com/timelessco/chakra-components/blob/refractor-menubar/packages/chakra-components/src/MenuBar/SubMenu.js Kindly add that.