@jsoc/react-grid 0.0.1
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.
- package/LICENSE +21 -0
- package/README.md +34 -0
- package/dist/index.d.mts +2 -0
- package/dist/index.mjs +2 -0
- package/dist/plugins/ag.d.mts +19 -0
- package/dist/plugins/ag.mjs +132 -0
- package/dist/plugins/ag.mjs.map +1 -0
- package/dist/plugins/ant.d.mts +13 -0
- package/dist/plugins/ant.mjs +88 -0
- package/dist/plugins/ant.mjs.map +1 -0
- package/dist/plugins/mantine.d.mts +15 -0
- package/dist/plugins/mantine.mjs +109 -0
- package/dist/plugins/mantine.mjs.map +1 -0
- package/dist/plugins/mui.d.mts +13 -0
- package/dist/plugins/mui.mjs +104 -0
- package/dist/plugins/mui.mjs.map +1 -0
- package/dist/plugins/prime.d.mts +16 -0
- package/dist/plugins/prime.mjs +94 -0
- package/dist/plugins/prime.mjs.map +1 -0
- package/dist/plugins/tanstack.d.mts +13 -0
- package/dist/plugins/tanstack.mjs +106 -0
- package/dist/plugins/tanstack.mjs.map +1 -0
- package/dist/shared-ajwnRPOX.d.mts +84 -0
- package/dist/shared-usOIqnt_.mjs +153 -0
- package/dist/shared-usOIqnt_.mjs.map +1 -0
- package/package.json +121 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 amanx5
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
# @jsoc/react-grid
|
|
2
|
+
|
|
3
|
+
Package for generating runtime props for a React Grid Component such as AG-Grid, MUI DataGrid, etc. directly from a response data (JSON).
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @jsoc/react-grid
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Peer Dependencies (required)
|
|
12
|
+
|
|
13
|
+
- `react`
|
|
14
|
+
- `react-dom`
|
|
15
|
+
|
|
16
|
+
> [!TIP]
|
|
17
|
+
> Refer to `package.json` for exact version ranges.
|
|
18
|
+
|
|
19
|
+
## Peer Dependencies (optional)
|
|
20
|
+
|
|
21
|
+
- `@mui/x-data-grid`
|
|
22
|
+
- `@tanstack/react-table`
|
|
23
|
+
- `ag-grid-react`
|
|
24
|
+
- `ag-grid-community`
|
|
25
|
+
- `mantine-react-table`
|
|
26
|
+
- ...and others
|
|
27
|
+
|
|
28
|
+
> [!IMPORTANT]
|
|
29
|
+
> These dependencies are **optional**.
|
|
30
|
+
> This package **does NOT have any runtime dependency** on them. They are used in this package only for creating **TypeScript types**.
|
|
31
|
+
>
|
|
32
|
+
> However, if your project uses TypeScript, you will need to install the specific package(s) for your chosen grid plugin to ensure successful compilation.
|
|
33
|
+
>
|
|
34
|
+
> For example: If you are using plugin for AG-Grid then you need to install `ag-grid-react` + `ag-grid-community`. Or if you are using plugin for MUI DataGrid then you need to install `@mui/x-data-grid` and so on.
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { a as useStoreContext, c as SubGridToggleProps, d as StoreContextProviderProps, f as StoreContext, g as GridCloseRendererParams, h as GridCloseProps, i as ujsonObjectCellRenderer, l as SubGridToggleRendererParams, m as GridClose, n as dateCellRenderer, o as useCoreStore, p as StoreContextValue, r as stringDateCellRenderer, s as SubGridToggle, t as booleanCellRenderer, u as StoreContextProvider } from "./shared-ajwnRPOX.mjs";
|
|
2
|
+
export { GridClose, GridCloseProps, GridCloseRendererParams, StoreContext, StoreContextProvider, StoreContextProviderProps, StoreContextValue, SubGridToggle, SubGridToggleProps, SubGridToggleRendererParams, booleanCellRenderer, dateCellRenderer, stringDateCellRenderer, ujsonObjectCellRenderer, useCoreStore, useStoreContext };
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { a as SubGridToggle, c as useStoreContext, i as ujsonObjectCellRenderer, l as StoreContext, n as dateCellRenderer, o as StoreContextProvider, r as stringDateCellRenderer, s as GridClose, t as booleanCellRenderer, u as useCoreStore } from "./shared-usOIqnt_.mjs";
|
|
2
|
+
export { GridClose, StoreContext, StoreContextProvider, SubGridToggle, booleanCellRenderer, dateCellRenderer, stringDateCellRenderer, ujsonObjectCellRenderer, useCoreStore, useStoreContext };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { p as StoreContextValue } from "../shared-ajwnRPOX.mjs";
|
|
2
|
+
import { GridOptions, GridRow, PluginConfig, PluginConfigGeneratorOptions } from "@jsoc/grid-core";
|
|
3
|
+
import { ColDef } from "ag-grid-community";
|
|
4
|
+
import { AgGridReactProps } from "ag-grid-react";
|
|
5
|
+
|
|
6
|
+
//#region src/plugins/ag/types.d.ts
|
|
7
|
+
type ColDefAg = ColDef<GridRow>;
|
|
8
|
+
type PluginConfigAg = PluginConfig<ColDefAg> & Pick<AgGridReactProps<GridRow>, "rowData" | "columnDefs" | "getRowId">;
|
|
9
|
+
//#endregion
|
|
10
|
+
//#region src/plugins/ag/useStore.d.ts
|
|
11
|
+
/**
|
|
12
|
+
* Hook to create and use a grid store.
|
|
13
|
+
* - Provide the result of this hook to the `StoreContextProvider` component in your app.
|
|
14
|
+
* - To avoid unnecessary re-renders, provide the hook result without destructuring and recreating.
|
|
15
|
+
*/
|
|
16
|
+
declare function useStore(gridOptions: GridOptions, configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigAg>): StoreContextValue<PluginConfigAg>;
|
|
17
|
+
//#endregion
|
|
18
|
+
export { ColDefAg, PluginConfigAg, useStore };
|
|
19
|
+
//# sourceMappingURL=ag.d.mts.map
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
import { i as ujsonObjectCellRenderer, r as stringDateCellRenderer, u as useCoreStore } from "../shared-usOIqnt_.mjs";
|
|
2
|
+
import { COLUMN_DATA_TYPES, generateColumns } from "@jsoc/grid-core";
|
|
3
|
+
import { prettyJSON, toReadableString, ujsonValueToString } from "@jsoc/utils";
|
|
4
|
+
//#region src/plugins/ag/COLUMN_GENERATORS.tsx
|
|
5
|
+
function extendBaseColumn(params, overrides) {
|
|
6
|
+
const { columnKey } = params;
|
|
7
|
+
return {
|
|
8
|
+
field: columnKey,
|
|
9
|
+
headerName: toReadableString(columnKey),
|
|
10
|
+
...overrides
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
const stringColumnGenerator = (params) => {
|
|
14
|
+
return extendBaseColumn(params, {
|
|
15
|
+
cellDataType: "text",
|
|
16
|
+
sortable: true,
|
|
17
|
+
filter: true
|
|
18
|
+
});
|
|
19
|
+
};
|
|
20
|
+
const booleanColumnGenerator = (params) => {
|
|
21
|
+
return extendBaseColumn(params, {
|
|
22
|
+
cellDataType: "boolean",
|
|
23
|
+
sortable: true,
|
|
24
|
+
filter: true
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
const numberColumnGenerator = (params) => {
|
|
28
|
+
return extendBaseColumn(params, {
|
|
29
|
+
cellDataType: "number",
|
|
30
|
+
sortable: true,
|
|
31
|
+
filter: true
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
const stringDateColumnGenerator = (params) => {
|
|
35
|
+
return extendBaseColumn(params, {
|
|
36
|
+
cellDataType: "dateTimeString",
|
|
37
|
+
sortable: true,
|
|
38
|
+
filter: true,
|
|
39
|
+
valueFormatter: (fParams) => {
|
|
40
|
+
const { value } = fParams;
|
|
41
|
+
return value ? stringDateCellRenderer(value) : "";
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
const ujsonObjectColumnGenerator = (params) => {
|
|
46
|
+
const { columnKey } = params;
|
|
47
|
+
return extendBaseColumn(params, {
|
|
48
|
+
cellDataType: "object",
|
|
49
|
+
sortable: false,
|
|
50
|
+
filter: false,
|
|
51
|
+
valueGetter: (gParams) => {
|
|
52
|
+
const { data } = gParams;
|
|
53
|
+
if (!data) return "";
|
|
54
|
+
const value = data[columnKey];
|
|
55
|
+
return ujsonValueToString(value);
|
|
56
|
+
},
|
|
57
|
+
valueFormatter: (fParams) => {
|
|
58
|
+
const { value } = fParams;
|
|
59
|
+
return value ? prettyJSON(value) : "";
|
|
60
|
+
},
|
|
61
|
+
cellRenderer: (rParams) => {
|
|
62
|
+
const { data, value } = rParams;
|
|
63
|
+
return ujsonObjectCellRenderer(params, value, data);
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
};
|
|
67
|
+
const ujsonObjectArrayColumnGenerator = (params) => {
|
|
68
|
+
const { columnKey } = params;
|
|
69
|
+
return extendBaseColumn(params, {
|
|
70
|
+
cellDataType: "object",
|
|
71
|
+
sortable: false,
|
|
72
|
+
filter: false,
|
|
73
|
+
valueGetter: (gParams) => {
|
|
74
|
+
const { data } = gParams;
|
|
75
|
+
if (!data) return "";
|
|
76
|
+
const value = data[columnKey];
|
|
77
|
+
return ujsonValueToString(value);
|
|
78
|
+
},
|
|
79
|
+
valueFormatter: (fParams) => {
|
|
80
|
+
const { value } = fParams;
|
|
81
|
+
return value ? prettyJSON(value) : "";
|
|
82
|
+
},
|
|
83
|
+
cellRenderer: (rParams) => {
|
|
84
|
+
const { data, value } = rParams;
|
|
85
|
+
return ujsonObjectCellRenderer(params, value, data);
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
};
|
|
89
|
+
const ujsonValueColumnGenerator = (params) => {
|
|
90
|
+
const { columnKey } = params;
|
|
91
|
+
return extendBaseColumn(params, {
|
|
92
|
+
sortable: false,
|
|
93
|
+
filter: false,
|
|
94
|
+
valueGetter: (gParams) => {
|
|
95
|
+
const { data } = gParams;
|
|
96
|
+
if (!data) return "";
|
|
97
|
+
const value = data[columnKey];
|
|
98
|
+
return ujsonValueToString(value);
|
|
99
|
+
}
|
|
100
|
+
});
|
|
101
|
+
};
|
|
102
|
+
const COLUMN_GENERATORS = {
|
|
103
|
+
[COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,
|
|
104
|
+
[COLUMN_DATA_TYPES.number]: numberColumnGenerator,
|
|
105
|
+
[COLUMN_DATA_TYPES.string]: stringColumnGenerator,
|
|
106
|
+
[COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,
|
|
107
|
+
[COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,
|
|
108
|
+
[COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,
|
|
109
|
+
[COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator
|
|
110
|
+
};
|
|
111
|
+
//#endregion
|
|
112
|
+
//#region src/plugins/ag/useStore.ts
|
|
113
|
+
const configGenerator = (gridSchema, options) => {
|
|
114
|
+
const { rows, primaryColumnKey } = gridSchema.meta;
|
|
115
|
+
return {
|
|
116
|
+
columnDefs: generateColumns(gridSchema, COLUMN_GENERATORS, options?.customColumnGeneratorByType),
|
|
117
|
+
getRowId: ({ data }) => String(data[primaryColumnKey]),
|
|
118
|
+
rowData: rows
|
|
119
|
+
};
|
|
120
|
+
};
|
|
121
|
+
/**
|
|
122
|
+
* Hook to create and use a grid store.
|
|
123
|
+
* - Provide the result of this hook to the `StoreContextProvider` component in your app.
|
|
124
|
+
* - To avoid unnecessary re-renders, provide the hook result without destructuring and recreating.
|
|
125
|
+
*/
|
|
126
|
+
function useStore(gridOptions, configGeneratorOptions) {
|
|
127
|
+
return useCoreStore(gridOptions, configGenerator, configGeneratorOptions);
|
|
128
|
+
}
|
|
129
|
+
//#endregion
|
|
130
|
+
export { useStore };
|
|
131
|
+
|
|
132
|
+
//# sourceMappingURL=ag.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ag.mjs","names":[],"sources":["../../src/plugins/ag/COLUMN_GENERATORS.tsx","../../src/plugins/ag/useStore.ts"],"sourcesContent":["import type { ColDefAg, PluginConfigAg } from \"#plugins/ag/types.ts\";\nimport {\n stringDateCellRenderer,\n ujsonObjectCellRenderer,\n} from \"#utils/cellRenderers.tsx\";\n\nimport {\n COLUMN_DATA_TYPES,\n type ColumnGenerator,\n type ColumnGeneratorByType,\n type ColumnGeneratorParams,\n type GridRow,\n} from \"@jsoc/grid-core\";\nimport {\n prettyJSON,\n toReadableString,\n type UJSONObject,\n type UJSONObjectArray,\n type UJSONValue,\n ujsonValueToString,\n} from \"@jsoc/utils\";\nimport type {\n ICellRendererParams,\n ValueFormatterParams,\n ValueGetterParams,\n} from \"ag-grid-community\";\n\ntype ColumnGeneratorAg = ColumnGenerator<PluginConfigAg>;\n\nfunction extendBaseColumn(\n params: ColumnGeneratorParams,\n overrides?: Partial<ColDefAg>,\n): ColDefAg {\n const { columnKey } = params;\n\n return {\n field: columnKey,\n headerName: toReadableString(columnKey),\n ...overrides,\n };\n}\n\nconst stringColumnGenerator: ColumnGeneratorAg = (params) => {\n return extendBaseColumn(params, {\n cellDataType: \"text\",\n sortable: true,\n filter: true,\n });\n};\n\nconst booleanColumnGenerator: ColumnGeneratorAg = (params) => {\n return extendBaseColumn(params, {\n cellDataType: \"boolean\",\n sortable: true,\n filter: true,\n });\n};\n\nconst numberColumnGenerator: ColumnGeneratorAg = (params) => {\n return extendBaseColumn(params, {\n cellDataType: \"number\",\n sortable: true,\n filter: true,\n });\n};\n\nconst stringDateColumnGenerator: ColumnGeneratorAg = (params) => {\n return extendBaseColumn(params, {\n cellDataType: \"dateTimeString\",\n sortable: true,\n filter: true,\n valueFormatter: (fParams: ValueFormatterParams<GridRow, string>) => {\n const { value } = fParams;\n return value ? stringDateCellRenderer(value) : \"\";\n },\n });\n};\n\nconst ujsonObjectColumnGenerator: ColumnGeneratorAg = (params) => {\n const { columnKey } = params;\n return extendBaseColumn(params, {\n cellDataType: \"object\",\n sortable: false,\n filter: false,\n /**\n * @see {@link https://www.ag-grid.com/react-data-grid/value-getters/ Value Getters}\n */\n valueGetter: (gParams: ValueGetterParams<GridRow, UJSONObject>) => {\n const { data } = gParams;\n if (!data) {\n return \"\";\n }\n const value = data[columnKey];\n return ujsonValueToString(value);\n },\n /**\n * @see {@link https://www.ag-grid.com/react-data-grid/value-formatters/ Value Formatters}\n */\n valueFormatter: (fParams: ValueFormatterParams<GridRow, string>) => {\n const { value } = fParams;\n return value ? prettyJSON(value) : \"\";\n },\n /**\n * @see {@link https://www.ag-grid.com/react-data-grid/component-cell-renderer/ Cell Renderer}\n */\n cellRenderer: (rParams: ICellRendererParams<GridRow, string>) => {\n const { data, value } = rParams;\n return ujsonObjectCellRenderer(params, value, data);\n },\n });\n};\n\nconst ujsonObjectArrayColumnGenerator: ColumnGeneratorAg = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n // AG-Grid's object datatype refers to any complex datatype including arrays, not just objects\n // https://www.ag-grid.com/react-data-grid/cell-data-types/#object\n cellDataType: \"object\",\n sortable: false,\n filter: false,\n valueGetter: (gParams: ValueGetterParams<GridRow, UJSONObjectArray>) => {\n const { data } = gParams;\n if (!data) {\n return \"\";\n }\n const value = data[columnKey];\n return ujsonValueToString(value);\n },\n valueFormatter: (fParams: ValueFormatterParams<GridRow, string>) => {\n const { value } = fParams;\n return value ? prettyJSON(value) : \"\";\n },\n cellRenderer: (rParams: ICellRendererParams<GridRow, string>) => {\n const { data, value } = rParams;\n return ujsonObjectCellRenderer(params, value, data);\n },\n });\n};\n\nconst ujsonValueColumnGenerator: ColumnGeneratorAg = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n sortable: false,\n filter: false,\n valueGetter: (gParams: ValueGetterParams<GridRow, UJSONValue>) => {\n const { data } = gParams;\n if (!data) {\n return \"\";\n }\n const value = data[columnKey];\n return ujsonValueToString(value);\n },\n });\n};\n\nexport const COLUMN_GENERATORS: ColumnGeneratorByType<PluginConfigAg> = {\n [COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,\n [COLUMN_DATA_TYPES.number]: numberColumnGenerator,\n [COLUMN_DATA_TYPES.string]: stringColumnGenerator,\n [COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator,\n};\n","import { useCoreStore } from \"#hooks/useCoreStore.ts\";\nimport { COLUMN_GENERATORS } from \"#plugins/ag/COLUMN_GENERATORS.tsx\";\nimport type { PluginConfigAg } from \"#plugins/ag/types.ts\";\n\nimport {\n generateColumns,\n type GridOptions,\n type GridRowId,\n type PluginConfigGenerator,\n type PluginConfigGeneratorOptions,\n} from \"@jsoc/grid-core\";\n\ntype ConfigGeneratorAg = PluginConfigGenerator<PluginConfigAg>;\n\nconst configGenerator: ConfigGeneratorAg = (gridSchema, options) => {\n const { rows, primaryColumnKey } = gridSchema.meta;\n const columnDefs = generateColumns(\n gridSchema,\n COLUMN_GENERATORS,\n options?.customColumnGeneratorByType,\n );\n\n return {\n columnDefs,\n getRowId: ({ data }) => String(data[primaryColumnKey] as GridRowId),\n rowData: rows,\n };\n};\n\n/**\n * Hook to create and use a grid store.\n * - Provide the result of this hook to the `StoreContextProvider` component in your app.\n * - To avoid unnecessary re-renders, provide the hook result without destructuring and recreating.\n */\nexport function useStore(\n gridOptions: GridOptions,\n configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigAg>,\n) {\n return useCoreStore<PluginConfigAg>(\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n );\n}\n"],"mappings":";;;;AA6BA,SAAS,iBACP,QACA,WACU;CACV,MAAM,EAAE,cAAc;AAEtB,QAAO;EACL,OAAO;EACP,YAAY,iBAAiB,UAAU;EACvC,GAAG;EACJ;;AAGH,MAAM,yBAA4C,WAAW;AAC3D,QAAO,iBAAiB,QAAQ;EAC9B,cAAc;EACd,UAAU;EACV,QAAQ;EACT,CAAC;;AAGJ,MAAM,0BAA6C,WAAW;AAC5D,QAAO,iBAAiB,QAAQ;EAC9B,cAAc;EACd,UAAU;EACV,QAAQ;EACT,CAAC;;AAGJ,MAAM,yBAA4C,WAAW;AAC3D,QAAO,iBAAiB,QAAQ;EAC9B,cAAc;EACd,UAAU;EACV,QAAQ;EACT,CAAC;;AAGJ,MAAM,6BAAgD,WAAW;AAC/D,QAAO,iBAAiB,QAAQ;EAC9B,cAAc;EACd,UAAU;EACV,QAAQ;EACR,iBAAiB,YAAmD;GAClE,MAAM,EAAE,UAAU;AAClB,UAAO,QAAQ,uBAAuB,MAAM,GAAG;;EAElD,CAAC;;AAGJ,MAAM,8BAAiD,WAAW;CAChE,MAAM,EAAE,cAAc;AACtB,QAAO,iBAAiB,QAAQ;EAC9B,cAAc;EACd,UAAU;EACV,QAAQ;EAIR,cAAc,YAAqD;GACjE,MAAM,EAAE,SAAS;AACjB,OAAI,CAAC,KACH,QAAO;GAET,MAAM,QAAQ,KAAK;AACnB,UAAO,mBAAmB,MAAM;;EAKlC,iBAAiB,YAAmD;GAClE,MAAM,EAAE,UAAU;AAClB,UAAO,QAAQ,WAAW,MAAM,GAAG;;EAKrC,eAAe,YAAkD;GAC/D,MAAM,EAAE,MAAM,UAAU;AACxB,UAAO,wBAAwB,QAAQ,OAAO,KAAK;;EAEtD,CAAC;;AAGJ,MAAM,mCAAsD,WAAW;CACrE,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAG9B,cAAc;EACd,UAAU;EACV,QAAQ;EACR,cAAc,YAA0D;GACtE,MAAM,EAAE,SAAS;AACjB,OAAI,CAAC,KACH,QAAO;GAET,MAAM,QAAQ,KAAK;AACnB,UAAO,mBAAmB,MAAM;;EAElC,iBAAiB,YAAmD;GAClE,MAAM,EAAE,UAAU;AAClB,UAAO,QAAQ,WAAW,MAAM,GAAG;;EAErC,eAAe,YAAkD;GAC/D,MAAM,EAAE,MAAM,UAAU;AACxB,UAAO,wBAAwB,QAAQ,OAAO,KAAK;;EAEtD,CAAC;;AAGJ,MAAM,6BAAgD,WAAW;CAC/D,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,QAAQ;EACR,cAAc,YAAoD;GAChE,MAAM,EAAE,SAAS;AACjB,OAAI,CAAC,KACH,QAAO;GAET,MAAM,QAAQ,KAAK;AACnB,UAAO,mBAAmB,MAAM;;EAEnC,CAAC;;AAGJ,MAAa,oBAA2D;EACrE,kBAAkB,UAAU;EAC5B,kBAAkB,SAAS;EAC3B,kBAAkB,SAAS;EAC3B,kBAAkB,aAAa;EAC/B,kBAAkB,cAAc;EAChC,kBAAkB,mBAAmB;EACrC,kBAAkB,aAAa;CACjC;;;ACvJD,MAAM,mBAAsC,YAAY,YAAY;CAClE,MAAM,EAAE,MAAM,qBAAqB,WAAW;AAO9C,QAAO;EACL,YAPiB,gBACjB,YACA,mBACA,SAAS,4BACV;EAIC,WAAW,EAAE,WAAW,OAAO,KAAK,kBAA+B;EACnE,SAAS;EACV;;;;;;;AAQH,SAAgB,SACd,aACA,wBACA;AACA,QAAO,aACL,aACA,iBACA,uBACD"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { p as StoreContextValue } from "../shared-ajwnRPOX.mjs";
|
|
2
|
+
import { GridOptions, GridRow, PluginConfig, PluginConfigGeneratorOptions } from "@jsoc/grid-core";
|
|
3
|
+
import { TableColumnProps, TableProps } from "antd";
|
|
4
|
+
|
|
5
|
+
//#region src/plugins/ant/types.d.ts
|
|
6
|
+
type ColDefAnt = TableColumnProps<GridRow>;
|
|
7
|
+
type PluginConfigAnt = PluginConfig<ColDefAnt> & Pick<TableProps<GridRow>, "columns" | "dataSource" | "rowKey">;
|
|
8
|
+
//#endregion
|
|
9
|
+
//#region src/plugins/ant/useStore.d.ts
|
|
10
|
+
declare function useStore(gridOptions: GridOptions, configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigAnt>): StoreContextValue<PluginConfigAnt>;
|
|
11
|
+
//#endregion
|
|
12
|
+
export { ColDefAnt, PluginConfigAnt, useStore };
|
|
13
|
+
//# sourceMappingURL=ant.d.mts.map
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { i as ujsonObjectCellRenderer, r as stringDateCellRenderer, t as booleanCellRenderer, u as useCoreStore } from "../shared-usOIqnt_.mjs";
|
|
2
|
+
import { COLUMN_DATA_TYPES, generateColumns } from "@jsoc/grid-core";
|
|
3
|
+
import { compareBooleans, compareNumbers, compareStringDates, compareStrings, toReadableString, ujsonValueToString } from "@jsoc/utils";
|
|
4
|
+
import { Fragment, jsx } from "react/jsx-runtime";
|
|
5
|
+
//#region src/plugins/ant/COLUMN_GENERATORS.tsx
|
|
6
|
+
function extendBaseColumn(params, overrides) {
|
|
7
|
+
const { columnKey } = params;
|
|
8
|
+
return {
|
|
9
|
+
dataIndex: columnKey,
|
|
10
|
+
title: toReadableString(columnKey),
|
|
11
|
+
...overrides
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
const stringColumnGenerator = (params) => {
|
|
15
|
+
const { columnKey } = params;
|
|
16
|
+
return extendBaseColumn(params, { sorter: (a, b) => {
|
|
17
|
+
return compareStrings(a[columnKey], b[columnKey]);
|
|
18
|
+
} });
|
|
19
|
+
};
|
|
20
|
+
const booleanColumnGenerator = (params) => {
|
|
21
|
+
const { columnKey } = params;
|
|
22
|
+
return extendBaseColumn(params, {
|
|
23
|
+
render: (value) => {
|
|
24
|
+
return /* @__PURE__ */ jsx(Fragment, { children: booleanCellRenderer(value) });
|
|
25
|
+
},
|
|
26
|
+
sorter: (a, b) => {
|
|
27
|
+
return compareBooleans(a[columnKey], b[columnKey]);
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
};
|
|
31
|
+
const numberColumnGenerator = (params) => {
|
|
32
|
+
const { columnKey } = params;
|
|
33
|
+
return extendBaseColumn(params, { sorter: (a, b) => {
|
|
34
|
+
return compareNumbers(a[columnKey], b[columnKey]);
|
|
35
|
+
} });
|
|
36
|
+
};
|
|
37
|
+
const stringDateColumnGenerator = (params) => {
|
|
38
|
+
const { columnKey } = params;
|
|
39
|
+
return extendBaseColumn(params, {
|
|
40
|
+
render: (value) => {
|
|
41
|
+
return stringDateCellRenderer(value);
|
|
42
|
+
},
|
|
43
|
+
sorter: (a, b) => {
|
|
44
|
+
return compareStringDates(a[columnKey], b[columnKey]);
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
const ujsonObjectColumnGenerator = (params) => {
|
|
49
|
+
return extendBaseColumn(params, { render: (value, record) => {
|
|
50
|
+
return ujsonObjectCellRenderer(params, value, record);
|
|
51
|
+
} });
|
|
52
|
+
};
|
|
53
|
+
const ujsonObjectArrayColumnGenerator = (params) => {
|
|
54
|
+
return extendBaseColumn(params, { render: (value, record) => {
|
|
55
|
+
return ujsonObjectCellRenderer(params, value, record);
|
|
56
|
+
} });
|
|
57
|
+
};
|
|
58
|
+
const ujsonValueColumnGenerator = (params) => {
|
|
59
|
+
return extendBaseColumn(params, { render: (value) => {
|
|
60
|
+
return ujsonValueToString(value);
|
|
61
|
+
} });
|
|
62
|
+
};
|
|
63
|
+
const COLUMN_GENERATORS = {
|
|
64
|
+
[COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,
|
|
65
|
+
[COLUMN_DATA_TYPES.number]: numberColumnGenerator,
|
|
66
|
+
[COLUMN_DATA_TYPES.string]: stringColumnGenerator,
|
|
67
|
+
[COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,
|
|
68
|
+
[COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,
|
|
69
|
+
[COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,
|
|
70
|
+
[COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator
|
|
71
|
+
};
|
|
72
|
+
//#endregion
|
|
73
|
+
//#region src/plugins/ant/useStore.ts
|
|
74
|
+
const configGenerator = (gridSchema, options) => {
|
|
75
|
+
const { rows, primaryColumnKey } = gridSchema.meta;
|
|
76
|
+
return {
|
|
77
|
+
columns: generateColumns(gridSchema, COLUMN_GENERATORS, options?.customColumnGeneratorByType),
|
|
78
|
+
dataSource: rows,
|
|
79
|
+
rowKey: (row) => String(row[primaryColumnKey])
|
|
80
|
+
};
|
|
81
|
+
};
|
|
82
|
+
function useStore(gridOptions, configGeneratorOptions) {
|
|
83
|
+
return useCoreStore(gridOptions, configGenerator, configGeneratorOptions);
|
|
84
|
+
}
|
|
85
|
+
//#endregion
|
|
86
|
+
export { useStore };
|
|
87
|
+
|
|
88
|
+
//# sourceMappingURL=ant.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ant.mjs","names":[],"sources":["../../src/plugins/ant/COLUMN_GENERATORS.tsx","../../src/plugins/ant/useStore.ts"],"sourcesContent":["import type { ColDefAnt, PluginConfigAnt } from \"#plugins/ant/types.ts\";\nimport {\n booleanCellRenderer,\n stringDateCellRenderer,\n ujsonObjectCellRenderer,\n} from \"#utils/cellRenderers.tsx\";\n\nimport {\n COLUMN_DATA_TYPES,\n type ColumnGenerator,\n type ColumnGeneratorByType,\n type ColumnGeneratorParams,\n} from \"@jsoc/grid-core\";\nimport {\n compareBooleans,\n compareNumbers,\n compareStringDates,\n compareStrings,\n toReadableString,\n type UJSONObject,\n type UJSONObjectArray,\n type UJSONValue,\n ujsonValueToString,\n} from \"@jsoc/utils\";\n\ntype ColumnGeneratorAnt = ColumnGenerator<PluginConfigAnt>;\n\nfunction extendBaseColumn(\n params: ColumnGeneratorParams,\n overrides?: Partial<ColDefAnt>,\n): ColDefAnt {\n const { columnKey } = params;\n\n return {\n dataIndex: columnKey,\n title: toReadableString(columnKey),\n ...overrides,\n };\n}\n\nconst stringColumnGenerator: ColumnGeneratorAnt = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n sorter: (a, b) => {\n return compareStrings(a[columnKey] as string, b[columnKey] as string);\n },\n // filters: [{text: ..., value: ...}] // skipping as it requires static value filters which can vary based on data\n });\n};\n\nconst booleanColumnGenerator: ColumnGeneratorAnt = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n render: (value: boolean) => {\n return <>{booleanCellRenderer(value)}</>;\n },\n sorter: (a, b) => {\n return compareBooleans(a[columnKey] as boolean, b[columnKey] as boolean);\n },\n });\n};\n\nconst numberColumnGenerator: ColumnGeneratorAnt = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n sorter: (a, b) => {\n return compareNumbers(a[columnKey] as number, b[columnKey] as number);\n },\n });\n};\n\nconst stringDateColumnGenerator: ColumnGeneratorAnt = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n render: (value: string) => {\n return stringDateCellRenderer(value);\n },\n sorter: (a, b) => {\n return compareStringDates(a[columnKey] as string, b[columnKey] as string);\n },\n });\n};\n\nconst ujsonObjectColumnGenerator: ColumnGeneratorAnt = (params) => {\n return extendBaseColumn(params, {\n render: (value: UJSONObject, record) => {\n return ujsonObjectCellRenderer(params, value, record);\n },\n });\n};\n\nconst ujsonObjectArrayColumnGenerator: ColumnGeneratorAnt = (params) => {\n return extendBaseColumn(params, {\n render: (value: UJSONObjectArray, record) => {\n return ujsonObjectCellRenderer(params, value, record);\n },\n });\n};\n\nconst ujsonValueColumnGenerator: ColumnGeneratorAnt = (params) => {\n return extendBaseColumn(params, {\n render: (value: UJSONValue) => {\n return ujsonValueToString(value);\n },\n });\n};\n\nexport const COLUMN_GENERATORS: ColumnGeneratorByType<PluginConfigAnt> = {\n [COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,\n [COLUMN_DATA_TYPES.number]: numberColumnGenerator,\n [COLUMN_DATA_TYPES.string]: stringColumnGenerator,\n [COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator,\n};\n","import { useCoreStore } from \"#hooks/useCoreStore.ts\";\nimport { COLUMN_GENERATORS } from \"#plugins/ant/COLUMN_GENERATORS.tsx\";\nimport type { PluginConfigAnt } from \"#plugins/ant/types.ts\";\n\nimport {\n generateColumns,\n type GridOptions,\n type GridRowId,\n type PluginConfigGenerator,\n type PluginConfigGeneratorOptions,\n} from \"@jsoc/grid-core\";\n\ntype ConfigGeneratorAnt = PluginConfigGenerator<PluginConfigAnt>;\n\nconst configGenerator: ConfigGeneratorAnt = (gridSchema, options) => {\n const { rows, primaryColumnKey } = gridSchema.meta;\n const columns = generateColumns(\n gridSchema,\n COLUMN_GENERATORS,\n options?.customColumnGeneratorByType,\n );\n\n return {\n columns,\n dataSource: rows,\n rowKey: (row) => String(row[primaryColumnKey] as GridRowId),\n };\n};\n\nexport function useStore(\n gridOptions: GridOptions,\n configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigAnt>,\n) {\n return useCoreStore<PluginConfigAnt>(\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n );\n}\n"],"mappings":";;;;;AA2BA,SAAS,iBACP,QACA,WACW;CACX,MAAM,EAAE,cAAc;AAEtB,QAAO;EACL,WAAW;EACX,OAAO,iBAAiB,UAAU;EAClC,GAAG;EACJ;;AAGH,MAAM,yBAA6C,WAAW;CAC5D,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ,EAC9B,SAAS,GAAG,MAAM;AAChB,SAAO,eAAe,EAAE,YAAsB,EAAE,WAAqB;IAGxE,CAAC;;AAGJ,MAAM,0BAA8C,WAAW;CAC7D,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,SAAS,UAAmB;AAC1B,UAAO,oBAAA,UAAA,EAAA,UAAG,oBAAoB,MAAM,EAAI,CAAA;;EAE1C,SAAS,GAAG,MAAM;AAChB,UAAO,gBAAgB,EAAE,YAAuB,EAAE,WAAsB;;EAE3E,CAAC;;AAGJ,MAAM,yBAA6C,WAAW;CAC5D,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ,EAC9B,SAAS,GAAG,MAAM;AAChB,SAAO,eAAe,EAAE,YAAsB,EAAE,WAAqB;IAExE,CAAC;;AAGJ,MAAM,6BAAiD,WAAW;CAChE,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,SAAS,UAAkB;AACzB,UAAO,uBAAuB,MAAM;;EAEtC,SAAS,GAAG,MAAM;AAChB,UAAO,mBAAmB,EAAE,YAAsB,EAAE,WAAqB;;EAE5E,CAAC;;AAGJ,MAAM,8BAAkD,WAAW;AACjE,QAAO,iBAAiB,QAAQ,EAC9B,SAAS,OAAoB,WAAW;AACtC,SAAO,wBAAwB,QAAQ,OAAO,OAAO;IAExD,CAAC;;AAGJ,MAAM,mCAAuD,WAAW;AACtE,QAAO,iBAAiB,QAAQ,EAC9B,SAAS,OAAyB,WAAW;AAC3C,SAAO,wBAAwB,QAAQ,OAAO,OAAO;IAExD,CAAC;;AAGJ,MAAM,6BAAiD,WAAW;AAChE,QAAO,iBAAiB,QAAQ,EAC9B,SAAS,UAAsB;AAC7B,SAAO,mBAAmB,MAAM;IAEnC,CAAC;;AAGJ,MAAa,oBAA4D;EACtE,kBAAkB,UAAU;EAC5B,kBAAkB,SAAS;EAC3B,kBAAkB,SAAS;EAC3B,kBAAkB,aAAa;EAC/B,kBAAkB,cAAc;EAChC,kBAAkB,mBAAmB;EACrC,kBAAkB,aAAa;CACjC;;;ACzGD,MAAM,mBAAuC,YAAY,YAAY;CACnE,MAAM,EAAE,MAAM,qBAAqB,WAAW;AAO9C,QAAO;EACL,SAPc,gBACd,YACA,mBACA,SAAS,4BACV;EAIC,YAAY;EACZ,SAAS,QAAQ,OAAO,IAAI,kBAA+B;EAC5D;;AAGH,SAAgB,SACd,aACA,wBACA;AACA,QAAO,aACL,aACA,iBACA,uBACD"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { p as StoreContextValue } from "../shared-ajwnRPOX.mjs";
|
|
2
|
+
import { GridOptions, GridRow, PluginConfig, PluginConfigGenerator, PluginConfigGeneratorOptions } from "@jsoc/grid-core";
|
|
3
|
+
import { MRT_ColumnDef, MRT_TableOptions } from "mantine-react-table";
|
|
4
|
+
|
|
5
|
+
//#region src/plugins/mantine/types.d.ts
|
|
6
|
+
type ColDefMantine = MRT_ColumnDef<GridRow>;
|
|
7
|
+
type PluginConfigMantine = PluginConfig<ColDefMantine> & Pick<MRT_TableOptions<GridRow>, "columns" | "data" | "getRowId">;
|
|
8
|
+
//#endregion
|
|
9
|
+
//#region src/plugins/mantine/useStore.d.ts
|
|
10
|
+
type ConfigGeneratorMantine = PluginConfigGenerator<PluginConfigMantine>;
|
|
11
|
+
declare const configGenerator: ConfigGeneratorMantine;
|
|
12
|
+
declare function useStore(gridOptions: GridOptions, configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigMantine>): StoreContextValue<PluginConfigMantine>;
|
|
13
|
+
//#endregion
|
|
14
|
+
export { ColDefMantine, PluginConfigMantine, configGenerator, useStore };
|
|
15
|
+
//# sourceMappingURL=mantine.d.mts.map
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import { i as ujsonObjectCellRenderer, n as dateCellRenderer, u as useCoreStore } from "../shared-usOIqnt_.mjs";
|
|
2
|
+
import { COLUMN_DATA_TYPES, generateColumns } from "@jsoc/grid-core";
|
|
3
|
+
import { booleanToString, stringDateToDate, toReadableString, ujsonValueToString } from "@jsoc/utils";
|
|
4
|
+
//#region src/plugins/mantine/COLUMN_GENERATORS.tsx
|
|
5
|
+
function extendBaseColumn(params, overrides) {
|
|
6
|
+
const { columnKey } = params;
|
|
7
|
+
return {
|
|
8
|
+
id: columnKey,
|
|
9
|
+
accessorKey: columnKey,
|
|
10
|
+
header: toReadableString(columnKey),
|
|
11
|
+
...overrides
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
const stringColumnGenerator = (params) => {
|
|
15
|
+
return extendBaseColumn(params, {
|
|
16
|
+
enableColumnFilter: true,
|
|
17
|
+
enableSorting: true,
|
|
18
|
+
filterVariant: "text",
|
|
19
|
+
sortingFn: "text"
|
|
20
|
+
});
|
|
21
|
+
};
|
|
22
|
+
const booleanColumnGenerator = (params) => {
|
|
23
|
+
const { columnKey } = params;
|
|
24
|
+
return extendBaseColumn(params, {
|
|
25
|
+
accessorFn: (originalRow) => {
|
|
26
|
+
const value = originalRow[columnKey];
|
|
27
|
+
return booleanToString(value);
|
|
28
|
+
},
|
|
29
|
+
enableColumnFilter: true,
|
|
30
|
+
enableSorting: true,
|
|
31
|
+
filterVariant: "checkbox",
|
|
32
|
+
sortingFn: "text"
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
const numberColumnGenerator = (params) => {
|
|
36
|
+
return extendBaseColumn(params, {
|
|
37
|
+
enableColumnFilter: true,
|
|
38
|
+
enableSorting: true,
|
|
39
|
+
filterVariant: "range",
|
|
40
|
+
sortingFn: "alphanumeric"
|
|
41
|
+
});
|
|
42
|
+
};
|
|
43
|
+
const stringDateColumnGenerator = (params) => {
|
|
44
|
+
const { columnKey } = params;
|
|
45
|
+
return extendBaseColumn(params, {
|
|
46
|
+
accessorFn: (originalRow) => {
|
|
47
|
+
const value = originalRow[columnKey];
|
|
48
|
+
return stringDateToDate(value);
|
|
49
|
+
},
|
|
50
|
+
Cell: ({ cell }) => dateCellRenderer(cell.getValue()),
|
|
51
|
+
enableColumnFilter: true,
|
|
52
|
+
enableSorting: true,
|
|
53
|
+
filterVariant: "date",
|
|
54
|
+
sortingFn: "datetime"
|
|
55
|
+
});
|
|
56
|
+
};
|
|
57
|
+
const ujsonObjectColumnGenerator = (params) => {
|
|
58
|
+
return extendBaseColumn(params, {
|
|
59
|
+
Cell: ({ cell, row }) => {
|
|
60
|
+
return ujsonObjectCellRenderer(params, cell.getValue(), row.original);
|
|
61
|
+
},
|
|
62
|
+
enableColumnFilter: false,
|
|
63
|
+
enableSorting: false
|
|
64
|
+
});
|
|
65
|
+
};
|
|
66
|
+
const ujsonObjectArrayColumnGenerator = (params) => {
|
|
67
|
+
return extendBaseColumn(params, {
|
|
68
|
+
Cell: ({ cell, row }) => {
|
|
69
|
+
return ujsonObjectCellRenderer(params, cell.getValue(), row.original);
|
|
70
|
+
},
|
|
71
|
+
enableColumnFilter: false,
|
|
72
|
+
enableSorting: false
|
|
73
|
+
});
|
|
74
|
+
};
|
|
75
|
+
const ujsonValueColumnGenerator = (params) => {
|
|
76
|
+
return extendBaseColumn(params, {
|
|
77
|
+
Cell: ({ cell }) => {
|
|
78
|
+
return ujsonValueToString(cell.getValue());
|
|
79
|
+
},
|
|
80
|
+
enableColumnFilter: false,
|
|
81
|
+
enableSorting: false
|
|
82
|
+
});
|
|
83
|
+
};
|
|
84
|
+
const COLUMN_GENERATORS = {
|
|
85
|
+
[COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,
|
|
86
|
+
[COLUMN_DATA_TYPES.number]: numberColumnGenerator,
|
|
87
|
+
[COLUMN_DATA_TYPES.string]: stringColumnGenerator,
|
|
88
|
+
[COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,
|
|
89
|
+
[COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,
|
|
90
|
+
[COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,
|
|
91
|
+
[COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator
|
|
92
|
+
};
|
|
93
|
+
//#endregion
|
|
94
|
+
//#region src/plugins/mantine/useStore.ts
|
|
95
|
+
const configGenerator = (gridSchema, options) => {
|
|
96
|
+
const { rows, primaryColumnKey } = gridSchema.meta;
|
|
97
|
+
return {
|
|
98
|
+
columns: generateColumns(gridSchema, COLUMN_GENERATORS, options?.customColumnGeneratorByType),
|
|
99
|
+
data: rows,
|
|
100
|
+
getRowId: (row) => String(row[primaryColumnKey])
|
|
101
|
+
};
|
|
102
|
+
};
|
|
103
|
+
function useStore(gridOptions, configGeneratorOptions) {
|
|
104
|
+
return useCoreStore(gridOptions, configGenerator, configGeneratorOptions);
|
|
105
|
+
}
|
|
106
|
+
//#endregion
|
|
107
|
+
export { configGenerator, useStore };
|
|
108
|
+
|
|
109
|
+
//# sourceMappingURL=mantine.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mantine.mjs","names":[],"sources":["../../src/plugins/mantine/COLUMN_GENERATORS.tsx","../../src/plugins/mantine/useStore.ts"],"sourcesContent":["import type {\n ColDefMantine,\n PluginConfigMantine,\n} from \"#plugins/mantine/types.ts\";\nimport {\n dateCellRenderer,\n ujsonObjectCellRenderer,\n} from \"#utils/cellRenderers.tsx\";\n\nimport {\n COLUMN_DATA_TYPES,\n type ColumnGenerator,\n type ColumnGeneratorByType,\n type ColumnGeneratorParams,\n} from \"@jsoc/grid-core\";\nimport {\n booleanToString,\n stringDateToDate,\n toReadableString,\n type UJSONObject,\n type UJSONObjectArray,\n type UJSONValue,\n ujsonValueToString,\n} from \"@jsoc/utils\";\n\ntype ColumnGeneratorMantine = ColumnGenerator<PluginConfigMantine>;\n\n// NOTE: This helper and column generators below are very much similar to the corresponding tanstack column generators.\n// But this code duplication is done intentionally because mantine plugin's internal tanstack dependency version can be\n// different from the version used in this library's tanstack plugin, so there is chances of type mismatches.\n// Also, we can't limit this library's tanstack version to match mantine's internal tanstack version as then it would be\n// not possible to develop the tanstack plugin independently.\nfunction extendBaseColumn(\n params: ColumnGeneratorParams,\n overrides?: Partial<ColDefMantine>,\n): ColDefMantine {\n const { columnKey } = params;\n\n return {\n id: columnKey,\n accessorKey: columnKey,\n header: toReadableString(columnKey),\n ...overrides,\n };\n}\n\nconst stringColumnGenerator: ColumnGeneratorMantine = (params) => {\n return extendBaseColumn(params, {\n enableColumnFilter: true,\n enableSorting: true,\n // https://www.mantine-react-table.com/docs/guides/column-filtering#filter-variants\n filterVariant: \"text\",\n // https://tanstack.com/table/v8/docs/api/features/sorting#sorting-functions\n sortingFn: \"text\",\n });\n};\n\nconst booleanColumnGenerator: ColumnGeneratorMantine = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n accessorFn: (originalRow) => {\n const value = originalRow[columnKey] as boolean;\n return booleanToString(value);\n },\n enableColumnFilter: true,\n enableSorting: true,\n filterVariant: \"checkbox\",\n sortingFn: \"text\",\n });\n};\n\nconst numberColumnGenerator: ColumnGeneratorMantine = (params) => {\n return extendBaseColumn(params, {\n enableColumnFilter: true,\n enableSorting: true,\n filterVariant: \"range\",\n sortingFn: \"alphanumeric\",\n });\n};\n\nconst stringDateColumnGenerator: ColumnGeneratorMantine = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n accessorFn: (originalRow) => {\n const value = originalRow[columnKey] as string;\n return stringDateToDate(value);\n },\n Cell: ({ cell }) => dateCellRenderer(cell.getValue<Date>()),\n enableColumnFilter: true,\n enableSorting: true,\n filterVariant: \"date\",\n sortingFn: \"datetime\",\n });\n};\n\nconst ujsonObjectColumnGenerator: ColumnGeneratorMantine = (params) => {\n return extendBaseColumn(params, {\n Cell: ({ cell, row }) => {\n const value = cell.getValue<UJSONObject>();\n return ujsonObjectCellRenderer(params, value, row.original);\n },\n enableColumnFilter: false,\n enableSorting: false,\n });\n};\n\nconst ujsonObjectArrayColumnGenerator: ColumnGeneratorMantine = (params) => {\n return extendBaseColumn(params, {\n Cell: ({ cell, row }) => {\n const value = cell.getValue<UJSONObjectArray>();\n return ujsonObjectCellRenderer(params, value, row.original);\n },\n enableColumnFilter: false,\n enableSorting: false,\n });\n};\n\nconst ujsonValueColumnGenerator: ColumnGeneratorMantine = (params) => {\n return extendBaseColumn(params, {\n Cell: ({ cell }) => {\n const value = cell.getValue<UJSONValue>();\n return ujsonValueToString(value);\n },\n enableColumnFilter: false,\n enableSorting: false,\n });\n};\n\nexport const COLUMN_GENERATORS: ColumnGeneratorByType<PluginConfigMantine> = {\n [COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,\n [COLUMN_DATA_TYPES.number]: numberColumnGenerator,\n [COLUMN_DATA_TYPES.string]: stringColumnGenerator,\n [COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator,\n};\n","import { useCoreStore } from \"#hooks/useCoreStore.ts\";\nimport { COLUMN_GENERATORS } from \"#plugins/mantine/COLUMN_GENERATORS.tsx\";\nimport type {\n ColDefMantine,\n PluginConfigMantine,\n} from \"#plugins/mantine/types.ts\";\n\nimport {\n generateColumns,\n type GridOptions,\n type GridRowId,\n type PluginConfigGenerator,\n type PluginConfigGeneratorOptions,\n} from \"@jsoc/grid-core\";\n\ntype ConfigGeneratorMantine = PluginConfigGenerator<PluginConfigMantine>;\n\nexport const configGenerator: ConfigGeneratorMantine = (\n gridSchema,\n options,\n) => {\n const { rows, primaryColumnKey } = gridSchema.meta;\n const columns = generateColumns(\n gridSchema,\n COLUMN_GENERATORS,\n options?.customColumnGeneratorByType,\n ) as ColDefMantine[];\n\n return {\n columns,\n data: rows,\n getRowId: (row) => String(row[primaryColumnKey] as GridRowId),\n };\n};\n\nexport function useStore(\n gridOptions: GridOptions,\n configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigMantine>,\n) {\n return useCoreStore<PluginConfigMantine>(\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n );\n}\n"],"mappings":";;;;AAgCA,SAAS,iBACP,QACA,WACe;CACf,MAAM,EAAE,cAAc;AAEtB,QAAO;EACL,IAAI;EACJ,aAAa;EACb,QAAQ,iBAAiB,UAAU;EACnC,GAAG;EACJ;;AAGH,MAAM,yBAAiD,WAAW;AAChE,QAAO,iBAAiB,QAAQ;EAC9B,oBAAoB;EACpB,eAAe;EAEf,eAAe;EAEf,WAAW;EACZ,CAAC;;AAGJ,MAAM,0BAAkD,WAAW;CACjE,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,aAAa,gBAAgB;GAC3B,MAAM,QAAQ,YAAY;AAC1B,UAAO,gBAAgB,MAAM;;EAE/B,oBAAoB;EACpB,eAAe;EACf,eAAe;EACf,WAAW;EACZ,CAAC;;AAGJ,MAAM,yBAAiD,WAAW;AAChE,QAAO,iBAAiB,QAAQ;EAC9B,oBAAoB;EACpB,eAAe;EACf,eAAe;EACf,WAAW;EACZ,CAAC;;AAGJ,MAAM,6BAAqD,WAAW;CACpE,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,aAAa,gBAAgB;GAC3B,MAAM,QAAQ,YAAY;AAC1B,UAAO,iBAAiB,MAAM;;EAEhC,OAAO,EAAE,WAAW,iBAAiB,KAAK,UAAgB,CAAC;EAC3D,oBAAoB;EACpB,eAAe;EACf,eAAe;EACf,WAAW;EACZ,CAAC;;AAGJ,MAAM,8BAAsD,WAAW;AACrE,QAAO,iBAAiB,QAAQ;EAC9B,OAAO,EAAE,MAAM,UAAU;AAEvB,UAAO,wBAAwB,QADjB,KAAK,UAAuB,EACI,IAAI,SAAS;;EAE7D,oBAAoB;EACpB,eAAe;EAChB,CAAC;;AAGJ,MAAM,mCAA2D,WAAW;AAC1E,QAAO,iBAAiB,QAAQ;EAC9B,OAAO,EAAE,MAAM,UAAU;AAEvB,UAAO,wBAAwB,QADjB,KAAK,UAA4B,EACD,IAAI,SAAS;;EAE7D,oBAAoB;EACpB,eAAe;EAChB,CAAC;;AAGJ,MAAM,6BAAqD,WAAW;AACpE,QAAO,iBAAiB,QAAQ;EAC9B,OAAO,EAAE,WAAW;AAElB,UAAO,mBADO,KAAK,UAAsB,CACT;;EAElC,oBAAoB;EACpB,eAAe;EAChB,CAAC;;AAGJ,MAAa,oBAAgE;EAC1E,kBAAkB,UAAU;EAC5B,kBAAkB,SAAS;EAC3B,kBAAkB,SAAS;EAC3B,kBAAkB,aAAa;EAC/B,kBAAkB,cAAc;EAChC,kBAAkB,mBAAmB;EACrC,kBAAkB,aAAa;CACjC;;;ACzHD,MAAa,mBACX,YACA,YACG;CACH,MAAM,EAAE,MAAM,qBAAqB,WAAW;AAO9C,QAAO;EACL,SAPc,gBACd,YACA,mBACA,SAAS,4BACV;EAIC,MAAM;EACN,WAAW,QAAQ,OAAO,IAAI,kBAA+B;EAC9D;;AAGH,SAAgB,SACd,aACA,wBACA;AACA,QAAO,aACL,aACA,iBACA,uBACD"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { p as StoreContextValue } from "../shared-ajwnRPOX.mjs";
|
|
2
|
+
import { GridOptions, GridRow, PluginConfig, PluginConfigGeneratorOptions } from "@jsoc/grid-core";
|
|
3
|
+
import { DataGridProps, GridColDef } from "@mui/x-data-grid";
|
|
4
|
+
|
|
5
|
+
//#region src/plugins/mui/types.d.ts
|
|
6
|
+
type ColDefMui = GridColDef<GridRow>;
|
|
7
|
+
type PluginConfigMui = PluginConfig<ColDefMui> & Pick<DataGridProps<GridRow>, "rows" | "columns" | "getRowId">;
|
|
8
|
+
//#endregion
|
|
9
|
+
//#region src/plugins/mui/useStore.d.ts
|
|
10
|
+
declare function useStore(gridOptions: GridOptions, configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigMui>): StoreContextValue<PluginConfigMui>;
|
|
11
|
+
//#endregion
|
|
12
|
+
export { ColDefMui, PluginConfigMui, useStore };
|
|
13
|
+
//# sourceMappingURL=mui.d.mts.map
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import { i as ujsonObjectCellRenderer, u as useCoreStore } from "../shared-usOIqnt_.mjs";
|
|
2
|
+
import { COLUMN_DATA_TYPES, generateColumns } from "@jsoc/grid-core";
|
|
3
|
+
import { prettyJSON, stringDateToDate, toReadableString, ujsonValueToString } from "@jsoc/utils";
|
|
4
|
+
//#region src/plugins/mui/COLUMN_GENERATORS.tsx
|
|
5
|
+
function extendBaseColumn(params, overrides) {
|
|
6
|
+
const { columnKey } = params;
|
|
7
|
+
return {
|
|
8
|
+
field: columnKey,
|
|
9
|
+
headerName: toReadableString(columnKey),
|
|
10
|
+
...overrides
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
const stringColumnGenerator = (params) => {
|
|
14
|
+
return extendBaseColumn(params, {
|
|
15
|
+
type: "string",
|
|
16
|
+
sortable: true,
|
|
17
|
+
filterable: true
|
|
18
|
+
});
|
|
19
|
+
};
|
|
20
|
+
const booleanColumnGenerator = (params) => {
|
|
21
|
+
return extendBaseColumn(params, {
|
|
22
|
+
type: "boolean",
|
|
23
|
+
sortable: true,
|
|
24
|
+
filterable: true
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
const numberColumnGenerator = (params) => {
|
|
28
|
+
return extendBaseColumn(params, {
|
|
29
|
+
type: "number",
|
|
30
|
+
sortable: true,
|
|
31
|
+
filterable: true
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
const stringDateColumnGenerator = (params) => {
|
|
35
|
+
return extendBaseColumn(params, {
|
|
36
|
+
type: "dateTime",
|
|
37
|
+
sortable: true,
|
|
38
|
+
filterable: true,
|
|
39
|
+
valueGetter: (value) => stringDateToDate(value)
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
const ujsonObjectColumnGenerator = (params) => {
|
|
43
|
+
return extendBaseColumn(params, {
|
|
44
|
+
sortable: false,
|
|
45
|
+
filterable: false,
|
|
46
|
+
valueGetter: (value) => ujsonValueToString(value),
|
|
47
|
+
valueFormatter: (value) => {
|
|
48
|
+
return prettyJSON(value);
|
|
49
|
+
},
|
|
50
|
+
renderCell: (rParams) => {
|
|
51
|
+
const { row, value } = rParams;
|
|
52
|
+
return ujsonObjectCellRenderer(params, value, row);
|
|
53
|
+
}
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
const ujsonObjectArrayColumnGenerator = (params) => {
|
|
57
|
+
return extendBaseColumn(params, {
|
|
58
|
+
sortable: false,
|
|
59
|
+
filterable: false,
|
|
60
|
+
valueGetter: (value) => ujsonValueToString(value),
|
|
61
|
+
valueFormatter: (value) => {
|
|
62
|
+
return prettyJSON(value);
|
|
63
|
+
},
|
|
64
|
+
renderCell: (rParams) => {
|
|
65
|
+
const { row, value } = rParams;
|
|
66
|
+
return ujsonObjectCellRenderer(params, value, row);
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
const ujsonValueColumnGenerator = (params) => {
|
|
71
|
+
return extendBaseColumn(params, {
|
|
72
|
+
sortable: false,
|
|
73
|
+
filterable: false,
|
|
74
|
+
valueGetter: (value) => {
|
|
75
|
+
return ujsonValueToString(value);
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
};
|
|
79
|
+
const COLUMN_GENERATORS = {
|
|
80
|
+
[COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,
|
|
81
|
+
[COLUMN_DATA_TYPES.number]: numberColumnGenerator,
|
|
82
|
+
[COLUMN_DATA_TYPES.string]: stringColumnGenerator,
|
|
83
|
+
[COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,
|
|
84
|
+
[COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,
|
|
85
|
+
[COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,
|
|
86
|
+
[COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator
|
|
87
|
+
};
|
|
88
|
+
//#endregion
|
|
89
|
+
//#region src/plugins/mui/useStore.ts
|
|
90
|
+
const configGenerator = (gridSchema, options) => {
|
|
91
|
+
const { rows, primaryColumnKey } = gridSchema.meta;
|
|
92
|
+
return {
|
|
93
|
+
columns: generateColumns(gridSchema, COLUMN_GENERATORS, options?.customColumnGeneratorByType),
|
|
94
|
+
getRowId: (row) => String(row[primaryColumnKey]),
|
|
95
|
+
rows
|
|
96
|
+
};
|
|
97
|
+
};
|
|
98
|
+
function useStore(gridOptions, configGeneratorOptions) {
|
|
99
|
+
return useCoreStore(gridOptions, configGenerator, configGeneratorOptions);
|
|
100
|
+
}
|
|
101
|
+
//#endregion
|
|
102
|
+
export { useStore };
|
|
103
|
+
|
|
104
|
+
//# sourceMappingURL=mui.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mui.mjs","names":[],"sources":["../../src/plugins/mui/COLUMN_GENERATORS.tsx","../../src/plugins/mui/useStore.ts"],"sourcesContent":["import type { ColDefMui, PluginConfigMui } from \"#plugins/mui/types.ts\";\nimport { ujsonObjectCellRenderer } from \"#utils/cellRenderers.tsx\";\n\nimport {\n COLUMN_DATA_TYPES,\n type ColumnGenerator,\n type ColumnGeneratorByType,\n type ColumnGeneratorParams,\n type GridRow,\n} from \"@jsoc/grid-core\";\nimport {\n prettyJSON,\n stringDateToDate,\n toReadableString,\n type UJSONObject,\n type UJSONObjectArray,\n type UJSONValue,\n ujsonValueToString,\n} from \"@jsoc/utils\";\nimport type { GridRenderCellParams } from \"@mui/x-data-grid\";\n\nexport type ColumnGeneratorMui = ColumnGenerator<PluginConfigMui>;\n\nfunction extendBaseColumn(\n params: ColumnGeneratorParams,\n overrides?: Partial<ColDefMui>,\n): ColDefMui {\n const { columnKey } = params;\n\n return {\n field: columnKey,\n headerName: toReadableString(columnKey),\n ...overrides,\n };\n}\n\nconst stringColumnGenerator: ColumnGeneratorMui = (params) => {\n return extendBaseColumn(params, {\n type: \"string\",\n sortable: true,\n filterable: true,\n });\n};\n\nconst booleanColumnGenerator: ColumnGeneratorMui = (params) => {\n return extendBaseColumn(params, {\n type: \"boolean\",\n sortable: true,\n filterable: true,\n });\n};\n\nconst numberColumnGenerator: ColumnGeneratorMui = (params) => {\n return extendBaseColumn(params, {\n type: \"number\",\n sortable: true,\n filterable: true,\n });\n};\n\nconst stringDateColumnGenerator: ColumnGeneratorMui = (params) => {\n return extendBaseColumn(params, {\n type: \"dateTime\",\n sortable: true,\n filterable: true,\n /**\n * For dateTime type, value is expected to be Date() object.\n */\n valueGetter: (value: string) => stringDateToDate(value),\n });\n};\n\nconst ujsonObjectColumnGenerator: ColumnGeneratorMui = (params) => {\n return extendBaseColumn(params, {\n // type: \"actions\",\n sortable: false,\n filterable: false,\n /**\n * Value to be used for filtering, sorting and default rendering. Though, for this column, sorting and filtering\n * are disabled. But the returned value is also made available to the valueFormatter and renderCell.\n * @see {@link https://mui.com/x/react-data-grid/column-definition/#value-getter Value Getter}\n */\n valueGetter: (value: UJSONObject) => ujsonValueToString(value),\n /**\n * Returns value which will be used in exporting, as suggested in:\n * https://mui.com/x/react-data-grid/column-definition/#:~:text=When%20using%20renderCell,exporting%20the%20data.\n * Value returned by valueFormatter is not used for filtering/sorting as it is only for rendering purposes. In this\n * case, it won't be used for rendering also as renderCell is provided. So, this is solely for value to use in the\n * export operation.\n *\n * @see {@link https://mui.com/x/react-data-grid/column-definition/#value-formatter Value Formatter}\n */\n valueFormatter: (value: string) => {\n return prettyJSON(value);\n },\n /**\n * Returns a button that allows toggling SubGrid which represents the data for this column.\n * Uses the value from valueGetter which is ensured array of objects to represent in the SubGrid.\n */\n renderCell: (rParams: GridRenderCellParams<GridRow, string>) => {\n const { row, value } = rParams;\n return ujsonObjectCellRenderer(params, value, row);\n },\n });\n};\n\nconst ujsonObjectArrayColumnGenerator: ColumnGeneratorMui = (params) => {\n return extendBaseColumn(params, {\n sortable: false,\n filterable: false,\n valueGetter: (value: UJSONObjectArray) => ujsonValueToString(value),\n valueFormatter: (value: string) => {\n return prettyJSON(value);\n },\n renderCell: (rParams: GridRenderCellParams<GridRow, string>) => {\n const { row, value } = rParams;\n return ujsonObjectCellRenderer(params, value, row);\n },\n });\n};\n\nconst ujsonValueColumnGenerator: ColumnGeneratorMui = (params) => {\n return extendBaseColumn(params, {\n sortable: false,\n filterable: false,\n valueGetter: (value: UJSONValue) => {\n return ujsonValueToString(value);\n },\n });\n};\n\nexport const COLUMN_GENERATORS: ColumnGeneratorByType<PluginConfigMui> = {\n [COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,\n [COLUMN_DATA_TYPES.number]: numberColumnGenerator,\n [COLUMN_DATA_TYPES.string]: stringColumnGenerator,\n [COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator,\n};\n","import { useCoreStore } from \"#hooks/useCoreStore.ts\";\nimport { COLUMN_GENERATORS } from \"#plugins/mui/COLUMN_GENERATORS.tsx\";\nimport type { PluginConfigMui } from \"#plugins/mui/types.ts\";\n\nimport {\n generateColumns,\n type GridOptions,\n type GridRowId,\n type PluginConfigGenerator,\n type PluginConfigGeneratorOptions,\n} from \"@jsoc/grid-core\";\n\ntype ConfigGeneratorMui = PluginConfigGenerator<PluginConfigMui>;\n\nconst configGenerator: ConfigGeneratorMui = (gridSchema, options) => {\n const { rows, primaryColumnKey } = gridSchema.meta;\n const columns = generateColumns(\n gridSchema,\n COLUMN_GENERATORS,\n options?.customColumnGeneratorByType,\n );\n\n return {\n columns,\n getRowId: (row) => String(row[primaryColumnKey] as GridRowId),\n rows,\n };\n};\n\nexport function useStore(\n gridOptions: GridOptions,\n configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigMui>,\n) {\n return useCoreStore<PluginConfigMui>(\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n );\n}\n"],"mappings":";;;;AAuBA,SAAS,iBACP,QACA,WACW;CACX,MAAM,EAAE,cAAc;AAEtB,QAAO;EACL,OAAO;EACP,YAAY,iBAAiB,UAAU;EACvC,GAAG;EACJ;;AAGH,MAAM,yBAA6C,WAAW;AAC5D,QAAO,iBAAiB,QAAQ;EAC9B,MAAM;EACN,UAAU;EACV,YAAY;EACb,CAAC;;AAGJ,MAAM,0BAA8C,WAAW;AAC7D,QAAO,iBAAiB,QAAQ;EAC9B,MAAM;EACN,UAAU;EACV,YAAY;EACb,CAAC;;AAGJ,MAAM,yBAA6C,WAAW;AAC5D,QAAO,iBAAiB,QAAQ;EAC9B,MAAM;EACN,UAAU;EACV,YAAY;EACb,CAAC;;AAGJ,MAAM,6BAAiD,WAAW;AAChE,QAAO,iBAAiB,QAAQ;EAC9B,MAAM;EACN,UAAU;EACV,YAAY;EAIZ,cAAc,UAAkB,iBAAiB,MAAM;EACxD,CAAC;;AAGJ,MAAM,8BAAkD,WAAW;AACjE,QAAO,iBAAiB,QAAQ;EAE9B,UAAU;EACV,YAAY;EAMZ,cAAc,UAAuB,mBAAmB,MAAM;EAU9D,iBAAiB,UAAkB;AACjC,UAAO,WAAW,MAAM;;EAM1B,aAAa,YAAmD;GAC9D,MAAM,EAAE,KAAK,UAAU;AACvB,UAAO,wBAAwB,QAAQ,OAAO,IAAI;;EAErD,CAAC;;AAGJ,MAAM,mCAAuD,WAAW;AACtE,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,YAAY;EACZ,cAAc,UAA4B,mBAAmB,MAAM;EACnE,iBAAiB,UAAkB;AACjC,UAAO,WAAW,MAAM;;EAE1B,aAAa,YAAmD;GAC9D,MAAM,EAAE,KAAK,UAAU;AACvB,UAAO,wBAAwB,QAAQ,OAAO,IAAI;;EAErD,CAAC;;AAGJ,MAAM,6BAAiD,WAAW;AAChE,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,YAAY;EACZ,cAAc,UAAsB;AAClC,UAAO,mBAAmB,MAAM;;EAEnC,CAAC;;AAGJ,MAAa,oBAA4D;EACtE,kBAAkB,UAAU;EAC5B,kBAAkB,SAAS;EAC3B,kBAAkB,SAAS;EAC3B,kBAAkB,aAAa;EAC/B,kBAAkB,cAAc;EAChC,kBAAkB,mBAAmB;EACrC,kBAAkB,aAAa;CACjC;;;AC7HD,MAAM,mBAAuC,YAAY,YAAY;CACnE,MAAM,EAAE,MAAM,qBAAqB,WAAW;AAO9C,QAAO;EACL,SAPc,gBACd,YACA,mBACA,SAAS,4BACV;EAIC,WAAW,QAAQ,OAAO,IAAI,kBAA+B;EAC7D;EACD;;AAGH,SAAgB,SACd,aACA,wBACA;AACA,QAAO,aACL,aACA,iBACA,uBACD"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { p as StoreContextValue } from "../shared-ajwnRPOX.mjs";
|
|
2
|
+
import { GridOptions, GridRows, PluginConfig, PluginConfigGeneratorOptions } from "@jsoc/grid-core";
|
|
3
|
+
import { ColumnProps } from "primereact/column/column.cjs.js";
|
|
4
|
+
import { DataTableProps } from "primereact/datatable/datatable.cjs.js";
|
|
5
|
+
|
|
6
|
+
//#region src/plugins/prime/types.d.ts
|
|
7
|
+
type ColDefPrime = ColumnProps;
|
|
8
|
+
type PluginConfigPrime = PluginConfig<ColDefPrime> & Pick<DataTableProps<GridRows>, "value"> & {
|
|
9
|
+
columns: ColDefPrime[];
|
|
10
|
+
};
|
|
11
|
+
//#endregion
|
|
12
|
+
//#region src/plugins/prime/useStore.d.ts
|
|
13
|
+
declare function useStore(gridOptions: GridOptions, configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigPrime>): StoreContextValue<PluginConfigPrime>;
|
|
14
|
+
//#endregion
|
|
15
|
+
export { ColDefPrime, PluginConfigPrime, useStore };
|
|
16
|
+
//# sourceMappingURL=prime.d.mts.map
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import { i as ujsonObjectCellRenderer, u as useCoreStore } from "../shared-usOIqnt_.mjs";
|
|
2
|
+
import { COLUMN_DATA_TYPES, generateColumns } from "@jsoc/grid-core";
|
|
3
|
+
import { toReadableString, ujsonValueToString } from "@jsoc/utils";
|
|
4
|
+
//#region src/plugins/prime/COLUMN_GENERATORS.tsx
|
|
5
|
+
function extendBaseColumn(params, overrides) {
|
|
6
|
+
const { columnKey } = params;
|
|
7
|
+
return {
|
|
8
|
+
field: columnKey,
|
|
9
|
+
header: toReadableString(columnKey),
|
|
10
|
+
...overrides
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
const stringColumnGenerator = (params) => {
|
|
14
|
+
return extendBaseColumn(params, {
|
|
15
|
+
dataType: "text",
|
|
16
|
+
sortable: true
|
|
17
|
+
});
|
|
18
|
+
};
|
|
19
|
+
const booleanColumnGenerator = (params) => {
|
|
20
|
+
return extendBaseColumn(params, {
|
|
21
|
+
dataType: "boolean",
|
|
22
|
+
sortable: true
|
|
23
|
+
});
|
|
24
|
+
};
|
|
25
|
+
const numberColumnGenerator = (params) => {
|
|
26
|
+
return extendBaseColumn(params, {
|
|
27
|
+
dataType: "number",
|
|
28
|
+
sortable: true
|
|
29
|
+
});
|
|
30
|
+
};
|
|
31
|
+
const stringDateColumnGenerator = (params) => {
|
|
32
|
+
return extendBaseColumn(params, {
|
|
33
|
+
dataType: "date",
|
|
34
|
+
sortable: true
|
|
35
|
+
});
|
|
36
|
+
};
|
|
37
|
+
const ujsonObjectColumnGenerator = (params) => {
|
|
38
|
+
const { columnKey } = params;
|
|
39
|
+
return extendBaseColumn(params, {
|
|
40
|
+
sortable: false,
|
|
41
|
+
filter: false,
|
|
42
|
+
body: (data) => {
|
|
43
|
+
const value = data[columnKey];
|
|
44
|
+
return ujsonObjectCellRenderer(params, value, data);
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
const ujsonObjectArrayColumnGenerator = (params) => {
|
|
49
|
+
const { columnKey } = params;
|
|
50
|
+
return extendBaseColumn(params, {
|
|
51
|
+
sortable: false,
|
|
52
|
+
filter: false,
|
|
53
|
+
body: (data) => {
|
|
54
|
+
const value = data[columnKey];
|
|
55
|
+
return ujsonObjectCellRenderer(params, value, data);
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
};
|
|
59
|
+
const ujsonValueColumnGenerator = (params) => {
|
|
60
|
+
const { columnKey } = params;
|
|
61
|
+
return extendBaseColumn(params, {
|
|
62
|
+
sortable: false,
|
|
63
|
+
filter: false,
|
|
64
|
+
body: (data) => {
|
|
65
|
+
const value = data[columnKey];
|
|
66
|
+
return ujsonValueToString(value);
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
const COLUMN_GENERATORS = {
|
|
71
|
+
[COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,
|
|
72
|
+
[COLUMN_DATA_TYPES.number]: numberColumnGenerator,
|
|
73
|
+
[COLUMN_DATA_TYPES.string]: stringColumnGenerator,
|
|
74
|
+
[COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,
|
|
75
|
+
[COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,
|
|
76
|
+
[COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,
|
|
77
|
+
[COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator
|
|
78
|
+
};
|
|
79
|
+
//#endregion
|
|
80
|
+
//#region src/plugins/prime/useStore.ts
|
|
81
|
+
const configGenerator = (gridSchema, options) => {
|
|
82
|
+
const { rows } = gridSchema.meta;
|
|
83
|
+
return {
|
|
84
|
+
columns: generateColumns(gridSchema, COLUMN_GENERATORS, options?.customColumnGeneratorByType),
|
|
85
|
+
value: rows
|
|
86
|
+
};
|
|
87
|
+
};
|
|
88
|
+
function useStore(gridOptions, configGeneratorOptions) {
|
|
89
|
+
return useCoreStore(gridOptions, configGenerator, configGeneratorOptions);
|
|
90
|
+
}
|
|
91
|
+
//#endregion
|
|
92
|
+
export { useStore };
|
|
93
|
+
|
|
94
|
+
//# sourceMappingURL=prime.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"prime.mjs","names":[],"sources":["../../src/plugins/prime/COLUMN_GENERATORS.tsx","../../src/plugins/prime/useStore.ts"],"sourcesContent":["import type { ColDefPrime, PluginConfigPrime } from \"#plugins/prime/types.ts\";\nimport { ujsonObjectCellRenderer } from \"#utils/cellRenderers.tsx\";\n\nimport {\n COLUMN_DATA_TYPES,\n type ColumnGenerator,\n type ColumnGeneratorByType,\n type ColumnGeneratorParams,\n type GridRow,\n} from \"@jsoc/grid-core\";\nimport {\n toReadableString,\n type UJSONObject,\n type UJSONObjectArray,\n ujsonValueToString,\n} from \"@jsoc/utils\";\n\nexport type ColumnGeneratorPrime = ColumnGenerator<PluginConfigPrime>;\n\nfunction extendBaseColumn(\n params: ColumnGeneratorParams,\n overrides?: Partial<ColDefPrime>,\n): ColDefPrime {\n const { columnKey } = params;\n\n return {\n field: columnKey,\n header: toReadableString(columnKey),\n ...overrides,\n };\n}\n\nconst stringColumnGenerator: ColumnGeneratorPrime = (params) => {\n return extendBaseColumn(params, {\n dataType: \"text\",\n sortable: true,\n // filter: true, // skipping for now as it needs additional configs (filters prop on main component)\n });\n};\n\nconst booleanColumnGenerator: ColumnGeneratorPrime = (params) => {\n return extendBaseColumn(params, {\n dataType: \"boolean\",\n sortable: true,\n });\n};\n\nconst numberColumnGenerator: ColumnGeneratorPrime = (params) => {\n return extendBaseColumn(params, {\n dataType: \"number\",\n sortable: true,\n });\n};\n\nconst stringDateColumnGenerator: ColumnGeneratorPrime = (params) => {\n return extendBaseColumn(params, {\n dataType: \"date\",\n sortable: true,\n });\n};\n\nconst ujsonObjectColumnGenerator: ColumnGeneratorPrime = (params) => {\n const { columnKey } = params;\n return extendBaseColumn(params, {\n sortable: false,\n filter: false,\n body: (data: GridRow) => {\n const value = data[columnKey] as UJSONObject;\n return ujsonObjectCellRenderer(params, value, data);\n },\n });\n};\n\nconst ujsonObjectArrayColumnGenerator: ColumnGeneratorPrime = (params) => {\n const { columnKey } = params;\n return extendBaseColumn(params, {\n sortable: false,\n filter: false,\n body: (data: GridRow) => {\n const value = data[columnKey] as UJSONObjectArray;\n return ujsonObjectCellRenderer(params, value, data);\n },\n });\n};\n\nconst ujsonValueColumnGenerator: ColumnGeneratorPrime = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n sortable: false,\n filter: false,\n body: (data: GridRow) => {\n const value = data[columnKey];\n return ujsonValueToString(value);\n },\n });\n};\n\nexport const COLUMN_GENERATORS: ColumnGeneratorByType<PluginConfigPrime> = {\n [COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,\n [COLUMN_DATA_TYPES.number]: numberColumnGenerator,\n [COLUMN_DATA_TYPES.string]: stringColumnGenerator,\n [COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator,\n};\n","import { useCoreStore } from \"#hooks/useCoreStore.ts\";\nimport { COLUMN_GENERATORS } from \"#plugins/prime/COLUMN_GENERATORS.tsx\";\nimport type { PluginConfigPrime } from \"#plugins/prime/types.ts\";\n\nimport {\n generateColumns,\n type GridOptions,\n type PluginConfigGenerator,\n type PluginConfigGeneratorOptions,\n} from \"@jsoc/grid-core\";\n\ntype ConfigGeneratorPrime = PluginConfigGenerator<PluginConfigPrime>;\n\nconst configGenerator: ConfigGeneratorPrime = (gridSchema, options) => {\n const { rows } = gridSchema.meta;\n const columns = generateColumns(\n gridSchema,\n COLUMN_GENERATORS,\n options?.customColumnGeneratorByType,\n );\n\n return {\n columns,\n value: rows,\n };\n};\n\nexport function useStore(\n gridOptions: GridOptions,\n configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigPrime>,\n) {\n return useCoreStore<PluginConfigPrime>(\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n );\n}\n"],"mappings":";;;;AAmBA,SAAS,iBACP,QACA,WACa;CACb,MAAM,EAAE,cAAc;AAEtB,QAAO;EACL,OAAO;EACP,QAAQ,iBAAiB,UAAU;EACnC,GAAG;EACJ;;AAGH,MAAM,yBAA+C,WAAW;AAC9D,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,UAAU;EAEX,CAAC;;AAGJ,MAAM,0BAAgD,WAAW;AAC/D,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,UAAU;EACX,CAAC;;AAGJ,MAAM,yBAA+C,WAAW;AAC9D,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,UAAU;EACX,CAAC;;AAGJ,MAAM,6BAAmD,WAAW;AAClE,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,UAAU;EACX,CAAC;;AAGJ,MAAM,8BAAoD,WAAW;CACnE,MAAM,EAAE,cAAc;AACtB,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,QAAQ;EACR,OAAO,SAAkB;GACvB,MAAM,QAAQ,KAAK;AACnB,UAAO,wBAAwB,QAAQ,OAAO,KAAK;;EAEtD,CAAC;;AAGJ,MAAM,mCAAyD,WAAW;CACxE,MAAM,EAAE,cAAc;AACtB,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,QAAQ;EACR,OAAO,SAAkB;GACvB,MAAM,QAAQ,KAAK;AACnB,UAAO,wBAAwB,QAAQ,OAAO,KAAK;;EAEtD,CAAC;;AAGJ,MAAM,6BAAmD,WAAW;CAClE,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,UAAU;EACV,QAAQ;EACR,OAAO,SAAkB;GACvB,MAAM,QAAQ,KAAK;AACnB,UAAO,mBAAmB,MAAM;;EAEnC,CAAC;;AAGJ,MAAa,oBAA8D;EACxE,kBAAkB,UAAU;EAC5B,kBAAkB,SAAS;EAC3B,kBAAkB,SAAS;EAC3B,kBAAkB,aAAa;EAC/B,kBAAkB,cAAc;EAChC,kBAAkB,mBAAmB;EACrC,kBAAkB,aAAa;CACjC;;;AC7FD,MAAM,mBAAyC,YAAY,YAAY;CACrE,MAAM,EAAE,SAAS,WAAW;AAO5B,QAAO;EACL,SAPc,gBACd,YACA,mBACA,SAAS,4BACV;EAIC,OAAO;EACR;;AAGH,SAAgB,SACd,aACA,wBACA;AACA,QAAO,aACL,aACA,iBACA,uBACD"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { p as StoreContextValue } from "../shared-ajwnRPOX.mjs";
|
|
2
|
+
import { GridOptions, GridRow, PluginConfig, PluginConfigGeneratorOptions } from "@jsoc/grid-core";
|
|
3
|
+
import { ColumnDef, TableOptions } from "@tanstack/react-table";
|
|
4
|
+
|
|
5
|
+
//#region src/plugins/tanstack/types.d.ts
|
|
6
|
+
type ColDefTanstack = ColumnDef<GridRow>;
|
|
7
|
+
type PluginConfigTanstack = PluginConfig<ColDefTanstack> & Pick<TableOptions<GridRow>, "columns" | "data" | "getRowId">;
|
|
8
|
+
//#endregion
|
|
9
|
+
//#region src/plugins/tanstack/useStore.d.ts
|
|
10
|
+
declare function useStore(gridOptions: GridOptions, configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigTanstack>): StoreContextValue<PluginConfigTanstack>;
|
|
11
|
+
//#endregion
|
|
12
|
+
export { ColDefTanstack, PluginConfigTanstack, useStore };
|
|
13
|
+
//# sourceMappingURL=tanstack.d.mts.map
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
import { i as ujsonObjectCellRenderer, n as dateCellRenderer, u as useCoreStore } from "../shared-usOIqnt_.mjs";
|
|
2
|
+
import { COLUMN_DATA_TYPES, generateColumns } from "@jsoc/grid-core";
|
|
3
|
+
import { booleanToString, stringDateToDate, toReadableString, ujsonValueToString } from "@jsoc/utils";
|
|
4
|
+
//#region src/plugins/tanstack/COLUMN_GENERATORS.tsx
|
|
5
|
+
function extendBaseColumn(params, overrides) {
|
|
6
|
+
const { columnKey, columnDataType } = params;
|
|
7
|
+
return {
|
|
8
|
+
id: columnKey,
|
|
9
|
+
accessorKey: columnKey,
|
|
10
|
+
header: toReadableString(columnKey),
|
|
11
|
+
meta: { type: columnDataType },
|
|
12
|
+
...overrides
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
const stringColumnGenerator = (params) => {
|
|
16
|
+
return extendBaseColumn(params, {
|
|
17
|
+
enableSorting: true,
|
|
18
|
+
enableColumnFilter: true,
|
|
19
|
+
sortingFn: "text"
|
|
20
|
+
});
|
|
21
|
+
};
|
|
22
|
+
const booleanColumnGenerator = (params) => {
|
|
23
|
+
const { columnKey } = params;
|
|
24
|
+
return extendBaseColumn(params, {
|
|
25
|
+
accessorFn: (originalRow) => {
|
|
26
|
+
const value = originalRow[columnKey];
|
|
27
|
+
return booleanToString(value);
|
|
28
|
+
},
|
|
29
|
+
enableSorting: true,
|
|
30
|
+
enableColumnFilter: true,
|
|
31
|
+
sortingFn: "text"
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
const numberColumnGenerator = (params) => {
|
|
35
|
+
return extendBaseColumn(params, {
|
|
36
|
+
enableSorting: true,
|
|
37
|
+
enableColumnFilter: true,
|
|
38
|
+
sortingFn: "alphanumeric"
|
|
39
|
+
});
|
|
40
|
+
};
|
|
41
|
+
const stringDateColumnGenerator = (params) => {
|
|
42
|
+
const { columnKey } = params;
|
|
43
|
+
return extendBaseColumn(params, {
|
|
44
|
+
accessorFn: (originalRow) => {
|
|
45
|
+
const value = originalRow[columnKey];
|
|
46
|
+
return stringDateToDate(value);
|
|
47
|
+
},
|
|
48
|
+
cell: ({ cell }) => dateCellRenderer(cell.getValue()),
|
|
49
|
+
enableSorting: true,
|
|
50
|
+
enableColumnFilter: true,
|
|
51
|
+
sortingFn: "datetime"
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
const ujsonObjectColumnGenerator = (params) => {
|
|
55
|
+
return extendBaseColumn(params, {
|
|
56
|
+
cell: ({ cell, row }) => {
|
|
57
|
+
return ujsonObjectCellRenderer(params, cell.getValue(), row.original);
|
|
58
|
+
},
|
|
59
|
+
enableSorting: false,
|
|
60
|
+
enableColumnFilter: false
|
|
61
|
+
});
|
|
62
|
+
};
|
|
63
|
+
const ujsonObjectArrayColumnGenerator = (params) => {
|
|
64
|
+
return extendBaseColumn(params, {
|
|
65
|
+
cell: ({ cell, row }) => {
|
|
66
|
+
return ujsonObjectCellRenderer(params, cell.getValue(), row.original);
|
|
67
|
+
},
|
|
68
|
+
enableSorting: false,
|
|
69
|
+
enableColumnFilter: false
|
|
70
|
+
});
|
|
71
|
+
};
|
|
72
|
+
const ujsonValueColumnGenerator = (params) => {
|
|
73
|
+
return extendBaseColumn(params, {
|
|
74
|
+
cell: ({ cell }) => {
|
|
75
|
+
return ujsonValueToString(cell.getValue());
|
|
76
|
+
},
|
|
77
|
+
enableSorting: false,
|
|
78
|
+
enableColumnFilter: false
|
|
79
|
+
});
|
|
80
|
+
};
|
|
81
|
+
const COLUMN_GENERATORS = {
|
|
82
|
+
[COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,
|
|
83
|
+
[COLUMN_DATA_TYPES.number]: numberColumnGenerator,
|
|
84
|
+
[COLUMN_DATA_TYPES.string]: stringColumnGenerator,
|
|
85
|
+
[COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,
|
|
86
|
+
[COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,
|
|
87
|
+
[COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,
|
|
88
|
+
[COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator
|
|
89
|
+
};
|
|
90
|
+
//#endregion
|
|
91
|
+
//#region src/plugins/tanstack/useStore.ts
|
|
92
|
+
const configGenerator = (gridSchema, options) => {
|
|
93
|
+
const { rows, primaryColumnKey } = gridSchema.meta;
|
|
94
|
+
return {
|
|
95
|
+
columns: generateColumns(gridSchema, COLUMN_GENERATORS, options?.customColumnGeneratorByType),
|
|
96
|
+
data: rows,
|
|
97
|
+
getRowId: (row) => String(row[primaryColumnKey])
|
|
98
|
+
};
|
|
99
|
+
};
|
|
100
|
+
function useStore(gridOptions, configGeneratorOptions) {
|
|
101
|
+
return useCoreStore(gridOptions, configGenerator, configGeneratorOptions);
|
|
102
|
+
}
|
|
103
|
+
//#endregion
|
|
104
|
+
export { useStore };
|
|
105
|
+
|
|
106
|
+
//# sourceMappingURL=tanstack.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tanstack.mjs","names":[],"sources":["../../src/plugins/tanstack/COLUMN_GENERATORS.tsx","../../src/plugins/tanstack/useStore.ts"],"sourcesContent":["import type {\n ColDefTanstack,\n PluginConfigTanstack,\n} from \"#plugins/tanstack/types.ts\";\nimport {\n dateCellRenderer,\n ujsonObjectCellRenderer,\n} from \"#utils/cellRenderers.tsx\";\n\nimport {\n COLUMN_DATA_TYPES,\n type ColumnGenerator,\n type ColumnGeneratorByType,\n type ColumnGeneratorParams,\n} from \"@jsoc/grid-core\";\nimport {\n booleanToString,\n stringDateToDate,\n toReadableString,\n type UJSONObject,\n type UJSONObjectArray,\n type UJSONValue,\n ujsonValueToString,\n} from \"@jsoc/utils\";\n\nexport type ColumnGeneratorTanstack = ColumnGenerator<PluginConfigTanstack>;\n\nfunction extendBaseColumn(\n params: ColumnGeneratorParams,\n overrides?: Partial<ColDefTanstack>,\n): ColDefTanstack {\n const { columnKey, columnDataType } = params;\n\n return {\n id: columnKey,\n accessorKey: columnKey,\n header: toReadableString(columnKey),\n meta: { type: columnDataType }, // this is just for reference, it has no bearing on the column definition\n ...overrides,\n };\n}\n\nconst stringColumnGenerator: ColumnGeneratorTanstack = (params) => {\n return extendBaseColumn(params, {\n enableSorting: true,\n enableColumnFilter: true,\n // https://tanstack.com/table/v8/docs/api/features/sorting#sorting-functions\n sortingFn: \"text\",\n });\n};\n\nconst booleanColumnGenerator: ColumnGeneratorTanstack = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n accessorFn: (originalRow) => {\n const value = originalRow[columnKey] as boolean;\n return booleanToString(value);\n },\n enableSorting: true,\n enableColumnFilter: true,\n sortingFn: \"text\",\n });\n};\n\nconst numberColumnGenerator: ColumnGeneratorTanstack = (params) => {\n return extendBaseColumn(params, {\n enableSorting: true,\n enableColumnFilter: true,\n sortingFn: \"alphanumeric\",\n });\n};\n\nconst stringDateColumnGenerator: ColumnGeneratorTanstack = (params) => {\n const { columnKey } = params;\n\n return extendBaseColumn(params, {\n accessorFn: (originalRow) => {\n const value = originalRow[columnKey] as string;\n return stringDateToDate(value);\n },\n cell: ({ cell }) => dateCellRenderer(cell.getValue<Date>()),\n enableSorting: true,\n enableColumnFilter: true,\n sortingFn: \"datetime\",\n });\n};\n\nconst ujsonObjectColumnGenerator: ColumnGeneratorTanstack = (params) => {\n return extendBaseColumn(params, {\n cell: ({ cell, row }) => {\n const value = cell.getValue<UJSONObject>();\n return ujsonObjectCellRenderer(params, value, row.original);\n },\n enableSorting: false,\n enableColumnFilter: false,\n });\n};\n\nconst ujsonObjectArrayColumnGenerator: ColumnGeneratorTanstack = (params) => {\n return extendBaseColumn(params, {\n cell: ({ cell, row }) => {\n const value = cell.getValue<UJSONObjectArray>();\n return ujsonObjectCellRenderer(params, value, row.original);\n },\n enableSorting: false,\n enableColumnFilter: false,\n });\n};\n\nconst ujsonValueColumnGenerator: ColumnGeneratorTanstack = (params) => {\n return extendBaseColumn(params, {\n cell: ({ cell }) => {\n const value = cell.getValue<UJSONValue>();\n return ujsonValueToString(value);\n },\n enableSorting: false,\n enableColumnFilter: false,\n });\n};\n\nexport const COLUMN_GENERATORS: ColumnGeneratorByType<PluginConfigTanstack> = {\n [COLUMN_DATA_TYPES.boolean]: booleanColumnGenerator,\n [COLUMN_DATA_TYPES.number]: numberColumnGenerator,\n [COLUMN_DATA_TYPES.string]: stringColumnGenerator,\n [COLUMN_DATA_TYPES.stringDate]: stringDateColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObject]: ujsonObjectColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonObjectArray]: ujsonObjectArrayColumnGenerator,\n [COLUMN_DATA_TYPES.ujsonValue]: ujsonValueColumnGenerator,\n};\n","import { useCoreStore } from \"#hooks/useCoreStore.ts\";\nimport { COLUMN_GENERATORS } from \"#plugins/tanstack/COLUMN_GENERATORS.tsx\";\nimport type { PluginConfigTanstack } from \"#plugins/tanstack/types.ts\";\n\nimport {\n generateColumns,\n type GridOptions,\n type GridRowId,\n type PluginConfigGenerator,\n type PluginConfigGeneratorOptions,\n} from \"@jsoc/grid-core\";\n\ntype ConfigGeneratorTanstack = PluginConfigGenerator<PluginConfigTanstack>;\n\nconst configGenerator: ConfigGeneratorTanstack = (gridSchema, options) => {\n const { rows, primaryColumnKey } = gridSchema.meta;\n const columns = generateColumns(\n gridSchema,\n COLUMN_GENERATORS,\n options?.customColumnGeneratorByType,\n );\n\n return {\n columns,\n data: rows,\n getRowId: (row) => String(row[primaryColumnKey] as GridRowId),\n };\n};\n\nexport function useStore(\n gridOptions: GridOptions,\n configGeneratorOptions?: PluginConfigGeneratorOptions<PluginConfigTanstack>,\n) {\n return useCoreStore<PluginConfigTanstack>(\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n );\n}\n"],"mappings":";;;;AA2BA,SAAS,iBACP,QACA,WACgB;CAChB,MAAM,EAAE,WAAW,mBAAmB;AAEtC,QAAO;EACL,IAAI;EACJ,aAAa;EACb,QAAQ,iBAAiB,UAAU;EACnC,MAAM,EAAE,MAAM,gBAAgB;EAC9B,GAAG;EACJ;;AAGH,MAAM,yBAAkD,WAAW;AACjE,QAAO,iBAAiB,QAAQ;EAC9B,eAAe;EACf,oBAAoB;EAEpB,WAAW;EACZ,CAAC;;AAGJ,MAAM,0BAAmD,WAAW;CAClE,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,aAAa,gBAAgB;GAC3B,MAAM,QAAQ,YAAY;AAC1B,UAAO,gBAAgB,MAAM;;EAE/B,eAAe;EACf,oBAAoB;EACpB,WAAW;EACZ,CAAC;;AAGJ,MAAM,yBAAkD,WAAW;AACjE,QAAO,iBAAiB,QAAQ;EAC9B,eAAe;EACf,oBAAoB;EACpB,WAAW;EACZ,CAAC;;AAGJ,MAAM,6BAAsD,WAAW;CACrE,MAAM,EAAE,cAAc;AAEtB,QAAO,iBAAiB,QAAQ;EAC9B,aAAa,gBAAgB;GAC3B,MAAM,QAAQ,YAAY;AAC1B,UAAO,iBAAiB,MAAM;;EAEhC,OAAO,EAAE,WAAW,iBAAiB,KAAK,UAAgB,CAAC;EAC3D,eAAe;EACf,oBAAoB;EACpB,WAAW;EACZ,CAAC;;AAGJ,MAAM,8BAAuD,WAAW;AACtE,QAAO,iBAAiB,QAAQ;EAC9B,OAAO,EAAE,MAAM,UAAU;AAEvB,UAAO,wBAAwB,QADjB,KAAK,UAAuB,EACI,IAAI,SAAS;;EAE7D,eAAe;EACf,oBAAoB;EACrB,CAAC;;AAGJ,MAAM,mCAA4D,WAAW;AAC3E,QAAO,iBAAiB,QAAQ;EAC9B,OAAO,EAAE,MAAM,UAAU;AAEvB,UAAO,wBAAwB,QADjB,KAAK,UAA4B,EACD,IAAI,SAAS;;EAE7D,eAAe;EACf,oBAAoB;EACrB,CAAC;;AAGJ,MAAM,6BAAsD,WAAW;AACrE,QAAO,iBAAiB,QAAQ;EAC9B,OAAO,EAAE,WAAW;AAElB,UAAO,mBADO,KAAK,UAAsB,CACT;;EAElC,eAAe;EACf,oBAAoB;EACrB,CAAC;;AAGJ,MAAa,oBAAiE;EAC3E,kBAAkB,UAAU;EAC5B,kBAAkB,SAAS;EAC3B,kBAAkB,SAAS;EAC3B,kBAAkB,aAAa;EAC/B,kBAAkB,cAAc;EAChC,kBAAkB,mBAAmB;EACrC,kBAAkB,aAAa;CACjC;;;ACnHD,MAAM,mBAA4C,YAAY,YAAY;CACxE,MAAM,EAAE,MAAM,qBAAqB,WAAW;AAO9C,QAAO;EACL,SAPc,gBACd,YACA,mBACA,SAAS,4BACV;EAIC,MAAM;EACN,WAAW,QAAQ,OAAO,IAAI,kBAA+B;EAC9D;;AAGH,SAAgB,SACd,aACA,wBACA;AACA,QAAO,aACL,aACA,iBACA,uBACD"}
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import { ColumnGeneratorParams, GridCellLocation, GridDataReadonly, GridId, GridName, GridOptions, GridRow, GridStore, PluginConfig, PluginConfigGenerator, PluginConfigGeneratorOptions } from "@jsoc/grid-core";
|
|
2
|
+
import * as _$react from "react";
|
|
3
|
+
import { Dispatch, ReactNode, SetStateAction } from "react";
|
|
4
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
|
+
|
|
6
|
+
//#region src/components/GridClose.d.ts
|
|
7
|
+
type GridCloseRendererParams = {
|
|
8
|
+
close: () => void;
|
|
9
|
+
};
|
|
10
|
+
type GridCloseProps = {
|
|
11
|
+
/**
|
|
12
|
+
* Either a custom renderer for the close action component or a string to display as text of default close action component.
|
|
13
|
+
*/
|
|
14
|
+
children?: string | ((params: GridCloseRendererParams) => React.ReactNode);
|
|
15
|
+
};
|
|
16
|
+
declare function GridClose({
|
|
17
|
+
children
|
|
18
|
+
}: GridCloseProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<_$react.ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<_$react.ReactNode> | null | undefined> | null | undefined;
|
|
19
|
+
//#endregion
|
|
20
|
+
//#region src/contexts/StoreContext.d.ts
|
|
21
|
+
type StoreContextValue<C extends PluginConfig = PluginConfig> = {
|
|
22
|
+
gridStore: GridStore<C>;
|
|
23
|
+
setGridStore: Dispatch<SetStateAction<GridStore<C>>>;
|
|
24
|
+
};
|
|
25
|
+
declare const StoreContext: _$react.Context<StoreContextValue<PluginConfig<unknown>> | undefined>;
|
|
26
|
+
//#endregion
|
|
27
|
+
//#region src/components/StoreContextProvider.d.ts
|
|
28
|
+
type StoreContextProviderProps<C extends PluginConfig = PluginConfig> = {
|
|
29
|
+
value: StoreContextValue<C>;
|
|
30
|
+
children: ReactNode;
|
|
31
|
+
};
|
|
32
|
+
declare function StoreContextProvider<C extends PluginConfig>({
|
|
33
|
+
value,
|
|
34
|
+
children
|
|
35
|
+
}: StoreContextProviderProps<C>): _$react_jsx_runtime0.JSX.Element;
|
|
36
|
+
//#endregion
|
|
37
|
+
//#region src/components/SubGridToggle.d.ts
|
|
38
|
+
type SubGridToggleRendererParams = {
|
|
39
|
+
isPresent: boolean;
|
|
40
|
+
name: GridName;
|
|
41
|
+
toggle: () => void;
|
|
42
|
+
};
|
|
43
|
+
type SubGridToggleProps = {
|
|
44
|
+
/**
|
|
45
|
+
* Custom renderer for the toggle action.
|
|
46
|
+
* @param isPresent - Flag that indicates whether the subgrid is already present in store or not
|
|
47
|
+
* @default DefaultSubGridToggleRenderer
|
|
48
|
+
*/
|
|
49
|
+
children?: (params: SubGridToggleRendererParams) => React.ReactNode;
|
|
50
|
+
/**
|
|
51
|
+
* data of the sub grid, is actually the `ColumnValue` of the `GridRow[rowId][ColumnKey]`
|
|
52
|
+
* using which the rows and columns will be generated.
|
|
53
|
+
*/
|
|
54
|
+
subGridData: GridDataReadonly;
|
|
55
|
+
/**
|
|
56
|
+
* `GridId` of the grid that will render this component
|
|
57
|
+
*/
|
|
58
|
+
parentGridId: GridId;
|
|
59
|
+
/**
|
|
60
|
+
* Location of the `GridCell` that will render this component
|
|
61
|
+
*/
|
|
62
|
+
parentGridCellLocation: GridCellLocation;
|
|
63
|
+
};
|
|
64
|
+
declare function SubGridToggle({
|
|
65
|
+
subGridData,
|
|
66
|
+
parentGridId,
|
|
67
|
+
parentGridCellLocation,
|
|
68
|
+
children
|
|
69
|
+
}: SubGridToggleProps): _$react.ReactNode;
|
|
70
|
+
//#endregion
|
|
71
|
+
//#region src/hooks/useCoreStore.d.ts
|
|
72
|
+
declare function useCoreStore<C extends PluginConfig>(gridOptions: GridOptions, configGenerator: PluginConfigGenerator<C>, configGeneratorOptions?: PluginConfigGeneratorOptions<C>): StoreContextValue<C>;
|
|
73
|
+
//#endregion
|
|
74
|
+
//#region src/hooks/useStoreContext.d.ts
|
|
75
|
+
declare function useStoreContext<C extends PluginConfig = PluginConfig>(): StoreContextValue<C>;
|
|
76
|
+
//#endregion
|
|
77
|
+
//#region src/utils/cellRenderers.d.ts
|
|
78
|
+
declare const booleanCellRenderer: (value: boolean) => string;
|
|
79
|
+
declare const dateCellRenderer: (value: Date) => string;
|
|
80
|
+
declare const stringDateCellRenderer: (value: string) => string;
|
|
81
|
+
declare const ujsonObjectCellRenderer: (params: ColumnGeneratorParams, value: GridDataReadonly | null | undefined, row: GridRow | null | undefined) => _$react_jsx_runtime0.JSX.Element | undefined;
|
|
82
|
+
//#endregion
|
|
83
|
+
export { useStoreContext as a, SubGridToggleProps as c, StoreContextProviderProps as d, StoreContext as f, GridCloseRendererParams as g, GridCloseProps as h, ujsonObjectCellRenderer as i, SubGridToggleRendererParams as l, GridClose as m, dateCellRenderer as n, useCoreStore as o, StoreContextValue as p, stringDateCellRenderer as r, SubGridToggle as s, booleanCellRenderer as t, StoreContextProvider as u };
|
|
84
|
+
//# sourceMappingURL=shared-ajwnRPOX.d.mts.map
|
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
import { createSubGridId, newGridStore } from "@jsoc/grid-core";
|
|
2
|
+
import { booleanToString, shallowEqual, stringDateToDate, toReadableString } from "@jsoc/utils";
|
|
3
|
+
import { createContext, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
//#region src/hooks/useCoreStore.ts
|
|
6
|
+
function useCoreStore(gridOptions, configGenerator, configGeneratorOptions) {
|
|
7
|
+
const lastGridOptionsRef = useRef(null);
|
|
8
|
+
const lastGeneratorOptionsRef = useRef(null);
|
|
9
|
+
const [gridStore, setGridStore] = useState(() => createStore(lastGridOptionsRef, lastGeneratorOptionsRef, gridOptions, configGenerator, configGeneratorOptions));
|
|
10
|
+
useEffect(() => {
|
|
11
|
+
if (!lastGridOptionsRef.current || !lastGeneratorOptionsRef.current || !shallowEqual(gridOptions, lastGridOptionsRef.current) || !shallowEqual(configGeneratorOptions, lastGeneratorOptionsRef.current)) setGridStore(createStore(lastGridOptionsRef, lastGeneratorOptionsRef, gridOptions, configGenerator, configGeneratorOptions));
|
|
12
|
+
}, [
|
|
13
|
+
gridOptions,
|
|
14
|
+
configGenerator,
|
|
15
|
+
configGeneratorOptions
|
|
16
|
+
]);
|
|
17
|
+
return useMemo(() => ({
|
|
18
|
+
gridStore,
|
|
19
|
+
setGridStore
|
|
20
|
+
}), [gridStore, setGridStore]);
|
|
21
|
+
}
|
|
22
|
+
function createStore(lastGridOptionsRef, lastGeneratorOptionsRef, gridOptions, configGenerator, configGeneratorOptions) {
|
|
23
|
+
const gridStore = newGridStore(gridOptions, {
|
|
24
|
+
configGenerator,
|
|
25
|
+
configGeneratorOptions
|
|
26
|
+
});
|
|
27
|
+
lastGridOptionsRef.current = gridOptions;
|
|
28
|
+
lastGeneratorOptionsRef.current = configGeneratorOptions;
|
|
29
|
+
return gridStore;
|
|
30
|
+
}
|
|
31
|
+
//#endregion
|
|
32
|
+
//#region src/contexts/StoreContext.tsx
|
|
33
|
+
const StoreContext = createContext(void 0);
|
|
34
|
+
//#endregion
|
|
35
|
+
//#region src/errors/ReactGridError.ts
|
|
36
|
+
var ReactGridError = class extends Error {
|
|
37
|
+
constructor(message, cause) {
|
|
38
|
+
super(message, { cause });
|
|
39
|
+
this.name = "ReactGridError";
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
//#endregion
|
|
43
|
+
//#region src/hooks/useStoreContext.ts
|
|
44
|
+
function useStoreContext() {
|
|
45
|
+
const ctx = useContext(StoreContext);
|
|
46
|
+
if (!ctx) throw new ReactGridError(`Missing provider for useStoreContext`);
|
|
47
|
+
return ctx;
|
|
48
|
+
}
|
|
49
|
+
//#endregion
|
|
50
|
+
//#region src/components/GridClose.tsx
|
|
51
|
+
function GridClose({ children }) {
|
|
52
|
+
const { gridStore, setGridStore } = useStoreContext();
|
|
53
|
+
if (gridStore.getSchemas().length === 1) return null;
|
|
54
|
+
const close = () => {
|
|
55
|
+
const newGridStore = gridStore.clone();
|
|
56
|
+
newGridStore.removeSchema();
|
|
57
|
+
setGridStore(newGridStore);
|
|
58
|
+
};
|
|
59
|
+
const params = { close };
|
|
60
|
+
if (typeof children === "function") return children(params);
|
|
61
|
+
return DefaultGridCloseRenderer(children || "Close", params);
|
|
62
|
+
}
|
|
63
|
+
function DefaultGridCloseRenderer(children, params) {
|
|
64
|
+
return /* @__PURE__ */ jsx("button", {
|
|
65
|
+
onClick: params.close,
|
|
66
|
+
style: {
|
|
67
|
+
padding: "4px 12px",
|
|
68
|
+
border: "1px solid #ddd",
|
|
69
|
+
borderRadius: "4px",
|
|
70
|
+
background: "white",
|
|
71
|
+
color: "black",
|
|
72
|
+
cursor: "pointer",
|
|
73
|
+
fontSize: "14px",
|
|
74
|
+
marginBottom: "8px"
|
|
75
|
+
},
|
|
76
|
+
children
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
//#endregion
|
|
80
|
+
//#region src/components/StoreContextProvider.tsx
|
|
81
|
+
function StoreContextProvider({ value, children }) {
|
|
82
|
+
return /* @__PURE__ */ jsx(StoreContext.Provider, {
|
|
83
|
+
value,
|
|
84
|
+
children
|
|
85
|
+
});
|
|
86
|
+
}
|
|
87
|
+
//#endregion
|
|
88
|
+
//#region src/components/SubGridToggle.tsx
|
|
89
|
+
function SubGridToggle({ subGridData, parentGridId, parentGridCellLocation, children = DefaultSubGridToggleRenderer }) {
|
|
90
|
+
const { gridStore, setGridStore } = useStoreContext();
|
|
91
|
+
const subGridId = createSubGridId(parentGridId, parentGridCellLocation);
|
|
92
|
+
const subGridName = parentGridCellLocation.columnKey;
|
|
93
|
+
const index = gridStore.findIndex(subGridId);
|
|
94
|
+
const isPresent = index > -1;
|
|
95
|
+
return children({
|
|
96
|
+
isPresent,
|
|
97
|
+
name: subGridName,
|
|
98
|
+
toggle
|
|
99
|
+
});
|
|
100
|
+
function toggle() {
|
|
101
|
+
const storeClone = gridStore.clone();
|
|
102
|
+
if (isPresent) storeClone.removeSchema(index);
|
|
103
|
+
else storeClone.addSchema({
|
|
104
|
+
id: subGridId,
|
|
105
|
+
name: subGridName,
|
|
106
|
+
data: subGridData
|
|
107
|
+
});
|
|
108
|
+
setGridStore(storeClone);
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
function DefaultSubGridToggleRenderer(params) {
|
|
112
|
+
const { name, isPresent, toggle } = params;
|
|
113
|
+
return /* @__PURE__ */ jsx("button", {
|
|
114
|
+
onClick: toggle,
|
|
115
|
+
style: {
|
|
116
|
+
background: "none",
|
|
117
|
+
border: "none",
|
|
118
|
+
color: "#007bff",
|
|
119
|
+
textDecoration: "underline",
|
|
120
|
+
cursor: "pointer",
|
|
121
|
+
padding: 0
|
|
122
|
+
},
|
|
123
|
+
children: isPresent ? "Close " : "View " + toReadableString(name)
|
|
124
|
+
});
|
|
125
|
+
}
|
|
126
|
+
//#endregion
|
|
127
|
+
//#region src/utils/cellRenderers.tsx
|
|
128
|
+
const booleanCellRenderer = (value) => {
|
|
129
|
+
return booleanToString(value);
|
|
130
|
+
};
|
|
131
|
+
const dateCellRenderer = (value) => {
|
|
132
|
+
return value.toLocaleString();
|
|
133
|
+
};
|
|
134
|
+
const stringDateCellRenderer = (value) => {
|
|
135
|
+
return dateCellRenderer(stringDateToDate(value));
|
|
136
|
+
};
|
|
137
|
+
const ujsonObjectCellRenderer = (params, value, row) => {
|
|
138
|
+
if (!value || !row) return;
|
|
139
|
+
const { columnKey, gridSchema } = params;
|
|
140
|
+
const { primaryColumnKey } = gridSchema.meta;
|
|
141
|
+
return /* @__PURE__ */ jsx(SubGridToggle, {
|
|
142
|
+
subGridData: value,
|
|
143
|
+
parentGridId: gridSchema.options.id,
|
|
144
|
+
parentGridCellLocation: {
|
|
145
|
+
rowId: row[primaryColumnKey],
|
|
146
|
+
columnKey
|
|
147
|
+
}
|
|
148
|
+
});
|
|
149
|
+
};
|
|
150
|
+
//#endregion
|
|
151
|
+
export { SubGridToggle as a, useStoreContext as c, ujsonObjectCellRenderer as i, StoreContext as l, dateCellRenderer as n, StoreContextProvider as o, stringDateCellRenderer as r, GridClose as s, booleanCellRenderer as t, useCoreStore as u };
|
|
152
|
+
|
|
153
|
+
//# sourceMappingURL=shared-usOIqnt_.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"shared-usOIqnt_.mjs","names":[],"sources":["../src/hooks/useCoreStore.ts","../src/contexts/StoreContext.tsx","../src/errors/ReactGridError.ts","../src/hooks/useStoreContext.ts","../src/components/GridClose.tsx","../src/components/StoreContextProvider.tsx","../src/components/SubGridToggle.tsx","../src/utils/cellRenderers.tsx"],"sourcesContent":["import type { StoreContextValue } from \"#contexts/StoreContext.tsx\";\n\nimport {\n type GridOptions,\n type GridStore,\n newGridStore,\n type PluginConfig,\n type PluginConfigGenerator,\n type PluginConfigGeneratorOptions,\n} from \"@jsoc/grid-core\";\nimport { shallowEqual } from \"@jsoc/utils\";\nimport { type RefObject, useEffect, useMemo, useRef, useState } from \"react\";\n\nexport function useCoreStore<C extends PluginConfig>(\n gridOptions: GridOptions,\n configGenerator: PluginConfigGenerator<C>,\n configGeneratorOptions?: PluginConfigGeneratorOptions<C>,\n): StoreContextValue<C> {\n const lastGridOptionsRef = useRef<GridOptions | null>(null);\n const lastGeneratorOptionsRef = useRef<\n PluginConfigGeneratorOptions<C> | null | undefined\n >(null);\n\n const [gridStore, setGridStore] = useState(() =>\n createStore<C>(\n lastGridOptionsRef,\n lastGeneratorOptionsRef,\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n ),\n );\n\n // update grid store when options fields shallowly change.\n useEffect(() => {\n const shouldUpdate =\n !lastGridOptionsRef.current ||\n !lastGeneratorOptionsRef.current ||\n !shallowEqual(gridOptions, lastGridOptionsRef.current) ||\n !shallowEqual(configGeneratorOptions, lastGeneratorOptionsRef.current);\n\n if (shouldUpdate) {\n const store = createStore<C>(\n lastGridOptionsRef,\n lastGeneratorOptionsRef,\n gridOptions,\n configGenerator,\n configGeneratorOptions,\n );\n\n setGridStore(store);\n }\n }, [gridOptions, configGenerator, configGeneratorOptions]);\n\n // prepare the store context value\n const storeContextValue = useMemo(\n () => ({\n gridStore,\n setGridStore,\n }),\n [gridStore, setGridStore],\n );\n\n return storeContextValue;\n}\n\nfunction createStore<C extends PluginConfig>(\n lastGridOptionsRef: RefObject<GridOptions | null>,\n lastGeneratorOptionsRef: RefObject<\n PluginConfigGeneratorOptions<C> | null | undefined\n >,\n gridOptions: GridOptions,\n configGenerator: PluginConfigGenerator<C>,\n configGeneratorOptions?: PluginConfigGeneratorOptions<C>,\n): GridStore<C> {\n const pluginOptions = {\n configGenerator,\n configGeneratorOptions,\n };\n\n const gridStore = newGridStore(gridOptions, pluginOptions);\n\n lastGridOptionsRef.current = gridOptions;\n lastGeneratorOptionsRef.current = configGeneratorOptions;\n\n return gridStore;\n}\n","import type { GridStore, PluginConfig } from \"@jsoc/grid-core\";\nimport { createContext, type Dispatch, type SetStateAction } from \"react\";\n\nexport type StoreContextValue<C extends PluginConfig = PluginConfig> = {\n gridStore: GridStore<C>;\n setGridStore: Dispatch<SetStateAction<GridStore<C>>>;\n};\n\nexport const StoreContext = createContext<\n StoreContextValue<PluginConfig> | undefined\n>(undefined);\n","export class ReactGridError extends Error {\n constructor(message: string, cause?: unknown) {\n super(message, { cause });\n this.name = \"ReactGridError\";\n }\n}\n","import {\n StoreContext,\n type StoreContextValue,\n} from \"#contexts/StoreContext.tsx\";\nimport { ReactGridError } from \"#errors/ReactGridError.ts\";\n\nimport type { PluginConfig } from \"@jsoc/grid-core\";\nimport { useContext } from \"react\";\n\nexport function useStoreContext<\n C extends PluginConfig = PluginConfig,\n>(): StoreContextValue<C> {\n const ctx = useContext(StoreContext);\n\n if (!ctx) {\n throw new ReactGridError(`Missing provider for useStoreContext`);\n }\n\n return ctx as unknown as StoreContextValue<C>;\n}\n","import { useStoreContext } from \"#hooks/index.ts\";\n\nexport type GridCloseRendererParams = {\n close: () => void;\n};\n\nexport type GridCloseProps = {\n /**\n * Either a custom renderer for the close action component or a string to display as text of default close action component.\n */\n children?: string | ((params: GridCloseRendererParams) => React.ReactNode);\n};\n\nexport function GridClose({ children }: GridCloseProps) {\n const { gridStore, setGridStore } = useStoreContext();\n const isRootSchema = gridStore.getSchemas().length === 1;\n\n if (isRootSchema) {\n return null;\n }\n\n const close = () => {\n const newGridStore = gridStore.clone();\n newGridStore.removeSchema();\n setGridStore(newGridStore);\n };\n\n const params = { close };\n\n if (typeof children === \"function\") {\n return children(params);\n }\n\n return DefaultGridCloseRenderer(children || \"Close\", params);\n}\n\nfunction DefaultGridCloseRenderer(\n children: string,\n params: GridCloseRendererParams,\n) {\n return (\n <button\n onClick={params.close}\n style={{\n padding: \"4px 12px\",\n border: \"1px solid #ddd\",\n borderRadius: \"4px\",\n background: \"white\",\n color: \"black\",\n cursor: \"pointer\",\n fontSize: \"14px\",\n marginBottom: \"8px\",\n }}\n >\n {children}\n </button>\n );\n}\n","import {\n StoreContext,\n type StoreContextValue,\n} from \"#contexts/StoreContext.tsx\";\n\nimport type { PluginConfig } from \"@jsoc/grid-core\";\nimport type { ReactNode } from \"react\";\n\nexport type StoreContextProviderProps<C extends PluginConfig = PluginConfig> = {\n value: StoreContextValue<C>;\n children: ReactNode;\n};\n\nexport function StoreContextProvider<C extends PluginConfig>({\n value,\n children,\n}: StoreContextProviderProps<C>) {\n return (\n <StoreContext.Provider\n value={value as unknown as StoreContextValue<PluginConfig>}\n >\n {children}\n </StoreContext.Provider>\n );\n}\n","import { useStoreContext } from \"#hooks/useStoreContext.ts\";\n\nimport {\n createSubGridId,\n type GridCellLocation,\n type GridDataReadonly,\n type GridId,\n type GridName,\n} from \"@jsoc/grid-core\";\nimport { toReadableString } from \"@jsoc/utils\";\n\nexport type SubGridToggleRendererParams = {\n isPresent: boolean;\n name: GridName;\n toggle: () => void;\n};\n\nexport type SubGridToggleProps = {\n /**\n * Custom renderer for the toggle action.\n * @param isPresent - Flag that indicates whether the subgrid is already present in store or not\n * @default DefaultSubGridToggleRenderer\n */\n children?: (params: SubGridToggleRendererParams) => React.ReactNode;\n /**\n * data of the sub grid, is actually the `ColumnValue` of the `GridRow[rowId][ColumnKey]`\n * using which the rows and columns will be generated.\n */\n subGridData: GridDataReadonly;\n /**\n * `GridId` of the grid that will render this component\n */\n parentGridId: GridId;\n /**\n * Location of the `GridCell` that will render this component\n */\n parentGridCellLocation: GridCellLocation;\n};\n\nexport function SubGridToggle({\n subGridData,\n parentGridId,\n parentGridCellLocation,\n children = DefaultSubGridToggleRenderer,\n}: SubGridToggleProps) {\n const { gridStore, setGridStore } = useStoreContext();\n\n const subGridId = createSubGridId(parentGridId, parentGridCellLocation);\n const subGridName = parentGridCellLocation.columnKey;\n const index = gridStore.findIndex(subGridId);\n const isPresent = index > -1;\n\n return children({\n isPresent,\n name: subGridName,\n toggle,\n });\n\n function toggle() {\n const storeClone = gridStore.clone();\n\n if (isPresent) {\n storeClone.removeSchema(index);\n } else {\n storeClone.addSchema({\n id: subGridId,\n name: subGridName,\n data: subGridData,\n });\n }\n\n setGridStore(storeClone);\n }\n}\n\nfunction DefaultSubGridToggleRenderer(params: SubGridToggleRendererParams) {\n const { name, isPresent, toggle } = params;\n const buttonText = isPresent ? \"Close \" : \"View \" + toReadableString(name);\n return (\n <button\n onClick={toggle}\n style={{\n background: \"none\",\n border: \"none\",\n color: \"#007bff\",\n textDecoration: \"underline\",\n cursor: \"pointer\",\n padding: 0,\n }}\n >\n {buttonText}\n </button>\n );\n}\n","import { SubGridToggle } from \"#components/index.ts\";\n\nimport type {\n ColumnGeneratorParams,\n GridDataReadonly,\n GridRow,\n GridRowId,\n} from \"@jsoc/grid-core\";\nimport { booleanToString, stringDateToDate } from \"@jsoc/utils\";\n\nexport const booleanCellRenderer = (value: boolean) => {\n return booleanToString(value);\n};\n\nexport const dateCellRenderer = (value: Date) => {\n return value.toLocaleString();\n};\n\nexport const stringDateCellRenderer = (value: string) => {\n return dateCellRenderer(stringDateToDate(value));\n};\n\nexport const ujsonObjectCellRenderer = (\n params: ColumnGeneratorParams,\n value: GridDataReadonly | null | undefined,\n row: GridRow | null | undefined,\n) => {\n if (!value || !row) {\n return;\n }\n\n const { columnKey, gridSchema } = params;\n const { primaryColumnKey } = gridSchema.meta;\n\n return (\n <SubGridToggle\n subGridData={value}\n parentGridId={gridSchema.options.id}\n parentGridCellLocation={{\n rowId: row[primaryColumnKey] as GridRowId,\n columnKey,\n }}\n />\n );\n};\n"],"mappings":";;;;;AAaA,SAAgB,aACd,aACA,iBACA,wBACsB;CACtB,MAAM,qBAAqB,OAA2B,KAAK;CAC3D,MAAM,0BAA0B,OAE9B,KAAK;CAEP,MAAM,CAAC,WAAW,gBAAgB,eAChC,YACE,oBACA,yBACA,aACA,iBACA,uBACD,CACF;AAGD,iBAAgB;AAOd,MALE,CAAC,mBAAmB,WACpB,CAAC,wBAAwB,WACzB,CAAC,aAAa,aAAa,mBAAmB,QAAQ,IACtD,CAAC,aAAa,wBAAwB,wBAAwB,QAAQ,CAWtE,cARc,YACZ,oBACA,yBACA,aACA,iBACA,uBACD,CAEkB;IAEpB;EAAC;EAAa;EAAiB;EAAuB,CAAC;AAW1D,QAR0B,eACjB;EACL;EACA;EACD,GACD,CAAC,WAAW,aAAa,CAC1B;;AAKH,SAAS,YACP,oBACA,yBAGA,aACA,iBACA,wBACc;CAMd,MAAM,YAAY,aAAa,aALT;EACpB;EACA;EACD,CAEyD;AAE1D,oBAAmB,UAAU;AAC7B,yBAAwB,UAAU;AAElC,QAAO;;;;AC7ET,MAAa,eAAe,cAE1B,KAAA,EAAU;;;ACVZ,IAAa,iBAAb,cAAoC,MAAM;CACxC,YAAY,SAAiB,OAAiB;AAC5C,QAAM,SAAS,EAAE,OAAO,CAAC;AACzB,OAAK,OAAO;;;;;ACMhB,SAAgB,kBAEU;CACxB,MAAM,MAAM,WAAW,aAAa;AAEpC,KAAI,CAAC,IACH,OAAM,IAAI,eAAe,uCAAuC;AAGlE,QAAO;;;;ACLT,SAAgB,UAAU,EAAE,YAA4B;CACtD,MAAM,EAAE,WAAW,iBAAiB,iBAAiB;AAGrD,KAFqB,UAAU,YAAY,CAAC,WAAW,EAGrD,QAAO;CAGT,MAAM,cAAc;EAClB,MAAM,eAAe,UAAU,OAAO;AACtC,eAAa,cAAc;AAC3B,eAAa,aAAa;;CAG5B,MAAM,SAAS,EAAE,OAAO;AAExB,KAAI,OAAO,aAAa,WACtB,QAAO,SAAS,OAAO;AAGzB,QAAO,yBAAyB,YAAY,SAAS,OAAO;;AAG9D,SAAS,yBACP,UACA,QACA;AACA,QACE,oBAAC,UAAD;EACE,SAAS,OAAO;EAChB,OAAO;GACL,SAAS;GACT,QAAQ;GACR,cAAc;GACd,YAAY;GACZ,OAAO;GACP,QAAQ;GACR,UAAU;GACV,cAAc;GACf;EAEA;EACM,CAAA;;;;AC1Cb,SAAgB,qBAA6C,EAC3D,OACA,YAC+B;AAC/B,QACE,oBAAC,aAAa,UAAd;EACS;EAEN;EACqB,CAAA;;;;ACiB5B,SAAgB,cAAc,EAC5B,aACA,cACA,wBACA,WAAW,gCACU;CACrB,MAAM,EAAE,WAAW,iBAAiB,iBAAiB;CAErD,MAAM,YAAY,gBAAgB,cAAc,uBAAuB;CACvE,MAAM,cAAc,uBAAuB;CAC3C,MAAM,QAAQ,UAAU,UAAU,UAAU;CAC5C,MAAM,YAAY,QAAQ;AAE1B,QAAO,SAAS;EACd;EACA,MAAM;EACN;EACD,CAAC;CAEF,SAAS,SAAS;EAChB,MAAM,aAAa,UAAU,OAAO;AAEpC,MAAI,UACF,YAAW,aAAa,MAAM;MAE9B,YAAW,UAAU;GACnB,IAAI;GACJ,MAAM;GACN,MAAM;GACP,CAAC;AAGJ,eAAa,WAAW;;;AAI5B,SAAS,6BAA6B,QAAqC;CACzE,MAAM,EAAE,MAAM,WAAW,WAAW;AAEpC,QACE,oBAAC,UAAD;EACE,SAAS;EACT,OAAO;GACL,YAAY;GACZ,QAAQ;GACR,OAAO;GACP,gBAAgB;GAChB,QAAQ;GACR,SAAS;GACV;YAXc,YAAY,WAAW,UAAU,iBAAiB,KAAK;EAc/D,CAAA;;;;ACjFb,MAAa,uBAAuB,UAAmB;AACrD,QAAO,gBAAgB,MAAM;;AAG/B,MAAa,oBAAoB,UAAgB;AAC/C,QAAO,MAAM,gBAAgB;;AAG/B,MAAa,0BAA0B,UAAkB;AACvD,QAAO,iBAAiB,iBAAiB,MAAM,CAAC;;AAGlD,MAAa,2BACX,QACA,OACA,QACG;AACH,KAAI,CAAC,SAAS,CAAC,IACb;CAGF,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,qBAAqB,WAAW;AAExC,QACE,oBAAC,eAAD;EACE,aAAa;EACb,cAAc,WAAW,QAAQ;EACjC,wBAAwB;GACtB,OAAO,IAAI;GACX;GACD;EACD,CAAA"}
|
package/package.json
ADDED
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@jsoc/react-grid",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"description": "Dynamic columns/rows generator for popular React grid components",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"datagrid",
|
|
7
|
+
"datatable",
|
|
8
|
+
"grid",
|
|
9
|
+
"jsongrid",
|
|
10
|
+
"react",
|
|
11
|
+
"table"
|
|
12
|
+
],
|
|
13
|
+
"license": "MIT",
|
|
14
|
+
"repository": {
|
|
15
|
+
"type": "git",
|
|
16
|
+
"url": "https://github.com/jsoc-dev/grid.git",
|
|
17
|
+
"directory": "packages/react-grid"
|
|
18
|
+
},
|
|
19
|
+
"bugs": {
|
|
20
|
+
"url": "https://github.com/jsoc-dev/grid/issues"
|
|
21
|
+
},
|
|
22
|
+
"homepage": "https://github.com/jsoc-dev/grid/tree/main/packages/react-grid#readme",
|
|
23
|
+
"type": "module",
|
|
24
|
+
"imports": {
|
|
25
|
+
"#*": "./src/*"
|
|
26
|
+
},
|
|
27
|
+
"exports": {
|
|
28
|
+
".": {
|
|
29
|
+
"import": "./dist/index.mjs",
|
|
30
|
+
"types": "./dist/index.d.mts"
|
|
31
|
+
},
|
|
32
|
+
"./ag": {
|
|
33
|
+
"import": "./dist/plugins/ag.mjs",
|
|
34
|
+
"types": "./dist/plugins/ag.d.mts"
|
|
35
|
+
},
|
|
36
|
+
"./ant": {
|
|
37
|
+
"import": "./dist/plugins/ant.mjs",
|
|
38
|
+
"types": "./dist/plugins/ant.d.mts"
|
|
39
|
+
},
|
|
40
|
+
"./mantine": {
|
|
41
|
+
"import": "./dist/plugins/mantine.mjs",
|
|
42
|
+
"types": "./dist/plugins/mantine.d.mts"
|
|
43
|
+
},
|
|
44
|
+
"./mui": {
|
|
45
|
+
"import": "./dist/plugins/mui.mjs",
|
|
46
|
+
"types": "./dist/plugins/mui.d.mts"
|
|
47
|
+
},
|
|
48
|
+
"./prime": {
|
|
49
|
+
"import": "./dist/plugins/prime.mjs",
|
|
50
|
+
"types": "./dist/plugins/prime.d.mts"
|
|
51
|
+
},
|
|
52
|
+
"./tanstack": {
|
|
53
|
+
"import": "./dist/plugins/tanstack.mjs",
|
|
54
|
+
"types": "./dist/plugins/tanstack.d.mts"
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
"files": [
|
|
58
|
+
"dist"
|
|
59
|
+
],
|
|
60
|
+
"dependencies": {
|
|
61
|
+
"@jsoc/utils": "0.0.1",
|
|
62
|
+
"@jsoc/grid-core": "0.0.1"
|
|
63
|
+
},
|
|
64
|
+
"devDependencies": {
|
|
65
|
+
"@mui/x-data-grid": "^8.16.0",
|
|
66
|
+
"@tanstack/react-table": "^8.21.3",
|
|
67
|
+
"@types/node": "^25.5.0",
|
|
68
|
+
"@types/react": "^19.0.0",
|
|
69
|
+
"@types/react-dom": "^19.0.0",
|
|
70
|
+
"ag-grid-community": "^35.0.0",
|
|
71
|
+
"ag-grid-react": "^35.0.0",
|
|
72
|
+
"antd": "^6.3.5",
|
|
73
|
+
"mantine-react-table": "^1.3.4",
|
|
74
|
+
"primereact": "^10.0.0",
|
|
75
|
+
"react": "^19.0.0",
|
|
76
|
+
"react-dom": "^19.0.0",
|
|
77
|
+
"tsdown": "^0.x",
|
|
78
|
+
"typescript": "^5.9.3"
|
|
79
|
+
},
|
|
80
|
+
"peerDependencies": {
|
|
81
|
+
"@mui/x-data-grid": "^8.16.0",
|
|
82
|
+
"@tanstack/react-table": "^8.21.3",
|
|
83
|
+
"ag-grid-community": "^35.0.0",
|
|
84
|
+
"ag-grid-react": "^35.0.0",
|
|
85
|
+
"antd": "^6.3.5",
|
|
86
|
+
"mantine-react-table": "^1.3.4",
|
|
87
|
+
"primereact": "^10.0.0",
|
|
88
|
+
"react": "^18.0.0 || ^19.0.0",
|
|
89
|
+
"react-dom": "^18.0.0 || ^19.0.0"
|
|
90
|
+
},
|
|
91
|
+
"peerDependenciesMeta": {
|
|
92
|
+
"@mui/x-data-grid": {
|
|
93
|
+
"optional": true
|
|
94
|
+
},
|
|
95
|
+
"@tanstack/react-table": {
|
|
96
|
+
"optional": true
|
|
97
|
+
},
|
|
98
|
+
"antd": {
|
|
99
|
+
"optional": true
|
|
100
|
+
},
|
|
101
|
+
"ag-grid-react": {
|
|
102
|
+
"optional": true
|
|
103
|
+
},
|
|
104
|
+
"ag-grid-community": {
|
|
105
|
+
"optional": true
|
|
106
|
+
},
|
|
107
|
+
"mantine-react-table": {
|
|
108
|
+
"optional": true
|
|
109
|
+
},
|
|
110
|
+
"primereact": {
|
|
111
|
+
"optional": true
|
|
112
|
+
}
|
|
113
|
+
},
|
|
114
|
+
"scripts": {
|
|
115
|
+
"build": "tsdown",
|
|
116
|
+
"typecheck": "tsc --noEmit"
|
|
117
|
+
},
|
|
118
|
+
"main": "./dist/index.mjs",
|
|
119
|
+
"module": "./dist/index.mjs",
|
|
120
|
+
"types": "./dist/index.d.mts"
|
|
121
|
+
}
|