diff --git a/src/components/filter/FilterEditor.jsx b/src/components/filter/FilterEditor.jsx
index 04b47701..4d635ff9 100644
--- a/src/components/filter/FilterEditor.jsx
+++ b/src/components/filter/FilterEditor.jsx
@@ -9,6 +9,7 @@ import { combiningFilterOps } from '../../libs/filterops.js'
import OperatorSelect from './OperatorSelect'
import SingleFilterEditor from './SingleFilterEditor'
import CombiningOperatorSelect from './CombiningOperatorSelect'
+import FilterEditorBlock from './FilterEditorBlock'
import DocLabel from '../fields/DocLabel'
import Button from '../Button'
@@ -75,26 +76,14 @@ export default class CombiningFilterEditor extends React.Component {
let filters = filter.slice(1)
const filterEditors = filters.map((f, idx) => {
- return
+
})
//TODO: Implement support for nested filter
diff --git a/src/components/filter/FilterEditorBlock.jsx b/src/components/filter/FilterEditorBlock.jsx
new file mode 100644
index 00000000..5413175b
--- /dev/null
+++ b/src/components/filter/FilterEditorBlock.jsx
@@ -0,0 +1,38 @@
+import React from 'react'
+import Button from '../Button'
+import DeleteIcon from 'react-icons/lib/md/delete'
+
+class FilterEditorBlock extends React.Component {
+ static propTypes = {
+ onDelete: React.PropTypes.func.isRequired,
+ children: React.PropTypes.element.isRequired,
+ }
+
+ renderChildren() {
+ return React.Children.map(this.props.children, child => {
+ return React.cloneElement(child, {
+ style: {
+ ...child.props.style,
+ display: 'inline-block',
+ width: '75%',
+ }
+ })
+ })
+ }
+
+ render() {
+ return
+
+
+
+ {this.props.children}
+
+ }
+}
+
+export default FilterEditorBlock