ywana-core8 0.0.943 → 0.0.945

package/dist/index.cjs

@@ -1847,8 +1847,25 @@ var DataTable = function DataTable(props) {
     icon: "search_off"
   }), /*#__PURE__*/React__default["default"].createElement(Text, null, emptyMessage)))))));
 };
+
+/**
+ * DataTableFiltersRow
+ */
 var DataTableFiltersRow = function DataTableFiltersRow(_ref4) {
   var columns = _ref4.columns;
+  var _useState3 = React.useState({}),
+    form = _useState3[0],
+    setForm = _useState3[1];
+  function changeFilter(id, value, onFilter) {
+    var _extends2;
+    setForm(_extends({}, form, (_extends2 = {}, _extends2[id] = value, _extends2)));
+    if (onFilter) onFilter(value);
+  }
+  function clear() {
+    setForm({});
+  }
+  var dirty = Object.keys(form).length > 0; // dirty if there are filters set
+
   return /*#__PURE__*/React__default["default"].createElement("tr", {
     className: "filters-row"
   }, columns.map(function (_ref5) {
@@ -1858,18 +1875,30 @@ var DataTableFiltersRow = function DataTableFiltersRow(_ref4) {
       options = _ref5.options;
     var field = options ? /*#__PURE__*/React__default["default"].createElement(DropDown, {
       id: id,
+      value: form[id],
       options: options,
-      onChange: onFilter,
+      onChange: function onChange(id, value) {
+        return changeFilter(id, value, onFilter);
+      },
       outlined: true
     }) : /*#__PURE__*/React__default["default"].createElement(TextField, {
       id: id,
-      onChange: onFilter,
+      value: form[id],
+      onChange: function onChange(id, value) {
+        return changeFilter(id, value, onFilter);
+      },
       outlined: true
     });
     return /*#__PURE__*/React__default["default"].createElement("td", {
       className: "filter-cell"
     }, filterable ? field : null);
-  }));
+  }), /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
+    icon: "close",
+    size: "small",
+    clickable: true,
+    action: clear,
+    disabled: !dirty
+  })));
 };
 
 /**
@@ -1887,9 +1916,9 @@ var DataTableRow = function DataTableRow(props) {
   var _row$selected = row.selected,
     selected = _row$selected === void 0 ? false : _row$selected,
     className = row.className;
-  var _useState3 = React.useState(expanded),
-    isInfoOpen = _useState3[0],
-    toggleInfo = _useState3[1];
+  var _useState4 = React.useState(expanded),
+    isInfoOpen = _useState4[0],
+    toggleInfo = _useState4[1];
   var infoIcon = isInfoOpen ? 'expand_less' : 'expand_more';
   var style = isInfoOpen ? "expanded" : "";
   if (selected) style += " selected";