diff --git a/data/README.md b/data/README.md
index 32522d178e9e6..134483cd61ca5 100644
--- a/data/README.md
+++ b/data/README.md
@@ -39,6 +39,25 @@ Let's say the state of our plugin (registered with the key `myPlugin`) has the f
 wp.data.registerSelectors( 'myPlugin', { getTitle: ( state ) => state.title } );
 ```
 
+### `wp.data.registerActions( reducerKey: string, newActions: object )`
+
+If your module or plugin needs to expose its actions to other modules and plugins, you'll have to register action creators.
+
+An action creator is a function that takes arguments and returns an action object dispatch to the registered reducer to update the state.
+
+#### Example:
+
+```js
+wp.data.registerActions( 'myPlugin', {
+	setTitle( newTitle ) {
+		return {
+			type: 'SET_TITLE',
+			title: newTitle,
+		};
+	},
+} );
+```
+
 ### `wp.data.select( key: string )`
 
 This function allows calling any registered selector. Given a module's key, this function returns an object of all selector functions registered for the module.
@@ -49,18 +68,14 @@ This function allows calling any registered selector. Given a module's key, this
 wp.data.select( 'myPlugin' ).getTitle(); // Returns "My post title"
 ```
 
-### `wp.data.query( mapSelectorsToProps: function )( WrappedComponent: Component )`
+### `wp.data.dispatch( key: string )`
 
-If you use a React or WordPress Element, a Higher Order Component is made available to inject data into your components like so:
+This function allows calling any registered action. Given a module's key, this function returns an object of all action creators functions registered for the module.
 
-```js
-const Component = ( { title } ) => <div>{ title }</div>;
+#### Example:
 
-wp.data.query( select => {
-	return {
-		title: select( 'myPlugin' ).getTitle(),
-	};
-} )( Component );
+```js
+wp.data.dispatch( 'myPlugin' ).setTitle( 'new Title' ); // Dispatches the setTitle action to the reducer
 ```
 
 ### `wp.data.subscribe( listener: function )`
@@ -80,3 +95,38 @@ const unsubscribe = wp.data.subscribe( () => {
 // Unsubcribe.
 unsubscribe();
 ```
+
+### `wp.data.withSelect( mapStateToProps: Object|Function )( WrappedComponent: Component )`
+
+To inject state-derived props into a WordPress Element Component, use the `withSelect` higher-order component:
+
+```jsx
+const Component = ( { title } ) => <div>{ title }</div>;
+
+const EnhancedComponent = wp.data.withSelect( ( select ) => {
+	return {
+		title: select( 'myPlugin' ).getTitle,		
+	};
+} )( Component );
+```
+
+### `wp.data.withDispatch( propsToDispatchers: Object )( WrappedComponent: Component )`
+
+To manipulate store data, you can pass dispatching actions into your component as props using the `withDispatch` higher-order component:
+
+```jsx
+const Component = ( { title, updateTitle } ) => <input value={ title } onChange={ updateTitle } />;
+
+const EnhancedComponent = wp.element.compose( [
+	wp.data.withSelect( ( select ) => {
+		return {
+			title: select( 'myPlugin' ).getTitle(),
+		};
+	} ),
+	wp.data.withDispatch( ( dispatch ) => {
+		return {
+			updateTitle: dispatch( 'myPlugin' ).setTitle,			
+		};
+	} ),
+] )( Component );
+```
diff --git a/data/index.js b/data/index.js
index 0d80e47cb63b6..93fa8fa80c09a 100644
--- a/data/index.js
+++ b/data/index.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { connect } from 'react-redux';
+import isEqualShallow from 'is-equal-shallow';
 import { createStore } from 'redux';
 import { flowRight, without, mapValues } from 'lodash';
 
@@ -9,6 +9,7 @@ import { flowRight, without, mapValues } from 'lodash';
  * WordPress dependencies
  */
 import { deprecated } from '@wordpress/utils';
+import { Component, getWrapperDisplayName } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -20,6 +21,7 @@ export { loadAndPersist, withRehydratation } from './persist';
  */
 const stores = {};
 const selectors = {};
+const actions = {};
 let listeners = [];
 
 /**
@@ -29,21 +31,6 @@ export function globalListener() {
 	listeners.forEach( listener => listener() );
 }
 
-/**
- * Subscribe to changes to any data.
- *
- * @param {Function}   listener Listener function.
- *
- * @return {Function}           Unsubscribe function.
- */
-export const subscribe = ( listener ) => {
-	listeners.push( listener );
-
-	return () => {
-		listeners = without( listeners, listener );
-	};
-};
-
 /**
  * Registers a new sub-reducer to the global state and returns a Redux-like store object.
  *
@@ -79,6 +66,34 @@ export function registerSelectors( reducerKey, newSelectors ) {
 	selectors[ reducerKey ] = mapValues( newSelectors, createStateSelector );
 }
 
+/**
+ * Registers actions for external usage.
+ *
+ * @param {string} reducerKey   Part of the state shape to register the
+ *                              selectors for.
+ * @param {Object} newActions   Actions to register.
+ */
+export function registerActions( reducerKey, newActions ) {
+	const store = stores[ reducerKey ];
+	const createBoundAction = ( action ) => ( ...args ) => store.dispatch( action( ...args ) );
+	actions[ reducerKey ] = mapValues( newActions, createBoundAction );
+}
+
+/**
+ * Subscribe to changes to any data.
+ *
+ * @param {Function}   listener Listener function.
+ *
+ * @return {Function}           Unsubscribe function.
+ */
+export const subscribe = ( listener ) => {
+	listeners.push( listener );
+
+	return () => {
+		listeners = without( listeners, listener );
+	};
+};
+
 /**
  * Calls a selector given the current state and extra arguments.
  *
@@ -102,33 +117,142 @@ export function select( reducerKey ) {
 }
 
 /**
- * Higher Order Component used to inject data using the registered selectors.
+ * Returns the available actions for a part of the state.
  *
- * @param {Function} mapSelectorsToProps Gets called with the selectors object
- *                                       to determine the data for the
- *                                       component.
+ * @param {string} reducerKey Part of the state shape to dispatch the
+ *                            action for.
  *
- * @return {Function} Renders the wrapped component and passes it data.
+ * @return {*} The action's returned value.
  */
-export const query = ( mapSelectorsToProps ) => ( WrappedComponent ) => {
-	const store = {
-		getState() {
-			return mapValues( stores, subStore => subStore.getState() );
-		},
-		subscribe,
-		dispatch() {
-			// eslint-disable-next-line no-console
-			console.warn( 'Dispatch is not supported.' );
-		},
-	};
-	const connectWithStore = ( ...args ) => {
-		const ConnectedWrappedComponent = connect( ...args )( WrappedComponent );
-		return ( props ) => {
-			return <ConnectedWrappedComponent { ...props } store={ store } />;
-		};
-	};
+export function dispatch( reducerKey ) {
+	return actions[ reducerKey ];
+}
+
+/**
+ * Higher-order component used to inject state-derived props using registered
+ * selectors.
+ *
+ * @param {Function} mapStateToProps Function called on every state change,
+ *                                   expected to return object of props to
+ *                                   merge with the component's own props.
+ *
+ * @return {Component} Enhanced component with merged state data props.
+ */
+export const withSelect = ( mapStateToProps ) => ( WrappedComponent ) => {
+	class ComponentWithSelect extends Component {
+		constructor() {
+			super( ...arguments );
+
+			this.runSelection = this.runSelection.bind( this );
+
+			this.state = {};
+		}
+
+		componentWillMount() {
+			this.subscribe();
+
+			// Populate initial state.
+			this.runSelection();
+		}
+
+		componentWillReceiveProps( nextProps ) {
+			if ( ! isEqualShallow( nextProps, this.props ) ) {
+				this.runSelection( nextProps );
+			}
+		}
+
+		componentWillUnmount() {
+			this.unsubscribe();
+		}
+
+		subscribe() {
+			this.unsubscribe = subscribe( this.runSelection );
+		}
+
+		runSelection( props = this.props ) {
+			const newState = mapStateToProps( select, props );
+			if ( ! isEqualShallow( newState, this.state ) ) {
+				this.setState( newState );
+			}
+		}
+
+		render() {
+			return <WrappedComponent { ...this.props } { ...this.state } />;
+		}
+	}
+
+	ComponentWithSelect.displayName = getWrapperDisplayName( WrappedComponent, 'select' );
+
+	return ComponentWithSelect;
+};
+
+/**
+ * Higher-order component used to add dispatch props using registered action
+ * creators.
+ *
+ * @param {Object} mapDispatchToProps Object of prop names where value is a
+ *                                    dispatch-bound action creator, or a
+ *                                    function to be called with with the
+ *                                    component's props and returning an
+ *                                    action creator.
+ *
+ * @return {Component} Enhanced component with merged dispatcher props.
+ */
+export const withDispatch = ( mapDispatchToProps ) => ( WrappedComponent ) => {
+	class ComponentWithDispatch extends Component {
+		constructor() {
+			super( ...arguments );
+
+			this.proxyProps = {};
+		}
+
+		componentWillMount() {
+			this.setProxyProps( this.props );
+		}
+
+		componentWillUpdate( nextProps ) {
+			this.setProxyProps( nextProps );
+		}
+
+		proxyDispatch( propName, ...args ) {
+			// Original dispatcher is a pre-bound (dispatching) action creator.
+			mapDispatchToProps( dispatch, this.props )[ propName ]( ...args );
+		}
+
+		setProxyProps( props ) {
+			// Assign as instance property so that in reconciling subsequent
+			// renders, the assigned prop values are referentially equal.
+			const propsToDispatchers = mapDispatchToProps( dispatch, props );
+			this.proxyProps = mapValues( propsToDispatchers, ( dispatcher, propName ) => {
+				// Prebind with prop name so we have reference to the original
+				// dispatcher to invoke. Track between re-renders to avoid
+				// creating new function references every render.
+				if ( this.proxyProps.hasOwnProperty( propName ) ) {
+					return this.proxyProps[ propName ];
+				}
+
+				return this.proxyDispatch.bind( this, propName );
+			} );
+		}
+
+		render() {
+			return <WrappedComponent { ...this.props } { ...this.proxyProps } />;
+		}
+	}
+
+	ComponentWithDispatch.displayName = getWrapperDisplayName( WrappedComponent, 'dispatch' );
+
+	return ComponentWithDispatch;
+};
+
+export const query = ( mapSelectToProps ) => {
+	deprecated( 'wp.data.query', {
+		version: '2.5',
+		alternative: 'wp.data.withSelect',
+		plugin: 'Gutenberg',
+	} );
 
-	return connectWithStore( ( state, ownProps ) => {
-		return mapSelectorsToProps( select, ownProps );
+	return withSelect( ( props ) => {
+		return mapSelectToProps( select, props );
 	} );
 };
diff --git a/data/test/__snapshots__/index.js.snap b/data/test/__snapshots__/index.js.snap
deleted file mode 100644
index 46758a91bd19a..0000000000000
--- a/data/test/__snapshots__/index.js.snap
+++ /dev/null
@@ -1,7 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`query passes the relevant data to the component 1`] = `
-<div>
-  reactState
-</div>
-`;
diff --git a/data/test/index.js b/data/test/index.js
index dfafb0e286f05..8b63e41f4e716 100644
--- a/data/test/index.js
+++ b/data/test/index.js
@@ -1,12 +1,26 @@
 /**
  * External dependencies
  */
-import { render } from 'enzyme';
+import { mount } from 'enzyme';
+
+/**
+ * WordPress dependencies
+ */
+import { compose } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
-import { registerReducer, registerSelectors, select, query, subscribe } from '../';
+import {
+	registerReducer,
+	registerSelectors,
+	registerActions,
+	dispatch,
+	select,
+	withSelect,
+	withDispatch,
+	subscribe,
+} from '../';
 
 describe( 'store', () => {
 	it( 'Should append reducers to the state', () => {
@@ -51,23 +65,146 @@ describe( 'select', () => {
 	} );
 } );
 
-describe( 'query', () => {
+describe( 'withSelect', () => {
 	it( 'passes the relevant data to the component', () => {
 		registerReducer( 'reactReducer', () => ( { reactKey: 'reactState' } ) );
 		registerSelectors( 'reactReducer', {
 			reactSelector: ( state, key ) => state[ key ],
 		} );
-		const Component = query( ( selectFunc, ownProps ) => {
+
+		// In normal circumstances, the fact that we have to add an arbitrary
+		// prefix to the variable name would be concerning, and perhaps an
+		// argument that we ought to expect developer to use select from the
+		// wp.data export. But in-fact, this serves as a good deterrent for
+		// including both `withSelect` and `select` in the same scope, which
+		// shouldn't occur for a typical component, and if it did might wrongly
+		// encourage the developer to use `select` within the component itself.
+		const Component = withSelect( ( _select, ownProps ) => ( {
+			data: _select( 'reactReducer' ).reactSelector( ownProps.keyName ),
+		} ) )( ( props ) => <div>{ props.data }</div> );
+
+		const wrapper = mount( <Component keyName="reactKey" /> );
+
+		// Wrapper is the enhanced component. Find props on the rendered child.
+		const child = wrapper.childAt( 0 );
+		expect( child.props() ).toEqual( {
+			keyName: 'reactKey',
+			data: 'reactState',
+		} );
+		expect( wrapper.text() ).toBe( 'reactState' );
+
+		wrapper.unmount();
+	} );
+
+	it( 'should rerun selection on state changes', () => {
+		registerReducer( 'counter', ( state = 0, action ) => {
+			if ( action.type === 'increment' ) {
+				return state + 1;
+			}
+
+			return state;
+		} );
+
+		registerSelectors( 'counter', {
+			getCount: ( state ) => state,
+		} );
+
+		registerActions( 'counter', {
+			increment: () => ( { type: 'increment' } ),
+		} );
+
+		const Component = compose( [
+			withSelect( ( _select ) => ( {
+				count: _select( 'counter' ).getCount(),
+			} ) ),
+			withDispatch( ( _dispatch ) => ( {
+				increment: _dispatch( 'counter' ).increment,
+			} ) ),
+		] )( ( props ) => (
+			<button onClick={ props.increment }>
+				{ props.count }
+			</button>
+		) );
+
+		const wrapper = mount( <Component /> );
+
+		const button = wrapper.find( 'button' );
+
+		button.simulate( 'click' );
+
+		expect( button.text() ).toBe( '1' );
+
+		wrapper.unmount();
+	} );
+
+	it( 'should rerun selection on props changes', () => {
+		registerReducer( 'counter', ( state = 0, action ) => {
+			if ( action.type === 'increment' ) {
+				return state + 1;
+			}
+
+			return state;
+		} );
+
+		registerSelectors( 'counter', {
+			getCount: ( state, offset ) => state + offset,
+		} );
+
+		const Component = withSelect( ( _select, ownProps ) => ( {
+			count: _select( 'counter' ).getCount( ownProps.offset ),
+		} ) )( ( props ) => <div>{ props.count }</div> );
+
+		const wrapper = mount( <Component offset={ 0 } /> );
+
+		wrapper.setProps( { offset: 10 } );
+
+		expect( wrapper.childAt( 0 ).text() ).toBe( '10' );
+
+		wrapper.unmount();
+	} );
+} );
+
+describe( 'withDispatch', () => {
+	it( 'passes the relevant data to the component', () => {
+		const store = registerReducer( 'counter', ( state = 0, action ) => {
+			if ( action.type === 'increment' ) {
+				return state + action.count;
+			}
+			return state;
+		} );
+
+		const increment = ( count = 1 ) => ( { type: 'increment', count } );
+		registerActions( 'counter', {
+			increment,
+		} );
+
+		const Component = withDispatch( ( _dispatch, ownProps ) => {
+			const { count } = ownProps;
+
 			return {
-				data: selectFunc( 'reactReducer' ).reactSelector( ownProps.keyName ),
+				increment: () => _dispatch( 'counter' ).increment( count ),
 			};
-		} )( ( props ) => {
-			return <div>{ props.data }</div>;
-		} );
+		} )( ( props ) => <button onClick={ props.increment } /> );
+
+		const wrapper = mount( <Component count={ 0 } /> );
+
+		// Wrapper is the enhanced component. Find props on the rendered child.
+		const child = wrapper.childAt( 0 );
+
+		const incrementBeforeSetProps = child.prop( 'increment' );
+
+		// Verify that dispatch respects props at the time of being invoked by
+		// changing props after the initial mount.
+		wrapper.setProps( { count: 2 } );
+
+		// Function value reference should not have changed in props update.
+		expect( child.prop( 'increment' ) ).toBe( incrementBeforeSetProps );
+
+		wrapper.find( 'button' ).simulate( 'click' );
 
-		const tree = render( <Component keyName="reactKey" /> );
+		expect( store.getState() ).toBe( 2 );
 
-		expect( tree ).toMatchSnapshot();
+		wrapper.unmount();
 	} );
 } );
 
@@ -97,3 +234,22 @@ describe( 'subscribe', () => {
 		expect( incrementedValue ).toBe( 3 );
 	} );
 } );
+
+describe( 'dispatch', () => {
+	it( 'registers actions to the public API', () => {
+		const store = registerReducer( 'counter', ( state = 0, action ) => {
+			if ( action.type === 'increment' ) {
+				return state + action.count;
+			}
+			return state;
+		} );
+		const increment = ( count = 1 ) => ( { type: 'increment', count } );
+		registerActions( 'counter', {
+			increment,
+		} );
+
+		dispatch( 'counter' ).increment(); // state = 1
+		dispatch( 'counter' ).increment( 4 ); // state = 5
+		expect( store.getState() ).toBe( 5 );
+	} );
+} );
diff --git a/editor/components/inserter/index.js b/editor/components/inserter/index.js
index 5783bd23f440a..82372dd82fe99 100644
--- a/editor/components/inserter/index.js
+++ b/editor/components/inserter/index.js
@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { connect } from 'react-redux';
 import { isEmpty } from 'lodash';
 
 /**
@@ -11,18 +10,12 @@ import { __ } from '@wordpress/i18n';
 import { Dropdown, IconButton, withContext } from '@wordpress/components';
 import { createBlock, isUnmodifiedDefaultBlock } from '@wordpress/blocks';
 import { Component, compose } from '@wordpress/element';
+import { withSelect, withDispatch } from '@wordpress/data';
 
 /**
  * Internal dependencies
  */
 import InserterMenu from './menu';
-import { getBlockInsertionPoint, getSelectedBlock } from '../../store/selectors';
-import {
-	insertBlock,
-	hideInsertionPoint,
-	showInsertionPoint,
-	replaceBlocks,
-} from '../../store/actions';
 
 class Inserter extends Component {
 	constructor() {
@@ -92,36 +85,24 @@ class Inserter extends Component {
 }
 
 export default compose( [
-	connect(
-		( state ) => {
-			return {
-				insertionPoint: getBlockInsertionPoint( state ),
-				selectedBlock: getSelectedBlock( state ),
-			};
+	withSelect( ( select ) => ( {
+		insertionPoint: select( 'core/editor' ).getBlockInsertionPoint,
+		selectedBlock: select( 'core/editor' ).getSelectedBlock,
+	} ) ),
+	withDispatch( ( dispatch, ownProps ) => ( {
+		showInsertionPoint: dispatch( 'core/editor' ).showInsertionPoint,
+		hideInsertionPoint: dispatch( 'core/editor' ).hideInsertionPoint,
+		onInsertBlock: ( item ) => {
+			const { insertionPoint, selectedBlock } = ownProps;
+			const { index, rootUID, layout } = insertionPoint;
+			const { name, initialAttributes } = item;
+			const insertedBlock = createBlock( name, { ...initialAttributes, layout } );
+			if ( selectedBlock && isUnmodifiedDefaultBlock( selectedBlock ) ) {
+				return dispatch( 'core/editor' ).replaceBlocks( selectedBlock.uid, insertedBlock );
+			}
+			return dispatch( 'core/editor' ).insertBlock( insertedBlock, index, rootUID );
 		},
-		{
-			showInsertionPoint,
-			hideInsertionPoint,
-			insertBlock,
-			replaceBlocks,
-		},
-		( { selectedBlock, insertionPoint, ...stateProps }, dispatchProps, { ...ownProps } ) => ( {
-			...stateProps,
-			...ownProps,
-			showInsertionPoint: dispatchProps.showInsertionPoint,
-			hideInsertionPoint: dispatchProps.hideInsertionPoint,
-			onInsertBlock( item ) {
-				const { index, rootUID, layout } = insertionPoint;
-				const { name, initialAttributes } = item;
-				const insertedBlock = createBlock( name, { ...initialAttributes, layout } );
-				if ( selectedBlock && isUnmodifiedDefaultBlock( selectedBlock ) ) {
-					dispatchProps.replaceBlocks( selectedBlock.uid, insertedBlock );
-					return;
-				}
-				dispatchProps.insertBlock( insertedBlock, index, rootUID );
-			},
-		} )
-	),
+	} ) ),
 	withContext( 'editor' )( ( settings ) => {
 		const { blockTypes, templateLock } = settings;
 
diff --git a/editor/index.js b/editor/index.js
index 3a55530e89af6..07635cbbc8e7a 100644
--- a/editor/index.js
+++ b/editor/index.js
@@ -1,4 +1 @@
-/**
- * Internal dependencies
- */
 export * from './components';
diff --git a/editor/store/index.js b/editor/store/index.js
index 8b9fba4192c33..13a07a2476429 100644
--- a/editor/store/index.js
+++ b/editor/store/index.js
@@ -1,20 +1,21 @@
 /**
  * WordPress Dependencies
  */
-import { registerReducer, registerSelectors, withRehydratation, loadAndPersist } from '@wordpress/data';
+import {
+	registerReducer,
+	registerSelectors,
+	registerActions,
+	withRehydratation,
+	loadAndPersist,
+} from '@wordpress/data';
 
 /**
  * Internal dependencies
  */
 import reducer from './reducer';
 import applyMiddlewares from './middlewares';
-import {
-	getBlockCount,
-	getBlocks,
-	getEditedPostAttribute,
-	getLastMultiSelectedBlockUid,
-	getSelectedBlockCount,
-} from './selectors';
+import * as selectors from './selectors';
+import * as actions from './actions';
 
 /**
  * Module Constants
@@ -27,12 +28,7 @@ const store = applyMiddlewares(
 );
 loadAndPersist( store, reducer, 'preferences', STORAGE_KEY );
 
-registerSelectors( MODULE_KEY, {
-	getBlockCount,
-	getBlocks,
-	getEditedPostAttribute,
-	getLastMultiSelectedBlockUid,
-	getSelectedBlockCount,
-} );
+registerSelectors( MODULE_KEY, selectors );
+registerActions( MODULE_KEY, actions );
 
 export default store;