mig-schema-table 3.0.11 → 3.0.13

package/README.md

@@ -1,6 +1,6 @@
 # schema-table-component
 
-This component will render fields dynamically based on openApi schema JSON.
+This component will render fields dynamically based on openApi schema JSON. Styling can be done using Bootstrap 5 compatible classes
 
 # Install
 ```

package/dist/SchemaTable/ColumnFilterRow/index.js

@@ -55,7 +55,6 @@ export default function ColumnFilterRow({ columnNames, getWidth, config, value,
     return (_jsx("div", Object.assign({ className: "schema-table__th-row", style: { display: "flex", flex: "row" } }, { children: columnNames.map((columnName, index) => {
             return (_jsx("div", Object.assign({ className: "schema-table__column-filter", style: {
                     width: getWidth(index),
-                    height: 25,
                     paddingBottom: 7,
                 } }, { children: SchemaColumnFilter(index) }), `filter-${index}`));
         }) })));

package/dist/SchemaTable/Th/index.js

@@ -26,15 +26,15 @@ const Th = ({ config, isSortable, name, schema, setSortAsc, setSortColumn, sortA
     }
     switch (schema.type) {
         case "boolean":
-            thDivProps.className += ` text-${(config === null || config === void 0 ? void 0 : config.align) || "center"}`;
+            thDivProps.className += ` text-${(config === null || config === void 0 ? void 0 : config.align) || "center"} justify-content-${(config === null || config === void 0 ? void 0 : config.align) || "center"}`;
             break;
         case "integer":
         case "number":
-            thDivProps.className += ` text-${(config === null || config === void 0 ? void 0 : config.align) || "end"}`;
+            thDivProps.className += ` text-${(config === null || config === void 0 ? void 0 : config.align) || "end"} justify-content-${(config === null || config === void 0 ? void 0 : config.align) || "end"}`;
             break;
         case "string":
             if (schema.format && ["date", "date-time"].indexOf(schema.format) >= 0) {
-                thDivProps.className += ` text-${(config === null || config === void 0 ? void 0 : config.align) || "end"}`;
+                thDivProps.className += ` text-${(config === null || config === void 0 ? void 0 : config.align) || "end"} justify-content-${(config === null || config === void 0 ? void 0 : config.align) || "end"}`;
             }
     }
     return (_jsx("div", Object.assign({}, thDivProps, { children: isSortable ? (_jsxs("button", Object.assign({ className: "px-0", disabled: (config === null || config === void 0 ? void 0 : config.sortable) === false, onClick: onSortButtonClick }, { children: [(config === null || config === void 0 ? void 0 : config.title) === undefined ? uncamel(name) : config === null || config === void 0 ? void 0 : config.title, sortAsc === undefined ? null : sortAsc ? "▲" : "▼"] }))) : (_jsx("div", Object.assign({ style: { lineHeight: "44px" } }, { children: (config === null || config === void 0 ? void 0 : config.title) === undefined ? uncamel(name) : config === null || config === void 0 ? void 0 : config.title }))) })));

package/dist/SchemaTable/index.js

@@ -146,7 +146,7 @@ export default function SchemaTable({ Heading = VariableSizeList, checkedIndexes
         if (!result) {
             return result;
         }
-        if (isColumnSearchable || searchQuery) {
+        if (isColumnSearchable || isSearchable) {
             return result.filter((item) => {
                 const globalSearchFilterResult = searchQuery
                     ? !!columnNames.find((columnName) => 
@@ -175,6 +175,7 @@ export default function SchemaTable({ Heading = VariableSizeList, checkedIndexes
         columnNames,
         columnSearchObj,
         isColumnSearchable,
+        isSearchable,
         renderData,
         searchQuery,
     ]);
@@ -278,5 +279,5 @@ export default function SchemaTable({ Heading = VariableSizeList, checkedIndexes
             ? rowsMaxHeight
             : rowsHeight;
     }, [maxHeight, isSearchable, rowCount, rowHeight]);
-    return (_jsxs("div", Object.assign({ className: `schema-table${onRowClick ? " schema-table--clickable-rows" : ""}`, style: Object.assign(Object.assign({}, style), { width: rowWidth }) }, { children: [_jsxs("div", Object.assign({ className: "schema-table__action-container" }, { children: [_jsx("div", Object.assign({ style: { flex: 1 } }, { children: isSearchable ? (_jsx("input", { type: "text", placeholder: searchPlaceholder || "Search...", value: searchQuery, onChange: onSearchChange, autoFocus: true })) : null })), customElement] })), _jsx(Heading, Object.assign({ height: 50, itemCount: columnCount, itemSize: getColumnWidth, layout: "horizontal", width: rowWidth, sortAsc: sortAsc, setSortAsc: setSortAsc, setSortColumn: setSortColumn, sortColumn: sortColumn, sortedRenderData: sortedRenderData, className: "schema-table__th-row" }, { children: SchemaTableTh }), `thead_${rowWidth}_${sortColumn}_${sortAsc}_${searchQuery}`), _jsx(ColumnFilterRow, { schema: schema, columnNames: columnNames, config: config, value: columnSearchObj, columnSearchHandler: columnSearchHandler, getWidth: getColumnWidth }), _jsx(VariableSizeGrid, Object.assign({ className: "schema-table__tbody", height: tableBodyHeight, width: rowWidth, columnWidth: getColumnWidth, rowHeight: getRowHeight, columnCount: columnCount, rowCount: rowCount }, { children: SchemaTableTd }), `tbody_${rowWidth}_${sortColumn}_${sortAsc}_${searchQuery}_${columnCount}`)] })));
+    return (_jsxs("div", Object.assign({ className: `schema-table${onRowClick ? " schema-table--clickable-rows" : ""}`, style: Object.assign(Object.assign({}, style), { width: rowWidth }) }, { children: [_jsxs("div", Object.assign({ className: "schema-table__action-container" }, { children: [_jsx("div", Object.assign({ style: { flex: 1 } }, { children: isSearchable ? (_jsx("input", { type: "text", placeholder: searchPlaceholder || "Search...", value: searchQuery, onChange: onSearchChange, autoFocus: true })) : null })), customElement] })), _jsx(Heading, Object.assign({ height: 50, itemCount: columnCount, itemSize: getColumnWidth, layout: "horizontal", width: rowWidth, sortAsc: sortAsc, setSortAsc: setSortAsc, setSortColumn: setSortColumn, sortColumn: sortColumn, sortedRenderData: sortedRenderData, className: "schema-table__th-row" }, { children: SchemaTableTh }), `thead_${rowWidth}_${sortColumn}_${sortAsc}_${searchQuery}`), isColumnSearchable ? (_jsx(ColumnFilterRow, { schema: schema, columnNames: columnNames, config: config, value: columnSearchObj, columnSearchHandler: columnSearchHandler, getWidth: getColumnWidth })) : null, _jsx(VariableSizeGrid, Object.assign({ className: "schema-table__tbody", height: tableBodyHeight, width: rowWidth, columnWidth: getColumnWidth, rowHeight: getRowHeight, columnCount: columnCount, rowCount: rowCount }, { children: SchemaTableTd }), `tbody_${rowWidth}_${sortColumn}_${sortAsc}_${searchQuery}_${columnCount}`)] })));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mig-schema-table",
-  "version": "3.0.11",
+  "version": "3.0.13",
   "main": "dist/index.js",
   "files": [
     "dist/"