diff --git a/docs/lib/Components/PopoversPage.js b/docs/lib/Components/PopoversPage.js
index f890edfcf..8512d5919 100644
--- a/docs/lib/Components/PopoversPage.js
+++ b/docs/lib/Components/PopoversPage.js
@@ -11,6 +11,8 @@ import PopoverFocusExample from '../examples/PopoverFocus';
const PopoverFocusExampleSource = require('!!raw-loader!../examples/PopoverFocus');
import UncontrolledPopoverExample from '../examples/PopoverUncontrolled';
const UncontrolledPopoverExampleSource = require('!!raw-loader!../examples/PopoverUncontrolled');
+import PopoverScheduleUpdateExample from '../examples/PopoverScheduleUpdate';
+const PopoverScheduleUpdateExampleSource = require('!!raw-loader!../examples/PopoverScheduleUpdate');
export default class PopoversPage extends React.Component {
render() {
@@ -30,6 +32,7 @@ export default class PopoversPage extends React.Component {
{`Popover.propTypes = {
+ children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
// space separated list of triggers (e.g. "click hover focus")
trigger: PropTypes.string,
// boolean to control the state of the popover
@@ -120,6 +123,20 @@ export default class PopoversPage extends React.Component {
{UncontrolledPopoverExampleSource}
+ Repositioning Popovers
+
+ If you need to reposition a popover due to content changes or target placement changes, use
+ the scheduleUpdate function to manually reposition it. This function is exposed
+ as a render prop for children.
+
{`Tooltip.propTypes = {
+ children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
// space separated list of triggers (e.g. "click hover focus")
trigger: PropTypes.string,
// boundaries for popper, can be scrollParent, window, viewport, or any DOM element
@@ -133,6 +136,20 @@ export default class TooltipsPage extends React.Component {
{TooltipExampleUncontrolledSource}
+ Repositioning Tooltips
+
+ If you need to reposition a tooltip due to content changes or target placement changes, use
+ the scheduleUpdate function to manually reposition it. This function is exposed
+ as a render prop for children.
+
+
+
+
+
+
+ {TooltipScheduleUpdateExampleSource}
+
+
);
}
diff --git a/docs/lib/examples/PopoverScheduleUpdate.js b/docs/lib/examples/PopoverScheduleUpdate.js
new file mode 100644
index 000000000..4d19d112e
--- /dev/null
+++ b/docs/lib/examples/PopoverScheduleUpdate.js
@@ -0,0 +1,37 @@
+import React, { useState } from 'react';
+import { Button, UncontrolledPopover, PopoverHeader, PopoverBody, Collapse } from 'reactstrap';
+
+const PopoverContent = ({ scheduleUpdate }) => {
+ const [isOpen, setIsOpen] = useState(false);
+
+ return (
+ <>
+ Schedule Update
+
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
+ labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
+ laboris nisi ut aliquip ex ea commodo consequat.
+
+
+ >
+ );
+}
+
+const Example = (props) => {
+ return (
+