Refactor #1951 - For OverlayPanel

primefaces · Apr 12, 2021 · 0c5d6b9 · 0c5d6b9
1 parent ece6d7a
commit 0c5d6b9
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 5 deletions.
diff --git a/src/components/overlaypanel/OverlayPanel.d.ts b/src/components/overlaypanel/OverlayPanel.d.ts
@@ -20,6 +20,7 @@ interface OverlayPanelProps {
     ariaCloseLabel?: string;
     breakpoints?: Breakpoints;
     transitionOptions?: object;
+    onShow?(): void;
     onHide?(): void;
 }
 

diff --git a/src/components/overlaypanel/OverlayPanel.js b/src/components/overlaypanel/OverlayPanel.js
@@ -22,6 +22,7 @@ export class OverlayPanel extends Component {
         breakpoints: null,
         ariaCloseLabel: 'close',
         transitionOptions: null,
+        onShow: null,
         onHide: null
     }
 
@@ -35,6 +36,7 @@ export class OverlayPanel extends Component {
         breakpoints: PropTypes.object,
         ariaCloseLabel: PropTypes.string,
         transitionOptions: PropTypes.object,
+        onShow: PropTypes.func,
         onHide: PropTypes.func
     }
 
@@ -173,10 +175,6 @@ export class OverlayPanel extends Component {
     hide() {
         this.setState({ visible: false }, () => {
             OverlayEventBus.off('overlay-click');
-
-            if (this.props.onHide) {
-                this.props.onHide();
-            }
         });
     }
 
@@ -190,6 +188,8 @@ export class OverlayPanel extends Component {
         this.bindDocumentClickListener();
         this.bindScrollListener();
         this.bindResizeListener();
+
+        this.props.onShow && this.props.onShow();
     }
 
     onExit() {
@@ -200,6 +200,8 @@ export class OverlayPanel extends Component {
 
     onExited() {
         ZIndexUtils.clear(this.overlayRef.current);
+
+        this.props.onHide && this.props.onHide();
     }
 
     align() {

diff --git a/src/showcase/overlaypanel/OverlayPanelDoc.js b/src/showcase/overlaypanel/OverlayPanelDoc.js
@@ -373,10 +373,15 @@ import { OverlayPanel } from 'primereact/overlaypanel';
                     </tr>
                     </thead>
                     <tbody>
+                        <tr>
+                            <td>onShow</td>
+                            <td>-</td>
+                            <td>Callback to invoke when overlay becomes visible.</td>
+                        </tr>
                         <tr>
                             <td>onHide</td>
                             <td>-</td>
-                            <td>Callback to invoke when overlay gets hidden.</td>
+                            <td>Callback to invoke when overlay becomes hidden.</td>
                         </tr>
                     </tbody>
                 </table>