feat: Excel export

schummar · Nov 6, 2024 · 0995921 · 0995921
1 parent 4e7648d
commit 0995921
Show file tree

Hide file tree

Showing 23 changed files with 1,644 additions and 368 deletions.
diff --git a/docs/stories/_default.tsx b/docs/stories/_default.tsx
@@ -8,6 +8,7 @@ const _defaultColumns: TableProps<Person>['columns'] = (col) => [
   //
   col((x) => x.avatar, {
     header: 'Avatar',
+    exportHeader: 'Avatar',
     renderCell: (avatar) => <img width={50} height={50} src={avatar} />,
     width: 'max-content',
   }),
@@ -29,9 +30,9 @@ const _defaultColumns: TableProps<Person>['columns'] = (col) => [
     filter: <SelectFilter />,
   }),
 
-  col((x) => x.birthday, {
+  col((x) => new Date(x.birthday), {
     header: 'Birthday',
-    renderCell: (birthday) => dateFormat.format(new Date(birthday)),
+    renderCell: (birthday) => dateFormat.format(birthday),
     filter: <DateFilter maxDate={new Date()} />,
   }),
 ];

diff --git a/docs/stories/aIntro.stories.tsx b/docs/stories/aIntro.stories.tsx
@@ -1,6 +1,7 @@
 import type { Meta } from '@storybook/react';
-import { Id, Table, type TableProps } from '../../src';
+import { Id, Table, TableSettingsProvider, type TableProps } from '../../src';
 import { DatePickerProvider } from '../../src/components/datePicker';
+import ExcelExporter from '../../src/exporters/excelExporter';
 import data from './_data';
 import { defaultColumns } from './_default';
 import css from './styles.module.css';
@@ -12,9 +13,13 @@ export default {
   title: 'Intro',
   component: Table,
   render: (args) => (
-    <DatePickerProvider showCalendarWeek>
-      <Table {...args} />
-    </DatePickerProvider>
+    <TableSettingsProvider
+      additionalExporters={[{ action: 'download', exporter: new ExcelExporter() }]}
+    >
+      <DatePickerProvider showCalendarWeek>
+        <Table {...args} />
+      </DatePickerProvider>
+    </TableSettingsProvider>
   ),
 
   // More on argTypes: https://storybook.js.org/docs/react/api/argtypes

diff --git a/docs/stories/cRangeFilter.stories.tsx b/docs/stories/cRangeFilter.stories.tsx
@@ -15,35 +15,30 @@ export default {
   component: Table,
   // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
   argTypes: {
-    classes: {
-      defaultValue: {
-        table: css.table,
-      },
-    },
     items: {
-      defaultValue: items,
       table: { disable: true },
     },
-    id: {
-      defaultValue: 'id',
-    },
-    columns: {
-      defaultValue: (col: any) => [
-        col((x: any) => x.name, {
-          header: 'Name',
-        }),
-        col((x: any) => x.age, {
-          header: 'Age',
-          filter: <RangeFilter min={-42} />,
-        }),
-      ],
-    },
     fullWidth: {
-      defaultValue: true,
       options: [true, false, 'left', 'right'],
       control: { type: 'inline-radio' },
     },
   },
 } as ComponentMeta<typeof Table>;
 
-export const Primary = {};
+export const Primary = {
+  args: {
+    classes: { table: css.table },
+    items: items,
+    id: 'id',
+    columns: (col: any) => [
+      col((x: any) => x.name, {
+        header: 'Name',
+      }),
+      col((x: any) => x.age, {
+        header: 'Age',
+        filter: <RangeFilter min={-42} />,
+      }),
+    ],
+    fullWidth: true,
+  },
+};