@@ -204,7 +202,7 @@ class SettingsTaxesWooCommerceServices extends Component {
{ loaded && this.renderRates() }
{ loaded && this.renderOptions() }
-
+
);
};
}
diff --git a/client/extensions/woocommerce/components/action-header/actions.js b/client/extensions/woocommerce/components/action-header/actions.js
new file mode 100644
index 00000000000000..18cccb7e048e9e
--- /dev/null
+++ b/client/extensions/woocommerce/components/action-header/actions.js
@@ -0,0 +1,147 @@
+/** @format */
+
+/**
+ * External dependencies
+ */
+
+import React, { Component } from 'react';
+import ReactDom from 'react-dom';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import { debounce } from 'lodash';
+
+/**
+ * Internal Dependencies
+ */
+import afterLayoutFlush from 'lib/after-layout-flush';
+import Button from 'components/button';
+import PopoverMenuItem from 'components/popover/menu-item';
+import SplitButton from 'components/split-button';
+
+class ActionButtons extends Component {
+ static propTypes = {
+ primaryLabel: PropTypes.string,
+ };
+
+ state = {
+ isDropdown: false,
+ };
+
+ componentDidMount() {
+ this.setDropdownAfterLayoutFlush();
+ window.addEventListener( 'resize', this.setDropdownDebounced );
+ }
+
+ componentDidUpdate() {
+ this.setDropdownAfterLayoutFlush();
+ }
+
+ componentWillUnmount() {
+ window.removeEventListener( 'resize', this.setDropdownDebounced );
+ // cancel the debounced `setDropdown` calls that might be already scheduled.
+ // see https://lodash.com/docs/4.17.4#debounce to learn about the `cancel` method.
+ this.setDropdownDebounced.cancel();
+ this.setDropdownAfterLayoutFlush.cancel();
+ }
+
+ setGroupRef = group => {
+ this.navGroup = group;
+ };
+
+ render() {
+ const buttons = React.Children.map( this.props.children, function( child, index ) {
+ return child && React.cloneElement( child, { ref: 'button-' + index } );
+ } );
+
+ const buttonsClassName = classNames( {
+ 'action-header__actions': true,
+ 'is-dropdown': this.state.isDropdown,
+ 'is-open': this.state.isDropdownOpen,
+ } );
+
+ return (
+