diff --git a/components/dropdown/README.md b/components/dropdown/README.md
index 1985439b564c1..05d8c37ff2e02 100644
--- a/components/dropdown/README.md
+++ b/components/dropdown/README.md
@@ -75,3 +75,11 @@ A callback invoked to render the content of the dropdown menu. Its first argumen
- Type: `Function`
- Required: Yes
+
+## expandOnMobile
+
+Opt-in prop to show popovers fullscreen on mobile, pass `false` in this prop to avoid this behavior.
+
+ - Type: `Boolean`
+ - Required: No
+ - Default: `false`
diff --git a/components/dropdown/index.js b/components/dropdown/index.js
index 1989f101de78a..8f9edc451ae74 100644
--- a/components/dropdown/index.js
+++ b/components/dropdown/index.js
@@ -61,7 +61,14 @@ class Dropdown extends Component {
render() {
const { isOpen } = this.state;
- const { renderContent, renderToggle, position = 'bottom', className, contentClassName } = this.props;
+ const {
+ renderContent,
+ renderToggle,
+ position = 'bottom',
+ className,
+ contentClassName,
+ expandOnMobile,
+ } = this.props;
const args = { isOpen, onToggle: this.toggle, onClose: this.close };
return (
@@ -72,6 +79,7 @@ class Dropdown extends Component {
position={ position }
onClose={ this.close }
onClickOutside={ this.clickOutside }
+ expandOnMobile={ expandOnMobile }
>
{ renderContent( args ) }
diff --git a/components/popover/README.md b/components/popover/README.md
index 919f9eecb1311..53a0ef352d21f 100644
--- a/components/popover/README.md
+++ b/components/popover/README.md
@@ -100,11 +100,10 @@ A callback invoked when the user clicks outside the opened popover, passing the
- Type: `Function`
- Required: No
-
## expandOnMobile
-Popovers automatically shows up fullscreen on mobile, pass `false` in this prop to avoid this behavior.
+Opt-in prop to show popovers fullscreen on mobile, pass `false` in this prop to avoid this behavior.
- Type: `Boolean`
- Required: No
- - Default: `true`
+ - Default: `false`
diff --git a/components/popover/index.js b/components/popover/index.js
index 5e29b3d7c63e8..bb1c73afea054 100644
--- a/components/popover/index.js
+++ b/components/popover/index.js
@@ -158,7 +158,7 @@ class Popover extends Component {
}
setOffset() {
- const { getAnchorRect = this.getAnchorRect, expandOnMobile = true } = this.props;
+ const { getAnchorRect = this.getAnchorRect, expandOnMobile = false } = this.props;
const { popover } = this.nodes;
if ( isMobile() && expandOnMobile ) {
diff --git a/components/popover/test/index.js b/components/popover/test/index.js
index 644a229760b34..0a30f0aa65760 100644
--- a/components/popover/test/index.js
+++ b/components/popover/test/index.js
@@ -13,7 +13,7 @@ describe( 'Popover', () => {
let wrapper, mocks;
beforeEach( () => {
wrapper = shallow(
- ,
+ ,
{ lifecycleExperimental: true }
);
@@ -206,7 +206,7 @@ describe( 'Popover', () => {
} );
function getInstanceWithParentNode() {
- const instance = new Popover( { expandOnMobile: false } );
+ const instance = new Popover( {} );
instance.nodes.anchor = {
parentNode: {
diff --git a/components/tooltip/index.js b/components/tooltip/index.js
index d036e4c6b4949..bfe8542c9f70a 100644
--- a/components/tooltip/index.js
+++ b/components/tooltip/index.js
@@ -177,7 +177,6 @@ class Tooltip extends Component {
position={ position }
className="components-tooltip"
aria-hidden="true"
- expandOnMobile={ false }
>
{ text }
,
diff --git a/editor/inserter/index.js b/editor/inserter/index.js
index e04300bc1a360..cea1f67948846 100644
--- a/editor/inserter/index.js
+++ b/editor/inserter/index.js
@@ -68,6 +68,7 @@ class Inserter extends Component {
className="editor-inserter"
position={ position }
onToggle={ this.onToggle }
+ expandOnMobile
renderToggle={ ( { onToggle, isOpen } ) => (