nillud-data-table 1.4.0 → 1.4.2

package/README.md

@@ -1,4 +1,4 @@
-# [React](https://react.dev/)  nillud-data-table Component [![npm version](https://img.shields.io/npm/v/data-table-lib)](https://www.npmjs.com/package/data-table-lib)
+# [React](https://react.dev/)  DataTable Component [![npm version](https://img.shields.io/npm/v/data-table-lib)](https://www.npmjs.com/package/data-table-lib)
 
 ## Возможности
 

package/dist/chunk-MLSI37NJ.js

@@ -0,0 +1,97 @@
+// components/export/export-word/ExportHelpers.ts
+function prepareExportRows(columns, data) {
+  return data.map(
+    (row) => columns.map((col) => {
+      const value = row[col.field];
+      return typeof col.exportCustomCell !== "undefined" ? col.exportCustomCell(String(value), row) : String(value != null ? value : "");
+    })
+  );
+}
+function prepareExportHeaders(columns) {
+  return columns.map((col) => col.title);
+}
+
+// components/export/export-word/ExportWord.tsx
+import {
+  AlignmentType,
+  Document,
+  Packer,
+  PageOrientation,
+  Paragraph,
+  Table,
+  TableCell,
+  TableRow,
+  TextRun,
+  VerticalAlign,
+  WidthType
+} from "docx";
+import { saveAs } from "file-saver";
+import { jsx } from "react/jsx-runtime";
+var WordExport = ({
+  wordData,
+  columns,
+  title,
+  options = {
+    fontSize: 20,
+    boldHeaders: false,
+    autoLandscape: false,
+    maxColumnsBeforeLandscape: 5
+  }
+}) => {
+  const createNewWord = async () => {
+    const {
+      fontSize = 0,
+      boldHeaders = true,
+      autoLandscape = true,
+      maxColumnsBeforeLandscape = 5
+    } = options;
+    const isLandscape = autoLandscape && columns.length > maxColumnsBeforeLandscape;
+    const headerCells = prepareExportHeaders(columns).map((header) => new TableCell({
+      children: [new Paragraph({
+        children: [new TextRun({
+          text: header,
+          size: fontSize,
+          bold: boldHeaders
+        })],
+        alignment: AlignmentType.CENTER
+      })],
+      verticalAlign: VerticalAlign.CENTER
+    }));
+    const tableHeaderRow = new TableRow({ children: headerCells });
+    const rows = prepareExportRows(columns, wordData).map((cells) => {
+      const rowCells = cells.map(
+        (value) => new TableCell({
+          children: [new Paragraph({
+            children: [new TextRun({
+              text: value,
+              size: fontSize
+            })],
+            alignment: AlignmentType.CENTER
+          })],
+          verticalAlign: VerticalAlign.CENTER
+        })
+      );
+      return new TableRow({ children: rowCells });
+    });
+    const table = new Table({
+      rows: [tableHeaderRow, ...rows],
+      width: { size: 11e3, type: WidthType.DXA },
+      indent: { size: -1e3, type: WidthType.DXA }
+    });
+    const doc = new Document({
+      sections: [{
+        children: [table, new Paragraph({ text: "" })],
+        properties: isLandscape ? { page: { size: { orientation: PageOrientation.LANDSCAPE } } } : {}
+      }]
+    });
+    Packer.toBlob(doc).then((blob) => {
+      saveAs(blob, `${title}.docx`);
+    });
+  };
+  return /* @__PURE__ */ jsx("button", { className: `ndt-buttonExport ndt-Word}`, onClick: createNewWord, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Word" });
+};
+var ExportWord_default = WordExport;
+
+export {
+  ExportWord_default
+};

package/dist/chunk-YP52DDKU.js

@@ -0,0 +1,157 @@
+// components/export/export-excel/exportUtils.ts
+var generateExcelColumns = (columns, exportCustomColumns) => {
+  let excelColumns = columns.filter((column) => column.title !== "").map((column) => ({
+    title: column.title,
+    key: column.field,
+    width: 20
+  }));
+  if (exportCustomColumns) {
+    exportCustomColumns.forEach((custom) => {
+      excelColumns = excelColumns.map(
+        (col) => col.key === custom.key ? { ...col, ...custom } : col
+      );
+    });
+  }
+  return excelColumns;
+};
+var applyHeaderStyles = (row, columnCount) => {
+  row.height = 40;
+  row.font = { size: 12, bold: true };
+  row.alignment = { vertical: "middle", horizontal: "center" };
+  for (let i = 1; i <= columnCount; i++) {
+    const cell = row.getCell(i);
+    cell.alignment = { wrapText: true, vertical: "middle", horizontal: "center" };
+    cell.border = {
+      top: { style: "thin" },
+      left: { style: "thin" },
+      bottom: { style: "thin" },
+      right: { style: "thin" }
+    };
+  }
+};
+var applyRowStyles = (row, columnCount, height = 40, columns) => {
+  row.height = height;
+  row.font = { size: 12 };
+  row.alignment = { vertical: "middle", horizontal: "center" };
+  for (let i = 1; i <= columnCount; i++) {
+    const cell = row.getCell(i);
+    const column = columns[i - 1];
+    cell.alignment = {
+      wrapText: true,
+      vertical: column.cellAlignment ? column.cellAlignment.vertical : "middle",
+      horizontal: column.cellAlignment ? column.cellAlignment.horizontal : "center"
+    };
+    cell.border = {
+      top: { style: "thin" },
+      left: { style: "thin" },
+      bottom: { style: "thin" },
+      right: { style: "thin" }
+    };
+  }
+};
+var generateExcelDataRows = (columns, data, exportCustomColumns) => {
+  return data.map((element, rowIndex) => {
+    return columns.map((col, colIndex) => {
+      const isAutoinc = col.autoinc;
+      if (isAutoinc) return rowIndex + 1;
+      const value = element[col.field];
+      const customCol = exportCustomColumns == null ? void 0 : exportCustomColumns.find((custom) => custom.key === col.field);
+      if (customCol == null ? void 0 : customCol.exportCustomCell) {
+        return customCol.exportCustomCell(String(value != null ? value : ""), element);
+      }
+      if (typeof col.exportCustomCell !== "undefined") {
+        return col.exportCustomCell(String(value != null ? value : ""), element);
+      }
+      return value != null ? value : "";
+    });
+  });
+};
+var setColumnAutoWidths = (sheet) => {
+  var _a;
+  (_a = sheet.columns) == null ? void 0 : _a.forEach((column) => {
+    var _a2;
+    let maxLength = 10;
+    (_a2 = column.eachCell) == null ? void 0 : _a2.call(column, { includeEmpty: true }, (cell) => {
+      const cellValue = cell.value ? String(cell.value) : "";
+      maxLength = Math.max(maxLength, cellValue.length + 5);
+    });
+    column.width = maxLength;
+  });
+};
+
+// components/export/export-excel/ExportExcel.tsx
+import ExcelJS from "exceljs";
+import { jsx } from "react/jsx-runtime";
+var ExportExcel = ({ columns, excelData, tableRef, titleFile, title, text, exportCustomColumns, customHeight }) => {
+  const exportExcel = async () => {
+    const tableData = excelData || tableRef.current.getData();
+    const workbook = new ExcelJS.Workbook();
+    const sheet = workbook.addWorksheet(titleFile, {
+      pageSetup: {
+        fitToPage: true,
+        fitToHeight: 2,
+        fitToWidth: 1,
+        orientation: "landscape"
+      },
+      headerFooter: {
+        oddFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N",
+        evenFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N"
+      }
+    });
+    sheet.properties.defaultRowHeight = 20;
+    let tableHeaderRow = 1;
+    if (title) {
+      sheet.getCell("A1").value = title;
+      sheet.getRow(1).height = 25;
+      sheet.getRow(1).alignment = { vertical: "middle" };
+      sheet.getCell("A1").font = {
+        size: 18,
+        bold: true
+      };
+      tableHeaderRow++;
+    }
+    if (text) {
+      sheet.getCell("A2").value = text;
+      sheet.getRow(2).height = 15;
+      sheet.getRow(2).alignment = { vertical: "middle" };
+      sheet.getCell("A2").font = {
+        size: 12
+      };
+      tableHeaderRow++;
+    }
+    if (title || text) tableHeaderRow++;
+    const excelColumns = generateExcelColumns(columns, exportCustomColumns);
+    sheet.columns = excelColumns;
+    const headerRow = sheet.getRow(tableHeaderRow);
+    headerRow.values = excelColumns.map((col) => col.title);
+    applyHeaderStyles(headerRow, sheet.columns.length);
+    const dataRows = generateExcelDataRows(columns, tableData);
+    dataRows.forEach((data) => {
+      const row = sheet.addRow(data);
+      applyRowStyles(row, sheet.columns.length, customHeight, columns);
+    });
+    setColumnAutoWidths(sheet);
+    if (tableData.length > 15) {
+      sheet.pageSetup.fitToHeight = Math.floor(tableData.length / 15);
+    } else {
+      sheet.pageSetup.fitToHeight = 1;
+    }
+    workbook.xlsx.writeBuffer().then((data) => {
+      const blob = new Blob([data], {
+        type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+      });
+      const url = window.URL.createObjectURL(blob);
+      const anchor = document.createElement("a");
+      anchor.href = url;
+      anchor.download = `${titleFile}.xlsx`;
+      anchor.click();
+      window.URL.revokeObjectURL(url);
+    });
+  };
+  return /* @__PURE__ */ jsx("button", { className: `ndt-buttonExport ndt-Excel`, onClick: exportExcel, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Excel" });
+};
+var ExportExcel_default = ExportExcel;
+
+export {
+  ExportExcel_default
+};

package/dist/export/export-excel/index.d.ts

@@ -1,35 +1,49 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactElement } from 'react';
+import { CellValue } from 'exceljs';
 
 type TableElement = {
     [key: string]: string | number;
 };
-type TableData = Array<TableElement>;
 type Column = {
     field: string;
     title: string;
     width?: number;
     autoinc?: boolean;
-    formatter?: (cell: string, row: TableElement) => ReactElement;
-    exportCustomCell?: (cell: string, row: TableElement) => string;
-    headerFilter?: (headerValue: string, rowValue: string) => string;
+    formatter?: (cell: string, row: TableElement, column: Column) => ReactElement;
+    headerFormatter?: (column: string) => ReactElement;
+    exportCustomCell?: (title: string, row: TableElement) => string;
+    cellAlignment?: CellAlignment;
+    headerFilter?: (headerValue: string, rowValue: string) => boolean;
     sortable?: boolean;
     filterable?: boolean;
+    selectable?: boolean;
+    isSelectableCell?: boolean;
+    filterPlaceholder?: string;
+    editable?: boolean;
 };
 type CustomColumn = {
-    header: string;
+    header?: string;
     key: string;
     width?: number;
+    exportCustomCell?: (value: string, row: TableElement) => string | CellValue;
     [key: string]: any;
 };
-type CustomColumns = Array<CustomColumn> | null;
+type CellAlignment = {
+    vertical: 'top' | 'middle' | 'bottom';
+    horizontal: 'left' | 'center' | 'right';
+};
 type ExcelExportTypes = {
     columns: Array<Column>;
-    excelData: TableData;
-    title: string;
-    exportCustomColumns?: CustomColumns;
+    excelData?: Array<TableElement>;
+    tableRef?: any;
+    titleFile: string;
+    title?: string;
+    text?: string;
+    exportCustomColumns?: Array<CustomColumn>;
+    customHeight?: number;
 };
 
-declare const ExportExcel: ({ columns, excelData, title, exportCustomColumns }: ExcelExportTypes) => react_jsx_runtime.JSX.Element;
+declare const ExportExcel: ({ columns, excelData, tableRef, titleFile, title, text, exportCustomColumns, customHeight }: ExcelExportTypes) => react_jsx_runtime.JSX.Element;
 
 export { type ExcelExportTypes, ExportExcel };

package/dist/export/export-excel/index.js

@@ -1,120 +1,6 @@
-// components/export/export-excel/exportUtils.ts
-var generateExcelColumns = (columns, exportCustomColumns) => {
-  let excelColumns = columns.map((column) => ({
-    header: column.title,
-    key: column.field,
-    width: 20
-  }));
-  if (exportCustomColumns) {
-    exportCustomColumns.forEach((custom) => {
-      excelColumns = excelColumns.map(
-        (col) => col.key === custom.key ? { ...col, ...custom } : col
-      );
-    });
-  }
-  return excelColumns;
-};
-var applyHeaderStyles = (row, columnCount) => {
-  row.height = 40;
-  row.font = { size: 12, bold: true };
-  row.alignment = { vertical: "middle", horizontal: "center" };
-  for (let i = 1; i <= columnCount; i++) {
-    const cell = row.getCell(i);
-    cell.alignment = { wrapText: true, vertical: "middle", horizontal: "center" };
-    cell.border = {
-      top: { style: "thin" },
-      left: { style: "thin" },
-      bottom: { style: "thin" },
-      right: { style: "thin" }
-    };
-  }
-};
-var applyRowStyles = (row, columnCount) => {
-  row.height = 40;
-  row.font = { size: 12 };
-  row.alignment = { vertical: "middle", horizontal: "center" };
-  for (let i = 1; i <= columnCount; i++) {
-    const cell = row.getCell(i);
-    cell.alignment = { wrapText: true, vertical: "middle", horizontal: "center" };
-    cell.border = {
-      top: { style: "thin" },
-      left: { style: "thin" },
-      bottom: { style: "thin" },
-      right: { style: "thin" }
-    };
-  }
-};
-var generateExcelDataRows = (columns, data) => {
-  return data.map((element) => {
-    const rowData = {};
-    columns.forEach((col) => {
-      const value = element[col.field];
-      rowData[col.field] = typeof col.exportCustomCell !== "undefined" ? col.exportCustomCell(String(value), element) : value != null ? value : "";
-    });
-    return rowData;
-  });
-};
-var setColumnAutoWidths = (sheet) => {
-  var _a;
-  (_a = sheet.columns) == null ? void 0 : _a.forEach((column) => {
-    var _a2;
-    let maxLength = 10;
-    (_a2 = column.eachCell) == null ? void 0 : _a2.call(column, { includeEmpty: true }, (cell) => {
-      const cellValue = cell.value ? String(cell.value) : "";
-      maxLength = Math.max(maxLength, cellValue.length + 5);
-    });
-    column.width = maxLength;
-  });
-};
-
-// components/export/export-excel/ExportExcel.tsx
-import ExcelJS from "exceljs";
-import { jsx } from "react/jsx-runtime";
-var ExportExcel = ({ columns, excelData, title, exportCustomColumns }) => {
-  const exportExcel = async () => {
-    const workbook = new ExcelJS.Workbook();
-    const sheet = workbook.addWorksheet(title, {
-      pageSetup: {
-        fitToPage: true,
-        fitToHeight: 2,
-        fitToWidth: 1,
-        orientation: "landscape"
-      },
-      headerFooter: {
-        oddFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N",
-        evenFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N"
-      }
-    });
-    const excelColumns = generateExcelColumns(columns, exportCustomColumns);
-    sheet.columns = excelColumns;
-    const headerRow = sheet.getRow(1);
-    applyHeaderStyles(headerRow, sheet.columns.length);
-    const dataRows = generateExcelDataRows(columns, excelData);
-    dataRows.forEach((data) => {
-      const row = sheet.addRow(data);
-      applyRowStyles(row, sheet.columns.length);
-    });
-    setColumnAutoWidths(sheet);
-    if (excelData.length > 15) {
-      sheet.pageSetup.fitToHeight = Math.floor(excelData.length / 15);
-    } else {
-      sheet.pageSetup.fitToHeight = 1;
-    }
-    workbook.xlsx.writeBuffer().then((data) => {
-      const blob = new Blob([data], {
-        type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
-      });
-      const url = window.URL.createObjectURL(blob);
-      const anchor = document.createElement("a");
-      anchor.href = url;
-      anchor.download = `${title}.xlsx`;
-      anchor.click();
-      window.URL.revokeObjectURL(url);
-    });
-  };
-  return /* @__PURE__ */ jsx("button", { className: `ndt-buttonExport ndt-Excel`, onClick: exportExcel, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Excel" });
-};
-var ExportExcel_default = ExportExcel;
+import {
+  ExportExcel_default
+} from "../../chunk-YP52DDKU.js";
 export {
   ExportExcel_default as ExportExcel
 };

package/dist/export/export-word/index.js

@@ -1,96 +1,6 @@
-// components/export/export-word/ExportHelpers.ts
-function prepareExportRows(columns, data) {
-  return data.map(
-    (row) => columns.map((col) => {
-      const value = row[col.field];
-      return typeof col.exportCustomCell !== "undefined" ? col.exportCustomCell(String(value), row) : String(value != null ? value : "");
-    })
-  );
-}
-function prepareExportHeaders(columns) {
-  return columns.map((col) => col.title);
-}
-
-// components/export/export-word/ExportWord.tsx
 import {
-  AlignmentType,
-  Document,
-  Packer,
-  PageOrientation,
-  Paragraph,
-  Table,
-  TableCell,
-  TableRow,
-  TextRun,
-  VerticalAlign,
-  WidthType
-} from "docx";
-import { saveAs } from "file-saver";
-import { jsx } from "react/jsx-runtime";
-var WordExport = ({
-  wordData,
-  columns,
-  title,
-  options = {
-    fontSize: 20,
-    boldHeaders: false,
-    autoLandscape: false,
-    maxColumnsBeforeLandscape: 5
-  }
-}) => {
-  const createNewWord = async () => {
-    const {
-      fontSize = 0,
-      boldHeaders = true,
-      autoLandscape = true,
-      maxColumnsBeforeLandscape = 5
-    } = options;
-    const isLandscape = autoLandscape && columns.length > maxColumnsBeforeLandscape;
-    const headerCells = prepareExportHeaders(columns).map((header) => new TableCell({
-      children: [new Paragraph({
-        children: [new TextRun({
-          text: header,
-          size: fontSize,
-          bold: boldHeaders
-        })],
-        alignment: AlignmentType.CENTER
-      })],
-      verticalAlign: VerticalAlign.CENTER
-    }));
-    const tableHeaderRow = new TableRow({ children: headerCells });
-    const rows = prepareExportRows(columns, wordData).map((cells) => {
-      const rowCells = cells.map(
-        (value) => new TableCell({
-          children: [new Paragraph({
-            children: [new TextRun({
-              text: value,
-              size: fontSize
-            })],
-            alignment: AlignmentType.CENTER
-          })],
-          verticalAlign: VerticalAlign.CENTER
-        })
-      );
-      return new TableRow({ children: rowCells });
-    });
-    const table = new Table({
-      rows: [tableHeaderRow, ...rows],
-      width: { size: 11e3, type: WidthType.DXA },
-      indent: { size: -1e3, type: WidthType.DXA }
-    });
-    const doc = new Document({
-      sections: [{
-        children: [table, new Paragraph({ text: "" })],
-        properties: isLandscape ? { page: { size: { orientation: PageOrientation.LANDSCAPE } } } : {}
-      }]
-    });
-    Packer.toBlob(doc).then((blob) => {
-      saveAs(blob, `${title}.docx`);
-    });
-  };
-  return /* @__PURE__ */ jsx("button", { className: `ndt-buttonExport ndt-Word}`, onClick: createNewWord, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Word" });
-};
-var ExportWord_default = WordExport;
+  ExportWord_default
+} from "../../chunk-MLSI37NJ.js";
 export {
   ExportWord_default as WordExport
 };

package/dist/index.d.ts

@@ -1,9 +1,17 @@
 import React, { ReactElement } from 'react';
+export { WordExport } from './export/export-word/index.js';
+export { ExportExcel } from './export/export-excel/index.js';
+import 'react/jsx-runtime';
+import 'exceljs';
 
 type TableElement = {
     [key: string]: string | number;
 };
 type TableData = Array<TableElement>;
+type CellAlignment = {
+    vertical: 'top' | 'middle' | 'bottom';
+    horizontal: 'left' | 'center' | 'right';
+};
 type Column = {
     field: string;
     title: string;
@@ -12,6 +20,7 @@ type Column = {
     formatter?: (cell: string, row: TableElement, column: Column) => ReactElement;
     headerFormatter?: (column: string) => ReactElement;
     exportCustomCell?: (title: string, row: TableElement) => string;
+    cellAlignment?: CellAlignment;
     headerFilter?: (headerValue: string, rowValue: string) => boolean;
     sortable?: boolean;
     filterable?: boolean;

package/dist/index.js

@@ -1,11 +1,15 @@
-// components/data-table/DataTable.tsx
-import { useImperativeHandle, useEffect as useEffect2, useState, useCallback, useMemo as useMemo2, forwardRef } from "react";
+import {
+  ExportExcel_default
+} from "./chunk-YP52DDKU.js";
+import {
+  ExportWord_default
+} from "./chunk-MLSI37NJ.js";
 
-// components/data-table/TableHeader.tsx
-import React from "react";
+// components/data-table/DataTable.tsx
+import { useImperativeHandle, useEffect as useEffect2, useState, useCallback, useMemo as useMemo4, forwardRef } from "react";
 
 // components/data-table/Column.tsx
-import { useMemo } from "react";
+import { memo, useMemo } from "react";
 
 // components/data-table/img/SortDown.tsx
 import { jsx } from "react/jsx-runtime";
@@ -49,11 +53,11 @@ var Column = ({ column, getSortField, sortBy, getFilters, filters, selectedRows,
     if (column.headerFormatter) {
       return column.headerFormatter(column.title);
     }
-    return /* @__PURE__ */ jsx3("span", { children: column.title });
+    return /* @__PURE__ */ jsx3("span", { title: `${column.title}`, children: column.title });
   };
   const renderColumnSort = () => {
     if (typeof column.autoinc === "undefined" && (typeof column.sortable === "undefined" || column.sortable)) {
-      return /* @__PURE__ */ jsx3("div", { className: "ndt-sorter", onClick: toggleSort, children: currentSort === "asc" ? /* @__PURE__ */ jsx3(SortDown_default, {}) : currentSort === "desc" ? /* @__PURE__ */ jsx3(SortUp_default, {}) : /* @__PURE__ */ jsx3(SortDown_default, {}) });
+      return /* @__PURE__ */ jsx3("div", { className: "ndt-sorter", role: "button", tabIndex: 1, onClick: toggleSort, children: currentSort === "asc" ? /* @__PURE__ */ jsx3(SortDown_default, {}) : currentSort === "desc" ? /* @__PURE__ */ jsx3(SortUp_default, {}) : /* @__PURE__ */ jsx3(SortDown_default, {}) });
     }
     return /* @__PURE__ */ jsx3(Fragment, {});
   };
@@ -73,12 +77,13 @@ var Column = ({ column, getSortField, sortBy, getFilters, filters, selectedRows,
     ) })
   ] }) });
 };
-var Column_default = Column;
+var Column_default = memo(Column);
 
 // components/data-table/TableHeader.tsx
+import { memo as memo2 } from "react";
 import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 var Header = ({ columns, getSortField, sortBy, getFilters, filters, widths, headerGroup, selectedRows, toggleAllSelection, displayData }) => {
-  const renderHeaderGroup = () => headerGroup && /* @__PURE__ */ jsx4("div", { className: "ndt-table-columns", style: { gridTemplateColumns: widths || "auto" }, children: headerGroup.map((col, id) => /* @__PURE__ */ jsx4("div", { className: "ndt-column", style: { gridColumn: `span ${col.cols || 1}` }, children: /* @__PURE__ */ jsx4("div", { className: "ndt-column-head", children: /* @__PURE__ */ jsx4("span", { children: col.title }) }) }, `header-group-${id}`)) });
+  const renderHeaderGroup = () => headerGroup && /* @__PURE__ */ jsx4("div", { className: "ndt-table-columns", style: { gridTemplateColumns: widths || "auto" }, children: headerGroup.map((col, id) => /* @__PURE__ */ jsx4("div", { className: "ndt-column", style: { gridColumn: `span ${col.cols || 1}` }, children: /* @__PURE__ */ jsx4("div", { className: "ndt-column-head", children: /* @__PURE__ */ jsx4("span", { title: col.title, children: col.title }) }) }, `header-group-${id}`)) });
   const renderColumns = () => columns && columns.length > 0 ? columns.map((column, id) => /* @__PURE__ */ jsx4(
     Column_default,
     {
@@ -98,12 +103,13 @@ var Header = ({ columns, getSortField, sortBy, getFilters, filters, widths, head
     /* @__PURE__ */ jsx4("div", { className: "ndt-table-columns", style: { gridTemplateColumns: widths || "auto" }, children: renderColumns() })
   ] });
 };
-var TableHeader_default = React.memo(Header);
+var TableHeader_default = memo2(Header);
 
 // components/data-table/TableBody.tsx
-import React2 from "react";
+import React, { memo as memo5, useMemo as useMemo3 } from "react";
 
 // components/data-table/Cell.tsx
+import { memo as memo3, useMemo as useMemo2 } from "react";
 import { jsx as jsx5 } from "react/jsx-runtime";
 var Cell = ({
   row,
@@ -121,7 +127,10 @@ var Cell = ({
   const isFormatted = typeof column.formatter !== "undefined";
   const isEditable = !!column.editable;
   const isColumnSelectable = !!column.selectable;
-  const formattedContent = column.formatter && column.formatter(stringValue, row, column);
+  const formattedContent = useMemo2(() => {
+    var _a;
+    return (_a = column.formatter) == null ? void 0 : _a.call(column, stringValue, row, column);
+  }, [column.formatter, stringValue, row, column]);
   const CellWithData = ({ children }) => /* @__PURE__ */ jsx5(
     "div",
     {
@@ -144,22 +153,16 @@ var Cell = ({
   );
   const SelectableCell = () => /* @__PURE__ */ jsx5("div", { className: "ndt-cell ndt-checkbox-cell", onClick: onRowSelect, children: /* @__PURE__ */ jsx5("input", { type: "checkbox", checked: !!isRowSelected, onChange: () => {
   } }) });
-  switch (true) {
-    case isAutoinc:
-      return /* @__PURE__ */ jsx5(CellWithData, { children: displayId + 1 });
-    case isFormatted:
-      return /* @__PURE__ */ jsx5(CellWithData, { children: formattedContent });
-    case isEditable:
-      return /* @__PURE__ */ jsx5(EditableCell, {});
-    case isColumnSelectable:
-      return /* @__PURE__ */ jsx5(SelectableCell, {});
-    default:
-      return /* @__PURE__ */ jsx5(CellWithData, { children: stringValue });
-  }
+  if (isAutoinc) return /* @__PURE__ */ jsx5(CellWithData, { children: displayId + 1 });
+  if (isFormatted) return /* @__PURE__ */ jsx5(CellWithData, { children: formattedContent });
+  if (isEditable) return /* @__PURE__ */ jsx5(EditableCell, {});
+  if (isColumnSelectable) return /* @__PURE__ */ jsx5(SelectableCell, {});
+  return /* @__PURE__ */ jsx5(CellWithData, { children: stringValue });
 };
-var Cell_default = Cell;
+var Cell_default = memo3(Cell);
 
 // components/data-table/Row.tsx
+import { memo as memo4 } from "react";
 import { jsx as jsx6 } from "react/jsx-runtime";
 var Row = ({
   rowId,
@@ -193,7 +196,7 @@ var Row = ({
     }
   );
 };
-var Row_default = Row;
+var Row_default = memo4(Row);
 
 // components/data-table/utils/groupDataBy.ts
 var groupDataBy = (data, key) => {
@@ -227,7 +230,7 @@ var TableBody = ({
   paginationSize,
   paginationPage
 }) => {
-  const grouped = groupBy ? groupDataBy(tableData, groupBy) : [];
+  const grouped = useMemo3(() => groupBy ? groupDataBy(tableData, groupBy) : [], [tableData, groupBy]);
   if (!tableData || tableData.length === 0) {
     return /* @__PURE__ */ jsx7("div", { className: `ndt-table-body${scrollable ? " ndt-table-body-scrollable" : ""}`, style: scrollable ? { height: scrollHeight } : {}, children: /* @__PURE__ */ jsx7("div", { className: "ndt-table-row", style: { height: "100%" }, children: /* @__PURE__ */ jsx7("div", { className: "ndt-row-item", style: { margin: "auto", padding: 20, fontWeight: "bold" }, children: "\u0414\u0430\u043D\u043D\u044B\u0445 \u043D\u0435\u0442" }) }) });
   }
@@ -269,7 +272,7 @@ var TableBody = ({
           `row-${group.key}-${globalIndex}`
         );
       }) : null;
-      return /* @__PURE__ */ jsxs3(React2.Fragment, { children: [
+      return /* @__PURE__ */ jsxs3(React.Fragment, { children: [
         groupHeader,
         rows
       ] }, `group-${group.key}`);
@@ -300,7 +303,7 @@ var TableBody = ({
   };
   return /* @__PURE__ */ jsx7("div", { className: `ndt-table-body${scrollable ? " ndt-table-body-scrollable" : ""}`, style: scrollable ? { height: scrollHeight } : {}, children: groupBy ? renderGroupedRows() : renderFlatRows() });
 };
-var TableBody_default = TableBody;
+var TableBody_default = memo5(TableBody);
 
 // components/data-table/img/NextIcon.tsx
 import { jsx as jsx8 } from "react/jsx-runtime";
@@ -541,44 +544,15 @@ var DataTable = forwardRef(({
   const [paginationPage, setPaginationPage] = useState(0);
   const [collapsedGroups, setCollapsedGroups] = useState({});
   const [selectedRows, setSelectedRows] = useState(/* @__PURE__ */ new Set());
-  const toggleRowSelection = (index) => {
-    setSelectedRows((prev) => {
-      const updated = new Set(prev);
-      if (updated.has(index)) {
-        updated.delete(index);
-      } else {
-        updated.add(index);
-      }
-      return updated;
-    });
-  };
-  const toggleAllSelection = () => {
-    if (selectedRows.size === processedData.length) {
-      setSelectedRows(/* @__PURE__ */ new Set());
-    } else {
-      const all = new Set(processedData.map((_, i) => i));
-      setSelectedRows(all);
-    }
-  };
-  const toggleGroup = (groupKey) => {
-    setCollapsedGroups((prev) => ({
-      ...prev,
-      [groupKey]: !prev[groupKey]
-    }));
-  };
-  const widths = useMemo2(() => {
+  const widths = useMemo4(() => {
     return columns.map((c) => c.width ? `${c.width}px` : "1fr").join(" ");
   }, [columns]);
   const loadFromLocalStorage = useCallback(() => {
     try {
       const s = localStorage.getItem(`${tableName}-sort-by`);
       const f = localStorage.getItem(`${tableName}-filters`);
-      const c = localStorage.getItem(`${tableName}-counts`);
-      const p = localStorage.getItem(`${tableName}-page`);
       if (s) setSortBy(JSON.parse(s));
       if (f) setFilters(JSON.parse(f));
-      if (c) setPaginationSize(c === "all" ? 0 : Number(c));
-      if (p) setPaginationPage(Number(p));
     } catch (e) {
       console.error("Error parsing localStorage data:", e);
       setSortBy({ col: "", type: "asc" });
@@ -591,7 +565,7 @@ var DataTable = forwardRef(({
   useEffect2(() => {
     loadFromLocalStorage();
   }, [loadFromLocalStorage]);
-  const processedData = useMemo2(() => {
+  const processedData = useMemo4(() => {
     let result = [...tableData];
     const columnMap = new Map(columns.map((col) => [col.field, col]));
     for (const field in filters) {
@@ -606,16 +580,40 @@ var DataTable = forwardRef(({
     }
     return result;
   }, [tableData, filters, sortBy, columns]);
-  const displayData = useMemo2(() => {
+  const displayData = useMemo4(() => {
     if (paginationSize === 0) return processedData;
     const start = paginationPage * paginationSize;
     return processedData.slice(start, start + paginationSize);
   }, [processedData, paginationPage, paginationSize]);
-  const rowIdMap = useMemo2(() => {
+  const rowIdMap = useMemo4(() => {
     const map = /* @__PURE__ */ new Map();
     processedData.forEach((row, i) => map.set(row, i));
     return map;
   }, [processedData]);
+  const toggleRowSelection = (index) => {
+    setSelectedRows((prev) => {
+      const updated = new Set(prev);
+      if (updated.has(index)) {
+        updated.delete(index);
+      } else {
+        updated.add(index);
+      }
+      return updated;
+    });
+  };
+  const toggleAllSelection = useCallback(() => {
+    if (selectedRows.size === processedData.length) {
+      setSelectedRows(/* @__PURE__ */ new Set());
+    } else {
+      setSelectedRows(new Set(processedData.map((_, i) => i)));
+    }
+  }, [processedData, selectedRows]);
+  const toggleGroup = (groupKey) => {
+    setCollapsedGroups((prev) => ({
+      ...prev,
+      [groupKey]: !prev[groupKey]
+    }));
+  };
   useEffect2(() => {
     if (Object.values(filters).some((value) => {
       return value !== null && value !== void 0 && value !== "";
@@ -627,12 +625,6 @@ var DataTable = forwardRef(({
   useDebouncedEffect(() => {
     localStorage.setItem(`${tableName}-sort-by`, JSON.stringify(sortBy));
   }, [sortBy, tableName], 500);
-  useEffect2(() => {
-    localStorage.setItem(`${tableName}-counts`, paginationSize === 0 ? "all" : paginationSize.toString());
-  }, [paginationSize, tableName]);
-  useEffect2(() => {
-    localStorage.setItem(`${tableName}-page`, paginationPage.toString());
-  }, [paginationPage, tableName]);
   useImperativeHandle(ref, () => ({
     getData: () => processedData,
     getCurrentData: () => displayData,
@@ -689,5 +681,7 @@ var DataTable = forwardRef(({
 DataTable.displayName = "DataTable";
 var DataTable_default = DataTable;
 export {
-  DataTable_default as DataTable
+  DataTable_default as DataTable,
+  ExportExcel_default as ExportExcel,
+  ExportWord_default as WordExport
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nillud-data-table",
-  "version": "1.4.0",
+  "version": "1.4.2",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -12,16 +12,19 @@
   "exports": {
     ".": {
       "import": "./dist/index.js",
+      "require": "./dist/index.js",
       "types": "./dist/index.d.ts"
     },
     "./types": "./dist/index.d.ts",
     "./styles.css": "./dist/styles.css",
     "./export-excel": {
       "import": "./dist/export/export-excel/index.js",
+      "require": "./dist/export/export-excel/index.js",
       "types": "./dist/export/export-excel/index.d.ts"
     },
     "./export-word": {
       "import": "./dist/export/export-word/index.js",
+      "require": "./dist/export/export-word/index.js",
       "types": "./dist/export/export-word/index.d.ts"
     }
   },