nillud-data-table 1.1.3 → 1.2.1

package/README.md

@@ -414,136 +414,149 @@ scrollable
 scrollHeight={410}
 ```
 
-### exportSectionComponent
+### headerGroup
 
-Необязательный параметр. Необходимо подключить модуль ExportSection и установить пакеты для экспорта Word и Excel
+Необязательный параметр. Передается **массив объектов**. Отображает сгруппированные заголовки таблицы, где title - заголовок группы, а cols - количество столбцов, на которое растягивается группа
 
-```bash
-npm i exceljs docx file-saver
--или-
-yarn add exceljs docx file-saver
+```tsx
+headerGroup={[{ title: 'Личные данные', cols: 4 }, { title: 'Оборудование', cols: 2 }]}
 ```
 
-Использование:
+### groupBy
 
-```tsx
-import { DataTable, ExportSection } from 'nillud-data-table'
+Необязательный параметр. Передается **строка**. Отображает строки таблицы, сгруппированные по столбцу, указанному в groupBy, каждую группу можно свернуть и раскрыть
 
-<DataTable
-    tableData={tableData}
-    columns={columns}
-    tableName={'current-tasks'}
-    ExportSectionComponent={ExportSection}
-/>
+```tsx
+groupBy={'status'}
 ```
 
-### exportCustomColumns
-
-Необязательный параметр. Принимает в себя массив объектов формата.
-По умолчанию:
-- Ключ header содержит в себе значение **title** объекта из массива columns
-- Ключ key содержит в себе значение **field** объекта из массива columns
-- Ключ width по умолчанию умеет ширину 20 у.е. по системе Excel
+### isTitles
 
-Дополнительные параметры можно добавлять исходя из документации [exceljs](https://www.npmjs.com/package/exceljs). 
-Для изменения/добавления каких-либо параметров в массиве необходимо указать объект с нужным ключом **key**
+Необязательный параметр. Передается **boolean** значение. Отображает **html title** при наведении на ячейку, по умолчанию **false**
 
 ```tsx
-excelCustomColumns={[
-    {
-        key: 'name',
-        width: 50
-    }
-]}
+isTitles
 ```
 
-### excelBtn
+### Возможности useRef
 
-Необязательный параметр. Тип **boolean**, по умолчанию **false**. При значении **true** над таблицей с правой стороны появляется кнопка экспорта Excel, которая по умолчанию принимает в себя исходный массив **tableData**
+Возможность подключиться напрямую к таблице и получить данные после всех манипуляций
 
-Для использования модуля Excel необходимо установить библиотеку [exceljs](https://www.npmjs.com/package/exceljs)
+```tsx
+import { useRef } from "react";
+
+const tableRef = useRef<DataTableRef>(null);
+
+<DataTable
+    ...
+    ref={tableRef}
+    ...
+/>
+
+const func = () => {
+    const data = tableRef.current.getData() // Получить текущие данные, после сортировки и фильтрации
+    const currData = tableRef.current.getCurrentData() // Получить данные с текущей таблицы пагинации
+}
 
-```bash
-npm i exceljs
--или-
-yarn add exceljs
 ```
 
-### wordBtn
+## Возможности экспорта данных
 
-Необязательный параметр. Тип **boolean**, по умолчанию **false**. При значении **true** над таблицей с правой стороны появляется кнопка экспорта Word, которая по умолчанию принимает в себя исходный массив **tableData**
+### ExportExcel
 
-Для использования модуля Word необходимо установить библиотеки [docx](https://www.npmjs.com/package/docx) и [file-saver](https://www.npmjs.com/package/file-saver)
+Требует установки пакета Exceljs
 
 ```bash
-npm i docx file-saver
--или-
-yarn add docx file-saver
+npm install exceljs
+# или
+yarn add exceljs
 ```
 
-### wordOptions
-
-Необязательный параметр. Используется вместе с **wordBtn**. Принимает в себя объект
-
+Пример вызова
 ```tsx
-options = {
-    fontSize: 20, // размер шрифта, 
-    boldHeaders: false, // Заголовки жирным начертанием, 
-    autoLandscape: false, // делать ли альбомный формат, 
-    maxColumnsBeforeLandscape: 5 // и от скольки столбцов. 
-}
+<ExportExcel
+    columns={columns} // Колонки таблицы
+    excelData={tableData} // Данные таблицы
+    title={'table-name'} // Название таблицы
+    exportCustomColumns={[{
+        header: 'Наименование',
+        key: 'name',
+        width: 50,
+        ...
+    }]} // Описание ниже
+/>
 ```
 
-### downloadSectionLeftSideContent
+#### exportCustomColumns
 
-Необязательный параметр. Передается **React.Component**. Отображает компонент с левой стороны от кнопок экспорта. Создано для экономии места
+Необязательный параметр. Принимает в себя массив объектов формата.
+По умолчанию:
+- Ключ header содержит в себе значение **title** объекта из массива columns
+- Ключ key содержит в себе значение **field** объекта из массива columns
+- Ключ width по умолчанию умеет ширину 20 у.е. по системе Excel
 
-```tsx
-downloadSectionLeftSideContent={<button className='base-button' onClick={() => setCanvas(true)}>OffCanvas</button>}
-```
+Дополнительные параметры можно добавлять исходя из документации [exceljs](https://www.npmjs.com/package/exceljs). 
+Для изменения/добавления каких-либо параметров в массиве необходимо указать объект с нужным ключом **key**
 
-### headerGroup
+### ExportWord
 
-Необязательный параметр. Передается **массив объектов**. Отображает сгруппированные заголовки таблицы, где title - заголовок группы, а cols - количество столбцов, на которое растягивается группа
+Требует установки пакетов docx и file-saver
 
-```tsx
-headerGroup={[{ title: 'Личные данные', cols: 4 }, { title: 'Оборудование', cols: 2 }]}
+```bash
+npm install docx file-saver
+# или
+yarn add docx file-saver
 ```
 
-### groupBy
-
-Необязательный параметр. Передается **строка**. Отображает строки таблицы, сгруппированные по столбцу, указанному в groupBy, каждую группу можно свернуть и раскрыть
-
+Пример вызова
 ```tsx
-groupBy={'status'}
+<ExportWord
+    columns={columns} // Колонки таблицы
+    wordData={tableData} // Данные таблицы
+    title={'table-name'} // Название таблицы
+    options={
+        fontSize: 20,
+        boldHeaders: false,
+        autoLandscape: false,
+        maxColumnsBeforeLandscape: 5
+    } // Описание ниже
+/>
 ```
 
-### isTitles
+#### wordOptions
 
-Необязательный параметр. Передается **boolean** значение. Отображает **html title** при наведении на ячейку, по умолчанию **false**
+Необязательный параметр. Принимает в себя объект:
 
 ```tsx
-isTitles
+options = {{
+    fontSize: 20, // размер шрифта, 
+    boldHeaders: false, // Заголовки жирным начертанием, 
+    autoLandscape: false, // делать ли альбомный формат, 
+    maxColumnsBeforeLandscape: 5 // и от скольки столбцов. 
+}}
 ```
 
-### Возможности useRef
+### ExportSection
 
-Возможность подключиться напрямую к таблице и получить данные после всех манипуляций
+Если нужно использовать секцию, по умолчанию 2 кнопки Word и Excel справа. А так же **downloadSectionLeftSideContent** принимает **React.Component**
 
 ```tsx
-import { useRef } from "react";
-
-const tableRef = useRef<DataTableRef>(null);
-
-<DataTable
-    ...
-    ref={tableRef}
-    ...
+<ExportSection
+    wordBtn // boolean - использовать экспорт Word
+    excelBtn // boolean - использовать экспорт Excel
+    downloadSectionLeftSideContent={<>...</>} // React.Component - произвольный контент
+    tableData={tableData} // Данные таблицы
+    columns={columns} // Колонки таблицы
+    tableName={'table-name'} // Название таблицы
+    exportCustomColumns={[{...}, {...}]}
+    wordOptions={{...}}
 />
+```
 
-const func = () => {
-    const data = tableRef.current.getData() // Получить текущие данные, после сортировки и фильтрации
-    const currData = tableRef.current.getCurrentData() // Получить данные с текущей таблицы пагинации
-}
+##### downloadSectionLeftSideContent
+
+Необязательный параметр. Передается **React.Component**. Отображает компонент с левой стороны от кнопок экспорта. Создано для экономии места
 
+```tsx
+downloadSectionLeftSideContent={<button className='base-button' onClick={() => setCanvas(true)}>OffCanvas</button>}
 ```

package/dist/export/index.d.ts

@@ -0,0 +1,61 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactElement } from 'react';
+
+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;
+    sortable?: boolean;
+    filterable?: boolean;
+};
+type ExportOptions = {
+    fontSize?: number;
+    boldHeaders?: boolean;
+    autoLandscape?: boolean;
+    maxColumnsBeforeLandscape?: number;
+};
+type CustomColumn = {
+    header: string;
+    key: string;
+    width?: number;
+    [key: string]: any;
+};
+type CustomColumns = Array<CustomColumn> | null;
+type ExportSectionTypes = {
+    wordBtn: boolean;
+    excelBtn: boolean;
+    downloadSectionLeftSideContent: ReactElement | null;
+    tableData: TableData;
+    columns: Array<Column>;
+    tableName: string;
+    exportCustomColumns?: CustomColumns;
+    wordOptions?: ExportOptions;
+};
+type ExcelExportTypes = {
+    columns: Array<Column>;
+    excelData: TableData;
+    title: string;
+    exportCustomColumns?: ExportSectionTypes["exportCustomColumns"];
+};
+type ExportWordTypes = {
+    wordData: TableData;
+    columns: Array<Column>;
+    title: string;
+    options?: ExportOptions;
+};
+
+declare const ExportExcel: ({ columns, excelData, title, exportCustomColumns }: ExcelExportTypes) => react_jsx_runtime.JSX.Element;
+
+declare const WordExport: ({ wordData, columns, title, options }: ExportWordTypes) => react_jsx_runtime.JSX.Element;
+
+declare const ExportSection: ({ wordBtn, excelBtn, downloadSectionLeftSideContent, tableData, columns, tableName, exportCustomColumns, wordOptions }: ExportSectionTypes) => react_jsx_runtime.JSX.Element;
+
+export { type ExcelExportTypes, ExportExcel, ExportSection, type ExportSectionTypes, type ExportWordTypes, WordExport };

package/dist/export/index.js

@@ -0,0 +1,254 @@
+// components/export/exportUtils/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/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;
+
+// components/export/exportUtils/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/ExportWord.tsx
+import {
+  AlignmentType,
+  Document,
+  Packer,
+  PageOrientation,
+  Paragraph,
+  Table,
+  TableCell,
+  TableRow,
+  TextRun,
+  VerticalAlign,
+  WidthType
+} from "docx";
+import { saveAs } from "file-saver";
+import { jsx as jsx2 } 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__ */ jsx2("button", { className: `ndt-buttonExport ndt-Word}`, onClick: createNewWord, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Word" });
+};
+var ExportWord_default = WordExport;
+
+// components/export/ExportSection.tsx
+import { Fragment, jsx as jsx3, jsxs } from "react/jsx-runtime";
+var ExportSection = ({
+  wordBtn,
+  excelBtn,
+  downloadSectionLeftSideContent,
+  tableData,
+  columns,
+  tableName,
+  exportCustomColumns,
+  wordOptions
+}) => {
+  return /* @__PURE__ */ jsx3(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "ndt-download-section", children: [
+    /* @__PURE__ */ jsx3("div", { className: "ndt-download-content", children: (wordBtn || excelBtn) && downloadSectionLeftSideContent !== null && downloadSectionLeftSideContent }),
+    /* @__PURE__ */ jsxs("div", { className: "ndt-download-buttons", children: [
+      wordBtn && /* @__PURE__ */ jsx3(
+        ExportWord_default,
+        {
+          wordData: tableData,
+          columns,
+          title: tableName,
+          options: wordOptions
+        }
+      ),
+      excelBtn && /* @__PURE__ */ jsx3(
+        ExportExcel_default,
+        {
+          excelData: tableData,
+          columns,
+          title: tableName,
+          exportCustomColumns
+        }
+      )
+    ] })
+  ] }) });
+};
+var ExportSection_default = ExportSection;
+export {
+  ExportExcel_default as ExportExcel,
+  ExportSection_default as ExportSection,
+  ExportWord_default as WordExport
+};

package/dist/index.d.ts

@@ -1,5 +1,4 @@
-import React$1, { ReactElement } from 'react';
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import React, { ReactElement } from 'react';
 
 type TableElement = {
     [key: string]: string | number;
@@ -16,12 +15,6 @@ type Column = {
     sortable?: boolean;
     filterable?: boolean;
 };
-type ExportOptions = {
-    fontSize?: number;
-    boldHeaders?: boolean;
-    autoLandscape?: boolean;
-    maxColumnsBeforeLandscape?: number;
-};
 type TableProps = {
     tableData: TableData;
     columns: Array<Column>;
@@ -32,53 +25,18 @@ type TableProps = {
     paginationCounts?: Array<number> | null;
     scrollable?: boolean;
     scrollHeight?: number;
-    exportCustomColumns?: Array<{
-        header: string;
-        key: string;
-        width: number;
-    }> | null;
-    excelBtn?: boolean;
-    wordBtn?: boolean;
-    downloadSectionLeftSideContent?: ReactElement | null;
     headerGroup?: Array<{
         title: string;
         cols: number;
     }> | null;
     groupBy?: string | null;
     isTitles?: boolean;
-    wordOptions?: ExportOptions;
-    ExportSectionComponent?: React.ComponentType<{
-        wordBtn: boolean;
-        excelBtn: boolean;
-        downloadSectionLeftSideContent: ReactElement | null;
-        tableData: TableData;
-        columns: Array<Column>;
-        tableName: string;
-        exportCustomColumns?: Array<{
-            header: string;
-            key: string;
-            width: number;
-        }> | null;
-        wordOptions?: any;
-    }> | null;
 };
 type DataTableRef = {
     getData: () => TableData;
     getCurrentData: () => TableData;
 };
 
-declare const DataTable: React$1.ForwardRefExoticComponent<TableProps & React$1.RefAttributes<DataTableRef>>;
-
-type Props = {
-    wordBtn: boolean;
-    excelBtn: boolean;
-    downloadSectionLeftSideContent: ReactElement | null;
-    tableData: TableData;
-    columns: Array<Column>;
-    tableName: string;
-    exportCustomColumns?: TableProps['exportCustomColumns'];
-    wordOptions?: ExportOptions;
-};
-declare const ExportSection: ({ wordBtn, excelBtn, downloadSectionLeftSideContent, tableData, columns, tableName, exportCustomColumns, wordOptions }: Props) => react_jsx_runtime.JSX.Element;
+declare const DataTable: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<DataTableRef>>;
 
-export { type Column, DataTable, type DataTableRef, ExportSection, type TableElement, type TableProps };
+export { type Column, DataTable, type DataTableRef, type TableElement, type TableProps };

package/dist/index.js

@@ -1,27 +1,27 @@
-// components/DataTable.tsx
+// components/data-table/DataTable.tsx
 import { useImperativeHandle, useEffect as useEffect2, useState, useCallback, useMemo as useMemo2, forwardRef } from "react";
 
-// components/TableHeader.tsx
+// components/data-table/TableHeader.tsx
 import React from "react";
 
-// components/Column.tsx
+// components/data-table/Column.tsx
 import { useMemo } from "react";
 
-// components/img/SortDown.tsx
+// components/data-table/img/SortDown.tsx
 import { jsx } from "react/jsx-runtime";
 var SortDown = () => {
   return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "currentColor", className: "bi bi-caret-down-fill", viewBox: "0 0 16 16", children: /* @__PURE__ */ jsx("path", { d: "M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z" }) });
 };
 var SortDown_default = SortDown;
 
-// components/img/SortUp.tsx
+// components/data-table/img/SortUp.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
 var SortUp = () => {
   return /* @__PURE__ */ jsx2("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "currentColor", className: "bi bi-caret-up-fill", viewBox: "0 0 16 16", children: /* @__PURE__ */ jsx2("path", { d: "m7.247 4.86-4.796 5.481c-.566.647-.106 1.659.753 1.659h9.592a1 1 0 0 0 .753-1.659l-4.796-5.48a1 1 0 0 0-1.506 0z" }) });
 };
 var SortUp_default = SortUp;
 
-// components/Column.tsx
+// components/data-table/Column.tsx
 import { jsx as jsx3, jsxs } from "react/jsx-runtime";
 var Column = ({ column, getSortField, sortBy, getFilters, filters }) => {
   var _a;
@@ -53,7 +53,7 @@ var Column = ({ column, getSortField, sortBy, getFilters, filters }) => {
 };
 var Column_default = Column;
 
-// components/TableHeader.tsx
+// components/data-table/TableHeader.tsx
 import { Fragment, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 var Header = ({ columns, getSortField, sortBy, getFilters, filters, widths, headerGroup }) => {
   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}`)) });
@@ -75,10 +75,10 @@ var Header = ({ columns, getSortField, sortBy, getFilters, filters, widths, head
 };
 var TableHeader_default = React.memo(Header);
 
-// components/TableBody.tsx
+// components/data-table/TableBody.tsx
 import React2 from "react";
 
-// components/Cell.tsx
+// components/data-table/Cell.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
 var Cell = ({
   row,
@@ -100,7 +100,7 @@ var Cell = ({
 };
 var Cell_default = Cell;
 
-// components/Row.tsx
+// components/data-table/Row.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
 var Row = ({ rowId, columns, row, widths, isTitles }) => /* @__PURE__ */ jsx6("div", { className: "ndt-table-row", style: { gridTemplateColumns: widths }, children: columns.map((column, id) => /* @__PURE__ */ jsx6(
   Cell_default,
@@ -114,7 +114,7 @@ var Row = ({ rowId, columns, row, widths, isTitles }) => /* @__PURE__ */ jsx6("d
 )) });
 var Row_default = Row;
 
-// utils/groupDataBy.ts
+// components/data-table/utils/groupDataBy.ts
 var groupDataBy = (data, key) => {
   const groups = /* @__PURE__ */ new Map();
   data.forEach((item) => {
@@ -127,7 +127,7 @@ var groupDataBy = (data, key) => {
   return Array.from(groups.entries()).map(([key2, items]) => ({ key: key2, items }));
 };
 
-// components/TableBody.tsx
+// components/data-table/TableBody.tsx
 import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
 var TableBody = ({
   columns,
@@ -185,35 +185,35 @@ var TableBody = ({
 };
 var TableBody_default = TableBody;
 
-// components/img/NextIcon.tsx
+// components/data-table/img/NextIcon.tsx
 import { jsx as jsx8 } from "react/jsx-runtime";
 var NextIcon = () => {
   return /* @__PURE__ */ jsx8("svg", { width: "41", height: "65", viewBox: "0 0 41 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx8("path", { d: "M0.674316 57.2669L25.3872 32.5L0.674316 7.73312L8.28244 0.125L40.6574 32.5L8.28244 64.875L0.674316 57.2669Z", fill: "#666666" }) });
 };
 var NextIcon_default = NextIcon;
 
-// components/img/LastIcon.tsx
+// components/data-table/img/LastIcon.tsx
 import { jsx as jsx9 } from "react/jsx-runtime";
 var LastIcon = () => {
   return /* @__PURE__ */ jsx9("svg", { width: "68", height: "65", viewBox: "0 0 68 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx9("path", { d: "M0.185059 7.73312L24.9519 32.5L0.185059 57.2669L7.79318 64.875L40.1682 32.5L7.79318 0.125L0.185059 7.73312ZM56.3557 0.125H67.1474V64.875H56.3557V0.125Z", fill: "#666666" }) });
 };
 var LastIcon_default = LastIcon;
 
-// components/img/PrevIcon.tsx
+// components/data-table/img/PrevIcon.tsx
 import { jsx as jsx10 } from "react/jsx-runtime";
 var PrevIcon = () => {
   return /* @__PURE__ */ jsx10("svg", { width: "41", height: "65", viewBox: "0 0 41 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M40.6574 57.2669L15.9445 32.5L40.6574 7.73312L33.0493 0.125L0.674316 32.5L33.0493 64.875L40.6574 57.2669Z", fill: "#666666" }) });
 };
 var PrevIcon_default = PrevIcon;
 
-// components/img/FirstIcon.tsx
+// components/data-table/img/FirstIcon.tsx
 import { jsx as jsx11 } from "react/jsx-runtime";
 var FirstIcon = () => {
   return /* @__PURE__ */ jsx11("svg", { width: "68", height: "65", viewBox: "0 0 68 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx11("path", { d: "M67.1474 57.2669L42.3805 32.5L67.1474 7.73312L59.5392 0.125L27.1642 32.5L59.5392 64.875L67.1474 57.2669ZM0.185059 0.125H10.9767V64.875H0.185059V0.125Z", fill: "#666666" }) });
 };
 var FirstIcon_default = FirstIcon;
 
-// components/TableFooter.tsx
+// components/data-table/TableFooter.tsx
 import { jsx as jsx12, jsxs as jsxs4 } from "react/jsx-runtime";
 var TableFooter = ({
   tableData,
@@ -235,7 +235,7 @@ var TableFooter = ({
     }
   };
   const renderPageNumbers = () => {
-    if (totalPages <= 1) return null;
+    if (totalPages <= 1) return /* @__PURE__ */ jsx12("button", { onClick: () => handlePageChange(0), children: "1" }, "page-0");
     const pages = [];
     const maxVisible = 5;
     let start = Math.max(0, paginationPage - Math.floor(maxVisible / 2));
@@ -340,7 +340,7 @@ var TableFooter = ({
 };
 var TableFooter_default = TableFooter;
 
-// components/functions/sort-data.ts
+// components/data-table/utils/sort-data.ts
 var sortByAsc = (data, column) => {
   const sortedData = data.sort((a, b) => {
     if (!isNaN(+a[column]) && !isNaN(+b[column])) {
@@ -384,7 +384,7 @@ var filterData = (data, filter, value) => {
   return filteredData;
 };
 
-// utils/useDebouncedEffect.tsx
+// components/data-table/utils/useDebouncedEffect.tsx
 import { useEffect } from "react";
 function useDebouncedEffect(callback, deps, delay) {
   useEffect(() => {
@@ -393,7 +393,7 @@ function useDebouncedEffect(callback, deps, delay) {
   }, [...deps, delay]);
 }
 
-// components/DataTable.tsx
+// components/data-table/DataTable.tsx
 import { jsx as jsx13, jsxs as jsxs5 } from "react/jsx-runtime";
 var DataTable = forwardRef(({
   tableData,
@@ -405,19 +405,13 @@ var DataTable = forwardRef(({
   paginationCounts = null,
   scrollable = false,
   scrollHeight = 300,
-  exportCustomColumns = null,
-  excelBtn = false,
-  wordBtn = false,
-  downloadSectionLeftSideContent = null,
   headerGroup = null,
   groupBy = null,
-  isTitles = false,
-  wordOptions,
-  ExportSectionComponent = null
+  isTitles = false
 }, ref) => {
   const [filters, setFilters] = useState({});
   const [sortBy, setSortBy] = useState({ col: "", type: "asc" });
-  const [paginationSize, setPaginationSize] = useState((paginationCounts == null ? void 0 : paginationCounts[0]) || 10);
+  const [paginationSize, setPaginationSize] = useState((paginationCounts == null ? void 0 : paginationCounts[0]) || 0);
   const [paginationPage, setPaginationPage] = useState(0);
   const [collapsedGroups, setCollapsedGroups] = useState({});
   const toggleGroup = (groupKey) => {
@@ -489,316 +483,48 @@ var DataTable = forwardRef(({
     getData: () => processedData,
     getCurrentData: () => displayData
   }), [processedData, displayData]);
-  return /* @__PURE__ */ jsxs5("div", { className: "ndt-table-container", children: [
-    ExportSectionComponent && /* @__PURE__ */ jsx13(
-      ExportSectionComponent,
+  return /* @__PURE__ */ jsx13("div", { className: "ndt-table-container", children: /* @__PURE__ */ jsxs5("div", { className: "ndt-table", children: [
+    /* @__PURE__ */ jsx13(
+      TableHeader_default,
+      {
+        columns,
+        sortBy,
+        getSortField: setSortBy,
+        filters,
+        getFilters: setFilters,
+        widths,
+        headerGroup
+      }
+    ),
+    loading ? loadingElement !== null ? loadingElement : /* @__PURE__ */ jsx13("span", { style: { marginLeft: 10, fontWeight: "bold" }, children: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445..." }) : /* @__PURE__ */ jsx13(
+      TableBody_default,
       {
-        wordBtn,
-        excelBtn,
-        downloadSectionLeftSideContent,
         tableData: displayData,
         columns,
-        tableName,
-        exportCustomColumns,
-        wordOptions
+        scrollable,
+        scrollHeight,
+        widths,
+        groupBy,
+        collapsedGroups,
+        toggleGroup,
+        isTitles
       }
     ),
-    /* @__PURE__ */ jsxs5("div", { className: "ndt-table", children: [
-      /* @__PURE__ */ jsx13(
-        TableHeader_default,
-        {
-          columns,
-          sortBy,
-          getSortField: setSortBy,
-          filters,
-          getFilters: setFilters,
-          widths,
-          headerGroup
-        }
-      ),
-      loading ? loadingElement !== null ? loadingElement : /* @__PURE__ */ jsx13("span", { style: { marginLeft: 10, fontWeight: "bold" }, children: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445..." }) : /* @__PURE__ */ jsx13(
-        TableBody_default,
-        {
-          tableData: displayData,
-          columns,
-          scrollable,
-          scrollHeight,
-          widths,
-          groupBy,
-          collapsedGroups,
-          toggleGroup,
-          isTitles
-        }
-      ),
-      isFooter && /* @__PURE__ */ jsx13(
-        TableFooter_default,
-        {
-          paginationCounts,
-          tableData: processedData,
-          paginationSize,
-          getPaginationSize: setPaginationSize,
-          paginationPage,
-          getPaginationPage: setPaginationPage
-        }
-      )
-    ] })
-  ] });
+    isFooter && /* @__PURE__ */ jsx13(
+      TableFooter_default,
+      {
+        paginationCounts,
+        tableData: processedData,
+        paginationSize,
+        getPaginationSize: setPaginationSize,
+        paginationPage,
+        getPaginationPage: setPaginationPage
+      }
+    )
+  ] }) });
 });
 DataTable.displayName = "DataTable";
 var DataTable_default = DataTable;
-
-// utils/exportUtils/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/WordExport.tsx
-import {
-  AlignmentType,
-  Document,
-  Packer,
-  PageOrientation,
-  Paragraph,
-  Table,
-  TableCell,
-  TableRow,
-  TextRun,
-  VerticalAlign,
-  WidthType
-} from "docx";
-import { saveAs } from "file-saver";
-import { jsx as jsx14 } from "react/jsx-runtime";
-var WordExport = ({
-  wordData,
-  columns,
-  title,
-  options = {
-    fontSize: 20,
-    boldHeaders: false,
-    autoLandscape: false,
-    maxColumnsBeforeLandscape: 5
-  }
-  // exportCustomColumns 
-}) => {
-  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__ */ jsx14("button", { className: `ndt-buttonExport ndt-Word}`, onClick: createNewWord, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Word" });
-};
-var WordExport_default = WordExport;
-
-// utils/exportUtils/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/ExportExcel.tsx
-import ExcelJS from "exceljs";
-import { jsx as jsx15 } 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__ */ jsx15("button", { className: `ndt-buttonExport ndt-Excel`, onClick: exportExcel, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Excel" });
-};
-var ExportExcel_default = ExportExcel;
-
-// components/ExportSection.tsx
-import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs6 } from "react/jsx-runtime";
-var ExportSection = ({
-  wordBtn,
-  excelBtn,
-  downloadSectionLeftSideContent,
-  tableData,
-  columns,
-  tableName,
-  exportCustomColumns,
-  wordOptions
-}) => {
-  return /* @__PURE__ */ jsx16(Fragment2, { children: /* @__PURE__ */ jsxs6("div", { className: "ndt-download-section", children: [
-    /* @__PURE__ */ jsx16("div", { className: "ndt-download-content", children: (wordBtn || excelBtn) && downloadSectionLeftSideContent !== null && downloadSectionLeftSideContent }),
-    /* @__PURE__ */ jsxs6("div", { className: "ndt-download-buttons", children: [
-      wordBtn && /* @__PURE__ */ jsx16(
-        WordExport_default,
-        {
-          wordData: tableData,
-          columns,
-          title: tableName,
-          exportCustomColumns,
-          options: wordOptions
-        }
-      ),
-      excelBtn && /* @__PURE__ */ jsx16(
-        ExportExcel_default,
-        {
-          excelData: tableData,
-          columns,
-          title: tableName,
-          exportCustomColumns
-        }
-      )
-    ] })
-  ] }) });
-};
-var ExportSection_default = ExportSection;
 export {
-  DataTable_default as DataTable,
-  ExportSection_default as ExportSection
+  DataTable_default as DataTable
 };

package/dist/styles.css

@@ -1,14 +1,4 @@
 @charset "UTF-8";
-.ndt-table-container .ndt-download-section {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 16px;
-}
-.ndt-table-container .ndt-download-section button:not(:last-child) {
-  margin-right: 10px;
-}
 .ndt-table-container .ndt-table {
   border-radius: 4px;
   border: 1px solid #ddd;
@@ -25,12 +15,14 @@
   border-bottom: 2px solid #ddd;
 }
 .ndt-table-container .ndt-table .ndt-table-columns .ndt-column {
-  padding: 16px 10px;
+  padding: 10px 10px;
 }
 .ndt-table-container .ndt-table .ndt-table-columns .ndt-column:not(:last-child) {
   border-right: 1px solid #ddd;
 }
 .ndt-table-container .ndt-table .ndt-table-columns .ndt-column .ndt-column-head {
+  font-size: 14px;
+  font-weight: 700;
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -55,7 +47,15 @@
 }
 .ndt-table-container .ndt-table .ndt-table-columns .ndt-column .ndt-column-footer input {
   width: 100%;
-  padding: 4px;
+  color: #222;
+  font-weight: 400;
+  letter-spacing: -0.01em;
+  line-height: 24px;
+  border: 1px solid #d9d9d9;
+  border-radius: 5px;
+  font-size: 14px;
+  padding: 4px 11px;
+  height: 43px;
 }
 .ndt-table-container .ndt-table .ndt-table-body {
   z-index: 1000;
@@ -91,6 +91,13 @@
 .ndt-table-container .ndt-table .ndt-table-body .ndt-table-row:nth-child(2n) {
   background-color: rgba(0, 0, 0, 0.05);
 }
+.ndt-table-container .ndt-table .ndt-table-body .ndt-table-row .ndt-cell {
+  display: flex;
+  align-items: center;
+  color: #333;
+  font-size: 16px;
+  font-weight: 400;
+}
 .ndt-table-container .ndt-table .ndt-table-body .ndt-table-row .ndt-cell:not(:last-child) {
   border-right: 1px solid #ddd;
 }
@@ -101,14 +108,20 @@
   border-top: 2px solid #cccccc;
   padding: 10px;
 }
+.ndt-table-container .ndt-table .ndt-table-footer .ndt-footer-count {
+  font-size: 14px;
+  color: #777777;
+}
 .ndt-table-container .ndt-table .ndt-table-footer .ndt-footer-pagination {
   display: flex;
 }
 .ndt-table-container .ndt-table .ndt-table-footer .ndt-footer-pagination .ndt-pagination-counts span {
   margin-right: 5px;
+  color: #777777;
 }
 .ndt-table-container .ndt-table .ndt-table-footer .ndt-footer-pagination .ndt-pagination-counts select {
-  height: 25px;
+  height: 32px;
+  border: 1px solid #cccccc;
   min-width: 50px;
   text-align: center;
 }
@@ -117,12 +130,12 @@
   display: flex;
 }
 .ndt-table-container .ndt-table .ndt-table-footer .ndt-footer-pagination .ndt-pagination-buttons button {
-  margin-right: 5px;
+  margin-right: 10px;
   background-color: #fff;
   border: 1px solid #cccccc;
   border-radius: 4px;
   cursor: pointer;
-  padding: 4px;
+  padding: 4px 10px;
   height: 100%;
   font-size: 14px;
 }
@@ -200,4 +213,15 @@
   color: #48ae78;
 }
 
+.ndt-download-section {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16px;
+}
+.ndt-download-section button:not(:last-child) {
+  margin-right: 10px;
+}
+
 /*# sourceMappingURL=styles.css.map */

package/dist/styles.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../styles/data-table.scss"],"names":[],"mappings":";AACI;EACI;EACA;EACA;EACA;EACA;;AAIA;EACI;;AAIR;EACI;EACA;;AAEA;AAAA;EAEI;;AAGJ;AAAA;EAEI;;AAGJ;EACI;;AAEA;EACI;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAMR;EACI;EACA;;AAMhB;EACI;;AAEA;EACI;EACA;EACA;;AAGA;EACI;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;;AAKJ;EACI;;AAGJ;EACI;;AAIA;EACI;;AAMhB;EACI;EACA;EACA;EACA;EACA;;AAIA;EACI;;AAGI;EACI;;AAGJ;EACI;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EAGI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;;AAEA;EACI;;AAEA;EACI;EACA;EACA;;;AAUhC;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EAGI;EACA;EACA;;AAIR;EACI;;AAEA;EAGI;EACA;EACA","file":"styles.css"}
+{"version":3,"sourceRoot":"","sources":["../components/data-table/styles/data-table.scss"],"names":[],"mappings":";AACI;EACI;EACA;;AAEA;AAAA;EAEI;;AAGJ;AAAA;EAEI;;AAGJ;EACI;;AAEA;EACI;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAMR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAMhB;EACI;;AAEA;EACI;EACA;EACA;;AAGA;EACI;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;;AAKJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAMhB;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;;AAGI;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EAGI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;;AAEA;EACI;;AAEA;EACI;EACA;EACA;;;AAUhC;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EAGI;EACA;EACA;;AAIR;EACI;;AAEA;EAGI;EACA;EACA;;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAIA;EACI","file":"styles.css"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nillud-data-table",
-  "version": "1.1.3",
+  "version": "1.2.1",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -14,6 +14,10 @@
       "import": "./dist/index.js",
       "types": "./dist/index.d.ts"
     },
+    "./export": {
+      "import": "./dist/export/index.js",
+      "types": "./dist/export.index.d.ts"
+    },
     "./types": "./dist/index.d.ts",
     "./styles.css": "./dist/styles.css"
   },