@tsed/react-formio 3.0.0-rc.21 → 3.0.0-rc.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,58 +1,67 @@
|
|
|
1
|
-
import { jsxs as l, jsx as
|
|
2
|
-
import { createElement as
|
|
1
|
+
import { jsxs as l, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { createElement as p } from "react";
|
|
3
3
|
import { flexRender as b } from "@tanstack/react-table";
|
|
4
4
|
import { c as x } from "../../chunks/index.js";
|
|
5
5
|
import { getComponent as r } from "../../registries/components.js";
|
|
6
6
|
import { useTable as f } from "./hooks/useTable.js";
|
|
7
|
-
function
|
|
8
|
-
className:
|
|
7
|
+
function w({
|
|
8
|
+
className: s,
|
|
9
9
|
enableFooter: g,
|
|
10
10
|
enablePagination: m = !0,
|
|
11
11
|
children: u,
|
|
12
12
|
...o
|
|
13
13
|
}) {
|
|
14
|
-
const { tableInstance:
|
|
15
|
-
return /* @__PURE__ */ l("div", { className: x("table-group",
|
|
16
|
-
/* @__PURE__ */
|
|
17
|
-
/* @__PURE__ */
|
|
18
|
-
const
|
|
19
|
-
return /* @__PURE__ */
|
|
14
|
+
const { tableInstance: a, i18n: d } = f(o), P = r("CellHeader"), C = r("CellFooter"), h = r("Pagination"), { pagination: i } = a.getState();
|
|
15
|
+
return /* @__PURE__ */ l("div", { className: x("table-group", s), children: [
|
|
16
|
+
/* @__PURE__ */ n("div", { className: "table-group-body", children: /* @__PURE__ */ l("table", { className: "table table-striped table-hover", children: [
|
|
17
|
+
/* @__PURE__ */ n("thead", { children: a.getHeaderGroups().map((t) => /* @__PURE__ */ n("tr", { children: t.headers.map((e) => {
|
|
18
|
+
const c = e.column.getIsSorted();
|
|
19
|
+
return /* @__PURE__ */ n(
|
|
20
20
|
"th",
|
|
21
21
|
{
|
|
22
22
|
"data-testid": `head-cell-${e.id}`,
|
|
23
|
-
"aria-sort":
|
|
24
|
-
children: e.isPlaceholder ? null : /* @__PURE__ */
|
|
23
|
+
"aria-sort": c ? c === "asc" ? "ascending" : "descending" : "none",
|
|
24
|
+
children: e.isPlaceholder ? null : /* @__PURE__ */ n(P, { header: e, i18n: d })
|
|
25
25
|
},
|
|
26
26
|
e.id
|
|
27
27
|
);
|
|
28
28
|
}) }, t.id)) }),
|
|
29
|
-
/* @__PURE__ */
|
|
30
|
-
|
|
29
|
+
/* @__PURE__ */ n("tbody", { children: a.getRowModel().rows.map((t) => /* @__PURE__ */ n("tr", { "data-testid": `body-row-${t.id}`, children: t.getVisibleCells().filter((e) => !e.column.columnDef.meta?.hidden).map((e) => /* @__PURE__ */ p(
|
|
30
|
+
"td",
|
|
31
|
+
{
|
|
32
|
+
onClick: () => o.onClick?.(e.row.original, { action: "row" }),
|
|
33
|
+
...e.column.columnDef?.meta?.cellProps,
|
|
34
|
+
key: e.id,
|
|
35
|
+
"data-testid": `body-cell-${e.id}`
|
|
36
|
+
},
|
|
37
|
+
b(e.column.columnDef.cell, e.getContext())
|
|
38
|
+
)) }, t.id)) }),
|
|
39
|
+
g && /* @__PURE__ */ n("tfoot", { children: a.getFooterGroups().map((t) => /* @__PURE__ */ n("tr", { children: t.headers.map((e) => /* @__PURE__ */ n("th", { children: e.isPlaceholder ? null : /* @__PURE__ */ n(C, { header: e, i18n: d }) }, e.id)) }, t.id)) })
|
|
31
40
|
] }) }),
|
|
32
41
|
/* @__PURE__ */ l("div", { className: "table-group-footer", children: [
|
|
33
|
-
o.data.length && i && m ? /* @__PURE__ */
|
|
42
|
+
o.data.length && i && m ? /* @__PURE__ */ n(
|
|
34
43
|
h,
|
|
35
44
|
{
|
|
36
45
|
className: "flex-1",
|
|
37
|
-
canNextPage:
|
|
38
|
-
canPreviousPage:
|
|
46
|
+
canNextPage: a.getCanNextPage(),
|
|
47
|
+
canPreviousPage: a.getCanPreviousPage(),
|
|
39
48
|
pageIndex: i.pageIndex,
|
|
40
49
|
pageSize: i.pageSize,
|
|
41
50
|
pageSizes: o.pageSizes,
|
|
42
51
|
i18n: o.i18n,
|
|
43
|
-
pageCount:
|
|
52
|
+
pageCount: a.getPageCount(),
|
|
44
53
|
rowCount: o.rowCount,
|
|
45
|
-
onPageIndexChange: (t) =>
|
|
46
|
-
onClickPreviousPage: () =>
|
|
47
|
-
onClickNextPage: () =>
|
|
48
|
-
onPageSizeChange: (t) =>
|
|
54
|
+
onPageIndexChange: (t) => a.setPageIndex(t),
|
|
55
|
+
onClickPreviousPage: () => a.previousPage(),
|
|
56
|
+
onClickNextPage: () => a.nextPage(),
|
|
57
|
+
onPageSizeChange: (t) => a.setPageSize(t)
|
|
49
58
|
}
|
|
50
59
|
) : null,
|
|
51
|
-
/* @__PURE__ */
|
|
60
|
+
/* @__PURE__ */ n("div", { children: u })
|
|
52
61
|
] })
|
|
53
62
|
] });
|
|
54
63
|
}
|
|
55
64
|
export {
|
|
56
|
-
|
|
65
|
+
w as Table
|
|
57
66
|
};
|
|
58
67
|
//# sourceMappingURL=Table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.js","sources":["../../../src/molecules/table/Table.tsx"],"sourcesContent":["import { flexRender } from \"@tanstack/react-table\";\nimport cx from \"classnames\";\nimport { PropsWithChildren } from \"react\";\n\nimport type { JSONRecord } from \"../../interfaces/JSONRecord.js\";\nimport { getComponent } from \"../../registries/components\";\nimport type { Pagination as DefaultPagination } from \"../pagination/Pagination\";\nimport type { DefaultCellFooter } from \"./components/DefaultCellFooter\";\nimport type { DefaultCellHeader } from \"./components/DefaultCellHeader\";\nimport { useTable, UseTableProps } from \"./hooks/useTable\";\n\nexport interface TableProps<Data extends object = JSONRecord> extends UseTableProps<Data> {\n className?: string;\n enableFooter?: boolean;\n enablePagination?: boolean;\n}\n\nexport function Table<Data extends object = JSONRecord>({\n className,\n enableFooter,\n enablePagination = true,\n children,\n ...props\n}: PropsWithChildren<TableProps<Data>>) {\n const { tableInstance, i18n } = useTable<Data>(props);\n const CellHeader = getComponent<typeof DefaultCellHeader>(\"CellHeader\");\n const CellFooter = getComponent<typeof DefaultCellFooter>(\"CellFooter\");\n const Pagination = getComponent<typeof DefaultPagination>(\"Pagination\");\n\n const { pagination } = tableInstance.getState();\n\n return (\n <div className={cx(\"table-group\", className)}>\n <div className='table-group-body'>\n <table className='table table-striped table-hover'>\n <thead>\n {tableInstance.getHeaderGroups().map((headerGroup) => (\n <tr key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n const sort = header.column.getIsSorted();\n return (\n <th\n data-testid={`head-cell-${header.id}`}\n key={header.id}\n aria-sort={sort ? (sort === \"asc\" ? \"ascending\" : \"descending\") : \"none\"}\n >\n {header.isPlaceholder ? null : <CellHeader header={header} i18n={i18n} />}\n </th>\n );\n })}\n </tr>\n ))}\n </thead>\n <tbody>\n {tableInstance.getRowModel().rows.map((row) => {\n return (\n <tr key={row.id} data-testid={`body-row-${row.id}`}>\n {row\n .getVisibleCells()\n .filter((cell) => !cell.column.columnDef.meta?.hidden)\n .map((cell) => {\n return (\n <td {...cell.column.columnDef?.meta?.cellProps}
|
|
1
|
+
{"version":3,"file":"Table.js","sources":["../../../src/molecules/table/Table.tsx"],"sourcesContent":["import { flexRender } from \"@tanstack/react-table\";\nimport cx from \"classnames\";\nimport { PropsWithChildren } from \"react\";\n\nimport type { JSONRecord } from \"../../interfaces/JSONRecord.js\";\nimport { getComponent } from \"../../registries/components\";\nimport type { Pagination as DefaultPagination } from \"../pagination/Pagination\";\nimport type { DefaultCellFooter } from \"./components/DefaultCellFooter\";\nimport type { DefaultCellHeader } from \"./components/DefaultCellHeader\";\nimport { useTable, UseTableProps } from \"./hooks/useTable\";\n\nexport interface TableProps<Data extends object = JSONRecord> extends UseTableProps<Data> {\n className?: string;\n enableFooter?: boolean;\n enablePagination?: boolean;\n}\n\nexport function Table<Data extends object = JSONRecord>({\n className,\n enableFooter,\n enablePagination = true,\n children,\n ...props\n}: PropsWithChildren<TableProps<Data>>) {\n const { tableInstance, i18n } = useTable<Data>(props);\n const CellHeader = getComponent<typeof DefaultCellHeader>(\"CellHeader\");\n const CellFooter = getComponent<typeof DefaultCellFooter>(\"CellFooter\");\n const Pagination = getComponent<typeof DefaultPagination>(\"Pagination\");\n\n const { pagination } = tableInstance.getState();\n\n return (\n <div className={cx(\"table-group\", className)}>\n <div className='table-group-body'>\n <table className='table table-striped table-hover'>\n <thead>\n {tableInstance.getHeaderGroups().map((headerGroup) => (\n <tr key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n const sort = header.column.getIsSorted();\n return (\n <th\n data-testid={`head-cell-${header.id}`}\n key={header.id}\n aria-sort={sort ? (sort === \"asc\" ? \"ascending\" : \"descending\") : \"none\"}\n >\n {header.isPlaceholder ? null : <CellHeader header={header} i18n={i18n} />}\n </th>\n );\n })}\n </tr>\n ))}\n </thead>\n <tbody>\n {tableInstance.getRowModel().rows.map((row) => {\n return (\n <tr key={row.id} data-testid={`body-row-${row.id}`}>\n {row\n .getVisibleCells()\n .filter((cell) => !cell.column.columnDef.meta?.hidden)\n .map((cell) => {\n return (\n <td\n onClick={() => props.onClick?.(cell.row.original, { action: \"row\" })}\n {...cell.column.columnDef?.meta?.cellProps}\n key={cell.id}\n data-testid={`body-cell-${cell.id}`}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </td>\n );\n })}\n </tr>\n );\n })}\n </tbody>\n {enableFooter && (\n <tfoot>\n {tableInstance.getFooterGroups().map((footerGroup) => (\n <tr key={footerGroup.id}>\n {footerGroup.headers.map((header) => (\n <th key={header.id}>{header.isPlaceholder ? null : <CellFooter header={header} i18n={i18n} />}</th>\n ))}\n </tr>\n ))}\n </tfoot>\n )}\n </table>\n </div>\n <div className='table-group-footer'>\n {props.data.length && pagination && enablePagination ? (\n <Pagination\n className={\"flex-1\"}\n canNextPage={tableInstance.getCanNextPage()}\n canPreviousPage={tableInstance.getCanPreviousPage()}\n pageIndex={pagination.pageIndex}\n pageSize={pagination.pageSize}\n pageSizes={props.pageSizes}\n i18n={props.i18n}\n pageCount={tableInstance.getPageCount()}\n rowCount={props.rowCount}\n onPageIndexChange={(page) => tableInstance.setPageIndex(page)}\n onClickPreviousPage={() => tableInstance.previousPage()}\n onClickNextPage={() => tableInstance.nextPage()}\n onPageSizeChange={(pageSize) => tableInstance.setPageSize(pageSize)}\n />\n ) : null}\n <div>{children}</div>\n </div>\n </div>\n );\n}\n"],"names":["Table","className","enableFooter","enablePagination","children","props","tableInstance","i18n","useTable","CellHeader","getComponent","CellFooter","Pagination","pagination","cx","jsx","jsxs","headerGroup","header","sort","row","cell","createElement","flexRender","footerGroup","page","pageSize"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tsed/react-formio",
|
|
3
|
-
"version": "3.0.0-rc.
|
|
3
|
+
"version": "3.0.0-rc.22",
|
|
4
4
|
"description": "Provide a react formio wrapper. Written in TypeScript.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -44,8 +44,8 @@
|
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
46
|
"@tanstack/react-table": ">=8.20.6",
|
|
47
|
-
"@tsed/tailwind-formio": "3.0.0-rc.
|
|
48
|
-
"@tsed/typescript": "3.0.0-rc.
|
|
47
|
+
"@tsed/tailwind-formio": "3.0.0-rc.22",
|
|
48
|
+
"@tsed/typescript": "3.0.0-rc.22",
|
|
49
49
|
"microbundle": "0.13.0",
|
|
50
50
|
"vite": "7.1.5",
|
|
51
51
|
"vitest": "3.2.4"
|
|
@@ -60,7 +60,12 @@ export function Table<Data extends object = JSONRecord>({
|
|
|
60
60
|
.filter((cell) => !cell.column.columnDef.meta?.hidden)
|
|
61
61
|
.map((cell) => {
|
|
62
62
|
return (
|
|
63
|
-
<td
|
|
63
|
+
<td
|
|
64
|
+
onClick={() => props.onClick?.(cell.row.original, { action: "row" })}
|
|
65
|
+
{...cell.column.columnDef?.meta?.cellProps}
|
|
66
|
+
key={cell.id}
|
|
67
|
+
data-testid={`body-cell-${cell.id}`}
|
|
68
|
+
>
|
|
64
69
|
{flexRender(cell.column.columnDef.cell, cell.getContext())}
|
|
65
70
|
</td>
|
|
66
71
|
);
|