@osdk/react-components 0.2.0-beta.10 → 0.2.0-beta.12
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/AGENTS.md +105 -0
- package/CHANGELOG.md +22 -0
- package/build/browser/object-table/DefaultCellRenderer.js +5 -2
- package/build/browser/object-table/DefaultCellRenderer.js.map +1 -1
- package/build/browser/object-table/EditableCell.js +16 -6
- package/build/browser/object-table/EditableCell.js.map +1 -1
- package/build/browser/object-table/EditableCell.module.css +30 -2
- package/build/browser/object-table/EditableCell.module.css.js +2 -1
- package/build/browser/object-table/ObjectTable.js +9 -22
- package/build/browser/object-table/ObjectTable.js.map +1 -1
- package/build/browser/object-table/ObjectTableApi.js.map +1 -1
- package/build/browser/object-table/Table.js +23 -15
- package/build/browser/object-table/Table.js.map +1 -1
- package/build/browser/object-table/Table.module.css +0 -8
- package/build/browser/object-table/Table.module.css.js +1 -2
- package/build/browser/object-table/TableBody.js +8 -2
- package/build/browser/object-table/TableBody.js.map +1 -1
- package/build/browser/object-table/TableCell.module.css +0 -8
- package/build/browser/object-table/TableEditContainer.js +79 -0
- package/build/browser/object-table/TableEditContainer.js.map +1 -0
- package/build/browser/object-table/TableEditContainer.module.css +44 -0
- package/build/browser/object-table/TableEditContainer.module.css.js +9 -0
- package/build/browser/object-table/TableRow.js +12 -4
- package/build/browser/object-table/TableRow.js.map +1 -1
- package/build/browser/object-table/TableRow.module.css +2 -1
- package/build/browser/object-table/hooks/useEditableTable.js +20 -11
- package/build/browser/object-table/hooks/useEditableTable.js.map +1 -1
- package/build/browser/object-table/hooks/useObjectTableData.js +0 -5
- package/build/browser/object-table/hooks/useObjectTableData.js.map +1 -1
- package/build/browser/object-table/utils/getCellId.js +0 -7
- package/build/browser/object-table/utils/getCellId.js.map +1 -1
- package/build/browser/object-table/utils/types.js.map +1 -1
- package/build/browser/public/experimental.js.map +1 -1
- package/build/browser/styles.css +79 -19
- package/build/cjs/public/experimental.cjs +179 -90
- package/build/cjs/public/experimental.cjs.map +1 -1
- package/build/cjs/public/experimental.css +96 -57
- package/build/cjs/public/experimental.css.map +1 -1
- package/build/cjs/public/experimental.d.cts +40 -18
- package/build/esm/object-table/DefaultCellRenderer.js +5 -2
- package/build/esm/object-table/DefaultCellRenderer.js.map +1 -1
- package/build/esm/object-table/EditableCell.js +16 -6
- package/build/esm/object-table/EditableCell.js.map +1 -1
- package/build/esm/object-table/EditableCell.module.css +30 -2
- package/build/esm/object-table/ObjectTable.js +9 -22
- package/build/esm/object-table/ObjectTable.js.map +1 -1
- package/build/esm/object-table/ObjectTableApi.js.map +1 -1
- package/build/esm/object-table/Table.js +23 -15
- package/build/esm/object-table/Table.js.map +1 -1
- package/build/esm/object-table/Table.module.css +0 -8
- package/build/esm/object-table/TableBody.js +8 -2
- package/build/esm/object-table/TableBody.js.map +1 -1
- package/build/esm/object-table/TableCell.module.css +0 -8
- package/build/esm/object-table/TableEditContainer.js +79 -0
- package/build/esm/object-table/TableEditContainer.js.map +1 -0
- package/build/esm/object-table/TableEditContainer.module.css +44 -0
- package/build/esm/object-table/TableRow.js +12 -4
- package/build/esm/object-table/TableRow.js.map +1 -1
- package/build/esm/object-table/TableRow.module.css +2 -1
- package/build/esm/object-table/hooks/useEditableTable.js +20 -11
- package/build/esm/object-table/hooks/useEditableTable.js.map +1 -1
- package/build/esm/object-table/hooks/useObjectTableData.js +0 -5
- package/build/esm/object-table/hooks/useObjectTableData.js.map +1 -1
- package/build/esm/object-table/utils/getCellId.js +0 -7
- package/build/esm/object-table/utils/getCellId.js.map +1 -1
- package/build/esm/object-table/utils/types.js.map +1 -1
- package/build/esm/public/experimental.js.map +1 -1
- package/build/types/object-table/DefaultCellRenderer.d.ts +2 -2
- package/build/types/object-table/DefaultCellRenderer.d.ts.map +1 -1
- package/build/types/object-table/EditableCell.d.ts +18 -6
- package/build/types/object-table/EditableCell.d.ts.map +1 -1
- package/build/types/object-table/ObjectTable.d.ts +1 -1
- package/build/types/object-table/ObjectTable.d.ts.map +1 -1
- package/build/types/object-table/ObjectTableApi.d.ts +16 -6
- package/build/types/object-table/ObjectTableApi.d.ts.map +1 -1
- package/build/types/object-table/Table.d.ts +5 -10
- package/build/types/object-table/Table.d.ts.map +1 -1
- package/build/types/object-table/TableBody.d.ts +4 -1
- package/build/types/object-table/TableBody.d.ts.map +1 -1
- package/build/types/object-table/TableEditContainer.d.ts +9 -0
- package/build/types/object-table/TableEditContainer.d.ts.map +1 -0
- package/build/types/object-table/TableRow.d.ts +5 -1
- package/build/types/object-table/TableRow.d.ts.map +1 -1
- package/build/types/object-table/hooks/useEditableTable.d.ts +4 -9
- package/build/types/object-table/hooks/useEditableTable.d.ts.map +1 -1
- package/build/types/object-table/utils/getCellId.d.ts +0 -1
- package/build/types/object-table/utils/getCellId.d.ts.map +1 -1
- package/build/types/object-table/utils/types.d.ts +25 -3
- package/build/types/object-table/utils/types.d.ts.map +1 -1
- package/build/types/public/experimental.d.ts +1 -1
- package/build/types/public/experimental.d.ts.map +1 -1
- package/package.json +7 -6
- package/build/browser/filter-list/__tests__/LinkedPropertyInput.test.js +0 -202
- package/build/browser/filter-list/__tests__/LinkedPropertyInput.test.js.map +0 -1
- package/build/browser/filter-list/__tests__/dateUtils.test.js +0 -55
- package/build/browser/filter-list/__tests__/dateUtils.test.js.map +0 -1
- package/build/browser/filter-list/__tests__/filterStateToWhereClause.test.js +0 -296
- package/build/browser/filter-list/__tests__/filterStateToWhereClause.test.js.map +0 -1
- package/build/browser/filter-list/__tests__/getFilterKey.test.js +0 -53
- package/build/browser/filter-list/__tests__/getFilterKey.test.js.map +0 -1
- package/build/browser/filter-list/__tests__/testUtils.js +0 -203
- package/build/browser/filter-list/__tests__/testUtils.js.map +0 -1
- package/build/browser/filter-list/hooks/__tests__/useFilterListState.test.js +0 -128
- package/build/browser/filter-list/hooks/__tests__/useFilterListState.test.js.map +0 -1
- package/build/browser/object-table/__tests__/useEditableTable.test.js +0 -197
- package/build/browser/object-table/__tests__/useEditableTable.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useCellContextMenu.test.js +0 -147
- package/build/browser/object-table/hooks/__tests__/useCellContextMenu.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useColumnDefs.test.js +0 -520
- package/build/browser/object-table/hooks/__tests__/useColumnDefs.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useColumnPinning.test.js +0 -266
- package/build/browser/object-table/hooks/__tests__/useColumnPinning.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useColumnVisibility.test.js +0 -200
- package/build/browser/object-table/hooks/__tests__/useColumnVisibility.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useObjectTableData.test.js +0 -315
- package/build/browser/object-table/hooks/__tests__/useObjectTableData.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useRowSelection.test.js +0 -596
- package/build/browser/object-table/hooks/__tests__/useRowSelection.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useSelectionColumn.test.js +0 -220
- package/build/browser/object-table/hooks/__tests__/useSelectionColumn.test.js.map +0 -1
- package/build/browser/object-table/hooks/__tests__/useTableSorting.test.js +0 -501
- package/build/browser/object-table/hooks/__tests__/useTableSorting.test.js.map +0 -1
- package/build/esm/filter-list/__tests__/LinkedPropertyInput.test.js +0 -202
- package/build/esm/filter-list/__tests__/LinkedPropertyInput.test.js.map +0 -1
- package/build/esm/filter-list/__tests__/dateUtils.test.js +0 -55
- package/build/esm/filter-list/__tests__/dateUtils.test.js.map +0 -1
- package/build/esm/filter-list/__tests__/filterStateToWhereClause.test.js +0 -296
- package/build/esm/filter-list/__tests__/filterStateToWhereClause.test.js.map +0 -1
- package/build/esm/filter-list/__tests__/getFilterKey.test.js +0 -53
- package/build/esm/filter-list/__tests__/getFilterKey.test.js.map +0 -1
- package/build/esm/filter-list/__tests__/testUtils.js +0 -203
- package/build/esm/filter-list/__tests__/testUtils.js.map +0 -1
- package/build/esm/filter-list/hooks/__tests__/useFilterListState.test.js +0 -128
- package/build/esm/filter-list/hooks/__tests__/useFilterListState.test.js.map +0 -1
- package/build/esm/object-table/__tests__/useEditableTable.test.js +0 -197
- package/build/esm/object-table/__tests__/useEditableTable.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useCellContextMenu.test.js +0 -147
- package/build/esm/object-table/hooks/__tests__/useCellContextMenu.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useColumnDefs.test.js +0 -520
- package/build/esm/object-table/hooks/__tests__/useColumnDefs.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useColumnPinning.test.js +0 -266
- package/build/esm/object-table/hooks/__tests__/useColumnPinning.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useColumnVisibility.test.js +0 -200
- package/build/esm/object-table/hooks/__tests__/useColumnVisibility.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useObjectTableData.test.js +0 -315
- package/build/esm/object-table/hooks/__tests__/useObjectTableData.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useRowSelection.test.js +0 -596
- package/build/esm/object-table/hooks/__tests__/useRowSelection.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useSelectionColumn.test.js +0 -220
- package/build/esm/object-table/hooks/__tests__/useSelectionColumn.test.js.map +0 -1
- package/build/esm/object-table/hooks/__tests__/useTableSorting.test.js +0 -501
- package/build/esm/object-table/hooks/__tests__/useTableSorting.test.js.map +0 -1
- package/build/types/filter-list/__tests__/LinkedPropertyInput.test.d.ts +0 -1
- package/build/types/filter-list/__tests__/LinkedPropertyInput.test.d.ts.map +0 -1
- package/build/types/filter-list/__tests__/dateUtils.test.d.ts +0 -1
- package/build/types/filter-list/__tests__/dateUtils.test.d.ts.map +0 -1
- package/build/types/filter-list/__tests__/filterStateToWhereClause.test.d.ts +0 -1
- package/build/types/filter-list/__tests__/filterStateToWhereClause.test.d.ts.map +0 -1
- package/build/types/filter-list/__tests__/getFilterKey.test.d.ts +0 -1
- package/build/types/filter-list/__tests__/getFilterKey.test.d.ts.map +0 -1
- package/build/types/filter-list/__tests__/testUtils.d.ts +0 -65
- package/build/types/filter-list/__tests__/testUtils.d.ts.map +0 -1
- package/build/types/filter-list/hooks/__tests__/useFilterListState.test.d.ts +0 -1
- package/build/types/filter-list/hooks/__tests__/useFilterListState.test.d.ts.map +0 -1
- package/build/types/object-table/__tests__/useEditableTable.test.d.ts +0 -1
- package/build/types/object-table/__tests__/useEditableTable.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useCellContextMenu.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useCellContextMenu.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useColumnDefs.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useColumnDefs.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useColumnPinning.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useColumnPinning.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useColumnVisibility.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useColumnVisibility.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useObjectTableData.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useObjectTableData.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useRowSelection.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useRowSelection.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useSelectionColumn.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useSelectionColumn.test.d.ts.map +0 -1
- package/build/types/object-table/hooks/__tests__/useTableSorting.test.d.ts +0 -1
- package/build/types/object-table/hooks/__tests__/useTableSorting.test.d.ts.map +0 -1
package/AGENTS.md
ADDED
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
# @osdk/react-components
|
|
2
|
+
|
|
3
|
+
Pre-built UI components for OSDK data. Requires `@osdk/react` (see the `@osdk/react` package's `AGENTS.md` for hooks and provider setup).
|
|
4
|
+
|
|
5
|
+
## Setup
|
|
6
|
+
|
|
7
|
+
All components import from `@osdk/react-components/experimental`. Requires `OsdkProvider2` from `@osdk/react/experimental`.
|
|
8
|
+
|
|
9
|
+
### Provider (required)
|
|
10
|
+
|
|
11
|
+
```tsx
|
|
12
|
+
import { OsdkProvider2 } from "@osdk/react/experimental";
|
|
13
|
+
import { client } from "./client";
|
|
14
|
+
|
|
15
|
+
function App() {
|
|
16
|
+
return (
|
|
17
|
+
<OsdkProvider2 client={client}>
|
|
18
|
+
<MyApp />
|
|
19
|
+
</OsdkProvider2>
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
### CSS (required)
|
|
25
|
+
|
|
26
|
+
```css
|
|
27
|
+
@layer osdk.tokens, osdk.components;
|
|
28
|
+
@import "@osdk/react-components-styles" layer(osdk.tokens);
|
|
29
|
+
@import "@osdk/react-components/styles.css" layer(osdk.components);
|
|
30
|
+
|
|
31
|
+
.root {
|
|
32
|
+
isolation: isolate;
|
|
33
|
+
}
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## ObjectTable
|
|
37
|
+
|
|
38
|
+
```tsx
|
|
39
|
+
import { ObjectTable } from "@osdk/react-components/experimental";
|
|
40
|
+
import { Employee } from "@your-osdk-package";
|
|
41
|
+
|
|
42
|
+
function EmployeeDirectory() {
|
|
43
|
+
return <ObjectTable objectType={Employee} />;
|
|
44
|
+
}
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
### Key Props
|
|
48
|
+
|
|
49
|
+
| Prop | Type | Description |
|
|
50
|
+
| ---------------------------- | ------------------------------------ | ------------------------------------------------------------------- |
|
|
51
|
+
| `objectType` | ObjectType | **Required.** The OSDK object type to display. |
|
|
52
|
+
| `columnDefinitions` | `ColumnDefinition[]` | Column config: visibility, order, custom renderers, pinning, width. |
|
|
53
|
+
| `enableFiltering` | boolean | Allow user filtering (default: true) |
|
|
54
|
+
| `enableOrdering` | boolean | Allow user sorting (default: true) |
|
|
55
|
+
| `enableColumnPinning` | boolean | Allow column pinning (default: true) |
|
|
56
|
+
| `enableColumnResizing` | boolean | Allow column resizing (default: true) |
|
|
57
|
+
| `enableColumnConfig` | boolean | Show column config dialog (default: true) |
|
|
58
|
+
| `selectionMode` | `"single"` / `"multiple"` / `"none"` | Row selection mode (default: "none") |
|
|
59
|
+
| `orderBy` / `defaultOrderBy` | `OrderBy<Q>[]` | Controlled/uncontrolled sorting |
|
|
60
|
+
| `filter` | WhereClause | Controlled filtering |
|
|
61
|
+
| `rowHeight` | number | Row height in pixels (default: 40) |
|
|
62
|
+
| `renderCellContextMenu` | function | Custom right-click menu |
|
|
63
|
+
|
|
64
|
+
### Column Definition
|
|
65
|
+
|
|
66
|
+
```ts
|
|
67
|
+
type ColumnDefinition = {
|
|
68
|
+
locator:
|
|
69
|
+
| { type: "property"; id: PropertyKeys<Q> }
|
|
70
|
+
| {
|
|
71
|
+
type: "rdp";
|
|
72
|
+
id: keyof RDPs;
|
|
73
|
+
creator: DerivedProperty.Creator<Q, RDPs[keyof RDPs]>;
|
|
74
|
+
}
|
|
75
|
+
| { type: "function"; id: keyof FunctionColumns }
|
|
76
|
+
| { type: "custom"; id: string };
|
|
77
|
+
renderCell?: (
|
|
78
|
+
object: Osdk.Instance<Q>,
|
|
79
|
+
locator: ColumnDefinitionLocator<Q>,
|
|
80
|
+
) => React.ReactNode;
|
|
81
|
+
renderHeader?: () => React.ReactNode;
|
|
82
|
+
width?: number;
|
|
83
|
+
pinned?: "left" | "right" | "none";
|
|
84
|
+
isVisible?: boolean;
|
|
85
|
+
orderable?: boolean;
|
|
86
|
+
columnName?: string;
|
|
87
|
+
};
|
|
88
|
+
```
|
|
89
|
+
|
|
90
|
+
### ColumnConfigDialog
|
|
91
|
+
|
|
92
|
+
Standalone dialog for column visibility/ordering:
|
|
93
|
+
|
|
94
|
+
```tsx
|
|
95
|
+
import { ColumnConfigDialog } from "@osdk/react-components/experimental";
|
|
96
|
+
|
|
97
|
+
<ColumnConfigDialog
|
|
98
|
+
isOpen={isOpen}
|
|
99
|
+
onClose={() => setIsOpen(false)}
|
|
100
|
+
columnOptions={[{ id: "fullName", name: "Full Name" }]}
|
|
101
|
+
currentVisibility={{ fullName: true }}
|
|
102
|
+
currentColumnOrder={["fullName"]}
|
|
103
|
+
onApply={(columns) => {/* [{ columnId, isVisible }] */}}
|
|
104
|
+
/>;
|
|
105
|
+
```
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
# @osdk/react-components
|
|
2
2
|
|
|
3
|
+
## 0.2.0-beta.12
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 9720083: Add AGENTS.md files for AI IDE context
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [9720083]
|
|
12
|
+
- Updated dependencies [09e5659]
|
|
13
|
+
- Updated dependencies [8a82492]
|
|
14
|
+
- Updated dependencies [2ebe62c]
|
|
15
|
+
- @osdk/react@0.10.0-beta.8
|
|
16
|
+
- @osdk/client@2.8.0-beta.16
|
|
17
|
+
- @osdk/api@2.8.0-beta.16
|
|
18
|
+
|
|
19
|
+
## 0.2.0-beta.11
|
|
20
|
+
|
|
21
|
+
### Minor Changes
|
|
22
|
+
|
|
23
|
+
- 447e29d: Update editable table UX and API to pass the entire row data on edit
|
|
24
|
+
|
|
3
25
|
## 0.2.0-beta.10
|
|
4
26
|
|
|
5
27
|
### Minor Changes
|
|
@@ -20,7 +20,7 @@ import { getCellId } from "./utils/getCellId.js";
|
|
|
20
20
|
export function renderDefaultCell(cellContext) {
|
|
21
21
|
const meta = cellContext.table.options.meta;
|
|
22
22
|
const columnMeta = cellContext.column.columnDef.meta;
|
|
23
|
-
if (!columnMeta?.editable || !meta?.onCellEdit) {
|
|
23
|
+
if (!columnMeta?.editable || !meta?.onCellEdit || !meta?.isInEditMode) {
|
|
24
24
|
return /*#__PURE__*/React.createElement(React.Fragment, null, cellContext.getValue());
|
|
25
25
|
}
|
|
26
26
|
const rowId = cellContext.row.id;
|
|
@@ -37,7 +37,10 @@ export function renderDefaultCell(cellContext) {
|
|
|
37
37
|
currentValue: currentValue,
|
|
38
38
|
cellId: cellId,
|
|
39
39
|
dataType: columnMeta?.dataType,
|
|
40
|
-
onCellEdit: meta.onCellEdit
|
|
40
|
+
onCellEdit: meta.onCellEdit,
|
|
41
|
+
originalRowData: cellContext.row.original,
|
|
42
|
+
rowId: rowId,
|
|
43
|
+
columnId: columnId
|
|
41
44
|
});
|
|
42
45
|
}
|
|
43
46
|
//# sourceMappingURL=DefaultCellRenderer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultCellRenderer.js","names":["React","EditableCell","getCellId","renderDefaultCell","cellContext","meta","table","options","columnMeta","column","columnDef","editable","onCellEdit","createElement","Fragment","getValue","rowId","row","id","columnId","cellId","cellEdits","editedValue","currentValue","newValue","initialValue","dataType"],"sources":["DefaultCellRenderer.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { CellContext } from \"@tanstack/react-table\";\nimport React from \"react\";\nimport { EditableCell } from \"./EditableCell.js\";\nimport { getCellId } from \"./utils/getCellId.js\";\n\nexport function renderDefaultCell<TData>(\n cellContext: CellContext<TData, unknown>,\n): React.ReactNode {\n const meta = cellContext.table.options.meta;\n const columnMeta = cellContext.column.columnDef.meta;\n\n if (!columnMeta?.editable || !meta?.onCellEdit) {\n return <>{cellContext.getValue()}</>;\n }\n\n const rowId = cellContext.row.id;\n const columnId = cellContext.column.id;\n const cellId = getCellId({ rowId, columnId });\n\n const cellEdits = meta.cellEdits;\n const editedValue = cellEdits?.[cellId];\n const currentValue = editedValue?.newValue ?? cellContext.getValue();\n\n return (\n <EditableCell
|
|
1
|
+
{"version":3,"file":"DefaultCellRenderer.js","names":["React","EditableCell","getCellId","renderDefaultCell","cellContext","meta","table","options","columnMeta","column","columnDef","editable","onCellEdit","isInEditMode","createElement","Fragment","getValue","rowId","row","id","columnId","cellId","cellEdits","editedValue","currentValue","newValue","initialValue","dataType","originalRowData","original"],"sources":["DefaultCellRenderer.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { CellContext, RowData } from \"@tanstack/react-table\";\nimport React from \"react\";\nimport { EditableCell } from \"./EditableCell.js\";\nimport { getCellId } from \"./utils/getCellId.js\";\n\nexport function renderDefaultCell<TData extends RowData>(\n cellContext: CellContext<TData, unknown>,\n): React.ReactNode {\n const meta = cellContext.table.options.meta;\n const columnMeta = cellContext.column.columnDef.meta;\n\n if (!columnMeta?.editable || !meta?.onCellEdit || !meta?.isInEditMode) {\n return <>{cellContext.getValue()}</>;\n }\n\n const rowId = cellContext.row.id;\n const columnId = cellContext.column.id;\n const cellId = getCellId({ rowId, columnId });\n\n const cellEdits = meta.cellEdits;\n const editedValue = cellEdits?.[cellId];\n const currentValue = editedValue?.newValue ?? cellContext.getValue();\n\n return (\n <EditableCell<TData>\n initialValue={cellContext.getValue()}\n currentValue={currentValue}\n cellId={cellId}\n dataType={columnMeta?.dataType}\n onCellEdit={meta.onCellEdit}\n originalRowData={cellContext.row.original}\n rowId={rowId}\n columnId={columnId}\n />\n );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,SAAS,QAAQ,sBAAsB;AAEhD,OAAO,SAASC,iBAAiBA,CAC/BC,WAAwC,EACvB;EACjB,MAAMC,IAAI,GAAGD,WAAW,CAACE,KAAK,CAACC,OAAO,CAACF,IAAI;EAC3C,MAAMG,UAAU,GAAGJ,WAAW,CAACK,MAAM,CAACC,SAAS,CAACL,IAAI;EAEpD,IAAI,CAACG,UAAU,EAAEG,QAAQ,IAAI,CAACN,IAAI,EAAEO,UAAU,IAAI,CAACP,IAAI,EAAEQ,YAAY,EAAE;IACrE,oBAAOb,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAe,QAAA,QAAGX,WAAW,CAACY,QAAQ,CAAC,CAAI,CAAC;EACtC;EAEA,MAAMC,KAAK,GAAGb,WAAW,CAACc,GAAG,CAACC,EAAE;EAChC,MAAMC,QAAQ,GAAGhB,WAAW,CAACK,MAAM,CAACU,EAAE;EACtC,MAAME,MAAM,GAAGnB,SAAS,CAAC;IAAEe,KAAK;IAAEG;EAAS,CAAC,CAAC;EAE7C,MAAME,SAAS,GAAGjB,IAAI,CAACiB,SAAS;EAChC,MAAMC,WAAW,GAAGD,SAAS,GAAGD,MAAM,CAAC;EACvC,MAAMG,YAAY,GAAGD,WAAW,EAAEE,QAAQ,IAAIrB,WAAW,CAACY,QAAQ,CAAC,CAAC;EAEpE,oBACEhB,KAAA,CAAAc,aAAA,CAACb,YAAY;IACXyB,YAAY,EAAEtB,WAAW,CAACY,QAAQ,CAAC,CAAE;IACrCQ,YAAY,EAAEA,YAAa;IAC3BH,MAAM,EAAEA,MAAO;IACfM,QAAQ,EAAEnB,UAAU,EAAEmB,QAAS;IAC/Bf,UAAU,EAAEP,IAAI,CAACO,UAAW;IAC5BgB,eAAe,EAAExB,WAAW,CAACc,GAAG,CAACW,QAAS;IAC1CZ,KAAK,EAAEA,KAAM;IACbG,QAAQ,EAAEA;EAAS,CACpB,CAAC;AAEN","ignoreList":[]}
|
|
@@ -15,6 +15,7 @@
|
|
|
15
15
|
*/
|
|
16
16
|
|
|
17
17
|
import { Input } from "@base-ui/react/input";
|
|
18
|
+
import classNames from "classnames";
|
|
18
19
|
import React, { useCallback, useEffect, useRef, useState } from "react";
|
|
19
20
|
import styles from "./EditableCell.module.css.js";
|
|
20
21
|
const NUMBER_TYPES = ["double", "integer", "long", "float", "decimal", "byte", "short"];
|
|
@@ -41,12 +42,15 @@ function parseValueByType(value, dataType) {
|
|
|
41
42
|
}
|
|
42
43
|
return parsedNumber;
|
|
43
44
|
}
|
|
44
|
-
|
|
45
|
+
function EditableCellInner({
|
|
45
46
|
initialValue,
|
|
46
47
|
currentValue,
|
|
47
48
|
cellId,
|
|
48
49
|
dataType,
|
|
49
|
-
onCellEdit
|
|
50
|
+
onCellEdit,
|
|
51
|
+
originalRowData,
|
|
52
|
+
rowId,
|
|
53
|
+
columnId
|
|
50
54
|
}) {
|
|
51
55
|
const [inputValue, setInputValue] = useState(valueToString(currentValue));
|
|
52
56
|
const isCancelled = useRef(false);
|
|
@@ -60,11 +64,14 @@ export function EditableCell({
|
|
|
60
64
|
return;
|
|
61
65
|
}
|
|
62
66
|
const parsedValue = parseValueByType(inputValue, dataType);
|
|
63
|
-
onCellEdit
|
|
67
|
+
onCellEdit(cellId, {
|
|
68
|
+
rowId,
|
|
69
|
+
columnId,
|
|
64
70
|
newValue: parsedValue,
|
|
65
|
-
oldValue: initialValue
|
|
71
|
+
oldValue: initialValue,
|
|
72
|
+
originalRowData
|
|
66
73
|
});
|
|
67
|
-
}, [inputValue, initialValue, onCellEdit, cellId, dataType]);
|
|
74
|
+
}, [inputValue, initialValue, onCellEdit, cellId, dataType, rowId, columnId, originalRowData]);
|
|
68
75
|
const handleChange = useCallback(value => {
|
|
69
76
|
setInputValue(value);
|
|
70
77
|
}, []);
|
|
@@ -80,7 +87,9 @@ export function EditableCell({
|
|
|
80
87
|
}, [currentValue]);
|
|
81
88
|
const inputType = dataType && NUMBER_TYPES.includes(dataType) ? "number" : "text";
|
|
82
89
|
return /*#__PURE__*/React.createElement(Input, {
|
|
83
|
-
className: styles.osdkEditableInput,
|
|
90
|
+
className: classNames(styles.osdkEditableInput, {
|
|
91
|
+
[styles.osdkEditedInput]: currentValue !== initialValue
|
|
92
|
+
}),
|
|
84
93
|
type: inputType,
|
|
85
94
|
value: inputValue,
|
|
86
95
|
onValueChange: handleChange,
|
|
@@ -88,4 +97,5 @@ export function EditableCell({
|
|
|
88
97
|
onKeyDown: handleKeyDown
|
|
89
98
|
});
|
|
90
99
|
}
|
|
100
|
+
export const EditableCell = /*#__PURE__*/React.memo(EditableCellInner);
|
|
91
101
|
//# sourceMappingURL=EditableCell.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableCell.js","names":["Input","React","useCallback","useEffect","useRef","useState","styles","NUMBER_TYPES","valueToString","value","JSON","stringify","String","parseValueByType","dataType","includes","parsedNumber","Number","isNaN","
|
|
1
|
+
{"version":3,"file":"EditableCell.js","names":["Input","classNames","React","useCallback","useEffect","useRef","useState","styles","NUMBER_TYPES","valueToString","value","JSON","stringify","String","parseValueByType","dataType","includes","parsedNumber","Number","isNaN","EditableCellInner","initialValue","currentValue","cellId","onCellEdit","originalRowData","rowId","columnId","inputValue","setInputValue","isCancelled","handleBlur","current","parsedValue","newValue","oldValue","handleChange","handleKeyDown","e","key","currentTarget","blur","inputType","createElement","className","osdkEditableInput","osdkEditedInput","type","onValueChange","onBlur","onKeyDown","EditableCell","memo"],"sources":["EditableCell.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Input } from \"@base-ui/react/input\";\nimport type { RowData } from \"@tanstack/react-table\";\nimport classNames from \"classnames\";\nimport React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport styles from \"./EditableCell.module.css\";\nimport type { CellEditInfo } from \"./utils/types.js\";\n\nexport interface EditableCellProps<TData extends RowData, CellValue = unknown> {\n initialValue: CellValue;\n currentValue: CellValue;\n cellId: string;\n dataType?: string;\n onCellEdit: (cellId: string, info: CellEditInfo<TData, CellValue>) => void;\n originalRowData: TData;\n rowId: string;\n columnId: string;\n}\n\nconst NUMBER_TYPES: string[] = [\n \"double\",\n \"integer\",\n \"long\",\n \"float\",\n \"decimal\",\n \"byte\",\n \"short\",\n];\n\nfunction valueToString(value: unknown): string {\n if (value == null) {\n return \"\";\n }\n if (typeof value === \"object\") {\n return JSON.stringify(value);\n }\n // At this point, value is a primitive (string, number, boolean, symbol, bigint)\n return String(value as string | number | boolean | symbol | bigint);\n}\n\nfunction parseValueByType(\n value: string,\n dataType?: string,\n): unknown {\n if (!dataType || !NUMBER_TYPES.includes(dataType)) {\n return value;\n }\n\n if (value === \"\") {\n return null;\n }\n\n const parsedNumber = Number(value);\n\n if (isNaN(parsedNumber)) {\n return value;\n }\n\n return parsedNumber;\n}\n\nfunction EditableCellInner<TData extends RowData, CellValue = unknown>({\n initialValue,\n currentValue,\n cellId,\n dataType,\n onCellEdit,\n originalRowData,\n rowId,\n columnId,\n}: EditableCellProps<TData, CellValue>): React.ReactElement {\n const [inputValue, setInputValue] = useState<string>(\n valueToString(currentValue),\n );\n const isCancelled = useRef(false);\n\n useEffect(() => {\n setInputValue(valueToString(currentValue));\n }, [currentValue]);\n\n const handleBlur = useCallback(() => {\n // Do not commit the edit if it was cancelled with Escape key\n if (isCancelled.current) {\n isCancelled.current = false;\n return;\n }\n const parsedValue = parseValueByType(inputValue, dataType);\n onCellEdit(cellId, {\n rowId,\n columnId,\n newValue: parsedValue as CellValue,\n oldValue: initialValue,\n originalRowData,\n });\n }, [\n inputValue,\n initialValue,\n onCellEdit,\n cellId,\n dataType,\n rowId,\n columnId,\n originalRowData,\n ]);\n\n const handleChange = useCallback((value: string) => {\n setInputValue(value);\n }, []);\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.currentTarget.blur();\n }\n if (e.key === \"Escape\") {\n isCancelled.current = true;\n setInputValue(valueToString(currentValue));\n e.currentTarget.blur();\n }\n },\n [currentValue],\n );\n\n const inputType = dataType && NUMBER_TYPES.includes(dataType)\n ? \"number\"\n : \"text\";\n\n const isEdited = currentValue !== initialValue;\n\n return (\n <Input\n className={classNames(styles.osdkEditableInput, {\n [styles.osdkEditedInput]: isEdited,\n })}\n type={inputType}\n value={inputValue}\n onValueChange={handleChange}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n />\n );\n}\n\nexport const EditableCell = React.memo(\n EditableCellInner,\n) as typeof EditableCellInner;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,3 +1,31 @@
|
|
|
1
|
-
.osdkEditableInput
|
|
2
|
-
|
|
1
|
+
.osdkEditableInput {
|
|
2
|
+
overflow: hidden;
|
|
3
|
+
text-overflow: ellipsis;
|
|
4
|
+
white-space: nowrap;
|
|
5
|
+
text-align: left;
|
|
6
|
+
padding: var(--osdk-surface-spacing) calc(var(--osdk-surface-spacing) * 3);
|
|
7
|
+
width: 100%;
|
|
8
|
+
border-radius: var(--osdk-surface-border-radius);
|
|
9
|
+
border: var(--osdk-surface-border-width) solid transparent;
|
|
10
|
+
background: inherit;
|
|
11
|
+
|
|
12
|
+
tr[data-focused="true"] & {
|
|
13
|
+
border: var(--osdk-table-cell-editable-border);
|
|
14
|
+
background: var(--osdk-table-cell-editable-bg);
|
|
15
|
+
|
|
16
|
+
&.osdkEditedInput {
|
|
17
|
+
border: var(--osdk-table-cell-edited-border);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
&:focus,
|
|
21
|
+
&.osdkEditedInput:focus {
|
|
22
|
+
border: var(--osdk-emphasis-focus-width) solid
|
|
23
|
+
var(--osdk-emphasis-focus-color);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.osdkEditedInput {
|
|
29
|
+
border: var(--osdk-table-cell-edited-border);
|
|
30
|
+
background: var(--osdk-table-cell-editable-bg);
|
|
3
31
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// CSS Module proxy for EditableCell.module.css
|
|
2
2
|
const styles = {
|
|
3
|
-
"osdkEditableInput": "EditableCell-module__osdkEditableInput___2BjN5Q4P"
|
|
3
|
+
"osdkEditableInput": "EditableCell-module__osdkEditableInput___2BjN5Q4P",
|
|
4
|
+
"osdkEditedInput": "EditableCell-module__osdkEditedInput___HxzrAqJz"
|
|
4
5
|
};
|
|
5
6
|
|
|
6
7
|
export default styles;
|
|
@@ -27,7 +27,6 @@ import { useSelectionColumn } from "./hooks/useSelectionColumn.js";
|
|
|
27
27
|
import { useTableSorting } from "./hooks/useTableSorting.js";
|
|
28
28
|
import { BaseTable } from "./Table.js";
|
|
29
29
|
import { getRowId } from "./utils/getRowId.js";
|
|
30
|
-
|
|
31
30
|
/**
|
|
32
31
|
* ObjectTable - A headless table component for displaying OSDK object sets
|
|
33
32
|
*
|
|
@@ -59,6 +58,7 @@ export function ObjectTable({
|
|
|
59
58
|
enableColumnPinning = true,
|
|
60
59
|
enableColumnResizing = true,
|
|
61
60
|
enableColumnConfig = true,
|
|
61
|
+
editMode = "manual",
|
|
62
62
|
...props
|
|
63
63
|
}) {
|
|
64
64
|
const {
|
|
@@ -67,15 +67,6 @@ export function ObjectTable({
|
|
|
67
67
|
} = useColumnResize({
|
|
68
68
|
onColumnResize
|
|
69
69
|
});
|
|
70
|
-
const {
|
|
71
|
-
cellEdits,
|
|
72
|
-
clearEdits,
|
|
73
|
-
handleCellEdit,
|
|
74
|
-
handleSubmitEdits
|
|
75
|
-
} = useEditableTable({
|
|
76
|
-
onCellValueChanged,
|
|
77
|
-
onSubmitEdits
|
|
78
|
-
});
|
|
79
70
|
const {
|
|
80
71
|
sorting,
|
|
81
72
|
onSortingChange
|
|
@@ -134,6 +125,11 @@ export function ObjectTable({
|
|
|
134
125
|
const allColumns = useMemo(() => {
|
|
135
126
|
return selectionColumn ? [selectionColumn, ...columns] : columns;
|
|
136
127
|
}, [selectionColumn, columns]);
|
|
128
|
+
const editableConfig = useEditableTable({
|
|
129
|
+
editMode,
|
|
130
|
+
onCellValueChanged,
|
|
131
|
+
onSubmitEdits
|
|
132
|
+
});
|
|
137
133
|
const table = useReactTable({
|
|
138
134
|
data: data ?? [],
|
|
139
135
|
columns: allColumns,
|
|
@@ -162,8 +158,9 @@ export function ObjectTable({
|
|
|
162
158
|
},
|
|
163
159
|
getRowId,
|
|
164
160
|
meta: {
|
|
165
|
-
onCellEdit:
|
|
166
|
-
cellEdits
|
|
161
|
+
onCellEdit: editableConfig.onCellEdit,
|
|
162
|
+
cellEdits: editableConfig.cellEdits,
|
|
163
|
+
isInEditMode: editableConfig.editMode.isActive
|
|
167
164
|
}
|
|
168
165
|
});
|
|
169
166
|
const onRenderCellContextMenu = useCallback((row, cell) => {
|
|
@@ -175,16 +172,6 @@ export function ObjectTable({
|
|
|
175
172
|
showResizeItem: enableColumnResizing,
|
|
176
173
|
showConfigItem: enableColumnConfig
|
|
177
174
|
}), [enableOrdering, enableColumnPinning, enableColumnResizing, enableColumnConfig]);
|
|
178
|
-
const editableConfig = useMemo(() => {
|
|
179
|
-
if (!onSubmitEdits) {
|
|
180
|
-
return;
|
|
181
|
-
}
|
|
182
|
-
return {
|
|
183
|
-
onSubmitEdits: handleSubmitEdits,
|
|
184
|
-
clearEdits,
|
|
185
|
-
cellEdits
|
|
186
|
-
};
|
|
187
|
-
}, [onSubmitEdits, handleSubmitEdits, clearEdits, cellEdits]);
|
|
188
175
|
return /*#__PURE__*/React.createElement(BaseTable, {
|
|
189
176
|
table: table,
|
|
190
177
|
isLoading: isLoading || isColumnsLoading,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ObjectTable.js","names":["getCoreRowModel","useReactTable","React","useCallback","useMemo","useColumnDefs","useColumnPinning","useColumnResize","useColumnVisibility","useEditableTable","useObjectTableData","useRowSelection","useSelectionColumn","useTableSorting","BaseTable","getRowId","ObjectTable","objectType","objectSet","columnDefinitions","filter","objectSetOptions","orderBy","defaultOrderBy","onOrderByChanged","onColumnsPinnedChanged","onColumnResize","onRowSelection","renderCellContextMenu","selectionMode","selectedRows","onColumnVisibilityChanged","onCellValueChanged","onSubmitEdits","enableOrdering","enableColumnPinning","enableColumnResizing","enableColumnConfig","props","columnSizing","onColumnSizingChange","cellEdits","clearEdits","handleCellEdit","handleSubmitEdits","sorting","onSortingChange","data","fetchMore","isLoading","error","columns","loading","isColumnsLoading","rowSelection","isAllSelected","hasSelection","onToggleAll","onToggleRow","enableRowSelection","selectionColumn","columnVisibility","onColumnVisibilityChange","columnOrder","onColumnOrderChange","allColumns","columnPinning","onColumnPinningChange","hasSelectionColumn","table","state","enableSorting","columnResizeMode","columnResizeDirection","manualSorting","defaultColumn","minSize","meta","onCellEdit","onRenderCellContextMenu","row","cell","getValue","headerMenuFeatureFlags","showSortingItems","showPinningItems","showResizeItem","showConfigItem","editableConfig","createElement","fetchNextPage","onRowClick","rowHeight","className"],"sources":["ObjectTable.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type {\n ObjectOrInterfaceDefinition,\n Osdk,\n PropertyKeys,\n QueryDefinition,\n SimplePropertyDef,\n} from \"@osdk/api\";\nimport type { Cell } from \"@tanstack/react-table\";\nimport { getCoreRowModel, useReactTable } from \"@tanstack/react-table\";\nimport React, { useCallback, useMemo } from \"react\";\nimport { useColumnDefs } from \"./hooks/useColumnDefs.js\";\nimport { useColumnPinning } from \"./hooks/useColumnPinning.js\";\nimport { useColumnResize } from \"./hooks/useColumnResize.js\";\nimport { useColumnVisibility } from \"./hooks/useColumnVisibility.js\";\nimport { useEditableTable } from \"./hooks/useEditableTable.js\";\nimport { useObjectTableData } from \"./hooks/useObjectTableData.js\";\nimport { useRowSelection } from \"./hooks/useRowSelection.js\";\nimport { useSelectionColumn } from \"./hooks/useSelectionColumn.js\";\nimport { useTableSorting } from \"./hooks/useTableSorting.js\";\nimport type { ObjectTableProps } from \"./ObjectTableApi.js\";\nimport { BaseTable } from \"./Table.js\";\nimport type { HeaderMenuFeatureFlags } from \"./TableHeaderWithPopover.js\";\nimport { getRowId } from \"./utils/getRowId.js\";\n\n/**\n * ObjectTable - A headless table component for displaying OSDK object sets\n *\n * @example\n * ```tsx\n * <ObjectTable objectType={MyObjectType} />\n * ```\n */\n\nexport function ObjectTable<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<\n string,\n never\n >,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n>({\n objectType,\n objectSet,\n columnDefinitions,\n filter,\n objectSetOptions,\n orderBy,\n defaultOrderBy,\n onOrderByChanged,\n onColumnsPinnedChanged,\n onColumnResize,\n onRowSelection,\n renderCellContextMenu,\n selectionMode = \"none\",\n selectedRows,\n onColumnVisibilityChanged,\n onCellValueChanged,\n onSubmitEdits,\n enableOrdering = true,\n enableColumnPinning = true,\n enableColumnResizing = true,\n enableColumnConfig = true,\n ...props\n}: ObjectTableProps<Q, RDPs, FunctionColumns>): React.ReactElement {\n const { columnSizing, onColumnSizingChange } = useColumnResize({\n onColumnResize,\n });\n\n const {\n cellEdits,\n clearEdits,\n handleCellEdit,\n handleSubmitEdits,\n } = useEditableTable({\n onCellValueChanged,\n onSubmitEdits,\n });\n\n const { sorting, onSortingChange } = useTableSorting<\n Q,\n RDPs,\n FunctionColumns\n >(\n {\n orderBy,\n defaultOrderBy,\n onOrderByChanged,\n },\n );\n\n const { data, fetchMore, isLoading, error } = useObjectTableData<\n Q,\n RDPs,\n FunctionColumns\n >(\n objectType,\n columnDefinitions,\n filter,\n sorting,\n objectSet,\n objectSetOptions,\n );\n\n const { columns, loading: isColumnsLoading } = useColumnDefs<\n Q,\n RDPs,\n FunctionColumns\n >(\n objectType,\n columnDefinitions,\n );\n\n const {\n rowSelection,\n isAllSelected,\n hasSelection,\n onToggleAll,\n onToggleRow,\n enableRowSelection,\n } = useRowSelection<Q, RDPs>({\n selectionMode,\n selectedRows,\n onRowSelection,\n data,\n });\n\n const selectionColumn = useSelectionColumn<Q, RDPs>(\n { selectionMode, isAllSelected, hasSelection, onToggleAll, onToggleRow },\n );\n\n const {\n columnVisibility,\n onColumnVisibilityChange,\n columnOrder,\n onColumnOrderChange,\n } = useColumnVisibility({\n allColumns: columns,\n onColumnVisibilityChanged,\n });\n\n const { columnPinning, onColumnPinningChange } = useColumnPinning({\n columnDefinitions,\n hasSelectionColumn: enableRowSelection,\n onColumnsPinnedChanged,\n });\n\n const allColumns = useMemo(() => {\n return selectionColumn ? [selectionColumn, ...columns] : columns;\n }, [selectionColumn, columns]);\n\n const table = useReactTable<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>\n >({\n data: data ?? [],\n columns: allColumns,\n getCoreRowModel: getCoreRowModel(),\n state: {\n columnVisibility,\n columnOrder,\n rowSelection,\n sorting,\n columnSizing,\n columnPinning,\n },\n onSortingChange,\n onColumnSizingChange,\n onColumnPinningChange,\n onColumnVisibilityChange,\n onColumnOrderChange,\n enableRowSelection,\n enableSorting: enableOrdering,\n columnResizeMode: \"onChange\",\n columnResizeDirection: \"ltr\",\n manualSorting: true, // Enable manual sorting to indicate server-side sorting\n defaultColumn: {\n minSize: 80,\n },\n getRowId,\n meta: {\n onCellEdit: handleCellEdit,\n cellEdits,\n },\n });\n\n const onRenderCellContextMenu = useCallback(\n (\n row: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n cell: Cell<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n unknown\n >,\n ) => {\n return renderCellContextMenu?.(row, cell.getValue());\n },\n [renderCellContextMenu],\n );\n\n const isTableLoading = isLoading || isColumnsLoading;\n\n const headerMenuFeatureFlags: HeaderMenuFeatureFlags = useMemo(() => ({\n showSortingItems: enableOrdering,\n showPinningItems: enableColumnPinning,\n showResizeItem: enableColumnResizing,\n showConfigItem: enableColumnConfig,\n }), [\n enableOrdering,\n enableColumnPinning,\n enableColumnResizing,\n enableColumnConfig,\n ]);\n\n const editableConfig = useMemo(() => {\n if (!onSubmitEdits) {\n return;\n }\n\n return {\n onSubmitEdits: handleSubmitEdits,\n clearEdits,\n cellEdits,\n };\n }, [onSubmitEdits, handleSubmitEdits, clearEdits, cellEdits]);\n\n return (\n <BaseTable<Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>>\n table={table}\n isLoading={isTableLoading}\n fetchNextPage={fetchMore}\n onRowClick={props.onRowClick}\n rowHeight={props.rowHeight}\n renderCellContextMenu={onRenderCellContextMenu}\n className={props.className}\n error={error}\n headerMenuFeatureFlags={headerMenuFeatureFlags}\n editableConfig={editableConfig}\n />\n );\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ObjectTable.js","names":["getCoreRowModel","useReactTable","React","useCallback","useMemo","useColumnDefs","useColumnPinning","useColumnResize","useColumnVisibility","useEditableTable","useObjectTableData","useRowSelection","useSelectionColumn","useTableSorting","BaseTable","getRowId","ObjectTable","objectType","objectSet","columnDefinitions","filter","objectSetOptions","orderBy","defaultOrderBy","onOrderByChanged","onColumnsPinnedChanged","onColumnResize","onRowSelection","renderCellContextMenu","selectionMode","selectedRows","onColumnVisibilityChanged","onCellValueChanged","onSubmitEdits","enableOrdering","enableColumnPinning","enableColumnResizing","enableColumnConfig","editMode","props","columnSizing","onColumnSizingChange","sorting","onSortingChange","data","fetchMore","isLoading","error","columns","loading","isColumnsLoading","rowSelection","isAllSelected","hasSelection","onToggleAll","onToggleRow","enableRowSelection","selectionColumn","columnVisibility","onColumnVisibilityChange","columnOrder","onColumnOrderChange","allColumns","columnPinning","onColumnPinningChange","hasSelectionColumn","editableConfig","table","state","enableSorting","columnResizeMode","columnResizeDirection","manualSorting","defaultColumn","minSize","meta","onCellEdit","cellEdits","isInEditMode","isActive","onRenderCellContextMenu","row","cell","getValue","headerMenuFeatureFlags","showSortingItems","showPinningItems","showResizeItem","showConfigItem","createElement","fetchNextPage","onRowClick","rowHeight","className"],"sources":["ObjectTable.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type {\n ObjectOrInterfaceDefinition,\n Osdk,\n PropertyKeys,\n QueryDefinition,\n SimplePropertyDef,\n} from \"@osdk/api\";\nimport type { Cell } from \"@tanstack/react-table\";\nimport { getCoreRowModel, useReactTable } from \"@tanstack/react-table\";\nimport React, { useCallback, useMemo } from \"react\";\nimport { useColumnDefs } from \"./hooks/useColumnDefs.js\";\nimport { useColumnPinning } from \"./hooks/useColumnPinning.js\";\nimport { useColumnResize } from \"./hooks/useColumnResize.js\";\nimport { useColumnVisibility } from \"./hooks/useColumnVisibility.js\";\nimport { useEditableTable } from \"./hooks/useEditableTable.js\";\nimport { useObjectTableData } from \"./hooks/useObjectTableData.js\";\nimport { useRowSelection } from \"./hooks/useRowSelection.js\";\nimport { useSelectionColumn } from \"./hooks/useSelectionColumn.js\";\nimport { useTableSorting } from \"./hooks/useTableSorting.js\";\nimport type { ObjectTableProps } from \"./ObjectTableApi.js\";\nimport { BaseTable } from \"./Table.js\";\nimport type { HeaderMenuFeatureFlags } from \"./TableHeaderWithPopover.js\";\nimport { getRowId } from \"./utils/getRowId.js\";\nimport type { EditableConfig } from \"./utils/types.js\";\n\n/**\n * ObjectTable - A headless table component for displaying OSDK object sets\n *\n * @example\n * ```tsx\n * <ObjectTable objectType={MyObjectType} />\n * ```\n */\n\nexport function ObjectTable<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<\n string,\n never\n >,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n>({\n objectType,\n objectSet,\n columnDefinitions,\n filter,\n objectSetOptions,\n orderBy,\n defaultOrderBy,\n onOrderByChanged,\n onColumnsPinnedChanged,\n onColumnResize,\n onRowSelection,\n renderCellContextMenu,\n selectionMode = \"none\",\n selectedRows,\n onColumnVisibilityChanged,\n onCellValueChanged,\n onSubmitEdits,\n enableOrdering = true,\n enableColumnPinning = true,\n enableColumnResizing = true,\n enableColumnConfig = true,\n editMode = \"manual\",\n ...props\n}: ObjectTableProps<Q, RDPs, FunctionColumns>): React.ReactElement {\n const { columnSizing, onColumnSizingChange } = useColumnResize({\n onColumnResize,\n });\n\n const { sorting, onSortingChange } = useTableSorting<\n Q,\n RDPs,\n FunctionColumns\n >(\n {\n orderBy,\n defaultOrderBy,\n onOrderByChanged,\n },\n );\n\n const { data, fetchMore, isLoading, error } = useObjectTableData<\n Q,\n RDPs,\n FunctionColumns\n >(\n objectType,\n columnDefinitions,\n filter,\n sorting,\n objectSet,\n objectSetOptions,\n );\n\n const { columns, loading: isColumnsLoading } = useColumnDefs<\n Q,\n RDPs,\n FunctionColumns\n >(\n objectType,\n columnDefinitions,\n );\n\n const {\n rowSelection,\n isAllSelected,\n hasSelection,\n onToggleAll,\n onToggleRow,\n enableRowSelection,\n } = useRowSelection<Q, RDPs>({\n selectionMode,\n selectedRows,\n onRowSelection,\n data,\n });\n\n const selectionColumn = useSelectionColumn<Q, RDPs>(\n { selectionMode, isAllSelected, hasSelection, onToggleAll, onToggleRow },\n );\n\n const {\n columnVisibility,\n onColumnVisibilityChange,\n columnOrder,\n onColumnOrderChange,\n } = useColumnVisibility({\n allColumns: columns,\n onColumnVisibilityChanged,\n });\n\n const { columnPinning, onColumnPinningChange } = useColumnPinning({\n columnDefinitions,\n hasSelectionColumn: enableRowSelection,\n onColumnsPinnedChanged,\n });\n\n const allColumns = useMemo(() => {\n return selectionColumn ? [selectionColumn, ...columns] : columns;\n }, [selectionColumn, columns]);\n\n const editableConfig: EditableConfig<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n unknown\n > = useEditableTable({\n editMode,\n onCellValueChanged,\n onSubmitEdits,\n });\n\n const table = useReactTable<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>\n >({\n data: data ?? [],\n columns: allColumns,\n getCoreRowModel: getCoreRowModel(),\n state: {\n columnVisibility,\n columnOrder,\n rowSelection,\n sorting,\n columnSizing,\n columnPinning,\n },\n onSortingChange,\n onColumnSizingChange,\n onColumnPinningChange,\n onColumnVisibilityChange,\n onColumnOrderChange,\n enableRowSelection,\n enableSorting: enableOrdering,\n columnResizeMode: \"onChange\",\n columnResizeDirection: \"ltr\",\n manualSorting: true, // Enable manual sorting to indicate server-side sorting\n defaultColumn: {\n minSize: 80,\n },\n getRowId,\n meta: {\n onCellEdit: editableConfig.onCellEdit,\n cellEdits: editableConfig.cellEdits,\n isInEditMode: editableConfig.editMode.isActive,\n },\n });\n\n const onRenderCellContextMenu = useCallback(\n (\n row: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n cell: Cell<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n unknown\n >,\n ) => {\n return renderCellContextMenu?.(row, cell.getValue());\n },\n [renderCellContextMenu],\n );\n\n const isTableLoading = isLoading || isColumnsLoading;\n\n const headerMenuFeatureFlags: HeaderMenuFeatureFlags = useMemo(() => ({\n showSortingItems: enableOrdering,\n showPinningItems: enableColumnPinning,\n showResizeItem: enableColumnResizing,\n showConfigItem: enableColumnConfig,\n }), [\n enableOrdering,\n enableColumnPinning,\n enableColumnResizing,\n enableColumnConfig,\n ]);\n\n return (\n <BaseTable<Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>>\n table={table}\n isLoading={isTableLoading}\n fetchNextPage={fetchMore}\n onRowClick={props.onRowClick}\n rowHeight={props.rowHeight}\n renderCellContextMenu={onRenderCellContextMenu}\n className={props.className}\n error={error}\n headerMenuFeatureFlags={headerMenuFeatureFlags}\n editableConfig={editableConfig}\n />\n );\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ObjectTableApi.js","names":[],"sources":["ObjectTableApi.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type {\n DerivedProperty,\n ObjectOrInterfaceDefinition,\n ObjectSet,\n Osdk,\n PrimaryKeyType,\n PropertyKeys,\n QueryDefinition,\n SimplePropertyDef,\n WhereClause,\n} from \"@osdk/api\";\nimport type * as React from \"react\";\nimport type { CellIdentifier, CellValueState } from \"./utils/types.js\";\n\nexport type ColumnDefinition<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<string, never>,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n> = {\n locator: ColumnDefinitionLocator<Q, RDPs, FunctionColumns>;\n\n /**\n * @default true\n */\n isVisible?: boolean;\n\n /**\n * @default none\n */\n pinned?: \"left\" | \"right\" | \"none\";\n width?: number;\n minWidth?: number;\n maxWidth?: number;\n resizable?: boolean;\n orderable?: boolean;\n filterable?: boolean;\n editable?: boolean;\n\n renderCell?: (\n object: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n locator: ColumnDefinitionLocator<Q, RDPs, FunctionColumns>,\n ) => React.ReactNode;\n\n /**\n * If provided, this will be used in the column header.\n * If both columnName and renderHeader are provided, renderHeader will take precedence in the table header.\n * columnName will still be used in other parts where the column name is displayed.\n *\n * If not provided,\n * for a property column, the property displayName will be used\n * for other columns, the id will be used.\n */\n columnName?: string;\n\n /**\n * If provided, this will be used to render the header component.\n * When both columnName and renderHeader are provided, renderHeader will take precedence in the table header.\n */\n renderHeader?: () => React.ReactNode;\n};\n\nexport type ColumnDefinitionLocator<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<string, never>,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n> =\n | {\n type: \"property\";\n id: PropertyKeys<Q>;\n }\n | {\n type: \"function\";\n id: keyof FunctionColumns;\n }\n | {\n type: \"rdp\";\n id: keyof RDPs;\n creator: DerivedProperty.Creator<Q, RDPs[keyof RDPs]>;\n }\n | {\n type: \"custom\";\n id: string;\n };\n\nexport interface ObjectTableProps<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<string, never>,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n> {\n /**\n * The object or interface type of the object\n * If objectSet is not provided, objects will be fetched based on this type.\n */\n objectType: Q;\n\n /**\n * The set of objects to show in the table.\n * If provided and the objectType is not an interface, the table will use objectSet to fetch objects instead of fetching based on objectType.\n */\n objectSet?: ObjectSet<Q>;\n\n objectSetOptions?: ObjectSetOptions<Q>;\n\n /**\n * Ordered list of column definitions to show in the table\n *\n * If not provided, all of the properties of the object type will be shown in default order.\n */\n columnDefinitions?: Array<ColumnDefinition<Q, RDPs, FunctionColumns>>;\n\n /**\n * Whether the table is filterable by the user.\n *\n * @default true\n */\n enableFiltering?: boolean;\n\n /**\n * The current where clause to filter the objects in the table.\n * If provided, the filter is controlled.\n */\n filter?: WhereClause<Q, RDPs>;\n\n /**\n * Called when the where clause is changed.\n * Required when filter is controlled.\n *\n * @param newWhere The new where clause\n */\n onFilterChanged?: (newWhere: WhereClause<Q, RDPs>) => void;\n\n /**\n * Whether the table is sortable by the user.\n *\n * @default true\n */\n enableOrdering?: boolean;\n\n /**\n * Whether columns can be pinned by the user.\n *\n * @default true\n */\n enableColumnPinning?: boolean;\n\n /**\n * Whether columns can be resized by the user.\n *\n * @default true\n */\n enableColumnResizing?: boolean;\n\n /**\n * Whether the column configuration dialog for column visibility and ordering is available to the user.\n *\n * @default true\n */\n enableColumnConfig?: boolean;\n\n /**\n * The default order by clause to sort the objects in the table.\n * If provided without orderBy prop, the sorting is uncontrolled.\n * If both orderBy and defaultOrderBy are provided, orderBy takes precedence.\n */\n defaultOrderBy?: Array<{\n property: PropertyKeys<Q>;\n direction: \"asc\" | \"desc\";\n }>;\n\n /**\n * The current order by clause to sort the objects in the table.\n * If provided, the sorting is controlled.\n * If both orderBy and defaultOrderBy are provided, orderBy takes precedence.\n */\n orderBy?: Array<{\n property: PropertyKeys<Q>;\n direction: \"asc\" | \"desc\";\n }>;\n\n /**\n * Called when the order by clause is changed.\n * Required when sorting is controlled.\n *\n * @param newOrderBy The new order by clause\n */\n onOrderByChanged?: (\n newOrderBy: Array<{\n property: PropertyKeys<Q>;\n direction: \"asc\" | \"desc\";\n }>,\n ) => void;\n\n /**\n * Called after the value of a cell is edited and committed by the user.\n *\n * @param cell The cell that was edited, identified by its row and column IDs\n * @param state The new and old values of the cell\n */\n onCellValueChanged?: (\n cell: CellIdentifier,\n state: CellValueState,\n ) => void;\n\n /**\n * If provided, the button Submit Edits will be shown in the table\n *\n * @param edits a map of cellId (stringified CellIdentifier) to the new and old values of the cell\n */\n onSubmitEdits?: (edits: Record<string, CellValueState>) => Promise<void>;\n\n /**\n * Called when the column visibility or ordering changed.\n *\n * If provided, the table will allow the user to show/hide columns.\n *\n * @param newStates The columns sorted in their display order in the table and their visibility state.\n */\n onColumnVisibilityChanged?: (\n newStates: Array<{\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns;\n isVisible: boolean;\n }>,\n ) => void;\n\n /**\n * Called when the pinned columns change.\n *\n * If provided, the table will allow the user to pin/unpin columns.\n *\n * @param newStates The new list of column pin states\n */\n onColumnsPinnedChanged?: (\n newStates: Array<{\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns;\n pinned: \"left\" | \"right\" | \"none\";\n }>,\n ) => void;\n\n /**\n * Called when a column is resized.\n *\n * @param columnId The ID of the resized column\n * @param newWidth The new width of the column. When newWidth = null, the column size is reset.\n */\n onColumnResize?: (\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns,\n newWidth: number | null,\n ) => void;\n\n /**\n * Called when a row is clicked.\n *\n * @param object The object representing the clicked row\n */\n onRowClick?: (\n object: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n ) => void;\n\n /**\n * Selection mode for the table rows.\n *\n * If multiple, a checkbox will be shown for each row to allow selecting multiple rows\n * as well as a top-level checkbox in the header to select all rows.\n *\n * @default \"none\"\n */\n selectionMode?: \"single\" | \"multiple\" | \"none\";\n\n /**\n * The currently selected rows in the table.\n * If provided, the row selection is controlled.\n */\n selectedRows?: PrimaryKeyType<Q>[];\n\n /**\n * Called when the row selection changes.\n * Required when row selection is controlled.\n *\n * @param selectedRowIds The primary keys of currently selected rows\n */\n\n onRowSelection?: (selectedRowIds: PrimaryKeyType<Q>[]) => void;\n\n /**\n * If provided, will render this context menu when right clicking on a cell\n */\n renderCellContextMenu?: (\n row: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n cellValue: unknown,\n ) => React.ReactNode;\n\n /**\n * The height of each row in pixels.\n *\n * @default 40\n */\n rowHeight?: number;\n\n className?: string;\n}\n\nexport interface ObjectSetOptions<\n Q extends ObjectOrInterfaceDefinition,\n> {\n /**\n * Object sets to union with\n */\n union?: ObjectSet<Q>[];\n\n /**\n * Object sets to intersect with\n */\n intersect?: ObjectSet<Q>[];\n\n /**\n * Object sets to subtract from\n */\n subtract?: ObjectSet<Q>[];\n}\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ObjectTableApi.js","names":[],"sources":["ObjectTableApi.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type {\n DerivedProperty,\n ObjectOrInterfaceDefinition,\n ObjectSet,\n Osdk,\n PrimaryKeyType,\n PropertyKeys,\n QueryDefinition,\n SimplePropertyDef,\n WhereClause,\n} from \"@osdk/api\";\nimport type * as React from \"react\";\nimport type { CellEditInfo } from \"./utils/types.js\";\n\nexport type ColumnDefinition<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<string, never>,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n> = {\n locator: ColumnDefinitionLocator<Q, RDPs, FunctionColumns>;\n\n /**\n * @default true\n */\n isVisible?: boolean;\n\n /**\n * @default none\n */\n pinned?: \"left\" | \"right\" | \"none\";\n width?: number;\n minWidth?: number;\n maxWidth?: number;\n resizable?: boolean;\n orderable?: boolean;\n filterable?: boolean;\n editable?: boolean;\n\n renderCell?: (\n object: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n locator: ColumnDefinitionLocator<Q, RDPs, FunctionColumns>,\n ) => React.ReactNode;\n\n /**\n * If provided, this will be used in the column header.\n * If both columnName and renderHeader are provided, renderHeader will take precedence in the table header.\n * columnName will still be used in other parts where the column name is displayed.\n *\n * If not provided,\n * for a property column, the property displayName will be used\n * for other columns, the id will be used.\n */\n columnName?: string;\n\n /**\n * If provided, this will be used to render the header component.\n * When both columnName and renderHeader are provided, renderHeader will take precedence in the table header.\n */\n renderHeader?: () => React.ReactNode;\n};\n\nexport type ColumnDefinitionLocator<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<string, never>,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n> =\n | {\n type: \"property\";\n id: PropertyKeys<Q>;\n }\n | {\n type: \"function\";\n id: keyof FunctionColumns;\n }\n | {\n type: \"rdp\";\n id: keyof RDPs;\n creator: DerivedProperty.Creator<Q, RDPs[keyof RDPs]>;\n }\n | {\n type: \"custom\";\n id: string;\n };\n\nexport interface ObjectTableProps<\n Q extends ObjectOrInterfaceDefinition,\n RDPs extends Record<string, SimplePropertyDef> = Record<string, never>,\n FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<\n string,\n never\n >,\n> {\n /**\n * The object or interface type of the object\n * If objectSet is not provided, objects will be fetched based on this type.\n */\n objectType: Q;\n\n /**\n * The set of objects to show in the table.\n * If provided and the objectType is not an interface, the table will use objectSet to fetch objects instead of fetching based on objectType.\n */\n objectSet?: ObjectSet<Q>;\n\n objectSetOptions?: ObjectSetOptions<Q>;\n\n /**\n * Ordered list of column definitions to show in the table\n *\n * If not provided, all of the properties of the object type will be shown in default order.\n */\n columnDefinitions?: Array<ColumnDefinition<Q, RDPs, FunctionColumns>>;\n\n /**\n * Whether the table is filterable by the user.\n *\n * @default true\n */\n enableFiltering?: boolean;\n\n /**\n * The current where clause to filter the objects in the table.\n * If provided, the filter is controlled.\n */\n filter?: WhereClause<Q, RDPs>;\n\n /**\n * Called when the where clause is changed.\n * Required when filter is controlled.\n *\n * @param newWhere The new where clause\n */\n onFilterChanged?: (newWhere: WhereClause<Q, RDPs>) => void;\n\n /**\n * Whether the table is sortable by the user.\n *\n * @default true\n */\n enableOrdering?: boolean;\n\n /**\n * Whether columns can be pinned by the user.\n *\n * @default true\n */\n enableColumnPinning?: boolean;\n\n /**\n * Whether columns can be resized by the user.\n *\n * @default true\n */\n enableColumnResizing?: boolean;\n\n /**\n * Whether the column configuration dialog for column visibility and ordering is available to the user.\n *\n * @default true\n */\n enableColumnConfig?: boolean;\n\n /**\n * Controls the edit mode behavior of the table.\n * - \"always\": Editable cells are immediately in edit mode on row clicked.\n * - \"manual\": User can toggle edit mode on/off via the Edit Table button.\n *\n * @default \"manual\"\n */\n editMode?: \"always\" | \"manual\";\n\n /**\n * The default order by clause to sort the objects in the table.\n * If provided without orderBy prop, the sorting is uncontrolled.\n * If both orderBy and defaultOrderBy are provided, orderBy takes precedence.\n */\n defaultOrderBy?: Array<{\n property: PropertyKeys<Q>;\n direction: \"asc\" | \"desc\";\n }>;\n\n /**\n * The current order by clause to sort the objects in the table.\n * If provided, the sorting is controlled.\n * If both orderBy and defaultOrderBy are provided, orderBy takes precedence.\n */\n orderBy?: Array<{\n property: PropertyKeys<Q>;\n direction: \"asc\" | \"desc\";\n }>;\n\n /**\n * Called when the order by clause is changed.\n * Required when sorting is controlled.\n *\n * @param newOrderBy The new order by clause\n */\n onOrderByChanged?: (\n newOrderBy: Array<{\n property: PropertyKeys<Q>;\n direction: \"asc\" | \"desc\";\n }>,\n ) => void;\n\n /**\n * Called after the value of a cell is edited and committed by the user.\n *\n * @param info An object containing details about the cell that was edited,\n * including the rowId, columnId, new and old values, and the row data before the edit\n */\n onCellValueChanged?: (\n info: CellEditInfo<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n unknown\n >,\n ) => void;\n\n /**\n * If provided, the button Submit Edits will be shown in the table\n *\n * @param edits an array of edit info containing details about the edited cells\n * including the rowId, columnId, new and old values, and the row data before the edit\n * @return a promise that resolves to true if the edits were successfully submitted\n */\n onSubmitEdits?: (edits: CellEditInfo<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n unknown\n >[]) => Promise<boolean>;\n\n /**\n * Called when the column visibility or ordering changed.\n *\n * If provided, the table will allow the user to show/hide columns.\n *\n * @param newStates The columns sorted in their display order in the table and their visibility state.\n */\n onColumnVisibilityChanged?: (\n newStates: Array<{\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns;\n isVisible: boolean;\n }>,\n ) => void;\n\n /**\n * Called when the pinned columns change.\n *\n * If provided, the table will allow the user to pin/unpin columns.\n *\n * @param newStates The new list of column pin states\n */\n onColumnsPinnedChanged?: (\n newStates: Array<{\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns;\n pinned: \"left\" | \"right\" | \"none\";\n }>,\n ) => void;\n\n /**\n * Called when a column is resized.\n *\n * @param columnId The ID of the resized column\n * @param newWidth The new width of the column. When newWidth = null, the column size is reset.\n */\n onColumnResize?: (\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns,\n newWidth: number | null,\n ) => void;\n\n /**\n * Called when a row is clicked.\n *\n * @param object The object representing the clicked row\n */\n onRowClick?: (\n object: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n ) => void;\n\n /**\n * Selection mode for the table rows.\n *\n * If multiple, a checkbox will be shown for each row to allow selecting multiple rows\n * as well as a top-level checkbox in the header to select all rows.\n *\n * @default \"none\"\n */\n selectionMode?: \"single\" | \"multiple\" | \"none\";\n\n /**\n * The currently selected rows in the table.\n * If provided, the row selection is controlled.\n */\n selectedRows?: PrimaryKeyType<Q>[];\n\n /**\n * Called when the row selection changes.\n * Required when row selection is controlled.\n *\n * @param selectedRowIds The primary keys of currently selected rows\n */\n\n onRowSelection?: (selectedRowIds: PrimaryKeyType<Q>[]) => void;\n\n /**\n * If provided, will render this context menu when right clicking on a cell\n */\n renderCellContextMenu?: (\n row: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n cellValue: unknown,\n ) => React.ReactNode;\n\n /**\n * The height of each row in pixels.\n *\n * @default 40\n */\n rowHeight?: number;\n\n className?: string;\n}\n\nexport interface ObjectSetOptions<\n Q extends ObjectOrInterfaceDefinition,\n> {\n /**\n * Object sets to union with\n */\n union?: ObjectSet<Q>[];\n\n /**\n * Object sets to intersect with\n */\n intersect?: ObjectSet<Q>[];\n\n /**\n * Object sets to subtract from\n */\n subtract?: ObjectSet<Q>[];\n}\n"],"mappings":"","ignoreList":[]}
|
|
@@ -16,11 +16,11 @@
|
|
|
16
16
|
|
|
17
17
|
import classNames from "classnames";
|
|
18
18
|
import React, { useCallback, useEffect, useRef, useState } from "react";
|
|
19
|
-
import { ActionButton } from "../base-components/action-button/ActionButton.js";
|
|
20
19
|
import { LoadingStateTable } from "./LoadingStateTable.js";
|
|
21
20
|
import { NonIdealState } from "./NonIdealState.js";
|
|
22
21
|
import styles from "./Table.module.css.js";
|
|
23
22
|
import { TableBody } from "./TableBody.js";
|
|
23
|
+
import { TableEditContainer } from "./TableEditContainer.js";
|
|
24
24
|
import { TableHeader } from "./TableHeader.js";
|
|
25
25
|
export function BaseTable({
|
|
26
26
|
table,
|
|
@@ -36,6 +36,7 @@ export function BaseTable({
|
|
|
36
36
|
}) {
|
|
37
37
|
const tableContainerRef = useRef(null);
|
|
38
38
|
const [isLoadingMore, setIsLoadingMore] = useState(false);
|
|
39
|
+
const [focusedRowId, setFocusedRowId] = useState(null);
|
|
39
40
|
|
|
40
41
|
// Using a ref to prevent duplicate fetches from rapid scroll events while a fetch is in-flight
|
|
41
42
|
const fetchingRef = useRef(false);
|
|
@@ -68,16 +69,23 @@ export function BaseTable({
|
|
|
68
69
|
const rows = table.getRowModel().rows;
|
|
69
70
|
const headerGroups = table.getHeaderGroups();
|
|
70
71
|
const hasData = rows.length > 0;
|
|
71
|
-
const
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
72
|
+
const hasEditableColumns = table.getAllColumns().some(column => column.columnDef.meta?.editable === true);
|
|
73
|
+
useEffect(() => {
|
|
74
|
+
const handleClickOutside = event => {
|
|
75
|
+
if (tableContainerRef.current && !tableContainerRef.current.contains(event.target)) {
|
|
76
|
+
setFocusedRowId(null);
|
|
77
|
+
}
|
|
78
|
+
};
|
|
79
|
+
document.addEventListener("click", handleClickOutside);
|
|
80
|
+
return () => {
|
|
81
|
+
document.removeEventListener("click", handleClickOutside);
|
|
82
|
+
};
|
|
83
|
+
}, []);
|
|
76
84
|
return /*#__PURE__*/React.createElement("div", {
|
|
77
85
|
className: classNames(styles.osdkTableWrapper, className)
|
|
78
86
|
}, /*#__PURE__*/React.createElement("div", {
|
|
79
87
|
ref: tableContainerRef,
|
|
80
|
-
className:
|
|
88
|
+
className: styles.osdkTableContainer,
|
|
81
89
|
onScroll: handleScroll
|
|
82
90
|
}, /*#__PURE__*/React.createElement("table", null, isLoading && !hasData ? /*#__PURE__*/React.createElement(LoadingStateTable, {
|
|
83
91
|
table: table,
|
|
@@ -94,17 +102,17 @@ export function BaseTable({
|
|
|
94
102
|
rowHeight: rowHeight,
|
|
95
103
|
renderCellContextMenu: renderCellContextMenu,
|
|
96
104
|
isLoadingMore: isLoadingMore,
|
|
97
|
-
headerGroups: headerGroups
|
|
105
|
+
headerGroups: headerGroups,
|
|
106
|
+
focusedRowId: focusedRowId,
|
|
107
|
+
setFocusedRowId: setFocusedRowId,
|
|
108
|
+
isInEditMode: editableConfig?.editMode.isActive
|
|
98
109
|
}))), !hasData && error == null && /*#__PURE__*/React.createElement(NonIdealState, {
|
|
99
110
|
message: "No Data"
|
|
100
111
|
}), error != null && /*#__PURE__*/React.createElement(NonIdealState, {
|
|
101
112
|
message: `Error Loading Data: ${error.message}`
|
|
102
|
-
})),
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
onClick: handleSubmitEdits,
|
|
107
|
-
disabled: !hasEdits
|
|
108
|
-
}, "Submit Edits")));
|
|
113
|
+
})), hasEditableColumns && /*#__PURE__*/React.createElement(TableEditContainer, {
|
|
114
|
+
editableConfig: editableConfig,
|
|
115
|
+
focusedRowId: focusedRowId
|
|
116
|
+
}));
|
|
109
117
|
}
|
|
110
118
|
//# sourceMappingURL=Table.js.map
|