react-instantsearch - npm Package Compare versions

Comparing version 2.0.0-beta.9 to 2.0.0-beta.10

index.js

@@ -6,3 +6,3 @@ 'use strict';
 });
-exports.ScrollTo = exports.Error = exports.Stats = exports.NoResults = exports.EmptyQuery = exports.Loading = exports.SortBy = exports.Toggle = exports.CurrentFilters = exports.Range = exports.MultiRange = exports.HierarchicalMenu = exports.Menu = exports.RefinementList = exports.Pagination = exports.SearchBox = exports.HitsPerPage = exports.Hits = exports.createConnector = exports.InstantSearch = undefined;
+exports.overrideTheme = exports.highlight = exports.ScrollTo = exports.Error = exports.Stats = exports.NoResults = exports.EmptyQuery = exports.Loading = exports.SortBy = exports.Toggle = exports.CurrentFilters = exports.Range = exports.MultiRange = exports.HierarchicalMenu = exports.Menu = exports.RefinementList = exports.Pagination = exports.SearchBox = exports.HitsPerPage = exports.Hits = exports.createConnector = exports.InstantSearch = undefined;
 
@@ -17,2 +17,10 @@ var _InstantSearch = require('./src/core/InstantSearch');
 
+var _styling = require('./src/core/styling');
+
+var _styling2 = _interopRequireDefault(_styling);
+
+var _highlight = require('./src/core/highlight.js');
+
+var _highlight2 = _interopRequireDefault(_highlight);
+
 var _index = require('./src/widgets/Hits/index.js');
@@ -115,1 +123,3 @@
 exports.ScrollTo = _index36.default;
+exports.highlight = _highlight2.default;
+exports.overrideTheme = _styling2.default;

package.json

 {
   "name": "react-instantsearch",
-  "version": "2.0.0-beta.9",
+  "version": "2.0.0-beta.10",
   "scripts": {
-    "test": "jest",
-    "dev": "jest --watch",
-    "coverage": "jest --coverage",
     "build": "./scripts/build.sh"
   },
   "repository": "algolia/instantsearch.js/packages/react-instantsearch",
-  "devDependencies": {
-    "babel-cli": "6.14.0",
-    "babel-jest": "15.0.0",
-    "enzyme": "2.4.1",
-    "jest-cli": "15.1.1",
-    "mockdate": "1.0.4",
-    "react": "15.3.2",
-    "react-addons-test-utils": "15.3.2",
-    "react-dom": "15.3.2",
-    "react-test-renderer": "15.3.2",
-    "webpack": "1.13.2"
-  },
   "dependencies": {
@@ -27,2 +12,3 @@ "algoliasearch": "3.18.1",
     "history": "2.1.2",
+    "insert-css": "1.0.0",
     "lodash": "4.16.2",
@@ -29,0 +15,0 @@ "qs": "6.2.1",

src/components/LinkList.js

@@ -54,3 +54,5 @@ 'use strict';
             'li',
-            applyTheme((0, _lodash.has)(item, 'key') ? item.key : item.value, 'item', item.value === selectedItem && 'itemSelected', item.disabled && 'itemDisabled', item.modifier),
+            applyTheme((0, _lodash.has)(item, 'key') ? item.key : item.value, 'item',
+            // eslint-disable-next-line
+            item.value == selectedItem && 'itemSelected', item.disabled && 'itemDisabled', item.modifier),
             item.disabled ? _react2.default.createElement(
@@ -95,3 +97,3 @@ 'span',
      */
-    value: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number]).isRequired,
+    value: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number, _react.PropTypes.object]).isRequired,
 
@@ -115,5 +117,5 @@ /**
   })),
-  selectedItem: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number]),
+  selectedItem: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number, _react.PropTypes.object]),
   onSelect: _react.PropTypes.func.isRequired
 };
 exports.default = LinkList;

src/components/List.js

@@ -62,3 +62,3 @@ 'use strict';
     _this.renderItem = function (item) {
-      var parent = arguments.length <= 1 || arguments[1] === undefined ? null : arguments[1];
+      var parent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
       var _this$props2 = _this.props;
@@ -83,3 +83,3 @@ var selectedItems = _this$props2.selectedItems;
         'div',
-        applyTheme(item.value, 'item', selected && 'itemSelected', children && 'itemParent', selectedParent && 'itemSelectedParent'),
+        applyTheme(item.value, 'item', selected && 'itemSelected', children && 'item_parent', selectedParent && 'itemSelectedParent'),
         _this.props.renderItem(item, selected, parent, selectedParent),
@@ -86,0 +86,0 @@ children

src/components/Slider.js

@@ -154,3 +154,3 @@ 'use strict';
           'div',
-          _extends({}, applyTheme(i, 'handle', i === activeIdx && 'handleActive'), {
+          _extends({}, applyTheme(i, 'handle', i === activeIdx && 'handle_active'), {
             style: {
@@ -157,0 +157,0 @@ left: offset + '%'

src/core/createHistoryStateManager.js

@@ -20,3 +20,3 @@ 'use strict';
 function getStateFromLocation(location) {
-  var knownKeys = arguments.length <= 1 || arguments[1] === undefined ? null : arguments[1];
+  var knownKeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
 
@@ -23,0 +23,0 @@ var query = location.query || _qs2.default.parse(location.search.slice(1));

src/widgets/CurrentFilters/CurrentFilters.js

@@ -23,2 +23,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -32,2 +36,16 @@
 
+var theme = {
+  code: '.ais-CurrentFilters__root {\n}\n\n.ais-CurrentFilters__filters {\n}\n\n.ais-CurrentFilters__filter {\n}\n\n.ais-CurrentFilters__filterLabel {\n}\n\n.ais-CurrentFilters__filterClear {\n}\n\n.ais-CurrentFilters__clearAll {\n}',
+  classNames: {
+    root: 'ais-CurrentFilters__root',
+    filters: 'ais-CurrentFilters__filters',
+    filter: 'ais-CurrentFilters__filter',
+    filterLabel: 'ais-CurrentFilters__filterLabel',
+    filterClear: 'ais-CurrentFilters__filterClear',
+    clearAll: 'ais-CurrentFilters__clearAll'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var CurrentFilters = function (_Component) {
@@ -106,12 +124,5 @@ _inherits(CurrentFilters, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'CurrentFilters',
-  filters: 'CurrentFilters__filters',
-  filter: 'CurrentFilters__filter',
-  filterLabel: 'CurrentFilters__filter__label',
-  filterClear: 'CurrentFilters__filter__clear',
-  clearAll: 'CurrentFilters__clearAll'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   clearFilter: '×',
   clearAll: 'Clear all'
 })(CurrentFilters));

src/widgets/Error/Error.js

@@ -21,2 +21,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,2 +34,11 @@
 
+var theme = {
+  code: '.ais-Error__root {\n}',
+  classNames: {
+    root: 'ais-Error__root'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var Error = function (_Component) {
@@ -64,6 +77,4 @@ _inherits(Error, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'Error'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   error: 'There was an error processing your request. Please try again.'
 })(Error));

src/widgets/HierarchicalMenu/HierarchicalMenu.js

@@ -35,2 +35,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -44,2 +48,21 @@
 
+var theme = {
+  code: '.ais-HierarchicalMenu__root {\n}\n\n.ais-HierarchicalMenu__items {\n}\n\n.ais-HierarchicalMenu__item {\n}\n\n.ais-HierarchicalMenu__itemSelected {\n}\n\n.ais-HierarchicalMenu__item_parent {\n}\n\n.ais-HierarchicalMenu__itemSelectedParent {\n}\n\n.ais-HierarchicalMenu__itemLink {\n}\n\n.ais-HierarchicalMenu__itemLabel {\n}\n\n.ais-HierarchicalMenu__itemCount {\n}\n\n.ais-HierarchicalMenu__itemChildren {\n}\n\n.ais-HierarchicalMenu__showMore {\n}',
+  classNames: {
+    root: 'ais-HierarchicalMenu__root',
+    items: 'ais-HierarchicalMenu__items',
+    item: 'ais-HierarchicalMenu__item',
+    itemSelected: 'ais-HierarchicalMenu__itemSelected',
+    item_parent: 'ais-HierarchicalMenu__item_parent',
+    itemSelectedParent: 'ais-HierarchicalMenu__itemSelectedParent',
+    itemLink: 'ais-HierarchicalMenu__itemLink',
+    itemLabel: 'ais-HierarchicalMenu__itemLabel',
+    itemCount: 'ais-HierarchicalMenu__itemCount',
+    itemChildren: 'ais-HierarchicalMenu__itemChildren',
+    showMore: 'ais-HierarchicalMenu__showMore'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var itemsPropType = _react.PropTypes.arrayOf(_react.PropTypes.shape({
@@ -130,15 +153,3 @@ label: _react.PropTypes.node,
 };
-exports.default = (0, _themeable2.default)({
-  root: 'HierarchicalMenu',
-  items: 'HierarchicalMenu__items',
-  item: 'HierarchicalMenu__item',
-  itemSelected: 'HierarchicalMenu__item--selected',
-  itemParent: 'HierarchicalMenu__item--parent',
-  itemSelectedParent: 'HierarchicalMenu__item--selectedParent',
-  itemLink: 'HierarchicalMenu__item__link',
-  itemLabel: 'HierarchicalMenu__item__label',
-  itemCount: 'HierarchicalMenu__item__count',
-  itemChildren: 'HierarchicalMenu__item__children',
-  showMore: 'HierarchicalMenu__showMore'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   showMore: function showMore(extended) {
@@ -145,0 +156,0 @@ return extended ? 'Show less' : 'Show more';

src/widgets/Hits/connect.js

@@ -24,3 +24,12 @@ 'use strict';
      */
-    hitsPerPage: _react.PropTypes.number
+    hitsPerPage: _react.PropTypes.number,
+    /**
+     * Component used for rendering each hit from the
+     * results. If it is not provided the rendering defaults
+     * to displaying the hit in its JSON form.
+     *
+     * The component will be called with a `hit` prop.
+     * @public
+     */
+    itemComponent: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.func])
   },
@@ -27,0 +36,0 @@

src/widgets/Hits/Hits.js

@@ -17,2 +17,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -26,2 +30,11 @@
 
+var theme = {
+  code: '.ais-Hits__root {\n}',
+  classNames: {
+    root: 'ais-Hits__root'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var Hits = function (_Component) {
@@ -84,4 +97,2 @@ _inherits(Hits, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'Hits'
-})(Hits);
+exports.default = (0, _themeable2.default)(theme.classNames)(Hits);

src/widgets/HitsPerPage/HitsPerPage.js

@@ -21,2 +21,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,2 +34,14 @@
 
+var theme = {
+  code: '.ais-HitsPerPage__root {\n}\n\n.ais-HitsPerPage__item {\n}\n\n.ais-HitsPerPage__itemLink {\n}\n\n.ais-HitsPerPage__itemSelected {\n}',
+  classNames: {
+    root: 'ais-HitsPerPage__root',
+    item: 'ais-HitsPerPage__item',
+    itemLink: 'ais-HitsPerPage__itemLink',
+    itemSelected: 'ais-HitsPerPage__itemSelected'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var HitsPerPage = function (_Component) {
@@ -90,7 +106,2 @@ _inherits(HitsPerPage, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'HitsPerPage',
-  item: 'HitsPerPage__item',
-  itemLink: 'HitsPerPage__item__link',
-  itemSelected: 'HitsPerPage__item--selected'
-})(HitsPerPage);
+exports.default = (0, _themeable2.default)(theme.classNames)(HitsPerPage);

src/widgets/HitsPerPage/HitsPerPageSelect.js

@@ -21,2 +21,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,2 +34,11 @@
 
+var theme = {
+  code: '.ais-HitsPerPageSelect__root {\n}',
+  classNames: {
+    root: 'ais-HitsPerPageSelect__root'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var HitsPerPageSelect = function (_Component) {
@@ -74,3 +87,3 @@ _inherits(HitsPerPageSelect, _Component);
    */
-  items: _react.PropTypes.oneOfType([_react.PropTypes.arrayOf(_react.PropTypes.shape({
+  items: _react.PropTypes.arrayOf(_react.PropTypes.shape({
     /**
@@ -85,6 +98,4 @@ * Number of hits to display.
     label: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number])
-  })), _react.PropTypes.arrayOf(_react.PropTypes.number)])
+  }))
 };
-exports.default = (0, _themeable2.default)({
-  root: 'HitsPerPageSelect'
-})(HitsPerPageSelect);
+exports.default = (0, _themeable2.default)(theme.classNames)(HitsPerPageSelect);

src/widgets/Menu/Menu.js

@@ -35,2 +35,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -44,2 +48,18 @@
 
+var theme = {
+  code: '.ais-Menu__root {\n}\n\n.ais-Menu__items {\n}\n\n.ais-Menu__item {\n}\n\n.ais-Menu__itemSelected {\n}\n\n.ais-Menu__itemLink {\n}\n\n.ais-Menu__itemLabel {\n}\n\n.ais-Menu__itemCount {\n}\n\n.ais-Menu__showMore {\n}',
+  classNames: {
+    root: 'ais-Menu__root',
+    items: 'ais-Menu__items',
+    item: 'ais-Menu__item',
+    itemSelected: 'ais-Menu__itemSelected',
+    itemLink: 'ais-Menu__itemLink',
+    itemLabel: 'ais-Menu__itemLabel',
+    itemCount: 'ais-Menu__itemCount',
+    showMore: 'ais-Menu__showMore'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var Menu = function (_Component) {
@@ -115,12 +135,3 @@ _inherits(Menu, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'Menu',
-  items: 'Menu__items',
-  item: 'Menu__item',
-  itemSelected: 'Menu__item--selected',
-  itemLink: 'Menu__item__link',
-  itemLabel: 'Menu__item__value',
-  itemCount: 'Menu__item__count',
-  showMore: 'Menu__showMore'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   showMore: function showMore(extended) {
@@ -127,0 +138,0 @@ return extended ? 'Show less' : 'Show more';

src/widgets/Menu/MenuSelect.js

@@ -25,2 +25,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -34,2 +38,11 @@
 
+var theme = {
+  code: '.ais-MenuSelect__root {\n}',
+  classNames: {
+    root: 'ais-MenuSelect__root'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var MenuSelect = function (_Component) {
@@ -82,5 +95,3 @@ _inherits(MenuSelect, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'MenuSelect'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   none: 'None',
@@ -87,0 +98,0 @@ count: function count(_count) {

src/widgets/MultiRange/MultiRange.js

@@ -23,2 +23,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -32,2 +36,16 @@
 
+var theme = {
+  code: '.ais-MultiRange__root {\n}\n\n.ais-MultiRange__items {\n}\n\n.ais-MultiRange__item {\n}\n\n.ais-MultiRange__itemSelected {\n}\n\n.ais-MultiRange__itemLabel {\n}\n\n.ais-MultiRange__itemRadio {\n}',
+  classNames: {
+    root: 'ais-MultiRange__root',
+    items: 'ais-MultiRange__items',
+    item: 'ais-MultiRange__item',
+    itemSelected: 'ais-MultiRange__itemSelected',
+    itemLabel: 'ais-MultiRange__itemLabel',
+    itemRadio: 'ais-MultiRange__itemRadio'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var MultiRange = function (_Component) {
@@ -101,9 +119,2 @@ _inherits(MultiRange, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'MultiRange',
-  items: 'MultiRange__items',
-  item: 'MultiRange__item',
-  itemSelected: 'MultiRange__item--selected',
-  itemLabel: 'MultiRange__item__label',
-  itemRadio: 'MultiRange__item__radio'
-})(MultiRange);
+exports.default = (0, _themeable2.default)(theme.classNames)(MultiRange);

src/widgets/Pagination/connect.js

@@ -11,2 +11,4 @@ 'use strict';
 
+var _lodash = require('lodash');
+
 var _createConnector = require('../../core/createConnector');
@@ -61,2 +63,7 @@
   transitionState: function transitionState(props, prevState, nextState) {
+    if (nextState[props.id] && nextState[props.id].isSamePage) {
+      return _extends({}, nextState, _defineProperty({}, props.id, prevState[props.id]));
+    } else if (prevState[props.id] === nextState[props.id]) {
+      return (0, _lodash.omit)(nextState, props.id);
+    }
     return nextState;
@@ -63,0 +70,0 @@ },

src/widgets/Pagination/Pagination.js

@@ -33,2 +33,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -44,2 +48,20 @@
 
+var theme = {
+  code: '.ais-Pagination__root{\n}\n\n.ais-Pagination__item {\n  display: inline-block;\n  padding: 3px;\n}\n\n.ais-Pagination__itemSelected a {\n  color: #000000;\n  font-weight: bold;\n}\n\n.ais-Pagination__itemDisabled {\n  visibility: visible;\n}\n\n.ais-Pagination__itemDisabled a {\n  color: #bbbbbb;\n}\n\n.ais-Pagination__itemDisabled a:hover {\n  cursor: default;\n  text-decoration: none;\n}\n\n.ais-Pagination__itemFirst {\n}\n\n.ais-Pagination__itemLast {\n}\n\n.ais-Pagination__itemPrevious {\n}\n\n.ais-Pagination__itemNext {\n}\n\n.ais-Pagination__itemPage {\n}\n\n.ais-Pagination__itemLink {\n}\n\n\n\n',
+  classNames: {
+    root: 'ais-Pagination__root',
+    item: 'ais-Pagination__item',
+    itemSelected: 'ais-Pagination__itemSelected',
+    itemDisabled: 'ais-Pagination__itemDisabled',
+    itemFirst: 'ais-Pagination__itemFirst',
+    itemLast: 'ais-Pagination__itemLast',
+    itemPrevious: 'ais-Pagination__itemPrevious',
+    itemNext: 'ais-Pagination__itemNext',
+    itemPage: 'ais-Pagination__itemPage',
+    itemLink: 'ais-Pagination__itemLink'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 function getPagesDisplayedCount(padding, total) {
@@ -74,15 +96,2 @@ return Math.min(2 * padding + 1, total);
 
-var ThemedLinkList = (0, _themeable2.default)({
-  root: 'Pagination',
-  item: 'Pagination__item',
-  itemFirst: 'Pagination__item--first',
-  itemLast: 'Pagination__item--last',
-  itemPrevious: 'Pagination__item--previous',
-  itemNext: 'Pagination__item--next',
-  itemPage: 'Pagination__item--page',
-  itemSelected: 'Pagination__item--selected',
-  itemDisabled: 'Pagination__item--disabled',
-  itemLink: 'Pagination__item__link'
-})(_LinkList2.default);
-
 var Pagination = function (_Component) {
@@ -157,2 +166,10 @@ _inherits(Pagination, _Component);
       }
+
+      var samePage = {
+        valueOf: function valueOf() {
+          return page;
+        },
+        isSamePage: true
+      };
+
       items = items.concat(getPages(page, totalPages, pagesPadding).map(function (value) {
@@ -163,3 +180,3 @@ return {
           label: translate('page', value),
-          value: value,
+          value: value === page ? samePage : value,
           ariaLabel: translate('ariaPage', value)
@@ -247,3 +264,3 @@ };
 Pagination.defaultProps = {
-  listComponent: ThemedLinkList,
+  listComponent: _LinkList2.default,
   showFirst: true,
@@ -256,3 +273,3 @@ showPrevious: true,
 };
-exports.default = (0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   previous: '‹',
@@ -272,2 +289,2 @@ next: '›',
   }
-})(Pagination);
+})(Pagination));

src/widgets/Pagination/PaginationSelect.js

@@ -27,4 +27,17 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+var theme = {
+  code: '.ais-PaginationSelect__root {\n}',
+  classNames: {
+    root: 'ais-PaginationSelect__root'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 function PaginationSelect(props) {
@@ -44,4 +57,2 @@ return _react2.default.createElement(_Pagination2.default, _extends({}, props, {
 
-exports.default = (0, _themeable2.default)({
-  root: 'PaginationSelect'
-})(PaginationSelect);
+exports.default = (0, _themeable2.default)(theme.classNames)(PaginationSelect);

src/widgets/Range/Range.js

@@ -25,2 +25,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -34,2 +38,22 @@
 
+var theme = {
+  code: '.ais-Range__root {\n  position: relative;\n  display: flex;\n  align-items: center;\n  height: 4px;\n  margin: 40px 0px;\n}\n\n.ais-Range__handles {\n  position: absolute;\n  top: 50%;\n  left: 0px;\n  right: 0px;\n}\n\n.ais-Range__handle {\n  position: absolute;\n  top: 0px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 0px;\n  height: 0px;\n}\n\n.ais-Range__handle > .ais-Range__handleDot {\n  background-color: #3E82F7;\n  width: 10px;\n  height: 10px;\n  border-radius: 5px;\n  flex-shrink: 0;\n  transition: transform 0.1s ease;\n}\n\n.ais-Range__handle:hover > .ais-Range__handleDot,\n.ais-Range__handle_active > .ais-Range__handleDot {\n  transform: scale(2);\n}\n\n.ais-Range__handleTooltip {\n  font-size: 0.8em;\n  padding: 0.3em 0.5em;\n  border-radius: 0.3em;\n  position: absolute;\n  top: -40px;\n  background-color: rgba(0, 0, 0, 0.6);\n  color: white;\n  opacity: 0;\n  transition: opacity 0.1s ease;\n  pointer-events: none;\n}\n\n.ais-Range__handle:hover > .ais-Range__handleTooltip,\n.ais-Range__handle_active > .ais-Range__handleTooltip {\n  opacity: 1;\n}\n\n.ais-Range__tracks {\n  width: 100%;\n  height: 4px;\n  display: flex;\n}\n\n.ais-Range__track {\n  height: 100%;\n  background: rgba(0, 0, 0, 0.15);\n}\n\n.ais-Range__track:first-child {\n  border-top-left-radius: 2px;\n  border-bottom-left-radius: 2px;\n}\n\n.ais-Range__track:last-child {\n  border-top-right-radius: 2px;\n  border-bottom-right-radius: 2px;\n}\n\n.ais-Range__track:nth-child(2) {\n  background-color: #3E82F7;\n}\n\n.ais-Range__bounds {\n  position: absolute;\n  top: 100%;\n  left: 0px;\n  right: 0px;\n}\n\n.ais-Range__bound {\n  position: absolute;\n  top: 0.6em;\n  color: rgba(0, 0, 0, 0.6);\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  font-size: 0.8em;\n  width: 0px;\n  height: 0px;\n}\n\n.ais-Range__boundMin {\n  left: 0px;\n}\n\n.ais-Range__boundMax {\n  right: 0px;\n}\n',
+  classNames: {
+    root: 'ais-Range__root',
+    handles: 'ais-Range__handles',
+    handle: 'ais-Range__handle',
+    handleDot: 'ais-Range__handleDot',
+    handle_active: 'ais-Range__handle_active',
+    handleTooltip: 'ais-Range__handleTooltip',
+    tracks: 'ais-Range__tracks',
+    track: 'ais-Range__track',
+    bounds: 'ais-Range__bounds',
+    bound: 'ais-Range__bound',
+    boundMin: 'ais-Range__boundMin',
+    boundMax: 'ais-Range__boundMax'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var Range = function (_Component) {
@@ -118,16 +142,3 @@ _inherits(Range, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'Range',
-  handles: 'Range__handles',
-  handle: 'Range__handle',
-  handleActive: 'Range__handle--active',
-  handleDot: 'Range__handle__dot',
-  handleTooltip: 'Range__handle__tooltip',
-  tracks: 'Range__tracks',
-  track: 'Range__track',
-  bounds: 'Range__bounds',
-  bound: 'Range__bound',
-  boundMin: 'Range__bound--min',
-  boundMax: 'Range__bound--max'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   value: function value(v) {
@@ -134,0 +145,0 @@ return v.toLocaleString();

src/widgets/Range/RangeInput.js

@@ -25,2 +25,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -34,2 +38,17 @@
 
+var theme = {
+  code: '.ais-RangeInput__root {\n}\n\n.ais-RangeInput__labelMin {\n}\n\n.ais-RangeInput__inputMin {\n}\n\n.ais-RangeInput__labelMax {\n}\n\n.ais-RangeInput__inputMax {\n}\n\n.ais-RangeInput__submit {\n}\n\n.ais-RangeInput__separator {\n}\n',
+  classNames: {
+    root: 'ais-RangeInput__root',
+    labelMin: 'ais-RangeInput__labelMin',
+    inputMin: 'ais-RangeInput__inputMin',
+    labelMax: 'ais-RangeInput__labelMax',
+    inputMax: 'ais-RangeInput__inputMax',
+    submit: 'ais-RangeInput__submit',
+    separator: 'ais-RangeInput__separator'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var RangeInput = function (_Component) {
@@ -118,13 +137,5 @@ _inherits(RangeInput, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'RangeInput',
-  labelMin: 'RangeInput__labelMin',
-  inputMin: 'RangeInput__labelMin__input',
-  labelMax: 'RangeInput__labelMax',
-  inputMax: 'RangeInput__labelMax__input',
-  submit: 'RangeInput__submit',
-  separator: 'RangeInput__separator'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   submit: 'go',
   separator: 'to'
 })(RangeInput));

src/widgets/Range/RangeRatings.js

@@ -23,2 +23,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -32,2 +36,18 @@
 
+var theme = {
+  code: '.ais-RangeRatings__root {\n  display: flex;\n  flex-direction: column;\n}\n\n.ais-RangeRatings__ratingLink > .ais-RangeRatings__ratingIcon:before {\n  content: \'\\2605\';\n  color: #FBAE00;\n}\n\n.ais-RangeRatings__ratingLink > .ais-RangeRatings__ratingIconEmpty:before {\n  content: \'\\2606\';\n  color: #FBAE00;\n}\n\n.ais-RangeRatings__ratingLinkSelected{\n  font-weight: 700;\n}\n\n.ais-RangeRatings__ratingLinkDisabled > .ais-RangeRatings__ratingCount{\n  display:none;\n}\n\n.ais-RangeRatings__ratingLinkDisabled > .ais-RangeRatings__ratingIconEmpty:before{\n  color: #C9C9C9;\n}\n\n.ais-RangeRatings__ratingLinkDisabled > .ais-RangeRatings__ratingIcon:before{\n  color: #C9C9C9;\n}\n\n.ais-RangeRatings__ratingLabel {\n}',
+  classNames: {
+    root: 'ais-RangeRatings__root',
+    ratingLink: 'ais-RangeRatings__ratingLink',
+    ratingIcon: 'ais-RangeRatings__ratingIcon',
+    ratingIconEmpty: 'ais-RangeRatings__ratingIconEmpty',
+    ratingLinkSelected: 'ais-RangeRatings__ratingLinkSelected',
+    ratingLinkDisabled: 'ais-RangeRatings__ratingLinkDisabled',
+    ratingCount: 'ais-RangeRatings__ratingCount',
+    ratingLabel: 'ais-RangeRatings__ratingLabel'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var RangeRatings = function (_Component) {
@@ -61,7 +81,8 @@ _inherits(RangeRatings, _Component);
       var translate = _ref.translate;
+      var createURL = _ref.createURL;
 
       var icons = [];
       for (var icon = 0; icon < max; icon++) {
-        var theme = icon >= lowerBound ? 'ratingIconEmpty' : 'ratingIcon';
-        icons.push(_react2.default.createElement('span', _extends({}, applyTheme(theme, theme), { key: icon })));
+        var iconTheme = icon >= lowerBound ? 'ratingIconEmpty' : 'ratingIcon';
+        icons.push(_react2.default.createElement('span', _extends({}, applyTheme(iconTheme, iconTheme), { key: icon })));
       }
@@ -76,3 +97,4 @@
           key: lowerBound,
-          onClick: this.onClick.bind(this, lowerBound, max)
+          onClick: this.onClick.bind(this, lowerBound, max),
+          href: createURL({ lowerBound: lowerBound, max: max })
         }),
@@ -106,2 +128,3 @@ icons,
       var count = _props.count;
+      var createURL = _props.createURL;
 
@@ -121,3 +144,4 @@ var items = [];
           applyTheme: applyTheme,
-          translate: translate
+          translate: translate,
+          createURL: createURL
         }));
@@ -144,2 +168,3 @@ };
   refine: _react.PropTypes.func.isRequired,
+  createURL: _react.PropTypes.func.isRequired,
   min: _react.PropTypes.number.isRequired,
@@ -156,13 +181,4 @@ max: _react.PropTypes.number.isRequired,
 };
-exports.default = (0, _themeable2.default)({
-  root: 'RangeRatings',
-  ratingLink: 'RangeRatings__link',
-  ratingLinkSelected: 'RangeRatings__link--selected',
-  ratingLinkDisabled: 'RangeRatings__link--disabled',
-  ratingIcon: 'RangeRatings__link__icon',
-  ratingIconEmpty: 'RangeRatings__link__icon--empty',
-  ratingLabel: 'RangeRatings__link__label',
-  ratingCount: 'RangeRatings__link__count'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   ratingLabel: ' & Up'
 })(RangeRatings));

src/widgets/RefinementList/RefinementList.js

@@ -31,2 +31,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -40,2 +44,16 @@
 
+var theme = {
+  code: '.ais-RefinementList__root {\n}\n\n.ais-RefinementList__item {\n}\n\n.ais-RefinementList__item {\n}\n\n.ais-RefinementList__itemSelected {\n}\n\n.ais-RefinementList__itemLabel {\n}\n\n.ais-RefinementList__itemCount {\n}\n\n.ais-RefinementList__showMore {\n}',
+  classNames: {
+    root: 'ais-RefinementList__root',
+    item: 'ais-RefinementList__item',
+    itemSelected: 'ais-RefinementList__itemSelected',
+    itemLabel: 'ais-RefinementList__itemLabel',
+    itemCount: 'ais-RefinementList__itemCount',
+    showMore: 'ais-RefinementList__showMore'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var RefinementList = function (_Component) {
@@ -121,11 +139,3 @@ _inherits(RefinementList, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'RefinementList',
-  items: 'RefinementList__items',
-  item: 'RefinementList__item',
-  itemSelected: 'RefinementList__item--selected',
-  itemLabel: 'RefinementList__item__label',
-  itemCount: 'RefinementList__item__count',
-  showMore: 'RefinementList__showMore'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   showMore: function showMore(extended) {
@@ -132,0 +142,0 @@ return extended ? 'Show less' : 'Show more';

src/widgets/RefinementList/RefinementListLinks.js

@@ -35,2 +35,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -44,2 +48,17 @@
 
+var theme = {
+  code: '.ais-RefinementListLinks__root {\n}\n\n.ais-RefinementListLinks__items {\n}\n\n.ais-RefinementListLinks__item {\n}\n\n.ais-RefinementListLinks__itemSelected {\n}\n\n.ais-RefinementListLinks__itemLink {\n}\n\n.ais-RefinementListLinks__itemLabel {\n}\n\n.ais-RefinementListLinks__itemCount {\n}',
+  classNames: {
+    root: 'ais-RefinementListLinks__root',
+    items: 'ais-RefinementListLinks__items',
+    item: 'ais-RefinementListLinks__item',
+    itemSelected: 'ais-RefinementListLinks__itemSelected',
+    itemLink: 'ais-RefinementListLinks__itemLink',
+    itemLabel: 'ais-RefinementListLinks__itemLabel',
+    itemCount: 'ais-RefinementListLinks__itemCount'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var RefinementListLinks = function (_Component) {
@@ -124,11 +143,3 @@ _inherits(RefinementListLinks, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'RefinementListLinks',
-  items: 'RefinementListLinks__items',
-  item: 'RefinementListLinks__item',
-  itemSelected: 'RefinementListLinks__item--selected',
-  itemLink: 'RefinementListLinks__item__link',
-  itemLabel: 'RefinementListLinks__item__label',
-  itemCount: 'RefinementListLinks__item__count'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   showMore: function showMore(extended) {
@@ -135,0 +146,0 @@ return extended ? 'Show less' : 'Show more';

src/widgets/SearchBox/SearchBox.js

@@ -23,2 +23,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -32,2 +36,37 @@
 
+var theme = {
+  code: '.ais-SearchBox__root {\n  display: inline-block;\n  position: relative;\n  width: 500px;\n  height: 41px;\n  white-space: nowrap;\n  box-sizing: border-box;\n  font-size: 14px;\n}\n\n.ais-SearchBox__wrapper {\n  width: 100%;\n  height: 100%;\n}\n\n.ais-SearchBox__input {\n  display: inline-block;\n  transition: box-shadow .4s ease, background .4s ease;\n  border: 0;\n  border-radius: 4px;\n  box-shadow: inset 0 0 0 1px #CCCCCC;\n  background: #FFFFFF;\n  padding: 0;\n  padding-right: 77px;\n  padding-left: 11px;\n  width: 100%;\n  height: 100%;\n  vertical-align: middle;\n  white-space: normal;\n  font-size: inherit;\n  appearance: none;\n}\n\n.ais-SearchBox__input::-webkit-search-decoration, .ais-SearchBox__input::-webkit-search-cancel-button, .ais-SearchBox__input::-webkit-search-results-button, .ais-SearchBox__input::-webkit-search-results-decoration {\n  display: none;\n}\n\n.ais-SearchBox__input:hover {\n  box-shadow: inset 0 0 0 1px #b3b3b3;\n}\n\n.ais-SearchBox__input:focus, .ais-SearchBox__input:active {\n  outline: 0;\n  box-shadow: inset 0 0 0 1px #3E82F7;\n  background: #FFFFFF;\n}\n\n.ais-SearchBox__input::placeholder {\n  color: #AAAAAA;\n}\n\n.ais-SearchBox__submit {\n  position: absolute;\n  top: 0;\n  right: 0;\n  left: inherit;\n  margin: 0;\n  border: 0;\n  border-radius: 0 3px 3px 0;\n  background-color: #3e82f7;\n  padding: 0;\n  width: 49px;\n  height: 100%;\n  vertical-align: middle;\n  text-align: center;\n  font-size: inherit;\n  user-select: none;\n}\n\n.ais-SearchBox__submit svg {\n  width: 21px;\n  height: 21px;\n  vertical-align: middle;\n  fill: #FFFFFF;\n}\n\n.ais-SearchBox__submit::before {\n  display: inline-block;\n  margin-right: -4px;\n  height: 100%;\n  vertical-align: middle;\n  content: \'\';\n}\n\n.ais-SearchBox__reset {\n  display: none;\n  position: absolute;\n  top: 10px;\n  right: 56px;\n  margin: 0;\n  border: 0;\n  background: none;\n  cursor: pointer;\n  padding: 0;\n  font-size: inherit;\n  user-select: none;\n  fill: rgba(0, 0, 0, 0.5);\n}\n\n.ais-SearchBox__reset svg {\n  display: block;\n  margin: 4px;\n  width: 13px;\n  height: 13px;\n}\n.ais-SearchBox__input:valid ~ .ais-SearchBox__reset {\n  display: block;\n  animation-name: ais-SearchBox__sbx-reset-in;\n  animation-duration: .15s;\n}\n\n@keyframes ais-SearchBox__sbx-reset-in {\n  0% {\n    transform: translate3d(-20%, 0, 0);\n    opacity: 0;\n  }\n  100% {\n    transform: none;\n    opacity: 1;\n  }\n}',
+  classNames: {
+    root: 'ais-SearchBox__root',
+    wrapper: 'ais-SearchBox__wrapper',
+    input: 'ais-SearchBox__input',
+    submit: 'ais-SearchBox__submit',
+    reset: 'ais-SearchBox__reset'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
+/* eslint-disable max-len */
+var SubmitIcon = function SubmitIcon() {
+  return _react2.default.createElement(
+    'svg',
+    { xmlns: 'http://www.w3.org/2000/svg', id: 'ris-search-icon', viewBox: '0 0 40 40' },
+    _react2.default.createElement('path', {
+      d: 'M15.553 31.106c8.59 0 15.553-6.963 15.553-15.553S24.143 0 15.553 0 0 6.963 0 15.553s6.963 15.553 15.553 15.553zm0-3.888c6.443 0 11.665-5.222 11.665-11.665 0-6.442-5.222-11.665-11.665-11.665-6.442 0-11.665 5.223-11.665 11.665 0 6.443 5.223 11.665 11.665 11.665zM27.76 31.06c-.78-.78-.778-2.05.004-2.833l.463-.463c.783-.783 2.057-.78 2.834-.003l8.168 8.17c.782.78.78 2.05-.003 2.832l-.463.463c-.783.783-2.057.78-2.833.003l-8.17-8.167z',
+      fillRule: 'evenodd' })
+  );
+};
+
+var ResetIcon = function ResetIcon() {
+  return _react2.default.createElement(
+    'svg',
+    { xmlns: 'http://www.w3.org/2000/svg', id: 'ris-clear-icon', viewBox: '0 0 20 20' },
+    _react2.default.createElement('path', {
+      d: 'M9.408 10L.296.888 0 .592.592 0l.296.296L10 9.408 19.112.296 19.408 0 20 .592l-.296.296L10.592 10l9.112 9.112.296.296-.592.592-.296-.296L10 10.592.888 19.704.592 20 0 19.408l.296-.296L9.408 10z',
+      fillRule: 'evenodd' })
+  );
+};
+/* eslint-enable max-len */
+
 var SearchBox = function (_Component) {
@@ -186,2 +225,3 @@ _inherits(SearchBox, _Component);
             }, applyTheme('submit', 'submit')),
+            _react2.default.createElement(SubmitIcon, null),
             translate('submit')
@@ -195,3 +235,4 @@ ),
             }, applyTheme('reset', 'reset')),
-            translate('reset')
+            translate('reset'),
+            _react2.default.createElement(ResetIcon, null)
           )
@@ -211,4 +252,2 @@ )
   translate: _react.PropTypes.func.isRequired,
-  // @TODO: implement
-  // poweredBy: PropTypes.bool,
 
@@ -242,3 +281,2 @@ /**
   query: '',
-  // poweredBy: false,
   focusShortcuts: ['s', '/'],
@@ -248,9 +286,3 @@ autoFocus: false,
 };
-exports.default = (0, _themeable2.default)({
-  root: 'SearchBox',
-  wrapper: 'SearchBox__wrapper',
-  input: 'SearchBox__input',
-  submit: 'SearchBox__submit',
-  reset: 'SearchBox__reset'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   submit: null,
@@ -257,0 +289,0 @@ reset: null,

src/widgets/SortBy/SortBy.js

@@ -21,2 +21,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,2 +34,11 @@
 
+var theme = {
+  code: '.ais-SortBy__root {\n}',
+  classNames: {
+    root: 'ais-SortBy__root'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var SortBy = function (_Component) {
@@ -93,4 +106,2 @@ _inherits(SortBy, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'SortBy'
-})(SortBy);
+exports.default = (0, _themeable2.default)(theme.classNames)(SortBy);

src/widgets/SortBy/SortByLinks.js

@@ -21,2 +21,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,2 +34,14 @@
 
+var theme = {
+  code: '.ais-SortByLinks__root {\n}\n\n.ais-SortByLinks__item {\n}\n\n.ais-SortByLinks__itemLink {\n}\n\n.ais-SortByLinks__itemSelected {\n}',
+  classNames: {
+    root: 'ais-SortByLinks__root',
+    item: 'ais-SortByLinks__item',
+    itemLink: 'ais-SortByLinks__itemLink',
+    itemSelected: 'ais-SortByLinks__itemSelected'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var SortByLinks = function (_Component) {
@@ -87,7 +103,2 @@ _inherits(SortByLinks, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'SortByLinks',
-  item: 'SortByLinks__item',
-  itemLink: 'SortByLinks__item__link',
-  itemSelected: 'SortByLinks__item--selected'
-})(SortByLinks);
+exports.default = (0, _themeable2.default)(theme.classNames)(SortByLinks);

src/widgets/Stats/Stats.js

@@ -21,2 +21,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,2 +34,11 @@
 
+var theme = {
+  code: '.ais-Stats__root {\n}',
+  classNames: {
+    root: 'ais-Stats__root'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var Stats = function (_Component) {
@@ -66,5 +79,3 @@ _inherits(Stats, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'Stats'
-})((0, _translatable2.default)({
+exports.default = (0, _themeable2.default)(theme.classNames)((0, _translatable2.default)({
   stats: function stats(n, ms) {
@@ -71,0 +82,0 @@ return n.toLocaleString() + ' results found in ' + ms.toLocaleString() + 'ms';

src/widgets/Toggle/Toggle.js

@@ -19,2 +19,6 @@ 'use strict';
 
+var _insertCss = require('insert-css');
+
+var _insertCss2 = _interopRequireDefault(_insertCss);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -28,2 +32,13 @@
 
+var theme = {
+  code: '.ais-Toggle__root {\n}\n\n.ais-Toggle__checkbox {\n}\n\n.ais-Toggle__label {\n}',
+  classNames: {
+    root: 'ais-Toggle__root',
+    checkbox: 'ais-Toggle__checkbox',
+    label: 'ais-Toggle__label'
+  }
+};
+
+(0, _insertCss2.default)(theme.code, { prepend: true });
+
 var Toggle = function (_Component) {
@@ -83,6 +98,2 @@ _inherits(Toggle, _Component);
 };
-exports.default = (0, _themeable2.default)({
-  root: 'Toggle',
-  checkbox: 'Toggle__checkbox',
-  label: 'Toggle__label'
-})(Toggle);
+exports.default = (0, _themeable2.default)(theme.classNames)(Toggle);

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

255825

increased by8.25%

Dev dependency count

0

decreased by-100%

Number of package files

83

increased by2.47%

Lines of code

5463

increased by6.06%

Worsened metrics

Dependency count

10

increased by11.11%

Number of low supply chain risk alerts

3

increased by200%

Dependency changes

• + Addedinsert-css@1.0.0

• + Addedinsert-css@1.0.0(transitive)