react-select-async-paginate - npm Package Compare versions

Comparing version 0.2.6 to 0.2.7

CHANGELOG.md

@@ -0,1 +1,14 @@
+## 0.2.7 (23 jan 2019)
+
+### New features
+
+- Added `reduceOptions` prop for reduce grouped options from different groups into one.
+- Added `reduceGroupedOptions` util.
+
+## 0.2.6 (15 jan 2019)
+
+### New features
+
+- Added `shouldLoadMore` prop.
+
 ## 0.2.5 (11 jan 2019)
@@ -2,0 +15,0 @@

es/async-paginate.js

@@ -16,2 +16,3 @@ import _extends from "@babel/runtime/helpers/extends";
 import defaultShouldLoadMore from './default-should-load-more';
+import defaultReduceOptions from './default-reduce-options';
 import wrapMenuList from './wrap-menu-list';
@@ -197,3 +198,3 @@ export var MenuList = wrapMenuList(defaultComponents.MenuList);
       _regeneratorRuntime.mark(function _callee4() {
-        var _this$state2, search, optionsCache, currentOptions, debounceTimeout, newSearch, hasError, additional, options, hasMore, _loadOptions2, response;
+        var _this$state2, search, optionsCache, currentOptions, debounceTimeout, newSearch, hasError, additional, options, hasMore, _loadOptions2, response, newAdditional, reduceOptions;
 
@@ -282,15 +283,17 @@ return _regeneratorRuntime.wrap(function _callee4$(_context4) {
               case 30:
-                _context4.next = 34;
+                _context4.next = 36;
                 break;
 
               case 32:
-                _context4.next = 34;
+                newAdditional = typeof additional === 'undefined' ? null : additional;
+                reduceOptions = this.props.reduceOptions;
+                _context4.next = 36;
                 return this.setState(function (prevState) {
                   return {
                     optionsCache: _objectSpread({}, prevState.optionsCache, _defineProperty({}, search, _objectSpread({}, currentOptions, {
-                      options: currentOptions.options.concat(options),
+                      options: reduceOptions(currentOptions.options, options, newAdditional),
                       hasMore: !!hasMore,
                       isLoading: false,
                       isFirstLoad: false,
-                      additional: typeof additional === 'undefined' ? null : additional
+                      additional: newAdditional
                     })))
@@ -300,3 +303,3 @@ };
 
-              case 34:
+              case 36:
               case "end":
@@ -355,2 +358,3 @@ return _context4.stop();
   additional: PropTypes.any,
+  reduceOptions: PropTypes.func,
   components: PropTypes.objectOf(PropTypes.func),
@@ -367,2 +371,3 @@ // eslint-disable-next-line react/forbid-prop-types
   additional: null,
+  reduceOptions: defaultReduceOptions,
   components: {},
@@ -369,0 +374,0 @@ cacheUniq: null,

es/index.js

 export { default } from './async-paginate';
-export { default as wrapMenuList } from './wrap-menu-list';
+export { default as wrapMenuList } from './wrap-menu-list';
+export { default as reduceGroupedOptions } from './reduce-grouped-options';

lib/async-paginate.js

@@ -42,2 +42,4 @@ "use strict";
 
+var _defaultReduceOptions = _interopRequireDefault(require("./default-reduce-options"));
+
 var _wrapMenuList = _interopRequireDefault(require("./wrap-menu-list"));
@@ -219,3 +221,3 @@
       _regenerator.default.mark(function _callee4() {
-        var _this$state2, search, optionsCache, currentOptions, debounceTimeout, newSearch, hasError, additional, options, hasMore, _loadOptions2, response;
+        var _this$state2, search, optionsCache, currentOptions, debounceTimeout, newSearch, hasError, additional, options, hasMore, _loadOptions2, response, newAdditional, reduceOptions;
 
@@ -304,15 +306,17 @@ return _regenerator.default.wrap(function _callee4$(_context4) {
               case 30:
-                _context4.next = 34;
+                _context4.next = 36;
                 break;
 
               case 32:
-                _context4.next = 34;
+                newAdditional = typeof additional === 'undefined' ? null : additional;
+                reduceOptions = this.props.reduceOptions;
+                _context4.next = 36;
                 return this.setState(function (prevState) {
                   return {
                     optionsCache: (0, _objectSpread5.default)({}, prevState.optionsCache, (0, _defineProperty2.default)({}, search, (0, _objectSpread5.default)({}, currentOptions, {
-                      options: currentOptions.options.concat(options),
+                      options: reduceOptions(currentOptions.options, options, newAdditional),
                       hasMore: !!hasMore,
                       isLoading: false,
                       isFirstLoad: false,
-                      additional: typeof additional === 'undefined' ? null : additional
+                      additional: newAdditional
                     })))
@@ -322,3 +326,3 @@ };
 
-              case 34:
+              case 36:
               case "end":
@@ -376,2 +380,3 @@ return _context4.stop();
   additional: _propTypes.default.any,
+  reduceOptions: _propTypes.default.func,
   components: _propTypes.default.objectOf(_propTypes.default.func),
@@ -387,2 +392,3 @@ // eslint-disable-next-line react/forbid-prop-types
   additional: null,
+  reduceOptions: _defaultReduceOptions.default,
   components: {},
@@ -389,0 +395,0 @@ cacheUniq: null,

lib/index.js

@@ -20,5 +20,13 @@ "use strict";
 });
+Object.defineProperty(exports, "reduceGroupedOptions", {
+  enumerable: true,
+  get: function get() {
+    return _reduceGroupedOptions.default;
+  }
+});
 
 var _asyncPaginate = _interopRequireDefault(require("./async-paginate"));
 
-var _wrapMenuList = _interopRequireDefault(require("./wrap-menu-list"));
+var _wrapMenuList = _interopRequireDefault(require("./wrap-menu-list"));
+
+var _reduceGroupedOptions = _interopRequireDefault(require("./reduce-grouped-options"));

package.json

 {
   "name": "react-select-async-paginate",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "description": "Wrapper above react-select that supports pagination on menu scroll",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -16,2 +16,4 @@ [![NPM](https://img.shields.io/npm/v/react-select-async-paginate.svg)](https://www.npmjs.com/package/react-select-async-paginate)
 - [Request by page number](https://codesandbox.io/s/10r1k12vk7)
+- [Customization check of the need of load options](https://codesandbox.io/s/kokz6j65zv)
+- [Grouped options](https://codesandbox.io/s/oxv62x8j4y)
 
@@ -84,2 +86,12 @@ ## Versions
 
+### reduceOptions
+
+Not required. Function. Be default new loaded options are concatted with previous. Arguments:
+
+- previous options
+- loaded options
+- next additional
+
+Should return new options.
+
 ### cacheUniq
@@ -170,2 +182,41 @@
 
+## Grouped options
+
+You can use `reduceGroupedOptions` util to group options by `label` key.
+
+```
+import AsyncPaginate, { reduceGroupedOptions } from 'react-select-async-paginate';
+
+/*
+ * assuming the API returns something like this:
+ *   const json = {
+ *     optioms: [
+ *       label: 'Cars',
+ *       options: [
+ *         {
+ *           value: 1,
+ *           label: 'Audi',
+ *         },
+ *         {
+ *           value: 2,
+ *           label: 'Mercedes',
+ *         },
+ *         {
+ *           value: 3,
+ *           label: 'BMW',
+ *         },
+ *       ]
+ *     ],
+ *     hasMore: true,
+ *   };
+ */
+
+...
+
+<AsyncPaginate
+  {...otherProps}
+  reduceOptions={reduceGroupedOptions}
+/>
+```
+
 ## Replacing Components
@@ -172,0 +223,0 @@

No alert changes

Improved metrics

Total package byte prevSize

195340

increased by2.67%

Number of package files

39

increased by11.43%

Lines of code

1796

increased by5.34%

Number of lines in readme file

238

increased by27.27%

No dependency changes