@helpdice/ui 1.1.8 → 1.2.0

package/dist/index.js

@@ -42125,10 +42125,7 @@ var TableHead = function TableHead(props) {
     if (!isScalableWidth) return /*#__PURE__*/React.createElement("colgroup", null);
     return makeColgroup(width, columns);
   }, [isScalableWidth, width]);
-  var handleFilterChange = function handleFilterChange(e) {
-    var _e$target = e.target,
-      name = _e$target.name,
-      value = _e$target.value;
+  var handleFilterChange = function handleFilterChange(name, value) {
     setFilters(function (prevFilters) {
       var updatedFilters = _objectSpread2(_objectSpread2({}, prevFilters), {}, _defineProperty$1({}, name, value));
       // Call onFiltersChange to propagate filter changes to the parent
@@ -42147,16 +42144,19 @@ var TableHead = function TableHead(props) {
       var filterName = (_String = String(col === null || col === undefined ? undefined : col.label)) === null || _String === undefined ? undefined : _String.replace(' ', '_').toLowerCase();
       var unq_accessor = _.uniqueId(filterName);
       if (accessor === 'fixed') {
+        var _filters$filterName;
         // Dropdown filter for categorical data (category, status)
-        return /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("select", {
+        return /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(Select, {
           key: unq_accessor,
           name: filterName,
-          value: filters[filterName],
-          onChange: handleFilterChange
-        }, /*#__PURE__*/React.createElement("option", {
-          value: ""
+          value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== undefined ? _filters$filterName : 'All',
+          onChange: function onChange(newValue) {
+            return handleFilterChange(filterName, newValue);
+          }
+        }, /*#__PURE__*/React.createElement(Select.Option, {
+          value: "All"
         }, "All ", Header), options ? options.map(function (option) {
-          return /*#__PURE__*/React.createElement("option", {
+          return /*#__PURE__*/React.createElement(Select.Option, {
             value: option.value
           }, option.name);
         }) : null));
@@ -42165,30 +42165,35 @@ var TableHead = function TableHead(props) {
         // Date filter
         return /*#__PURE__*/React.createElement("th", {
           key: unq_accessor
-        }, /*#__PURE__*/React.createElement("input", {
-          type: "date",
+        }, /*#__PURE__*/React.createElement(Input, {
+          htmlType: "date",
           name: filterName,
           value: filters[filterName],
-          onChange: handleFilterChange
+          onChange: function onChange(e) {
+            return handleFilterChange(filterName, e.target.value);
+          }
+        }));
+      }
+      if (accessor === 'search') {
+        // Text search filter
+        return /*#__PURE__*/React.createElement("th", null, /*#__PURE__*/React.createElement(Input, {
+          id: "filter-search-".concat(filterName),
+          htmlType: "text"
+          // ref={filterRefs.current[filterName]} // Dynamically set ref}
+          ,
+          name: filterName,
+          style: {
+            height: 30,
+            minWidth: 160
+          },
+          value: filters[filterName],
+          onChange: function onChange(e) {
+            return handleFilterChange(filterName, e.target.value);
+          },
+          placeholder: "Search...",
+          fullWidth: true
         }));
       }
-
-      // Text search filter for other fields (like name)
-      return /*#__PURE__*/React.createElement("th", null, /*#__PURE__*/React.createElement(Input, {
-        id: "filter-search-".concat(filterName),
-        htmlType: "text"
-        // ref={filterRefs.current[filterName]} // Dynamically set ref}
-        ,
-        name: filterName,
-        style: {
-          height: 30,
-          minWidth: 160
-        },
-        value: filters[filterName],
-        onChange: handleFilterChange,
-        placeholder: "Search...",
-        fullWidth: true
-      }));
     });
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
@@ -42267,18 +42272,37 @@ var TableBody = function TableBody(_ref) {
     onCell = _ref.onCell,
     rowClassName = _ref.rowClassName,
     _ref$rowDraggable = _ref.rowDraggable,
-    rowDraggable = _ref$rowDraggable === undefined ? false : _ref$rowDraggable;
-    _ref.readOnly;
-    var onSelected = _ref.onSelected;
+    rowDraggable = _ref$rowDraggable === undefined ? false : _ref$rowDraggable,
+    _ref$readOnly = _ref.readOnly,
+    readOnly = _ref$readOnly === undefined ? false : _ref$readOnly,
+    onSelected = _ref.onSelected;
   var theme = useTheme();
   var _useState = React.useState([]),
     _useState2 = _slicedToArray(_useState, 2),
-    selected = _useState2[0];
-    _useState2[1];
+    selected = _useState2[0],
+    setSelected = _useState2[1];
   var _useTableContext = useTableContext(),
     columns = _useTableContext.columns;
-  var rowClickHandler = function rowClickHandler(row, index) {
-    onRow && onRow(row, index);
+  // const rowClickHandler = (row: TableDataItem, index: number) => {
+  //   onRow && onRow(row, index)
+  // }
+
+  var handleClick = function handleClick(_event, id) {
+    if (readOnly) {
+      return true;
+    }
+    var selectedIndex = selected.indexOf(id);
+    var newSelected = [];
+    if (selectedIndex === -1) {
+      newSelected = newSelected.concat(selected, id);
+    } else if (selectedIndex === 0) {
+      newSelected = newSelected.concat(selected.slice(1));
+    } else if (selectedIndex === selected.length - 1) {
+      newSelected = newSelected.concat(selected.slice(0, -1));
+    } else if (selectedIndex > 0) {
+      newSelected = newSelected.concat(selected.slice(0, selectedIndex), selected.slice(selectedIndex + 1));
+    }
+    setSelected(newSelected);
   };
 
   // const handleSelectAllClick = (event: { target: { checked: any } }) => {
@@ -42306,15 +42330,11 @@ var TableBody = function TableBody(_ref) {
     delete rw.table;
     delete rw.style;
     delete rw.onDragStart;
-    var frow = Object.fromEntries(Object.entries(row).filter(function (_ref2) {
-      var _ref3 = _slicedToArray(_ref2, 2),
-        ky = _ref3[0];
-        _ref3[1];
-      return ky !== '_id' && cols.map(function (col) {
-        return col.id;
-      }).includes(ky);
-    }));
-    console.log(frow);
+    // console.log(row);
+    // const frow = Object.fromEntries(
+    //   Object.entries(row).filter(([ky, _]) => ky !== '_id' && cols.map((col: any) => col.id).includes(ky))
+    // ) as unknown as TableDataItem
+    // console.log(frow);
     var isRowSelected = selected.indexOf(row) !== -1;
     return /*#__PURE__*/React.createElement("tr", {
       draggable: rowDraggable,
@@ -42332,14 +42352,16 @@ var TableBody = function TableBody(_ref) {
       }, rowStyle),
       onClick: function onClick(e) {
         if (!rowDraggable) {
-          {
-            rowClickHandler(row, index);
+          if (onRow) {
+            onRow(row, index);
+          } else {
+            handleClick(e, row);
           }
         }
       }
     }, /*#__PURE__*/React.createElement(TableCell, {
       columns: cols,
-      row: frow,
+      row: rw,
       rowIndex: index,
       emptyText: emptyText,
       onCellClick: onCell
@@ -42400,6 +42422,7 @@ var TableColumn = function TableColumn(columnProps) {
     label = _ref.label,
     width = _ref.width,
     filter = _ref.filter,
+    options = _ref.options,
     _ref$className = _ref.className,
     className = _ref$className === undefined ? '' : _ref$className,
     renderHandler = _ref.render;
@@ -42413,12 +42436,13 @@ var TableColumn = function TableColumn(columnProps) {
     updateColumn({
       label: children || label,
       filter: filter,
+      options: options,
       prop: safeProp,
       width: width,
       className: className,
       renderHandler: function renderHandler() {}
     });
-  }, [children, filter, label, prop, width, className, renderHandler]);
+  }, [children, filter, options, label, prop, width, className, renderHandler]);
   return null;
 };
 TableColumn.displayName = 'TableColumn';