ywana-core8 0.0.865 → 0.0.866

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.865",
+  "version": "0.0.866",
   "description": "ywana-core8",
   "homepage": "https://ywana.github.io/workspace",
   "author": "Ernesto Roldan Garcia",

package/src/html/table.js

@@ -13,7 +13,7 @@ const isFunction = value => value && (Object.prototype.toString.call(value) ===
  */
 export const DataTable = (props) => {
 
-    const { columns = [], rows = [], onRowSelection, onSort, onCheckAll, editable, outlined, expanded = false, className, emptyMessage = "No Results Found", multisort = false } = props
+    const { columns = [], rows = [], onRowSelection, onSort, onCheckAll, editable, outlined, expanded = false, className, emptyMessage = "No Results Found", multisort = false, filterable = false } = props
     const [sortDir, setSortDir] = useState({})
     const [allChecked, setAllChecked] = useState(false)
 
@@ -122,6 +122,9 @@ export const DataTable = (props) => {
                     </tr>
                 </thead>
                 <tbody>
+
+                    { filterable ? <DataTableFiltersRow columns={columns} /> : null }
+
                     {rows.length > 0 ?
                         multiSort(rows, sortDir).map((row, index) => (
                             <DataTableRow key={row.id} index={index} row={row} columns={columns} onSelect={select} onDrop={moveRow} editable={editable} expanded={expanded} />
@@ -142,6 +145,18 @@ export const DataTable = (props) => {
     )
 }
 
+const DataTableFiltersRow = ({ columns }) => {
+    return (
+        <tr className="filters-row">
+            {columns.map(({ id, filterable, onFilter }) => {
+                <td className='filter-cell'>
+                    { filterable ? <TextField id={id} onChange={onFilter} /> : null } 
+                </td>
+            })}
+        </tr>
+    )
+}
+
 /**
  * DataTable Row
  */