diff --git a/components/RefinementList.js b/components/RefinementList.js
index 6770c8e68d..42667d38fc 100644
--- a/components/RefinementList.js
+++ b/components/RefinementList.js
@@ -3,6 +3,8 @@ var React = require('react');
var Template = require('./Template');
var cx = require('classnames');
+var identity = require('lodash/utility/identity');
+
class RefinementList extends React.Component {
refine(value) {
this.props.toggleRefinement(value);
@@ -43,6 +45,7 @@ class RefinementList extends React.Component {
var rootClass = cx(this.props.cssClasses.root);
var listClass = cx(this.props.cssClasses.list);
var itemClass = cx(this.props.cssClasses.item);
+ var transformData = this.props.transformData || identity;
return (
@@ -51,7 +54,7 @@ class RefinementList extends React.Component {
{facetValues.map(facetValue => {
return (
-
+
);
})}
@@ -92,6 +95,7 @@ RefinementList.propTypes = {
React.PropTypes.func
])
}),
+ transformData: React.PropTypes.func,
toggleRefinement: React.PropTypes.func.isRequired
};
diff --git a/example/app.js b/example/app.js
index 363056ed7f..cb86797454 100644
--- a/example/app.js
+++ b/example/app.js
@@ -81,6 +81,10 @@ search.addWidget(
templates: {
header: '
Price ranges
',
item: require('./templates/and.html')
+ },
+ transformData: function(data) {
+ data.name = data.name.replace(/(\d+) - (\d+)/, '$$$1 - $$$2').replace(/> (\d+)/, '> $$$1');
+ return data;
}
})
);
diff --git a/widgets/menu.js b/widgets/menu.js
index c09182db09..3c831d9111 100644
--- a/widgets/menu.js
+++ b/widgets/menu.js
@@ -25,6 +25,7 @@ var hierarchicalCounter = 0;
* @param {String|Function} [options.templates.header=''] Header template
* @param {String|Function} [options.templates.item='
{{name}} {{count}}'] Item template, provided with `name`, `count`, `isRefined`
* @param {String|Function} [options.templates.footer=''] Footer template
+ * @param {Function} [options.transformData] Method to change the object passed to the item template
* @param {boolean} [hideWhenNoResults=true] Hide the container when no results match
* @return {Object}
*/
@@ -39,14 +40,15 @@ function menu({
item: null
},
hideWhenNoResults = true,
- templates = defaultTemplates
+ templates = defaultTemplates,
+ transformData = null
}) {
hierarchicalCounter++;
var RefinementList = require('../components/RefinementList');
var containerNode = utils.getContainerNode(container);
- var usage = 'Usage: menu({container, facetName, [sortBy, limit, rootClass, itemClass, template]})';
+ var usage = 'Usage: menu({container, facetName, [sortBy, limit, rootClass, itemClass, templates.{header,item,footer}, transformData]})';
if (container === null || facetName === null) {
throw new Error(usage);
@@ -85,6 +87,7 @@ function menu({
cssClasses={cssClasses}
facetValues={getFacetValues(results, hierarchicalFacetName, sortBy, limit)}
templates={templates}
+ transformData={transformData}
toggleRefinement={toggleRefinement.bind(null, helper, hierarchicalFacetName)}
/>,
containerNode
diff --git a/widgets/refinement-list.js b/widgets/refinement-list.js
index aa0be23d1b..16709a1cef 100644
--- a/widgets/refinement-list.js
+++ b/widgets/refinement-list.js
@@ -27,6 +27,7 @@ var defaultTemplates = {
{{name}}
{{count}}
`] Item template, provided with `name`, `count`, `isRefined`
* @param {String|Function} [options.templates.footer] Footer template
+ * @param {Function} [options.transformData] Method to change the object passed to the item template
* @param {String|Function} [options.singleRefine=true] Are multiple refinements allowed or only one at the same time. You can use this
* to build radio based refinement lists for example
* @param {boolean} [hideWhenNoResults=true] Hide the container when no results match
@@ -45,12 +46,13 @@ function refinementList({
},
hideWhenNoResults = true,
templates = defaultTemplates,
+ transformData = null,
singleRefine = false
}) {
var RefinementList = require('../components/RefinementList');
var containerNode = utils.getContainerNode(container);
- var usage = 'Usage: refinementList({container, facetName, operator[sortBy, limit, rootClass, itemClass, template]})';
+ var usage = 'Usage: refinementList({container, facetName, operator[sortBy, limit, rootClass, itemClass, templates.{header,item,footer}, transformData]})';
if (container === null ||
facetName === null ||
@@ -94,6 +96,7 @@ function refinementList({
cssClasses={cssClasses}
facetValues={results.getFacetValues(facetName, {sortBy: sortBy}).slice(0, limit)}
templates={templates}
+ transformData={transformData}
toggleRefinement={toggleRefinement.bind(null, helper, singleRefine, facetName)}
/>,
containerNode