- <div className={classes.toolbarWrapper} ref={navRef}>
- {React.Children.map(children, (child) => {
- return React.cloneElement(child, {
- className: classnames(child.props.className, {
- [classes.visible]: !!visibilityMap[child.props["data-targetid"]],
- [classes.inVisible]: !visibilityMap[child.props["data-targetid"]]
- })
- });
- })}
- <OverflowMenu
- visibilityMap={visibilityMap}
- className={classes.overflowStyle}
- >
- {children}
- </OverflowMenu>
- </div>
+ <div
+ className={classes.toolbarWrapper}
+ ref={navRef}
+ >
+ {React.Children.map(children, (child) => {
+ return React.cloneElement(child, {
+ className: classnames(child.props.className, {
+ [classes.visible]: !!visibilityMap[child.props['data-targetid']],
+ [classes.inVisible]: !visibilityMap[child.props['data-targetid']],
+ }),
+ });
+ })}
+ {numHidden >= 2 && (
+ <OverflowMenu
+ visibilityMap={visibilityMap}
+ className={classes.overflowStyle}
+ >
+ {children.filter((child) => !child.props['data-targetid'].includes("Divider"))}
+ </OverflowMenu>
+ )}
+ </div>