data-feed - npm Package Compare versions

Comparing version 0.0.27 to 0.0.28

dist/feed/index.d.ts

 import React from 'react';
 import { FeedFilterValues, FeedSortOption, FeedButonProps, RenderSortOptionProps, FeedFieldProps } from '../interfaces';
 import './index.scss';
-export interface DataFeedProps {
-    data?: any[];
+export interface DataFeedProps<T> {
+    data?: T[];
     all?: number;
-    renderItem: (item: any) => React.ReactNode;
+    renderItem: (item: T) => React.ReactNode;
     sortOptions?: FeedSortOption[];
@@ -24,2 +24,2 @@ onChange: (options: FeedFilterValues) => void;
 }
-export declare const DataFeed: React.FC<DataFeedProps>;
+export declare function DataFeed<T = any>({ data, all, onChange, sortOptions, filterFields, renderItem, filterClassName, renderSortOption, showTotal, renderSearch, renderCleanButton, texts: initialTexts, searchField, sortNameField, sortModeField, renderFilterField, }: DataFeedProps<T>): JSX.Element;

dist/index.esm.js

 import React, { useState, useCallback, useEffect } from 'react';
 import classNames from 'classnames';
-import { debounce } from 'lodash';
 import { useForm, FormContext, useFormContext } from 'react-hook-form';
 import equal from 'deep-equal';
+import { debounce } from 'lodash';
 
@@ -131,5 +131,2 @@ /*! *****************************************************************************
 
-var debounceChange = debounce(function (callback) {
-    callback();
-}, 500);
 function getDefaultValues(fields) {
@@ -171,9 +168,10 @@ var result = {};
     var handleClean = useCallback(function () {
-        // reset()
-        // reset(defaultValues);
-        Object.keys(defaultValues).forEach(function (name) {
-            setFormValue(name, defaultValues[name]);
-        });
-    }, [defaultValues]);
+        reset(getDefaultValues(fields));
+    }, [fields]);
+    var handleChange = useCallback(function () {
+        handleDebounce();
+    }, [fields]);
     var handleDebounce = useCallback(function () {
+        var values = getValues();
+        onChange(values, sort);
         setCleanDisabled(equal(values, defaultValues));
@@ -190,4 +188,3 @@ onChange(convertValues(values, fields), sort);
         if (defaultValues) {
-            // console.log('handleDebounce', defaultValues);
-            debounceChange(handleDebounce);
+            handleDebounce();
         }
@@ -273,12 +270,17 @@ }, [defaultValues, values, sort]);
 
-var DataFeed = function (_a) {
+function DataFeed(_a) {
     var data = _a.data, all = _a.all, onChange = _a.onChange, sortOptions = _a.sortOptions, filterFields = _a.filterFields, renderItem = _a.renderItem, filterClassName = _a.filterClassName, renderSortOption = _a.renderSortOption, showTotal = _a.showTotal, renderSearch = _a.renderSearch, renderCleanButton = _a.renderCleanButton, initialTexts = _a.texts, searchField = _a.searchField, sortNameField = _a.sortNameField, sortModeField = _a.sortModeField, renderFilterField = _a.renderFilterField;
     var showLoad = data && all && data.length > 0 && data.length < all;
-    var _b = useState(0), skip = _b[0], setSkip = _b[1];
+    var _b = useState({ skip: 0 }), changeParams = _b[0], setChangeParams = _b[1];
     var texts = initialTexts || {};
+    var debounceChange = useCallback(debounce(onChange, 200), [onChange]);
+    useEffect(function () {
+        debounceChange(changeParams);
+        return function () {
+            debounceChange.cancel();
+        };
+    }, [changeParams]);
     return (React.createElement("div", { className: "feed" },
         React.createElement(FeedFilter, { onChange: function (filterValues, sort) {
-                var values = __assign(__assign(__assign({}, sort), filterValues), { skip: skip });
-                // console.log(values);
-                onChange(values);
+                setChangeParams(__assign(__assign(__assign({}, changeParams), sort), filterValues));
             }, sortOptions: sortOptions || [], all: all, renderCleanButton: renderCleanButton ? renderCleanButton : RenderUtil.renderButton, fields: filterFields || [], className: filterClassName, renderSortOption: renderSortOption, showTotal: showTotal, renderSearch: renderSearch, texts: texts, searchField: searchField, sortNameField: sortNameField, sortModeField: sortModeField, renderField: renderFilterField }),
@@ -288,5 +290,5 @@ React.createElement("div", { className: "feed__data" }, (data || []).map(function (item, i) { return (React.createElement("div", { key: i }, renderItem(item))); })),
             React.createElement("div", { onClick: function () {
-                    setSkip(data ? data.length : 0);
+                    setChangeParams(__assign(__assign({}, changeParams), { skip: data ? data.length : 0 }));
                 } }, texts['load'] ? texts['load'] : 'See More'))) : null));
-};
+}
 
@@ -293,0 +295,0 @@ var FeedAttribute = function (_a) {

dist/index.js

@@ -10,5 +10,5 @@ 'use strict';
 var classNames = _interopDefault(require('classnames'));
-var lodash = require('lodash');
 var reactHookForm = require('react-hook-form');
 var equal = _interopDefault(require('deep-equal'));
+var lodash = require('lodash');
 
@@ -139,5 +139,2 @@ /*! *****************************************************************************
 
-var debounceChange = lodash.debounce(function (callback) {
-    callback();
-}, 500);
 function getDefaultValues(fields) {
@@ -179,9 +176,10 @@ var result = {};
     var handleClean = React.useCallback(function () {
-        // reset()
-        // reset(defaultValues);
-        Object.keys(defaultValues).forEach(function (name) {
-            setFormValue(name, defaultValues[name]);
-        });
-    }, [defaultValues]);
+        reset(getDefaultValues(fields));
+    }, [fields]);
+    var handleChange = React.useCallback(function () {
+        handleDebounce();
+    }, [fields]);
     var handleDebounce = React.useCallback(function () {
+        var values = getValues();
+        onChange(values, sort);
         setCleanDisabled(equal(values, defaultValues));
@@ -198,4 +196,3 @@ onChange(convertValues(values, fields), sort);
         if (defaultValues) {
-            // console.log('handleDebounce', defaultValues);
-            debounceChange(handleDebounce);
+            handleDebounce();
         }
@@ -281,12 +278,17 @@ }, [defaultValues, values, sort]);
 
-var DataFeed = function (_a) {
+function DataFeed(_a) {
     var data = _a.data, all = _a.all, onChange = _a.onChange, sortOptions = _a.sortOptions, filterFields = _a.filterFields, renderItem = _a.renderItem, filterClassName = _a.filterClassName, renderSortOption = _a.renderSortOption, showTotal = _a.showTotal, renderSearch = _a.renderSearch, renderCleanButton = _a.renderCleanButton, initialTexts = _a.texts, searchField = _a.searchField, sortNameField = _a.sortNameField, sortModeField = _a.sortModeField, renderFilterField = _a.renderFilterField;
     var showLoad = data && all && data.length > 0 && data.length < all;
-    var _b = React.useState(0), skip = _b[0], setSkip = _b[1];
+    var _b = React.useState({ skip: 0 }), changeParams = _b[0], setChangeParams = _b[1];
     var texts = initialTexts || {};
+    var debounceChange = React.useCallback(lodash.debounce(onChange, 200), [onChange]);
+    React.useEffect(function () {
+        debounceChange(changeParams);
+        return function () {
+            debounceChange.cancel();
+        };
+    }, [changeParams]);
     return (React__default.createElement("div", { className: "feed" },
         React__default.createElement(FeedFilter, { onChange: function (filterValues, sort) {
-                var values = __assign(__assign(__assign({}, sort), filterValues), { skip: skip });
-                // console.log(values);
-                onChange(values);
+                setChangeParams(__assign(__assign(__assign({}, changeParams), sort), filterValues));
             }, sortOptions: sortOptions || [], all: all, renderCleanButton: renderCleanButton ? renderCleanButton : RenderUtil.renderButton, fields: filterFields || [], className: filterClassName, renderSortOption: renderSortOption, showTotal: showTotal, renderSearch: renderSearch, texts: texts, searchField: searchField, sortNameField: sortNameField, sortModeField: sortModeField, renderField: renderFilterField }),
@@ -296,5 +298,5 @@ React__default.createElement("div", { className: "feed__data" }, (data || []).map(function (item, i) { return (React__default.createElement("div", { key: i }, renderItem(item))); })),
             React__default.createElement("div", { onClick: function () {
-                    setSkip(data ? data.length : 0);
+                    setChangeParams(__assign(__assign({}, changeParams), { skip: data ? data.length : 0 }));
                 } }, texts['load'] ? texts['load'] : 'See More'))) : null));
-};
+}
 
@@ -301,0 +303,0 @@ var FeedAttribute = function (_a) {

package.json

 {
     "name": "data-feed",
-    "version": "0.0.27",
+    "version": "0.0.28",
     "description": "Data feed view",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

No alert changes

Improved metrics

Total package byte prevSize

51982

increased by0.93%

Lines of code

974

increased by0.52%

No dependency changes