Refactor #1832 - For SplitButton

primefaces · Mar 1, 2021 · c09f037 · c09f037
1 parent a2ab15d
commit c09f037
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 4 deletions.
diff --git a/src/components/splitbutton/SplitButton.js b/src/components/splitbutton/SplitButton.js
@@ -9,6 +9,7 @@ import { tip } from '../tooltip/Tooltip';
 import UniqueComponentId from '../utils/UniqueComponentId';
 import ObjectUtils from '../utils/ObjectUtils';
 import ConnectedOverlayScrollHandler from '../utils/ConnectedOverlayScrollHandler';
+import { PrimeEventBus } from '../utils/PrimeEventBus';
 
 export class SplitButton extends Component {
 
@@ -59,11 +60,19 @@ export class SplitButton extends Component {
         this.onOverlayEnter = this.onOverlayEnter.bind(this);
         this.onOverlayEntered = this.onOverlayEntered.bind(this);
         this.onOverlayExit = this.onOverlayExit.bind(this);
+        this.onPanelClick = this.onPanelClick.bind(this);
 
         this.id = this.props.id || UniqueComponentId();
         this.overlayRef = React.createRef();
     }
 
+    onPanelClick(event) {
+        PrimeEventBus.emit('overlay-click', {
+            originalEvent: event,
+            target: this.container
+        });
+    }
+
     onDropdownButtonClick() {
         if (this.state.overlayVisible)
             this.hide();
@@ -230,7 +239,7 @@ export class SplitButton extends Component {
                 <Button type="button" className="p-splitbutton-menubutton" icon="pi pi-chevron-down" onClick={this.onDropdownButtonClick} disabled={this.props.disabled}
                     aria-expanded={this.state.overlayVisible} aria-haspopup aria-owns={this.id + '_overlay'} />
                 <SplitButtonPanel ref={this.overlayRef} appendTo={this.props.appendTo} id={this.id + '_overlay'}
-                    menuStyle={this.props.menuStyle} menuClassName={this.props.menuClassName}
+                    menuStyle={this.props.menuStyle} menuClassName={this.props.menuClassName} onClick={this.onPanelClick}
                     in={this.state.overlayVisible} onEnter={this.onOverlayEnter} onEntered={this.onOverlayEntered} onExit={this.onOverlayExit}>
                     {items}
                 </SplitButtonPanel>

diff --git a/src/components/splitbutton/SplitButtonPanel.js b/src/components/splitbutton/SplitButtonPanel.js
@@ -10,14 +10,16 @@ class SplitButtonPanelComponent extends Component {
         appendTo: null,
         menuStyle: null,
         menuClassName: null,
-        id: null
+        id: null,
+        onClick: null
     };
 
     static propTypes = {
         appendTo: PropTypes.object,
         menustyle: PropTypes.object,
         menuClassName: PropTypes.string,
-        id: PropTypes.any
+        id: PropTypes.any,
+        onClick: PropTypes.func
     };
 
     renderElement() {
@@ -26,7 +28,7 @@ class SplitButtonPanelComponent extends Component {
         return (
             <CSSTransition nodeRef={this.props.forwardRef} classNames="p-connected-overlay" in={this.props.in} timeout={{ enter: 120, exit: 100 }}
                 unmountOnExit onEnter={this.props.onEnter} onEntered={this.props.onEntered} onExit={this.props.onExit}>
-                <div ref={this.props.forwardRef} className={className} style={this.props.menuStyle} id={this.props.id}>
+                <div ref={this.props.forwardRef} className={className} style={this.props.menuStyle} id={this.props.id} onClick={this.onClick}>
                     <ul className="p-menu-list p-reset" role="menu">
                         {this.props.children}
                     </ul>