@osdk/react-components 0.43.0 → 0.43.1-main-eab07502700f00fae33f4d3d60a4e457d68f5e69
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/CHANGELOG.md +9 -0
- package/build/browser/object-table/ObjectTableApi.js.map +1 -1
- package/build/browser/util/UserAgent.js +1 -1
- package/build/browser/util/UserAgent.js.map +1 -1
- package/build/cjs/{chunk-KZINCUSO.cjs → chunk-4RHYSLOF.cjs} +4 -4
- package/build/cjs/{chunk-KZINCUSO.cjs.map → chunk-4RHYSLOF.cjs.map} +1 -1
- package/build/cjs/{chunk-QBNUA5WG.cjs → chunk-5VZLGEZC.cjs} +4 -4
- package/build/cjs/{chunk-QBNUA5WG.cjs.map → chunk-5VZLGEZC.cjs.map} +1 -1
- package/build/cjs/{chunk-IGTCAXIJ.cjs → chunk-6FC3IRD6.cjs} +4 -4
- package/build/cjs/{chunk-IGTCAXIJ.cjs.map → chunk-6FC3IRD6.cjs.map} +1 -1
- package/build/cjs/{chunk-S3ITMFF3.cjs → chunk-76KDF3JW.cjs} +3 -3
- package/build/cjs/chunk-76KDF3JW.cjs.map +1 -0
- package/build/cjs/chunk-M35GTTYY.cjs +11 -0
- package/build/cjs/{chunk-XXYKJGWB.cjs.map → chunk-M35GTTYY.cjs.map} +1 -1
- package/build/cjs/chunk-MMXFXPW7.cjs +11 -0
- package/build/cjs/{chunk-KTPZ5SKZ.cjs.map → chunk-MMXFXPW7.cjs.map} +1 -1
- package/build/cjs/{chunk-FDRBFQS4.cjs → chunk-NJX2FUOF.cjs} +4 -4
- package/build/cjs/{chunk-FDRBFQS4.cjs.map → chunk-NJX2FUOF.cjs.map} +1 -1
- package/build/cjs/chunk-QGK4II3K.cjs +11 -0
- package/build/cjs/{chunk-DVC36NGS.cjs.map → chunk-QGK4II3K.cjs.map} +1 -1
- package/build/cjs/{chunk-T2MN4MGM.cjs → chunk-RNADPIG7.cjs} +4 -4
- package/build/cjs/{chunk-T2MN4MGM.cjs.map → chunk-RNADPIG7.cjs.map} +1 -1
- package/build/cjs/{chunk-P2YIHI5H.cjs → chunk-RZJEJUTM.cjs} +4 -4
- package/build/cjs/{chunk-P2YIHI5H.cjs.map → chunk-RZJEJUTM.cjs.map} +1 -1
- package/build/cjs/chunk-UHPUV7GG.cjs +11 -0
- package/build/cjs/{chunk-3OPZKCH7.cjs.map → chunk-UHPUV7GG.cjs.map} +1 -1
- package/build/cjs/{chunk-JCUVNLFE.cjs → chunk-X52ISTY4.cjs} +4 -4
- package/build/cjs/{chunk-JCUVNLFE.cjs.map → chunk-X52ISTY4.cjs.map} +1 -1
- package/build/cjs/{chunk-D63UEIY6.cjs → chunk-XMJMURMR.cjs} +4 -4
- package/build/cjs/{chunk-D63UEIY6.cjs.map → chunk-XMJMURMR.cjs.map} +1 -1
- package/build/cjs/chunk-Z5QMB2F7.cjs +11 -0
- package/build/cjs/{chunk-JWRNK62V.cjs.map → chunk-Z5QMB2F7.cjs.map} +1 -1
- package/build/cjs/public/experimental/action-form.cjs +4 -4
- package/build/cjs/public/experimental/cbac-picker.cjs +11 -11
- package/build/cjs/public/experimental/document-viewer.cjs +4 -4
- package/build/cjs/public/experimental/email-viewer.cjs +3 -3
- package/build/cjs/public/experimental/excel-viewer.cjs +3 -3
- package/build/cjs/public/experimental/filter-list.cjs +15 -15
- package/build/cjs/public/experimental/image-viewer.cjs +3 -3
- package/build/cjs/public/experimental/markdown-renderer.cjs +3 -3
- package/build/cjs/public/experimental/object-table.cjs +21 -21
- package/build/cjs/public/experimental/object-table.d.cts +91 -91
- package/build/cjs/public/experimental/pdf-viewer.cjs +7 -7
- package/build/cjs/public/experimental/tiff-renderer.cjs +3 -3
- package/build/cjs/public/experimental/video-viewer.cjs +3 -3
- package/build/cjs/public/experimental/xml-viewer.cjs +3 -3
- package/build/cjs/public/experimental.cjs +71 -71
- package/build/esm/object-table/ObjectTableApi.js.map +1 -1
- package/build/esm/util/UserAgent.js +1 -1
- package/build/esm/util/UserAgent.js.map +1 -1
- package/build/types/object-table/ObjectTableApi.d.ts +91 -91
- package/build/types/object-table/ObjectTableApi.d.ts.map +1 -1
- package/docs/ObjectTable.md +14 -14
- package/docs/ObjectTableOverview.md +131 -0
- package/package.json +7 -7
- package/build/cjs/chunk-3OPZKCH7.cjs +0 -11
- package/build/cjs/chunk-DVC36NGS.cjs +0 -11
- package/build/cjs/chunk-JWRNK62V.cjs +0 -11
- package/build/cjs/chunk-KTPZ5SKZ.cjs +0 -11
- package/build/cjs/chunk-S3ITMFF3.cjs.map +0 -1
- package/build/cjs/chunk-XXYKJGWB.cjs +0 -11
|
@@ -207,6 +207,12 @@ export interface ObjectTableProps<
|
|
|
207
207
|
* Use objectType-based fetching if you need those.
|
|
208
208
|
*/
|
|
209
209
|
objectSet?: ObjectSet<Q>;
|
|
210
|
+
/**
|
|
211
|
+
* Ordered list of column definitions to show in the table
|
|
212
|
+
*
|
|
213
|
+
* If not provided, all of the properties of the object type will be shown in default order.
|
|
214
|
+
*/
|
|
215
|
+
columnDefinitions?: Array<ColumnDefinition<Q, RDPs, FunctionColumns>>;
|
|
210
216
|
objectSetOptions?: ObjectSetOptions<Q>;
|
|
211
217
|
/**
|
|
212
218
|
* Minimum time between fetch requests in milliseconds.
|
|
@@ -236,22 +242,16 @@ export interface ObjectTableProps<
|
|
|
236
242
|
*/
|
|
237
243
|
pageSize?: number;
|
|
238
244
|
/**
|
|
239
|
-
* Ordered list of column definitions to show in the table
|
|
240
|
-
*
|
|
241
|
-
* If not provided, all of the properties of the object type will be shown in default order.
|
|
242
|
-
*/
|
|
243
|
-
columnDefinitions?: Array<ColumnDefinition<Q, RDPs, FunctionColumns>>;
|
|
244
|
-
/**
|
|
245
245
|
* The current where clause to filter the objects in the table.
|
|
246
246
|
* If provided, the filter is controlled.
|
|
247
247
|
*/
|
|
248
248
|
filter?: WhereClause<Q, RDPs>;
|
|
249
249
|
/**
|
|
250
|
-
* Whether the
|
|
250
|
+
* Whether the column configuration dialog for column visibility and ordering is available to the user.
|
|
251
251
|
*
|
|
252
252
|
* @default true
|
|
253
253
|
*/
|
|
254
|
-
|
|
254
|
+
enableColumnConfig?: boolean;
|
|
255
255
|
/**
|
|
256
256
|
* Whether columns can be pinned by the user.
|
|
257
257
|
*
|
|
@@ -265,29 +265,50 @@ export interface ObjectTableProps<
|
|
|
265
265
|
*/
|
|
266
266
|
enableColumnResizing?: boolean;
|
|
267
267
|
/**
|
|
268
|
-
*
|
|
268
|
+
* Called when the column visibility or ordering changed.
|
|
269
269
|
*
|
|
270
|
-
*
|
|
270
|
+
* If provided, the table will allow the user to show/hide columns.
|
|
271
|
+
*
|
|
272
|
+
* @param newStates The columns sorted in their display order in the table and their visibility state.
|
|
271
273
|
*/
|
|
272
|
-
|
|
274
|
+
onColumnVisibilityChanged?: (newStates: Array<{
|
|
275
|
+
columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns
|
|
276
|
+
isVisible: boolean
|
|
277
|
+
}>) => void;
|
|
273
278
|
/**
|
|
274
|
-
*
|
|
275
|
-
* - "always": Editable cells are immediately in edit mode on row clicked.
|
|
276
|
-
* - "manual": User can toggle edit mode on/off via the Edit Table button.
|
|
279
|
+
* Called when the pinned columns change.
|
|
277
280
|
*
|
|
278
|
-
*
|
|
281
|
+
* If provided, the table will allow the user to pin/unpin columns.
|
|
282
|
+
*
|
|
283
|
+
* @param newStates The new list of column pin states
|
|
279
284
|
*/
|
|
280
|
-
|
|
285
|
+
onColumnsPinnedChanged?: (newStates: Array<{
|
|
286
|
+
columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns
|
|
287
|
+
pinned: "left" | "right" | "none"
|
|
288
|
+
}>) => void;
|
|
281
289
|
/**
|
|
282
|
-
*
|
|
283
|
-
* "Edit Table" / "Cancel" / "Submit Edits" buttons and the edit-state
|
|
284
|
-
* indicators (modification count, validation errors).
|
|
290
|
+
* Called when a column is resized.
|
|
285
291
|
*
|
|
286
|
-
* @
|
|
287
|
-
*
|
|
288
|
-
* When `false`, the "Edit Table" and "Submit Edits" buttons will not be shown.
|
|
292
|
+
* @param columnId The ID of the resized column
|
|
293
|
+
* @param newWidth The new width of the column. When newWidth = null, the column size is reset.
|
|
289
294
|
*/
|
|
290
|
-
|
|
295
|
+
onColumnResize?: (columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns, newWidth: number | null) => void;
|
|
296
|
+
/**
|
|
297
|
+
* Called when a column header is clicked.
|
|
298
|
+
*
|
|
299
|
+
* The columnId matches the `locator.id` configured on the column definition.
|
|
300
|
+
* The dropdown menu trigger is excluded — clicking the chevron opens the
|
|
301
|
+
* header menu instead of firing this callback.
|
|
302
|
+
*
|
|
303
|
+
* @param columnId The id of the clicked column
|
|
304
|
+
*/
|
|
305
|
+
onColumnHeaderClick?: (columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns) => void;
|
|
306
|
+
/**
|
|
307
|
+
* Whether the table is sortable by the user.
|
|
308
|
+
*
|
|
309
|
+
* @default true
|
|
310
|
+
*/
|
|
311
|
+
enableOrdering?: boolean;
|
|
291
312
|
/**
|
|
292
313
|
* The default order by clause to sort the objects in the table.
|
|
293
314
|
* If provided without orderBy prop, the sorting is uncontrolled.
|
|
@@ -317,55 +338,31 @@ export interface ObjectTableProps<
|
|
|
317
338
|
direction: "asc" | "desc"
|
|
318
339
|
}>) => void;
|
|
319
340
|
/**
|
|
320
|
-
*
|
|
321
|
-
*
|
|
322
|
-
* @param info An object containing details about the cell that was edited,
|
|
323
|
-
* including the rowId, columnId, new and old values, and the row data before the edit
|
|
324
|
-
*/
|
|
325
|
-
onCellValueChanged?: (info: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>) => void;
|
|
326
|
-
/**
|
|
327
|
-
* If provided, the "Submit Edits" button will be shown in the edit footer.
|
|
328
|
-
*
|
|
329
|
-
* @param edits an array of edit info containing details about the edited cells
|
|
330
|
-
* including the rowId, columnId, new and old values, and the row data before the edit
|
|
331
|
-
* @return a promise that resolves to true if the edits were successfully submitted
|
|
332
|
-
*/
|
|
333
|
-
onSubmitEdits?: (edits: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>[]) => Promise<boolean>;
|
|
334
|
-
/**
|
|
335
|
-
* Called when the column visibility or ordering changed.
|
|
341
|
+
* Selection mode for the table rows.
|
|
336
342
|
*
|
|
337
|
-
* If
|
|
343
|
+
* If multiple, a checkbox will be shown for each row to allow selecting multiple rows
|
|
344
|
+
* as well as a top-level checkbox in the header to select all rows.
|
|
338
345
|
*
|
|
339
|
-
* @
|
|
346
|
+
* @default "none"
|
|
340
347
|
*/
|
|
341
|
-
|
|
342
|
-
columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns
|
|
343
|
-
isVisible: boolean
|
|
344
|
-
}>) => void;
|
|
348
|
+
selectionMode?: "single" | "multiple" | "none";
|
|
345
349
|
/**
|
|
346
|
-
*
|
|
347
|
-
*
|
|
348
|
-
* If provided, the table will allow the user to pin/unpin columns.
|
|
349
|
-
*
|
|
350
|
-
* @param newStates The new list of column pin states
|
|
350
|
+
* The currently selected rows in the table.
|
|
351
|
+
* If provided, the row selection is controlled.
|
|
351
352
|
*/
|
|
352
|
-
|
|
353
|
-
columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns
|
|
354
|
-
pinned: "left" | "right" | "none"
|
|
355
|
-
}>) => void;
|
|
353
|
+
selectedRows?: PrimaryKeyType<Q>[];
|
|
356
354
|
/**
|
|
357
|
-
*
|
|
358
|
-
*
|
|
359
|
-
* @param columnId The ID of the resized column
|
|
360
|
-
* @param newWidth The new width of the column. When newWidth = null, the column size is reset.
|
|
355
|
+
* Indicates whether all rows are selected in controlled mode.
|
|
356
|
+
* When true, the table will show all rows as selected regardless of the selectedRows array.
|
|
361
357
|
*/
|
|
362
|
-
|
|
358
|
+
isAllSelected?: boolean;
|
|
363
359
|
/**
|
|
364
|
-
* Called when
|
|
360
|
+
* Called when the row selection changes, with a {@link RowSelectionChange}
|
|
361
|
+
* payload describing the new state.
|
|
365
362
|
*
|
|
366
|
-
* @param
|
|
363
|
+
* @param change The new selection state. See {@link RowSelectionChange}.
|
|
367
364
|
*/
|
|
368
|
-
|
|
365
|
+
onRowSelectionChanged?: (change: RowSelectionChange<Q, RDPs>) => void;
|
|
369
366
|
/**
|
|
370
367
|
* The primary key of the row to render as visually focused (the
|
|
371
368
|
* "last interacted" row). When provided, focus state is controlled by
|
|
@@ -387,58 +384,61 @@ export interface ObjectTableProps<
|
|
|
387
384
|
*/
|
|
388
385
|
onFocusedRowChanged?: (row: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs> | null) => void;
|
|
389
386
|
/**
|
|
390
|
-
*
|
|
391
|
-
*
|
|
392
|
-
*
|
|
393
|
-
* The dropdown menu trigger is excluded — clicking the chevron opens the
|
|
394
|
-
* header menu instead of firing this callback.
|
|
387
|
+
* Controls the edit mode behavior of the table.
|
|
388
|
+
* - "always": Editable cells are immediately in edit mode on row clicked.
|
|
389
|
+
* - "manual": User can toggle edit mode on/off via the Edit Table button.
|
|
395
390
|
*
|
|
396
|
-
* @
|
|
391
|
+
* @default "manual"
|
|
397
392
|
*/
|
|
398
|
-
|
|
393
|
+
editMode?: "always" | "manual";
|
|
399
394
|
/**
|
|
400
|
-
*
|
|
401
|
-
*
|
|
402
|
-
*
|
|
403
|
-
* as well as a top-level checkbox in the header to select all rows.
|
|
395
|
+
* Whether to render the bottom edit footer that hosts the
|
|
396
|
+
* "Edit Table" / "Cancel" / "Submit Edits" buttons and the edit-state
|
|
397
|
+
* indicators (modification count, validation errors).
|
|
404
398
|
*
|
|
405
|
-
* @default
|
|
399
|
+
* @default true whenever the table has at least one column declared
|
|
400
|
+
* editable (i.e. any column with `editable: true` or `editable: (object) => boolean`).
|
|
401
|
+
* When `false`, the "Edit Table" and "Submit Edits" buttons will not be shown.
|
|
406
402
|
*/
|
|
407
|
-
|
|
403
|
+
showEditFooter?: boolean;
|
|
408
404
|
/**
|
|
409
|
-
*
|
|
410
|
-
*
|
|
405
|
+
* Called after the value of a cell is edited and committed by the user.
|
|
406
|
+
*
|
|
407
|
+
* @param info An object containing details about the cell that was edited,
|
|
408
|
+
* including the rowId, columnId, new and old values, and the row data before the edit
|
|
411
409
|
*/
|
|
412
|
-
|
|
410
|
+
onCellValueChanged?: (info: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>) => void;
|
|
413
411
|
/**
|
|
414
|
-
*
|
|
415
|
-
*
|
|
412
|
+
* If provided, the "Submit Edits" button will be shown in the edit footer.
|
|
413
|
+
*
|
|
414
|
+
* @param edits an array of edit info containing details about the edited cells
|
|
415
|
+
* including the rowId, columnId, new and old values, and the row data before the edit
|
|
416
|
+
* @return a promise that resolves to true if the edits were successfully submitted
|
|
416
417
|
*/
|
|
417
|
-
|
|
418
|
+
onSubmitEdits?: (edits: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>[]) => Promise<boolean>;
|
|
418
419
|
/**
|
|
419
|
-
* Called when
|
|
420
|
-
* payload describing the new state.
|
|
420
|
+
* Called when a row is clicked.
|
|
421
421
|
*
|
|
422
|
-
* @param
|
|
422
|
+
* @param object The object representing the clicked row
|
|
423
423
|
*/
|
|
424
|
-
|
|
424
|
+
onRowClick?: (object: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>) => void;
|
|
425
425
|
/**
|
|
426
426
|
* If provided, will render this context menu when right clicking on a cell
|
|
427
427
|
*/
|
|
428
428
|
renderCellContextMenu?: (row: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, cellValue: unknown) => React.ReactNode;
|
|
429
429
|
/**
|
|
430
|
-
* Render override for the empty state. Called when the table has no
|
|
431
|
-
* rows and no error. When omitted, a default "No Data" indicator is
|
|
432
|
-
* rendered.
|
|
433
|
-
*/
|
|
434
|
-
renderEmptyState?: () => React.ReactNode;
|
|
435
|
-
/**
|
|
436
430
|
* The height of each row in pixels.
|
|
437
431
|
*
|
|
438
432
|
* @default 40
|
|
439
433
|
*/
|
|
440
434
|
rowHeight?: number;
|
|
441
435
|
/**
|
|
436
|
+
* Render override for the empty state. Called when the table has no
|
|
437
|
+
* rows and no error. When omitted, a default "No Data" indicator is
|
|
438
|
+
* rendered.
|
|
439
|
+
*/
|
|
440
|
+
renderEmptyState?: () => React.ReactNode;
|
|
441
|
+
/**
|
|
442
442
|
* Returns extra HTML attributes (typically `data-*`) to apply to each
|
|
443
443
|
* row element. Use this to drive conditional row styling
|
|
444
444
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AAgBA,cACE,qBACA,iBACA,6BACA,WACA,MACA,gBACA,cACA,iBACA,mBACA,mBACK,WAAY;AACnB,cAAc,0BAA0B,yBAA0B;AAClE,iBAAiB,WAAW,OAAQ;AAEpC,cAAc,yBAAyB,wBAAyB;AAChE,cAAc,cAAc,uBAAuB,kBAAmB;AAEtE,cAAc,uBAAuB;AAErC,YAAY;CACV,UAAU;CACV,aAAa,eAAe,qBAAqB;CACjD,wBAAwB,eAAe,gBAAgB,CAAE,MAAK;IAK5D,yBAAyB,GAAG,MAAM,mBAClC,yBAAyB,GAAG,MAAM;UAE5B;CACR,UAAU;CACV,aAAa,eAAe,qBAAqB;CACjD,wBAAwB,eAAe,gBAAgB,CAAE,MAAK;EAI9D;;;;;;CAMA,SAAS,wBAAwB,GAAG,MAAM;;;;CAK1C;;;;CAKA,SAAS,SAAS,UAAU;CAC5B;CACA;CACA;CACA;CACA;;;;;;;;;;;;;;CAeA,cACEA,QAAQ,KAAK,SAAS,GAAG,sBAAsB,aAAa,IAAI,OAChEC,SAAS,wBAAwB,GAAG,MAAM,qBACvC,MAAM;;;;;;;;;;CAWX;;;;;CAMA,qBAAqB,MAAM;AAC5B;UAES;CACR,UAAU;CACV,aAAa,eAAe,qBAAqB;CACjD,wBAAwB,eAAe,gBAAgB,CAAE,MAAK;UAItD,uBAAuB,GAAG,MAAM,iBAAiB;;;;;CAKzD,UACI,SAEED,QAAQ,KAAK,SAAS,GAAG,sBAAsB,aAAa,IAAI;;;;;;;;;;;;CActE,kBAAkB,gBAChB,KAAK,SAAS,GAAG,sBAAsB,aAAa,IAAI;;;;;;;CAS1D,gBAAgBE,mBAAmB;AACpC;;;;;UAMS;CACR,UAAU;CACV,aAAa,eAAe,qBAAqB;CACjD,wBAAwB,eAAe,gBAAgB,CAAE,MAAK;UAItD,uBAAuB,GAAG,MAAM,iBAAiB;CACzD,WAAW;AACZ;AAED,YAAY,uBAAuB,UAAU,mBAC3C,oBAAoB,GAAG,sBAAsB,oCAEzC,mBAAmB,oBAAoB,GAAG;AAEhD,iBAAiB,sBAAsB,UAAU,6BAA6B;CAC5E,MAAM;CACN,IAAI,aAAa;AAClB;;;;;UAMS;CACR,UAAU;CACV,aAAa,eAAe;CAC5B,wBAAwB,eAAe,gBAAgB,CAAE;CACzD,gBAAgB;EAChB;;;;;CAKA,MAAM;CACN,IAAI;CACJ,iBAAiB,gBAAgB;;;;;;CAOjC,oBACEC,WAAW,UAAU,GAAG,UACrB,uBAAuB,gBAAgB;;;;;;CAO5C,SACEH,QAAQ,KAAK,SAAS,GAAG,sBAAsB,aAAa,IAAI;;;;;;;CASlE,YAAYI;;;;;;;;CASZ;;;;;;;CAQA;AACD;;;;;AAMD,YAAY;CACV,UAAU;CACV,aAAa,eAAe,qBAAqB;CACjD,wBAAwB,eAAe,gBAAgB,CAAE,MAAK;UAItD,8BAA8B,IACpC,gBAAgB,kBACd,4BAA4B,GAAG,MAAM,iBAAiB;AAI5D,iBAAiB;CACf,UAAU;CACV,aAAa,eAAe,qBAAqB;EACjD;CACA,MAAM;CACN,UAAU;CACV,SAAS,gBAAgB,QAAQ,GAAG,WAAW;AAChD;AAED,iBAAiB,oBAAoB;CACnC,MAAM;CACN;AACD;AAED,YAAY;CACV,UAAU;CACV,aAAa,eAAe,qBAAqB;CACjD,wBAAwB,eAAe,gBAAgB,CAAE,MAAK;IAK5D,sBAAsB,KACtB,sBAAsB,GAAG,MAAM,mBAC/B,iBAAiB,GAAG,QACpB;AAEJ,iBAAiB;CACf,UAAU;CACV,aAAa,eAAe,qBAAqB;CACjD,wBAAwB,eAAe,gBAAgB,CAAE,MAAK;EAI9D;;;;;CAKA,YAAY;;;;;;;;;;CAWZ,YAAY,UAAU;
|
|
1
|
+
{"mappings":"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","names":["object: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>","locator: ColumnDefinitionLocator<Q, RDPs, FunctionColumns>","value: unknown","objectSet: ObjectSet<Q, RDPs>","cellData?: unknown","newStates: Array<{\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns;\n isVisible: boolean;\n }>","newStates: Array<{\n columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns;\n pinned: \"left\" | \"right\" | \"none\";\n }>","columnId: PropertyKeys<Q> | keyof RDPs | keyof FunctionColumns","newWidth: number | null","newOrderBy: Array<{\n property: PropertyKeys<Q> | keyof RDPs;\n direction: \"asc\" | \"desc\";\n }>","change: RowSelectionChange<Q, RDPs>","row: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs> | null","info: CellEditInfo<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n unknown\n >","edits: CellEditInfo<\n Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>,\n unknown\n >[]","row: Osdk.Instance<Q, \"$allBaseProperties\", PropertyKeys<Q>, RDPs>","cellValue: unknown","options?: ObjectTableSnapshotOptions","columnId: string"],"sources":["../../../src/object-table/ObjectTableApi.ts"],"version":3,"file":"ObjectTableApi.d.ts"}
|
package/docs/ObjectTable.md
CHANGED
|
@@ -82,37 +82,37 @@ Type parameters: `Q extends ObjectOrInterfaceDefinition`, `RDPs extends Record<s
|
|
|
82
82
|
| --------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
|
83
83
|
| `objectType` | `Q` | **Required.** The object or interface type of the object If objectSet is not provided, objects will be fetched based on this type. |
|
|
84
84
|
| `objectSet` | `ObjectSet<Q>` | The set of objects to show in the table. If provided, the table fetches through this object set instead of fetching based on objectType. Supported for both object and interface types.<br /><br />For an interface object set, rows expose the interface's declared properties; the underlying concrete object's non-interface properties are not loaded. Use objectType-based fetching if you need those. |
|
|
85
|
+
| `columnDefinitions` | `Array<ColumnDefinition<Q, RDPs, FunctionColumns>>` | Ordered list of column definitions to show in the table<br /><br />If not provided, all of the properties of the object type will be shown in default order. |
|
|
85
86
|
| `objectSetOptions` | `ObjectSetOptions<Q>` | |
|
|
86
87
|
| `dedupeIntervalMs` | `number` | Minimum time between fetch requests in milliseconds. Increasing this value reduces redundant network calls when the same data is requested multiple times in quick succession. Defaults to `60_000 1 minute`. |
|
|
87
88
|
| `streamUpdates` | `boolean` | Enable streaming updates via websocket subscription. When true, the table will automatically update when matching objects are added, updated, or removed in Foundry.<br /><br />Limitations: `streamUpdates` cannot be used together with `pivotTo` or `withProperties`. The server does not support websocket subscriptions for link-traversal or derived-property queries. Those queries still fetch data normally but won't receive real-time updates. Defaults to `false`. |
|
|
88
89
|
| `pageSize` | `number` | Number of objects to fetch per page. Defaults to `50`. |
|
|
89
|
-
| `columnDefinitions` | `Array<ColumnDefinition<Q, RDPs, FunctionColumns>>` | Ordered list of column definitions to show in the table<br /><br />If not provided, all of the properties of the object type will be shown in default order. |
|
|
90
90
|
| `filter` | `WhereClause<Q, RDPs>` | The current where clause to filter the objects in the table. If provided, the filter is controlled. |
|
|
91
|
-
| `
|
|
91
|
+
| `enableColumnConfig` | `boolean` | Whether the column configuration dialog for column visibility and ordering is available to the user. Defaults to `true`. |
|
|
92
92
|
| `enableColumnPinning` | `boolean` | Whether columns can be pinned by the user. Defaults to `true`. |
|
|
93
93
|
| `enableColumnResizing` | `boolean` | Whether columns can be resized by the user. Defaults to `true`. |
|
|
94
|
-
| `enableColumnConfig` | `boolean` | Whether the column configuration dialog for column visibility and ordering is available to the user. Defaults to `true`. |
|
|
95
|
-
| `editMode` | `"always" \| "manual"` | Controls the edit mode behavior of the table. - "always": Editable cells are immediately in edit mode on row clicked. - "manual": User can toggle edit mode on/off via the Edit Table button. Defaults to `"manual"`. |
|
|
96
|
-
| `showEditFooter` | `boolean` | Whether to render the bottom edit footer that hosts the "Edit Table" / "Cancel" / "Submit Edits" buttons and the edit-state indicators (modification count, validation errors). Defaults to true whenever the table has at least one column declared editable (i.e. any column with `editable: true` or `editable: (object) => boolean`). When `false`, the "Edit Table" and "Submit Edits" buttons will not be shown. |
|
|
97
|
-
| `defaultOrderBy` | `Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>` | The default order by clause to sort the objects in the table. If provided without orderBy prop, the sorting is uncontrolled. If both orderBy and defaultOrderBy are provided, orderBy takes precedence. |
|
|
98
|
-
| `orderBy` | `Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>` | The current order by clause to sort the objects in the table. If provided, the sorting is controlled. If both orderBy and defaultOrderBy are provided, orderBy takes precedence. |
|
|
99
|
-
| `onOrderByChanged` | `(newOrderBy: Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>) => void` | Called when the order by clause is changed. Required when sorting is controlled. |
|
|
100
|
-
| `onCellValueChanged` | `(info: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>) => void` | Called after the value of a cell is edited and committed by the user. |
|
|
101
|
-
| `onSubmitEdits` | `(edits: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>[]) => Promise<boolean>` | If provided, the "Submit Edits" button will be shown in the edit footer. |
|
|
102
94
|
| `onColumnVisibilityChanged` | `(newStates: Array<{ columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns; isVisible: boolean; }>) => void` | Called when the column visibility or ordering changed.<br /><br />If provided, the table will allow the user to show/hide columns. |
|
|
103
95
|
| `onColumnsPinnedChanged` | `(newStates: Array<{ columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns; pinned: "left" \| "right" \| "none"; }>) => void` | Called when the pinned columns change.<br /><br />If provided, the table will allow the user to pin/unpin columns. |
|
|
104
96
|
| `onColumnResize` | `(columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns, newWidth: number \| null) => void` | Called when a column is resized. |
|
|
105
|
-
| `onRowClick` | `(object: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>) => void` | Called when a row is clicked. |
|
|
106
|
-
| `focusedRow` | `PrimaryKeyType<Q> \| null` | The primary key of the row to render as visually focused (the "last interacted" row). When provided, focus state is controlled by the caller.<br /><br />Stored as a primary key rather than a full object so the focus does not go stale when the underlying row data changes.<br /><br />Pass `null` to render no row as focused. |
|
|
107
|
-
| `onFocusedRowChanged` | `(row: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs> \| null) => void` | Called when the focused row changes — fires in both controlled and uncontrolled modes so callers can observe focus without taking it over. |
|
|
108
97
|
| `onColumnHeaderClick` | `(columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns) => void` | Called when a column header is clicked.<br /><br />The columnId matches the `locator.id` configured on the column definition. The dropdown menu trigger is excluded — clicking the chevron opens the header menu instead of firing this callback. |
|
|
98
|
+
| `enableOrdering` | `boolean` | Whether the table is sortable by the user. Defaults to `true`. |
|
|
99
|
+
| `defaultOrderBy` | `Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>` | The default order by clause to sort the objects in the table. If provided without orderBy prop, the sorting is uncontrolled. If both orderBy and defaultOrderBy are provided, orderBy takes precedence. |
|
|
100
|
+
| `orderBy` | `Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>` | The current order by clause to sort the objects in the table. If provided, the sorting is controlled. If both orderBy and defaultOrderBy are provided, orderBy takes precedence. |
|
|
101
|
+
| `onOrderByChanged` | `(newOrderBy: Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>) => void` | Called when the order by clause is changed. Required when sorting is controlled. |
|
|
109
102
|
| `selectionMode` | `"single" \| "multiple" \| "none"` | Selection mode for the table rows.<br /><br />If multiple, a checkbox will be shown for each row to allow selecting multiple rows as well as a top-level checkbox in the header to select all rows. Defaults to `"none"`. |
|
|
110
103
|
| `selectedRows` | `PrimaryKeyType<Q>[]` | The currently selected rows in the table. If provided, the row selection is controlled. |
|
|
111
104
|
| `isAllSelected` | `boolean` | Indicates whether all rows are selected in controlled mode. When true, the table will show all rows as selected regardless of the selectedRows array. |
|
|
112
105
|
| `onRowSelectionChanged` | `(change: RowSelectionChange<Q, RDPs>) => void` | Called when the row selection changes, with a `RowSelectionChange` payload describing the new state. |
|
|
106
|
+
| `focusedRow` | `PrimaryKeyType<Q> \| null` | The primary key of the row to render as visually focused (the "last interacted" row). When provided, focus state is controlled by the caller.<br /><br />Stored as a primary key rather than a full object so the focus does not go stale when the underlying row data changes.<br /><br />Pass `null` to render no row as focused. |
|
|
107
|
+
| `onFocusedRowChanged` | `(row: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs> \| null) => void` | Called when the focused row changes — fires in both controlled and uncontrolled modes so callers can observe focus without taking it over. |
|
|
108
|
+
| `editMode` | `"always" \| "manual"` | Controls the edit mode behavior of the table. - "always": Editable cells are immediately in edit mode on row clicked. - "manual": User can toggle edit mode on/off via the Edit Table button. Defaults to `"manual"`. |
|
|
109
|
+
| `showEditFooter` | `boolean` | Whether to render the bottom edit footer that hosts the "Edit Table" / "Cancel" / "Submit Edits" buttons and the edit-state indicators (modification count, validation errors). Defaults to true whenever the table has at least one column declared editable (i.e. any column with `editable: true` or `editable: (object) => boolean`). When `false`, the "Edit Table" and "Submit Edits" buttons will not be shown. |
|
|
110
|
+
| `onCellValueChanged` | `(info: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>) => void` | Called after the value of a cell is edited and committed by the user. |
|
|
111
|
+
| `onSubmitEdits` | `(edits: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>[]) => Promise<boolean>` | If provided, the "Submit Edits" button will be shown in the edit footer. |
|
|
112
|
+
| `onRowClick` | `(object: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>) => void` | Called when a row is clicked. |
|
|
113
113
|
| `renderCellContextMenu` | `(row: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, cellValue: unknown) => React.ReactNode` | If provided, will render this context menu when right clicking on a cell |
|
|
114
|
-
| `renderEmptyState` | `() => React.ReactNode` | Render override for the empty state. Called when the table has no rows and no error. When omitted, a default "No Data" indicator is rendered. |
|
|
115
114
|
| `rowHeight` | `number` | The height of each row in pixels. Defaults to `40`. |
|
|
115
|
+
| `renderEmptyState` | `() => React.ReactNode` | Render override for the empty state. Called when the table has no rows and no error. When omitted, a default "No Data" indicator is rendered. |
|
|
116
116
|
| `getRowAttributes` | `(object: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>) => Record<string, string \| undefined>` | Returns extra HTML attributes (typically `data-*`) to apply to each row element. Use this to drive conditional row styling |
|
|
117
117
|
| `tableRef` | `React.Ref<ObjectTableHandle<Q, RDPs>>` | Imperative handle for programmatic table actions. Pass a ref (`useRef<ObjectTableHandle<Q, RDPs>>(null)`) to call `ObjectTableHandle` methods such as `ObjectTableHandle.getSnapshot`. |
|
|
118
118
|
| `className` | `string` | |
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: ObjectTable
|
|
3
|
+
description: An OSDK-aware data table for ontology objects. Renders rows from an object type, ObjectSet, or interface, with built-in column configuration, selection, sorting, pinning, resizing, and inline editing.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
> **Beta** — exported from `@osdk/react-components/experimental/object-table`.
|
|
7
|
+
|
|
8
|
+
## Usage
|
|
9
|
+
|
|
10
|
+
ObjectTable fetches its own data. Wrap your app in `OsdkProvider` and import the package styles once (see [Prerequisites](./Prerequisites.md) for the `@layer` order), then pass an object type — columns, sorting, filtering, and selection are wired up out of the box.
|
|
11
|
+
|
|
12
|
+
> **Note** — `@my/osdk` is a placeholder for **your generated SDK package** (e.g. `@your-app/sdk`). Replace it with the actual package name in your project.
|
|
13
|
+
|
|
14
|
+
```tsx
|
|
15
|
+
import { Office } from "@my/osdk";
|
|
16
|
+
import { ObjectTable } from "@osdk/react-components/experimental/object-table";
|
|
17
|
+
|
|
18
|
+
function OfficesPage() {
|
|
19
|
+
return <ObjectTable objectType={Office} />;
|
|
20
|
+
}
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
## Props
|
|
24
|
+
|
|
25
|
+
This table is generated from the `ObjectTableProps` interface in [`ObjectTableApi.ts`](https://github.com/palantir/osdk-ts/blob/main/packages/react-components/src/object-table/ObjectTableApi.ts) — edit the JSDoc there, not this table. It lists the props declared directly on `ObjectTableProps`; for the nested `ColumnDefinition`, `ObjectSetOptions`, and editor-config shapes, see the [full ObjectTable reference](https://github.com/palantir/osdk-ts/blob/main/packages/react-components/docs/ObjectTable.md).
|
|
26
|
+
|
|
27
|
+
<!-- AUTOGEN:props START src=src/object-table/ObjectTableApi.ts interface=ObjectTableProps — generated by scripts/gen-props.mjs; run `pnpm --filter @osdk/react-components gen-props` -->
|
|
28
|
+
|
|
29
|
+
Type parameters: `Q extends ObjectOrInterfaceDefinition`, `RDPs extends Record<string, SimplePropertyDef> = Record<string, never>`, `FunctionColumns extends Record<string, QueryDefinition<{}>> = Record<string, never>`
|
|
30
|
+
|
|
31
|
+
| Name | Type | Description |
|
|
32
|
+
| --------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
|
33
|
+
| `objectType` | `Q` | **Required.** The object or interface type of the object If objectSet is not provided, objects will be fetched based on this type. |
|
|
34
|
+
| `objectSet` | `ObjectSet<Q>` | The set of objects to show in the table. If provided, the table fetches through this object set instead of fetching based on objectType. Supported for both object and interface types.<br /><br />For an interface object set, rows expose the interface's declared properties; the underlying concrete object's non-interface properties are not loaded. Use objectType-based fetching if you need those. |
|
|
35
|
+
| `columnDefinitions` | `Array<ColumnDefinition<Q, RDPs, FunctionColumns>>` | Ordered list of column definitions to show in the table<br /><br />If not provided, all of the properties of the object type will be shown in default order. |
|
|
36
|
+
| `objectSetOptions` | `ObjectSetOptions<Q>` | |
|
|
37
|
+
| `dedupeIntervalMs` | `number` | Minimum time between fetch requests in milliseconds. Increasing this value reduces redundant network calls when the same data is requested multiple times in quick succession. Defaults to `60_000 1 minute`. |
|
|
38
|
+
| `streamUpdates` | `boolean` | Enable streaming updates via websocket subscription. When true, the table will automatically update when matching objects are added, updated, or removed in Foundry.<br /><br />Limitations: `streamUpdates` cannot be used together with `pivotTo` or `withProperties`. The server does not support websocket subscriptions for link-traversal or derived-property queries. Those queries still fetch data normally but won't receive real-time updates. Defaults to `false`. |
|
|
39
|
+
| `pageSize` | `number` | Number of objects to fetch per page. Defaults to `50`. |
|
|
40
|
+
| `filter` | `WhereClause<Q, RDPs>` | The current where clause to filter the objects in the table. If provided, the filter is controlled. |
|
|
41
|
+
| `enableColumnConfig` | `boolean` | Whether the column configuration dialog for column visibility and ordering is available to the user. Defaults to `true`. |
|
|
42
|
+
| `enableColumnPinning` | `boolean` | Whether columns can be pinned by the user. Defaults to `true`. |
|
|
43
|
+
| `enableColumnResizing` | `boolean` | Whether columns can be resized by the user. Defaults to `true`. |
|
|
44
|
+
| `onColumnVisibilityChanged` | `(newStates: Array<{ columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns; isVisible: boolean; }>) => void` | Called when the column visibility or ordering changed.<br /><br />If provided, the table will allow the user to show/hide columns. |
|
|
45
|
+
| `onColumnsPinnedChanged` | `(newStates: Array<{ columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns; pinned: "left" \| "right" \| "none"; }>) => void` | Called when the pinned columns change.<br /><br />If provided, the table will allow the user to pin/unpin columns. |
|
|
46
|
+
| `onColumnResize` | `(columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns, newWidth: number \| null) => void` | Called when a column is resized. |
|
|
47
|
+
| `onColumnHeaderClick` | `(columnId: PropertyKeys<Q> \| keyof RDPs \| keyof FunctionColumns) => void` | Called when a column header is clicked.<br /><br />The columnId matches the `locator.id` configured on the column definition. The dropdown menu trigger is excluded — clicking the chevron opens the header menu instead of firing this callback. |
|
|
48
|
+
| `enableOrdering` | `boolean` | Whether the table is sortable by the user. Defaults to `true`. |
|
|
49
|
+
| `defaultOrderBy` | `Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>` | The default order by clause to sort the objects in the table. If provided without orderBy prop, the sorting is uncontrolled. If both orderBy and defaultOrderBy are provided, orderBy takes precedence. |
|
|
50
|
+
| `orderBy` | `Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>` | The current order by clause to sort the objects in the table. If provided, the sorting is controlled. If both orderBy and defaultOrderBy are provided, orderBy takes precedence. |
|
|
51
|
+
| `onOrderByChanged` | `(newOrderBy: Array<{ property: PropertyKeys<Q> \| keyof RDPs; direction: "asc" \| "desc"; }>) => void` | Called when the order by clause is changed. Required when sorting is controlled. |
|
|
52
|
+
| `selectionMode` | `"single" \| "multiple" \| "none"` | Selection mode for the table rows.<br /><br />If multiple, a checkbox will be shown for each row to allow selecting multiple rows as well as a top-level checkbox in the header to select all rows. Defaults to `"none"`. |
|
|
53
|
+
| `selectedRows` | `PrimaryKeyType<Q>[]` | The currently selected rows in the table. If provided, the row selection is controlled. |
|
|
54
|
+
| `isAllSelected` | `boolean` | Indicates whether all rows are selected in controlled mode. When true, the table will show all rows as selected regardless of the selectedRows array. |
|
|
55
|
+
| `onRowSelectionChanged` | `(change: RowSelectionChange<Q, RDPs>) => void` | Called when the row selection changes, with a `RowSelectionChange` payload describing the new state. |
|
|
56
|
+
| `focusedRow` | `PrimaryKeyType<Q> \| null` | The primary key of the row to render as visually focused (the "last interacted" row). When provided, focus state is controlled by the caller.<br /><br />Stored as a primary key rather than a full object so the focus does not go stale when the underlying row data changes.<br /><br />Pass `null` to render no row as focused. |
|
|
57
|
+
| `onFocusedRowChanged` | `(row: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs> \| null) => void` | Called when the focused row changes — fires in both controlled and uncontrolled modes so callers can observe focus without taking it over. |
|
|
58
|
+
| `editMode` | `"always" \| "manual"` | Controls the edit mode behavior of the table. - "always": Editable cells are immediately in edit mode on row clicked. - "manual": User can toggle edit mode on/off via the Edit Table button. Defaults to `"manual"`. |
|
|
59
|
+
| `showEditFooter` | `boolean` | Whether to render the bottom edit footer that hosts the "Edit Table" / "Cancel" / "Submit Edits" buttons and the edit-state indicators (modification count, validation errors). Defaults to true whenever the table has at least one column declared editable (i.e. any column with `editable: true` or `editable: (object) => boolean`). When `false`, the "Edit Table" and "Submit Edits" buttons will not be shown. |
|
|
60
|
+
| `onCellValueChanged` | `(info: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>) => void` | Called after the value of a cell is edited and committed by the user. |
|
|
61
|
+
| `onSubmitEdits` | `(edits: CellEditInfo<Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, unknown>[]) => Promise<boolean>` | If provided, the "Submit Edits" button will be shown in the edit footer. |
|
|
62
|
+
| `onRowClick` | `(object: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>) => void` | Called when a row is clicked. |
|
|
63
|
+
| `renderCellContextMenu` | `(row: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>, cellValue: unknown) => React.ReactNode` | If provided, will render this context menu when right clicking on a cell |
|
|
64
|
+
| `rowHeight` | `number` | The height of each row in pixels. Defaults to `40`. |
|
|
65
|
+
| `renderEmptyState` | `() => React.ReactNode` | Render override for the empty state. Called when the table has no rows and no error. When omitted, a default "No Data" indicator is rendered. |
|
|
66
|
+
| `getRowAttributes` | `(object: Osdk.Instance<Q, "$allBaseProperties", PropertyKeys<Q>, RDPs>) => Record<string, string \| undefined>` | Returns extra HTML attributes (typically `data-*`) to apply to each row element. Use this to drive conditional row styling |
|
|
67
|
+
| `tableRef` | `React.Ref<ObjectTableHandle<Q, RDPs>>` | Imperative handle for programmatic table actions. Pass a ref (`useRef<ObjectTableHandle<Q, RDPs>>(null)`) to call `ObjectTableHandle` methods such as `ObjectTableHandle.getSnapshot`. |
|
|
68
|
+
| `className` | `string` | |
|
|
69
|
+
| `labels` | `Partial<ObjectTableLabels>` | Overrides for the table's user-facing strings. Provide any subset; unset keys fall back to the built-in English defaults. Use this to localize the table or adjust wording. See `ObjectTableLabels`. Defaults to `undefined (built-in English strings)`. |
|
|
70
|
+
|
|
71
|
+
<!-- AUTOGEN:props END -->
|
|
72
|
+
|
|
73
|
+
## Style API
|
|
74
|
+
|
|
75
|
+
The ObjectTable emits a stable set of `data-*` attributes on its rendered DOM and exposes every visual property through `--osdk-table-*` CSS variables. Together they let you override appearance via the table's `className` (or any ancestor) without forking the component.
|
|
76
|
+
|
|
77
|
+
> **Class names are internal.** ObjectTable uses CSS Modules, so its class names are hashed at build time and are **not** part of the public API. Style states and elements by targeting the documented `data-*` attributes and CSS variables below — the only consumer-facing class name is the one you pass via the `className` prop. Token defaults live in `src/tokens/component-tokens/table.css`; the `--osdk-*` values they reference are defined in `src/tokens/base-tokens/base.css`.
|
|
78
|
+
|
|
79
|
+
| Element | Data attributes | CSS variables |
|
|
80
|
+
| ---------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
|
81
|
+
| `<thead>` (header row) | `data-resizing` — `true` \| `false`; set while a column is being resized. | `--osdk-table-header-height`<br /> `--osdk-table-header-bg`<br /> `--osdk-table-header-fontWeight`<br /> `--osdk-table-header-fontSize`<br /> `--osdk-table-header-color`<br /> `--osdk-table-header-divider`<br /> `--osdk-table-resizer-color-hover`<br /> `--osdk-table-resizer-color-active` |
|
|
82
|
+
| `<th>` (header cell) | `data-pinned` — `left` \| `right` \| `false`. | `--osdk-table-pinned-column-border`<br /> `--osdk-table-header-menu-padding`<br /> `--osdk-table-header-menu-bg`<br /> `--osdk-table-header-menu-bg-hover`<br /> `--osdk-table-header-menu-bg-active`<br /> `--osdk-table-header-menu-border`<br /> `--osdk-table-header-menu-color`<br /> `--osdk-table-header-menu-color-active`<br /> `--osdk-table-header-menu-icon-color` |
|
|
83
|
+
| `<tr>` (body row) | `data-selected` — `true` \| `false`<br /> `data-focused` — `true` \| `false`<br /> `data-row-parity` — `even` \| `odd`<br />plus any custom attrs from `getRowAttributes`. | `--osdk-table-row-bg-default`<br /> `--osdk-table-row-bg-alternate`<br /> `--osdk-table-row-bg-hover`<br /> `--osdk-table-row-bg-active`<br /> `--osdk-table-row-border-color-hover`<br /> `--osdk-table-row-border-color-active`<br /> `--osdk-table-row-divider` |
|
|
84
|
+
| `<td>` (body cell) | `data-pinned` — `left` \| `right` \| `false`<br /> `data-editable` — `true` \| (absent). | `--osdk-table-cell-padding`<br /> `--osdk-table-cell-fontSize`<br /> `--osdk-table-cell-color`<br /> `--osdk-table-cell-divider`<br /> `--osdk-table-cell-editable-border`<br /> `--osdk-table-cell-edited-border`<br /> `--osdk-table-cell-edited-border-error`<br /> `--osdk-table-cell-input-bg` |
|
|
85
|
+
| Edit footer container | — | `--osdk-table-edit-container-padding`<br /> `--osdk-table-edit-container-min-height` |
|
|
86
|
+
| Column config dialog | — | `--osdk-table-column-config-dialog-min-width`<br /> `--osdk-table-column-config-dialog-min-height`<br /> `--osdk-table-column-config-visible-columns-bg` |
|
|
87
|
+
| Skeleton loading rows | — | `--osdk-table-skeleton-color-from`<br /> `--osdk-table-skeleton-color-to` |
|
|
88
|
+
| Shared border tokens | — | `--osdk-table-border`<br /> `--osdk-table-border-color`<br /> `--osdk-table-border-width` |
|
|
89
|
+
|
|
90
|
+
## Advanced
|
|
91
|
+
|
|
92
|
+
`ObjectTable` is the OSDK-aware component most consumers should use. For cases where you need to bring your own data fetching or assemble the table from smaller pieces, the package also exports the OSDK-agnostic base component, the individual building blocks, and the headless hooks that back them. All are available from `@osdk/react-components/experimental/object-table`.
|
|
93
|
+
|
|
94
|
+
### Base component
|
|
95
|
+
|
|
96
|
+
The base component contains all interactions and styling but does no data fetching — feed it primitive props from your own data source.
|
|
97
|
+
|
|
98
|
+
| Export | Description |
|
|
99
|
+
| ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
100
|
+
| `BaseTable` | OSDK-agnostic table that renders rows, columns, selection, sorting, pinning, resizing, and inline editing from primitive props. Does no fetching — wire it up with your own data source (or the hooks below). |
|
|
101
|
+
|
|
102
|
+
### Building blocks
|
|
103
|
+
|
|
104
|
+
Standalone sub-components used internally by `ObjectTable`, exported so you can compose them into a custom table.
|
|
105
|
+
|
|
106
|
+
| Export | Description |
|
|
107
|
+
| ----------------------- | ---------------------------------------------------------------------------------------- |
|
|
108
|
+
| `ColumnConfigDialog` | Dialog for toggling column visibility and reordering columns. |
|
|
109
|
+
| `MultiColumnSortDialog` | Dialog for building a multi-column sort order. |
|
|
110
|
+
| `LoadingCell` | Skeleton loading cell that renders a full `<td>` element — use in a custom row renderer. |
|
|
111
|
+
| `LoadingCellContent` | Skeleton loading content only (no `<td>` wrapper) — use inside an existing cell. |
|
|
112
|
+
|
|
113
|
+
### Hooks
|
|
114
|
+
|
|
115
|
+
Headless hooks holding the table's data and interaction logic. Reach for them when you're building your own TanStack React Table instance and custom table components and want to reuse ObjectTable's data fetching and state logic.
|
|
116
|
+
|
|
117
|
+
| Export | Description |
|
|
118
|
+
| ------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
119
|
+
| `useObjectTableData` | Fetches table rows (OSDK-aware). Wraps `useObjectSet`/`useOsdkObjects` depending on whether an `objectSet` is provided, and applies derived-property (RDP) locators via `withProperties`. |
|
|
120
|
+
| `useFunctionColumnsData` | Resolves values for function-backed (query) columns for the loaded rows (OSDK-aware). |
|
|
121
|
+
| `useColumnDefs` | Builds the tanstack-table column definitions from the object/interface type and column definitions. |
|
|
122
|
+
| `useSelectionColumn` | Builds the leading selection (checkbox) column for multi-select tables. |
|
|
123
|
+
| `useColumnPinning` | Manages pinned (left/right) column state, controlled or uncontrolled. |
|
|
124
|
+
| `useColumnResize` | Manages per-column widths and resize interactions. |
|
|
125
|
+
| `useColumnVisibility` | Manages column visibility and ordering state. |
|
|
126
|
+
| `useFocusedRow` | Manages the "last interacted" focused row, controlled or uncontrolled. |
|
|
127
|
+
| `useRowSelection` | Manages row selection state (single/multiple), controlled or uncontrolled. |
|
|
128
|
+
| `useTableSorting` | Manages sort (`orderBy`) state, controlled or uncontrolled. |
|
|
129
|
+
| `useEditableTable` | Manages inline edit state: tracked edits, validation, and the submit lifecycle. |
|
|
130
|
+
| `useObjectTableSnapshot` | Builds the `ObjectTableHandle` exposed via `tableRef`, whose `getSnapshot` paginates the object set and resolves column values for export. |
|
|
131
|
+
| `useCellContextMenu` | Manages the right-click cell context-menu open state and position. |
|