mig-schema-table 1.0.6 → 1.0.8

package/build/component/SchemaTable/Th/index.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
-import { camelTextToTitleText } from "../../../inc/string";
+import { uncamel } from "../../../inc/string";
 const Th = ({ columnFilters, config, isSortable, name, schema, setColumnFilters, setSortAsc, setSortColumn, sortAsc, style, }) => {
     const thDivProps = {
         style,
@@ -39,6 +39,6 @@ const Th = ({ columnFilters, config, isSortable, name, schema, setColumnFilters,
                 thDivProps.className += ` text-${(config === null || config === void 0 ? void 0 : config.align) || "end"}`;
             }
     }
-    return (_jsxs("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) || camelTextToTitleText(name), sortAsc === undefined ? null : sortAsc ? "▲" : "▼"] }))) : (_jsx("div", Object.assign({ style: { lineHeight: "44px" } }, { children: (config === null || config === void 0 ? void 0 : config.title) || camelTextToTitleText(name) }))), (config === null || config === void 0 ? void 0 : config.isFilterable) ? (_jsx("button", Object.assign({ onClick: onFilterButtonClick }, { children: _jsx("svg", Object.assign({ viewBox: "0 0 36 36", xmlns: "http://www.w3.org/2000/svg", height: 16, width: 16, style: { display: "block" } }, { children: _jsx("polygon", { fill: "#231F20", points: "14,30 22,25 22,17 35.999,0 17.988,0 0,0 14,17 " }) })) }))) : null] })));
+    return (_jsxs("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) || uncamel(name), sortAsc === undefined ? null : sortAsc ? "▲" : "▼"] }))) : (_jsx("div", Object.assign({ style: { lineHeight: "44px" } }, { children: (config === null || config === void 0 ? void 0 : config.title) || uncamel(name) }))), (config === null || config === void 0 ? void 0 : config.isFilterable) ? (_jsx("button", Object.assign({ onClick: onFilterButtonClick }, { children: _jsx("svg", Object.assign({ viewBox: "0 0 36 36", xmlns: "http://www.w3.org/2000/svg", height: 16, width: 16, style: { display: "block" } }, { children: _jsx("polygon", { fill: "#231F20", points: "14,30 22,25 22,17 35.999,0 17.988,0 0,0 14,17 " }) })) }))) : null] })));
 };
 export default React.memo(Th);

package/build/component/SchemaTable/index.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { VariableSizeList, VariableSizeGrid } from "react-window";
 import { localeFormat } from "../../inc/date";
-import { camelTextToTitleText } from "../../inc/string";
+import { uncamel } from "../../inc/string";
 import Th from "./Th";
 export default function SchemaTableComponent(props) {
     const { config, data, defaultSortColumn, defaultSortAsc = false, Heading = VariableSizeList, isSearchable, isSortable, onRowClick, getRowClassName, getRowSelected, rowHeight = 36, schema, style, customElement, tableTitle, searchPlaceholder } = props;
@@ -81,7 +81,7 @@ export default function SchemaTableComponent(props) {
                         return prev;
                     }
                     if (schema.enum) {
-                        prev[propName] = camelTextToTitleText(rawValue);
+                        prev[propName] = uncamel(rawValue);
                         return prev;
                     }
                 // fallthrough
@@ -260,5 +260,5 @@ export default function SchemaTableComponent(props) {
     const totalWidth = React.useMemo(() => columnWidths.reduce((a, b) => {
         return a + b;
     }, 0), [columnWidths]);
-    return (_jsxs("div", Object.assign({ className: `schema-table${onRowClick ? " schema-table--clickable-rows" : ""}`, style: Object.assign(Object.assign({}, style), { width: dynamicWidthColumnCount ? gridWidth : fixedWidthColumnsWidth }) }, { children: [_jsx("div", Object.assign({ className: "tableTitle" }, { children: tableTitle })), _jsxs("div", Object.assign({ className: "form-action-container" }, { children: [_jsx("div", Object.assign({ className: "flex-1" }, { children: isSearchable ? (_jsx("input", { id: "input-filter", type: "text", placeholder: searchPlaceholder, value: searchQuery, onChange: onSearchChange, autoFocus: true })) : null })), customElement] })), _jsx(Heading, Object.assign({ height: 50, itemCount: columnCount, itemSize: getColumnWidth, layout: "horizontal", width: width, sortAsc: sortAsc, setSortAsc: setSortAsc, setSortColumn: setSortColumn, sortColumn: sortColumn, sortedRenderData: sortedRenderData }, { children: SchemaTableTh }), `thead_${width}_${sortColumn}_${sortAsc}_${searchQuery}`), _jsx(VariableSizeGrid, Object.assign({ className: "schema-table__tbody", height: props.height - (isSearchable ? 50 : 0), width: totalWidth, columnWidth: getColumnWidth, rowHeight: getRowHeight, columnCount: columnCount, rowCount: sortedRenderData ? sortedRenderData.length : 0 }, { children: Td }), `tbody_${width}_${sortColumn}_${sortAsc}_${searchQuery}_${columnCount}`)] })));
+    return (_jsxs("div", Object.assign({ className: `schema-table${onRowClick ? " schema-table--clickable-rows" : ""}`, style: Object.assign(Object.assign({}, style), { width: dynamicWidthColumnCount ? gridWidth : fixedWidthColumnsWidth }) }, { children: [_jsx("div", Object.assign({ className: "tableTitle" }, { children: tableTitle })), _jsxs("div", Object.assign({ className: "form-action-container" }, { children: [_jsx("div", Object.assign({ className: "flex-1" }, { children: isSearchable ? (_jsx("input", { id: "input-filter", type: "text", placeholder: searchPlaceholder, value: searchQuery, onChange: onSearchChange, autoFocus: true })) : null })), customElement] })), _jsx(Heading, Object.assign({ height: 50, itemCount: columnCount, itemSize: getColumnWidth, layout: "horizontal", width: width, sortAsc: sortAsc, setSortAsc: setSortAsc, setSortColumn: setSortColumn, sortColumn: sortColumn, sortedRenderData: sortedRenderData, className: "schema-table__th-row" }, { children: SchemaTableTh }), `thead_${width}_${sortColumn}_${sortAsc}_${searchQuery}`), _jsx(VariableSizeGrid, Object.assign({ className: "schema-table__tbody", height: props.height - (isSearchable ? 50 : 0), width: totalWidth, columnWidth: getColumnWidth, rowHeight: getRowHeight, columnCount: columnCount, rowCount: sortedRenderData ? sortedRenderData.length : 0 }, { children: Td }), `tbody_${width}_${sortColumn}_${sortAsc}_${searchQuery}_${columnCount}`)] })));
 }

package/build/inc/string.d.ts

@@ -1 +1 @@
-export declare const camelTextToTitleText: (keyName: string) => string;
+export declare function uncamel(camel: string): string;

package/build/inc/string.js

@@ -1,4 +1,17 @@
-export const camelTextToTitleText = (keyName) => {
-    const titleText = keyName.replace(/([A-Z])/g, " $1");
-    return titleText.charAt(0).toUpperCase() + titleText.slice(1);
-};
+import { upperFirst } from "lodash";
+function isUpperCase(letter) {
+    return !!letter.match(/[A-Z]/);
+}
+export function uncamel(camel) {
+    return upperFirst(camel.replaceAll(/[A-Z]/g, (letter, position) => {
+        const prevLetter = camel[position - 1];
+        const prevIsUppercase = prevLetter ? isUpperCase(prevLetter) : false;
+        const nextLetter = camel[position + 1];
+        const nextIsUppercase = nextLetter ? isUpperCase(nextLetter) : false;
+        if (position === 0 ||
+            (prevIsUppercase && (!nextLetter || nextIsUppercase))) {
+            return letter;
+        }
+        return ` ${nextIsUppercase ? letter : letter.toLowerCase()}`;
+    }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mig-schema-table",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "main": "build/index.js",
   "files": [
     "build/"