mig-schema-table 3.0.47 → 3.0.49

package/dist/SchemaTable/Td/index.d.ts

@@ -12,12 +12,13 @@ interface ITdProps<T> {
     rowIndex: number;
     onCheckedIndexesChange?: (dataIndex: number[]) => void;
     onRowClick?: (rowData: T, dataIndex: number, event: React.MouseEvent) => void;
+    onRowDoubleClick?: (rowData: T, dataIndex: number, event: React.MouseEvent) => void;
     propConfig?: IColumnConfig<any>;
     propName: string;
     propSchema: oas31.SchemaObject;
     sortedRenderData?: IRenderData[];
     style: React.CSSProperties;
 }
-declare function Td<T>({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowClassName, getRowSelected, onCheckedIndexesChange, onRowClick, propConfig, propName, propSchema, rowHeight, rowIndex, sortedRenderData, style, }: ITdProps<T>): import("react/jsx-runtime").JSX.Element | null;
+declare function Td<T>({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowClassName, getRowSelected, onCheckedIndexesChange, onRowClick, onRowDoubleClick, propConfig, propName, propSchema, rowHeight, rowIndex, sortedRenderData, style, }: ITdProps<T>): import("react/jsx-runtime").JSX.Element | null;
 declare const _default: typeof Td;
 export default _default;

package/dist/SchemaTable/Td/index.js

@@ -4,7 +4,7 @@ import { SELECT_ALL_COLUMN_NAME } from "../constants";
 import { localeFormatInTimeZone, timeZone } from "../../inc/date";
 import { DEFAULT_DATE_TIME_FORMAT } from "../../inc/constant";
 import { t } from "../../inc/string";
-function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowClassName, getRowSelected, onCheckedIndexesChange, onRowClick, propConfig, propName, propSchema, rowHeight, rowIndex, sortedRenderData, style, }) {
+function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowClassName, getRowSelected, onCheckedIndexesChange, onRowClick, onRowDoubleClick, propConfig, propName, propSchema, rowHeight, rowIndex, sortedRenderData, style, }) {
     const onTdClick = React.useCallback((e) => {
         if (!sortedRenderData || !onRowClick) {
             return;
@@ -16,6 +16,17 @@ function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowC
         const row = sortedRenderData[parseInt(rowIndex, 10)];
         onRowClick(data[row._index], row._index, e);
     }, [data, onRowClick, sortedRenderData]);
+    const onTdDoubleClick = React.useCallback((e) => {
+        if (!sortedRenderData || !onRowDoubleClick) {
+            return;
+        }
+        const { rowIndex } = e.currentTarget.dataset;
+        if (!rowIndex) {
+            return;
+        }
+        const row = sortedRenderData[parseInt(rowIndex, 10)];
+        onRowDoubleClick(data[row._index], row._index, e);
+    }, [data, onRowDoubleClick, sortedRenderData]);
     const row = sortedRenderData ? sortedRenderData[rowIndex] : undefined;
     const tdDivProps = React.useMemo(() => {
         if (!row) {
@@ -28,7 +39,9 @@ function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowC
             // @ts-ignore
             const dateString = data[row._index][propName];
             const date = dateString ? new Date(dateString) : undefined;
-            const alternativeTimeZone = timeZone.startsWith("Europe/") ? "Asia/Jakarta" : "Europe/Amsterdam";
+            const alternativeTimeZone = timeZone.startsWith("Europe/")
+                ? "Asia/Jakarta"
+                : "Europe/Amsterdam";
             if (date) {
                 title = `${localeFormatInTimeZone(date, alternativeTimeZone, DEFAULT_DATE_TIME_FORMAT)} (${t(alternativeTimeZone)})`;
             }
@@ -39,6 +52,7 @@ function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowC
             key: propName,
             style: Object.assign(Object.assign({}, style), { lineHeight: `${rowHeight}px` }),
             onClick: !(propConfig === null || propConfig === void 0 ? void 0 : propConfig.renderCell) ? onTdClick : undefined,
+            onDoubleClick: onTdDoubleClick,
             className: `schema-table__td schema-table__td--${rowIndex % 2 ? "odd" : "even"}${getRowSelected && getRowSelected(data[row._index], row._index)
                 ? " schema-table__td--selected"
                 : ""} ${getRowClassName ? getRowClassName(data[row._index], row._index) : ""}`,
@@ -50,9 +64,11 @@ function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowC
         getRowClassName,
         getRowSelected,
         onTdClick,
-        propConfig,
+        onTdDoubleClick,
+        propConfig === null || propConfig === void 0 ? void 0 : propConfig.renderCell,
+        propConfig === null || propConfig === void 0 ? void 0 : propConfig.showTimezones,
         propName,
-        propSchema,
+        propSchema.format,
         row,
         rowHeight,
         rowIndex,
@@ -76,6 +92,7 @@ function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowC
     if (!propSchema) {
         return null;
     }
+    const propValue = row[propName];
     switch (propSchema.type) {
         case "boolean":
             tdDivProps.className += ` text-${(propConfig === null || propConfig === void 0 ? void 0 : propConfig.align) || "center"}`;
@@ -88,7 +105,12 @@ function Td({ checkedIndexes, disabledCheckedIndexes, columnIndex, data, getRowC
             if (propConfig === null || propConfig === void 0 ? void 0 : propConfig.align) {
                 tdDivProps.className += ` text-${propConfig.align}`;
             }
+            if (propSchema.format === "url" && propValue) {
+                return (
+                // @ts-ignore
+                _jsx("a", Object.assign({ href: propValue, target: "_blank", rel: "noopener noreferrer" }, tdDivProps, { children: propValue })));
+            }
     }
-    return _jsx("div", Object.assign({}, tdDivProps, { children: row[propName] }));
+    return _jsx("div", Object.assign({}, tdDivProps, { children: propValue }));
 }
 export default React.memo(Td);

package/dist/SchemaTable/index.d.ts

@@ -28,6 +28,7 @@ export interface ISchemaTableProps<T> {
     isSortable?: boolean;
     onCheckedIndexesChange?: (dataIndex: number[]) => void;
     onRowClick?: (rowData: T, dataIndex: number, event: React.MouseEvent) => void;
+    onRowDoubleClick?: (rowData: T, dataIndex: number, event: React.MouseEvent) => void;
     rowHeight?: number;
     schema: oas31.SchemaObject;
     searchPlaceholder?: string;
@@ -38,6 +39,6 @@ export type TColumnFilterValue = string | number | boolean | {
     from?: Date;
     to?: Date;
 };
-declare function SchemaTable<T>({ Heading, checkedIndexes, disabledCheckedIndexes, config, customElement, data, defaultSortAsc, defaultSortColumn, getRowClassName, getRowSelected, maxHeight, isSearchable, isColumnFilterable, isSortable, onCheckedIndexesChange, onRowClick, rowHeight, schema, searchPlaceholder, style, width, }: ISchemaTableProps<T>): import("react/jsx-runtime").JSX.Element;
+declare function SchemaTable<T>({ Heading, checkedIndexes, disabledCheckedIndexes, config, customElement, data, defaultSortAsc, defaultSortColumn, getRowClassName, getRowSelected, maxHeight, isSearchable, isColumnFilterable, isSortable, onCheckedIndexesChange, onRowClick, rowHeight, schema, searchPlaceholder, style, width, onRowDoubleClick, }: ISchemaTableProps<T>): import("react/jsx-runtime").JSX.Element;
 declare const _default: typeof SchemaTable;
 export default _default;

package/dist/SchemaTable/index.js

@@ -9,7 +9,7 @@ import Td from "./Td";
 import { DEFAULT_DATE_FORMAT, DEFAULT_DATE_TIME_FORMAT } from "../inc/constant";
 import SchemaColumnFilterPopover from "./SchemaColumnFilterPopover";
 const startOfTheWorldDate = new Date("1000-01-01 00:00:00Z");
-function SchemaTable({ Heading = VariableSizeList, checkedIndexes, disabledCheckedIndexes, config, customElement, data, defaultSortAsc = false, defaultSortColumn, getRowClassName, getRowSelected, maxHeight, isSearchable, isColumnFilterable, isSortable, onCheckedIndexesChange, onRowClick, rowHeight = 36, schema, searchPlaceholder, style, width, }) {
+function SchemaTable({ Heading = VariableSizeList, checkedIndexes, disabledCheckedIndexes, config, customElement, data, defaultSortAsc = false, defaultSortColumn, getRowClassName, getRowSelected, maxHeight, isSearchable, isColumnFilterable, isSortable, onCheckedIndexesChange, onRowClick, rowHeight = 36, schema, searchPlaceholder, style, width, onRowDoubleClick, }) {
     const [sortColumn, setSortColumn] = React.useState(defaultSortColumn);
     const [sortAsc, setSortAsc] = React.useState(defaultSortAsc);
     const [searchQuery, setSearchQuery] = React.useState("");
@@ -375,18 +375,19 @@ function SchemaTable({ Heading = VariableSizeList, checkedIndexes, disabledCheck
         const propSchema = (propName === SELECT_ALL_COLUMN_NAME
             ? { type: "boolean" }
             : properties[propName]);
-        return sourceData ? (_jsx(Td, { checkedIndexes: checkedIndexes, disabledCheckedIndexes: disabledCheckedIndexes, columnIndex: columnIndex, data: sourceData, getRowClassName: getRowClassName, getRowSelected: getRowSelected, onCheckedIndexesChange: onCheckedIndexesChange, onRowClick: onRowClick, propConfig: config ? config[propName] : undefined, propName: propName, propSchema: propSchema, rowHeight: rowHeight, rowIndex: rowIndex, sortedRenderData: sortedRenderData, style: style })) : null;
+        return sourceData ? (_jsx(Td, { checkedIndexes: checkedIndexes, disabledCheckedIndexes: disabledCheckedIndexes, columnIndex: columnIndex, data: sourceData, getRowClassName: getRowClassName, getRowSelected: getRowSelected, onCheckedIndexesChange: onCheckedIndexesChange, onRowClick: onRowClick, onRowDoubleClick: onRowDoubleClick, propConfig: config ? config[propName] : undefined, propName: propName, propSchema: propSchema, rowHeight: rowHeight, rowIndex: rowIndex, sortedRenderData: sortedRenderData, style: style })) : null;
     }, [
-        checkedIndexes,
         columnNames,
-        config,
+        properties,
         sourceData,
+        checkedIndexes,
         disabledCheckedIndexes,
         getRowClassName,
         getRowSelected,
         onCheckedIndexesChange,
         onRowClick,
-        properties,
+        onRowDoubleClick,
+        config,
         rowHeight,
         sortedRenderData,
     ]);

package/package.json

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