@osdk/react-components 0.2.0-beta.3 → 0.2.0-beta.4

package/build/esm/object-table/EditableCell.js

@@ -0,0 +1,91 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Input } from "@base-ui/react/input";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import styles from "./EditableCell.module.css";
+const NUMBER_TYPES = ["double", "integer", "long", "float", "decimal", "byte", "short"];
+function valueToString(value) {
+  if (value == null) {
+    return "";
+  }
+  if (typeof value === "object") {
+    return JSON.stringify(value);
+  }
+  // At this point, value is a primitive (string, number, boolean, symbol, bigint)
+  return String(value);
+}
+function parseValueByType(value, dataType) {
+  if (!dataType || !NUMBER_TYPES.includes(dataType)) {
+    return value;
+  }
+  if (value === "") {
+    return null;
+  }
+  const parsedNumber = Number(value);
+  if (isNaN(parsedNumber)) {
+    return value;
+  }
+  return parsedNumber;
+}
+export function EditableCell({
+  initialValue,
+  currentValue,
+  cellId,
+  dataType,
+  onCellEdit
+}) {
+  const [value, setValue] = useState(valueToString(currentValue));
+  const isCancelled = useRef(false);
+  useEffect(() => {
+    setValue(valueToString(currentValue));
+  }, [currentValue]);
+  const handleBlur = useCallback(() => {
+    // Do not commit the edit if it was cancelled with Escape key
+    if (isCancelled.current) {
+      isCancelled.current = false;
+      return;
+    }
+    const parsedValue = parseValueByType(value, dataType);
+    onCellEdit?.(cellId, {
+      newValue: parsedValue,
+      oldValue: initialValue
+    });
+  }, [value, initialValue, onCellEdit, cellId, dataType]);
+  const handleChange = useCallback(value => {
+    setValue(value);
+  }, []);
+  const handleKeyDown = useCallback(e => {
+    if (e.key === "Enter") {
+      e.currentTarget.blur();
+    }
+    if (e.key === "Escape") {
+      isCancelled.current = true;
+      setValue(valueToString(currentValue));
+      e.currentTarget.blur();
+    }
+  }, [currentValue]);
+  const inputType = dataType && NUMBER_TYPES.includes(dataType) ? "number" : "text";
+  return /*#__PURE__*/React.createElement(Input, {
+    className: styles.osdkEditableInput,
+    type: inputType,
+    value: value,
+    onValueChange: handleChange,
+    onBlur: handleBlur,
+    onKeyDown: handleKeyDown
+  });
+}
+//# sourceMappingURL=EditableCell.js.map

package/build/esm/object-table/EditableCell.js.map

@@ -0,0 +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","EditableCell","initialValue","currentValue","cellId","onCellEdit","setValue","isCancelled","handleBlur","current","parsedValue","newValue","oldValue","handleChange","handleKeyDown","e","key","currentTarget","blur","inputType","createElement","className","osdkEditableInput","type","onValueChange","onBlur","onKeyDown"],"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 React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport styles from \"./EditableCell.module.css\";\nimport type { CellValueState } from \"./utils/types.js\";\n\nexport interface EditableCellProps {\n  initialValue: unknown;\n  currentValue: unknown;\n  cellId: string;\n  dataType?: string;\n  onCellEdit?: (cellId: string, state: CellValueState) => void;\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\nexport function EditableCell({\n  initialValue,\n  currentValue,\n  cellId,\n  dataType,\n  onCellEdit,\n}: EditableCellProps): React.ReactElement {\n  const [value, setValue] = useState<string>(valueToString(currentValue));\n  const isCancelled = useRef(false);\n\n  useEffect(() => {\n    setValue(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(value, dataType);\n    onCellEdit?.(cellId, { newValue: parsedValue, oldValue: initialValue });\n  }, [value, initialValue, onCellEdit, cellId, dataType]);\n\n  const handleChange = useCallback((value: string) => {\n    setValue(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        setValue(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  return (\n    <Input\n      className={styles.osdkEditableInput}\n      type={inputType}\n      value={value}\n      onValueChange={handleChange}\n      onBlur={handleBlur}\n      onKeyDown={handleKeyDown}\n    />\n  );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,KAAK,QAAQ,sBAAsB;AAC5C,OAAOC,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AACvE,OAAOC,MAAM,MAAM,2BAA2B;AAW9C,MAAMC,YAAsB,GAAG,CAC7B,QAAQ,EACR,SAAS,EACT,MAAM,EACN,OAAO,EACP,SAAS,EACT,MAAM,EACN,OAAO,CACR;AAED,SAASC,aAAaA,CAACC,KAAc,EAAU;EAC7C,IAAIA,KAAK,IAAI,IAAI,EAAE;IACjB,OAAO,EAAE;EACX;EACA,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;IAC7B,OAAOC,IAAI,CAACC,SAAS,CAACF,KAAK,CAAC;EAC9B;EACA;EACA,OAAOG,MAAM,CAACH,KAAoD,CAAC;AACrE;AAEA,SAASI,gBAAgBA,CACvBJ,KAAa,EACbK,QAAiB,EACR;EACT,IAAI,CAACA,QAAQ,IAAI,CAACP,YAAY,CAACQ,QAAQ,CAACD,QAAQ,CAAC,EAAE;IACjD,OAAOL,KAAK;EACd;EAEA,IAAIA,KAAK,KAAK,EAAE,EAAE;IAChB,OAAO,IAAI;EACb;EAEA,MAAMO,YAAY,GAAGC,MAAM,CAACR,KAAK,CAAC;EAElC,IAAIS,KAAK,CAACF,YAAY,CAAC,EAAE;IACvB,OAAOP,KAAK;EACd;EAEA,OAAOO,YAAY;AACrB;AAEA,OAAO,SAASG,YAAYA,CAAC;EAC3BC,YAAY;EACZC,YAAY;EACZC,MAAM;EACNR,QAAQ;EACRS;AACiB,CAAC,EAAsB;EACxC,MAAM,CAACd,KAAK,EAAEe,QAAQ,CAAC,GAAGnB,QAAQ,CAASG,aAAa,CAACa,YAAY,CAAC,CAAC;EACvE,MAAMI,WAAW,GAAGrB,MAAM,CAAC,KAAK,CAAC;EAEjCD,SAAS,CAAC,MAAM;IACdqB,QAAQ,CAAChB,aAAa,CAACa,YAAY,CAAC,CAAC;EACvC,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,MAAMK,UAAU,GAAGxB,WAAW,CAAC,MAAM;IACnC;IACA,IAAIuB,WAAW,CAACE,OAAO,EAAE;MACvBF,WAAW,CAACE,OAAO,GAAG,KAAK;MAC3B;IACF;IACA,MAAMC,WAAW,GAAGf,gBAAgB,CAACJ,KAAK,EAAEK,QAAQ,CAAC;IACrDS,UAAU,GAAGD,MAAM,EAAE;MAAEO,QAAQ,EAAED,WAAW;MAAEE,QAAQ,EAAEV;IAAa,CAAC,CAAC;EACzE,CAAC,EAAE,CAACX,KAAK,EAAEW,YAAY,EAAEG,UAAU,EAAED,MAAM,EAAER,QAAQ,CAAC,CAAC;EAEvD,MAAMiB,YAAY,GAAG7B,WAAW,CAAEO,KAAa,IAAK;IAClDe,QAAQ,CAACf,KAAK,CAAC;EACjB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMuB,aAAa,GAAG9B,WAAW,CAC9B+B,CAAwC,IAAK;IAC5C,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;MACrBD,CAAC,CAACE,aAAa,CAACC,IAAI,CAAC,CAAC;IACxB;IACA,IAAIH,CAAC,CAACC,GAAG,KAAK,QAAQ,EAAE;MACtBT,WAAW,CAACE,OAAO,GAAG,IAAI;MAC1BH,QAAQ,CAAChB,aAAa,CAACa,YAAY,CAAC,CAAC;MACrCY,CAAC,CAACE,aAAa,CAACC,IAAI,CAAC,CAAC;IACxB;EACF,CAAC,EACD,CAACf,YAAY,CACf,CAAC;EAED,MAAMgB,SAAS,GAAGvB,QAAQ,IAAIP,YAAY,CAACQ,QAAQ,CAACD,QAAQ,CAAC,GACzD,QAAQ,GACR,MAAM;EAEV,oBACEb,KAAA,CAAAqC,aAAA,CAACtC,KAAK;IACJuC,SAAS,EAAEjC,MAAM,CAACkC,iBAAkB;IACpCC,IAAI,EAAEJ,SAAU;IAChB5B,KAAK,EAAEA,KAAM;IACbiC,aAAa,EAAEX,YAAa;IAC5BY,MAAM,EAAEjB,UAAW;IACnBkB,SAAS,EAAEZ;EAAc,CAC1B,CAAC;AAEN","ignoreList":[]}

package/build/esm/object-table/EditableCell.module.css

@@ -0,0 +1,3 @@
+.osdkEditableInput:focus {
+  outline: none;
+}

package/build/esm/object-table/ObjectTable.js

@@ -20,6 +20,7 @@ import { useColumnDefs } from "./hooks/useColumnDefs.js";
 import { useColumnPinning } from "./hooks/useColumnPinning.js";
 import { useColumnResize } from "./hooks/useColumnResize.js";
 import { useColumnVisibility } from "./hooks/useColumnVisibility.js";
+import { useEditableTable } from "./hooks/useEditableTable.js";
 import { useObjectTableData } from "./hooks/useObjectTableData.js";
 import { useRowSelection } from "./hooks/useRowSelection.js";
 import { useSelectionColumn } from "./hooks/useSelectionColumn.js";
@@ -50,6 +51,8 @@ export function ObjectTable({
   selectionMode = "none",
   selectedRows,
   onColumnVisibilityChanged,
+  onCellValueChanged,
+  onSubmitEdits,
   enableOrdering = true,
   enableColumnPinning = true,
   enableColumnResizing = true,
@@ -62,6 +65,15 @@ export function ObjectTable({
   } = useColumnResize({
     onColumnResize
   });
+  const {
+    cellEdits,
+    clearEdits,
+    handleCellEdit,
+    handleSubmitEdits
+  } = useEditableTable({
+    onCellValueChanged,
+    onSubmitEdits
+  });
   const {
     sorting,
     onSortingChange
@@ -146,7 +158,11 @@ export function ObjectTable({
     defaultColumn: {
       minSize: 80
     },
-    getRowId
+    getRowId,
+    meta: {
+      onCellEdit: handleCellEdit,
+      cellEdits
+    }
   });
   const onRenderCellContextMenu = useCallback((row, cell) => {
     return renderCellContextMenu?.(row, cell.getValue());
@@ -157,6 +173,16 @@ export function ObjectTable({
     showResizeItem: enableColumnResizing,
     showConfigItem: enableColumnConfig
   }), [enableOrdering, enableColumnPinning, enableColumnResizing, enableColumnConfig]);
+  const editableConfig = useMemo(() => {
+    if (!onSubmitEdits) {
+      return;
+    }
+    return {
+      onSubmitEdits: handleSubmitEdits,
+      clearEdits,
+      cellEdits
+    };
+  }, [onSubmitEdits, handleSubmitEdits, clearEdits, cellEdits]);
   return /*#__PURE__*/React.createElement(BaseTable, {
     table: table,
     isLoading: isLoading || isColumnsLoading,
@@ -166,7 +192,8 @@ export function ObjectTable({
     renderCellContextMenu: onRenderCellContextMenu,
     className: props.className,
     error: error,
-    headerMenuFeatureFlags: headerMenuFeatureFlags
+    headerMenuFeatureFlags: headerMenuFeatureFlags,
+    editableConfig: editableConfig
   });
 }
 //# sourceMappingURL=ObjectTable.js.map

package/build/esm/object-table/ObjectTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectTable.js","names":["getCoreRowModel","useReactTable","React","useCallback","useMemo","useColumnDefs","useColumnPinning","useColumnResize","useColumnVisibility","useObjectTableData","useRowSelection","useSelectionColumn","useTableSorting","BaseTable","getRowId","ObjectTable","objectType","columnDefinitions","filter","orderBy","defaultOrderBy","onOrderByChanged","onColumnsPinnedChanged","onColumnResize","onRowSelection","renderCellContextMenu","selectionMode","selectedRows","onColumnVisibilityChanged","enableOrdering","enableColumnPinning","enableColumnResizing","enableColumnConfig","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","table","state","enableSorting","columnResizeMode","columnResizeDirection","manualSorting","defaultColumn","minSize","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 { 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  columnDefinitions,\n  filter,\n  orderBy,\n  defaultOrderBy,\n  onOrderByChanged,\n  onColumnsPinnedChanged,\n  onColumnResize,\n  onRowSelection,\n  renderCellContextMenu,\n  selectionMode = \"none\",\n  selectedRows,\n  onColumnVisibilityChanged,\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 { 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  );\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  });\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    />\n  );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ObjectTable.js","names":["getCoreRowModel","useReactTable","React","useCallback","useMemo","useColumnDefs","useColumnPinning","useColumnResize","useColumnVisibility","useEditableTable","useObjectTableData","useRowSelection","useSelectionColumn","useTableSorting","BaseTable","getRowId","ObjectTable","objectType","columnDefinitions","filter","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  columnDefinitions,\n  filter,\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  );\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":[]}

package/build/esm/object-table/ObjectTableApi.js.map

@@ -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  Osdk,\n  PrimaryKeyType,\n  PropertyKeys,\n  QueryDefinition,\n  SimplePropertyDef,\n  WhereClause,\n} from \"@osdk/api\";\nimport type * as React from \"react\";\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  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 type of the object\n   */\n  objectType: 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 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"],"mappings":"","ignoreList":[]}
+{"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  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 type of the object\n   */\n  objectType: 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"],"mappings":"","ignoreList":[]}

package/build/esm/object-table/Table.js

@@ -16,6 +16,7 @@
 
 import classNames from "classnames";
 import React, { useCallback, useEffect, useRef, useState } from "react";
+import { ActionButton } from "../base-components/action-button/ActionButton.js";
 import { LoadingStateTable } from "./LoadingStateTable.js";
 import { NonIdealState } from "./NonIdealState.js";
 import styles from "./Table.module.css";
@@ -30,7 +31,8 @@ export function BaseTable({
   renderCellContextMenu,
   className,
   error,
-  headerMenuFeatureFlags
+  headerMenuFeatureFlags,
+  editableConfig
 }) {
   const tableContainerRef = useRef(null);
   const [isLoadingMore, setIsLoadingMore] = useState(false);
@@ -66,9 +68,16 @@ export function BaseTable({
   const rows = table.getRowModel().rows;
   const headerGroups = table.getHeaderGroups();
   const hasData = rows.length > 0;
+  const hasEdits = Object.keys(editableConfig?.cellEdits ?? {}).length > 0;
+  const handleSubmitEdits = useCallback(async () => {
+    await editableConfig?.onSubmitEdits?.();
+    editableConfig?.clearEdits?.();
+  }, [editableConfig]);
   return /*#__PURE__*/React.createElement("div", {
+    className: classNames(styles.osdkTableWrapper, className)
+  }, /*#__PURE__*/React.createElement("div", {
     ref: tableContainerRef,
-    className: classNames(styles.osdkTableContainer, className),
+    className: classNames(styles.osdkTableContainer, editableConfig && styles.osdkTableContainerWithButton),
     onScroll: handleScroll
   }, /*#__PURE__*/React.createElement("table", null, isLoading && !hasData ? /*#__PURE__*/React.createElement(LoadingStateTable, {
     table: table,
@@ -90,6 +99,12 @@ export function BaseTable({
     message: "No Data"
   }), error != null && /*#__PURE__*/React.createElement(NonIdealState, {
     message: `Error Loading Data: ${error.message}`
-  }));
+  })), editableConfig && /*#__PURE__*/React.createElement("div", {
+    className: styles.submitButtonContainer
+  }, /*#__PURE__*/React.createElement(ActionButton, {
+    variant: "primary",
+    onClick: handleSubmitEdits,
+    disabled: !hasEdits
+  }, "Submit Edits")));
 }
 //# sourceMappingURL=Table.js.map

package/build/esm/object-table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","names":["classNames","React","useCallback","useEffect","useRef","useState","LoadingStateTable","NonIdealState","styles","TableBody","TableHeader","BaseTable","table","isLoading","fetchNextPage","onRowClick","rowHeight","renderCellContextMenu","className","error","headerMenuFeatureFlags","tableContainerRef","isLoadingMore","setIsLoadingMore","fetchingRef","fetchMoreOnEndReached","containerRefElement","current","scrollHeight","scrollTop","clientHeight","handleScroll","e","currentTarget","rows","getRowModel","headerGroups","getHeaderGroups","hasData","length","createElement","ref","osdkTableContainer","onScroll","Fragment","message"],"sources":["Table.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 { Cell, RowData, Table } from \"@tanstack/react-table\";\nimport classNames from \"classnames\";\nimport React, {\n  type ReactElement,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { LoadingStateTable } from \"./LoadingStateTable.js\";\nimport { NonIdealState } from \"./NonIdealState.js\";\nimport styles from \"./Table.module.css\";\nimport { TableBody } from \"./TableBody.js\";\nimport { TableHeader } from \"./TableHeader.js\";\nimport type { HeaderMenuFeatureFlags } from \"./TableHeaderWithPopover.js\";\n\ndeclare module \"@tanstack/react-table\" {\n  interface ColumnMeta<TData extends RowData, TValue> {\n    columnName?: string;\n    isVisible?: boolean;\n  }\n}\n\nexport interface BaseTableProps<\n  TData extends RowData,\n> {\n  table: Table<TData>;\n  isLoading?: boolean;\n  fetchNextPage?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n  rowHeight?: number;\n  renderCellContextMenu?: (\n    row: TData,\n    cell: Cell<TData, unknown>,\n  ) => React.ReactNode;\n  className?: string;\n  error?: Error;\n  headerMenuFeatureFlags?: HeaderMenuFeatureFlags;\n}\n\nexport function BaseTable<\n  TData extends RowData,\n>(\n  {\n    table,\n    isLoading,\n    fetchNextPage,\n    onRowClick,\n    rowHeight,\n    renderCellContextMenu,\n    className,\n    error,\n    headerMenuFeatureFlags,\n  }: BaseTableProps<TData>,\n): ReactElement {\n  const tableContainerRef = useRef<HTMLDivElement>(null);\n  const [isLoadingMore, setIsLoadingMore] = useState(false);\n\n  // Using a ref to prevent duplicate fetches from rapid scroll events while a fetch is in-flight\n  const fetchingRef = useRef(false);\n\n  useEffect(() => {\n    if (!isLoading || fetchNextPage == null) {\n      setIsLoadingMore(false);\n    }\n  }, [isLoading, fetchNextPage]);\n\n  const fetchMoreOnEndReached = useCallback(\n    async (containerRefElement?: HTMLDivElement | null) => {\n      if (containerRefElement && !fetchingRef.current && !isLoadingMore) {\n        const { scrollHeight, scrollTop, clientHeight } = containerRefElement;\n        if (\n          scrollHeight - scrollTop - clientHeight < 100\n          && !isLoading && fetchNextPage != null\n        ) {\n          fetchingRef.current = true;\n          setIsLoadingMore(true);\n          try {\n            await fetchNextPage();\n          } finally {\n            fetchingRef.current = false;\n          }\n        }\n      }\n    },\n    [fetchNextPage, isLoading, isLoadingMore],\n  );\n\n  const handleScroll = useCallback(\n    async (e: React.UIEvent<HTMLDivElement>) => {\n      await fetchMoreOnEndReached(e.currentTarget);\n    },\n    [fetchMoreOnEndReached],\n  );\n\n  const rows = table.getRowModel().rows;\n  const headerGroups = table.getHeaderGroups();\n  const hasData = rows.length > 0;\n\n  return (\n    <div\n      ref={tableContainerRef}\n      className={classNames(styles.osdkTableContainer, className)}\n      onScroll={handleScroll}\n    >\n      <table>\n        {isLoading && !hasData\n          ? (\n            <LoadingStateTable\n              table={table}\n              headerGroups={headerGroups}\n              rowHeight={rowHeight}\n              tableContainerRef={tableContainerRef}\n            />\n          )\n          : (\n            <>\n              <TableHeader\n                table={table}\n                headerMenuFeatureFlags={headerMenuFeatureFlags}\n              />\n              <TableBody\n                rows={rows}\n                tableContainerRef={tableContainerRef}\n                onRowClick={onRowClick}\n                rowHeight={rowHeight}\n                renderCellContextMenu={renderCellContextMenu}\n                isLoadingMore={isLoadingMore}\n                headerGroups={headerGroups}\n              />\n            </>\n          )}\n      </table>\n      {!hasData && error == null && <NonIdealState message={\"No Data\"} />}\n      {error != null && (\n        <NonIdealState message={`Error Loading Data: ${error.message}`} />\n      )}\n    </div>\n  );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA,OAAOA,UAAU,MAAM,YAAY;AACnC,OAAOC,KAAK,IAEVC,WAAW,EACXC,SAAS,EACTC,MAAM,EACNC,QAAQ,QACH,OAAO;AACd,SAASC,iBAAiB,QAAQ,wBAAwB;AAC1D,SAASC,aAAa,QAAQ,oBAAoB;AAClD,OAAOC,MAAM,MAAM,oBAAoB;AACvC,SAASC,SAAS,QAAQ,gBAAgB;AAC1C,SAASC,WAAW,QAAQ,kBAAkB;AA2B9C,OAAO,SAASC,SAASA,CAGvB;EACEC,KAAK;EACLC,SAAS;EACTC,aAAa;EACbC,UAAU;EACVC,SAAS;EACTC,qBAAqB;EACrBC,SAAS;EACTC,KAAK;EACLC;AACqB,CAAC,EACV;EACd,MAAMC,iBAAiB,GAAGjB,MAAM,CAAiB,IAAI,CAAC;EACtD,MAAM,CAACkB,aAAa,EAAEC,gBAAgB,CAAC,GAAGlB,QAAQ,CAAC,KAAK,CAAC;;EAEzD;EACA,MAAMmB,WAAW,GAAGpB,MAAM,CAAC,KAAK,CAAC;EAEjCD,SAAS,CAAC,MAAM;IACd,IAAI,CAACU,SAAS,IAAIC,aAAa,IAAI,IAAI,EAAE;MACvCS,gBAAgB,CAAC,KAAK,CAAC;IACzB;EACF,CAAC,EAAE,CAACV,SAAS,EAAEC,aAAa,CAAC,CAAC;EAE9B,MAAMW,qBAAqB,GAAGvB,WAAW,CACvC,MAAOwB,mBAA2C,IAAK;IACrD,IAAIA,mBAAmB,IAAI,CAACF,WAAW,CAACG,OAAO,IAAI,CAACL,aAAa,EAAE;MACjE,MAAM;QAAEM,YAAY;QAAEC,SAAS;QAAEC;MAAa,CAAC,GAAGJ,mBAAmB;MACrE,IACEE,YAAY,GAAGC,SAAS,GAAGC,YAAY,GAAG,GAAG,IAC1C,CAACjB,SAAS,IAAIC,aAAa,IAAI,IAAI,EACtC;QACAU,WAAW,CAACG,OAAO,GAAG,IAAI;QAC1BJ,gBAAgB,CAAC,IAAI,CAAC;QACtB,IAAI;UACF,MAAMT,aAAa,CAAC,CAAC;QACvB,CAAC,SAAS;UACRU,WAAW,CAACG,OAAO,GAAG,KAAK;QAC7B;MACF;IACF;EACF,CAAC,EACD,CAACb,aAAa,EAAED,SAAS,EAAES,aAAa,CAC1C,CAAC;EAED,MAAMS,YAAY,GAAG7B,WAAW,CAC9B,MAAO8B,CAAgC,IAAK;IAC1C,MAAMP,qBAAqB,CAACO,CAAC,CAACC,aAAa,CAAC;EAC9C,CAAC,EACD,CAACR,qBAAqB,CACxB,CAAC;EAED,MAAMS,IAAI,GAAGtB,KAAK,CAACuB,WAAW,CAAC,CAAC,CAACD,IAAI;EACrC,MAAME,YAAY,GAAGxB,KAAK,CAACyB,eAAe,CAAC,CAAC;EAC5C,MAAMC,OAAO,GAAGJ,IAAI,CAACK,MAAM,GAAG,CAAC;EAE/B,oBACEtC,KAAA,CAAAuC,aAAA;IACEC,GAAG,EAAEpB,iBAAkB;IACvBH,SAAS,EAAElB,UAAU,CAACQ,MAAM,CAACkC,kBAAkB,EAAExB,SAAS,CAAE;IAC5DyB,QAAQ,EAAEZ;EAAa,gBAEvB9B,KAAA,CAAAuC,aAAA,gBACG3B,SAAS,IAAI,CAACyB,OAAO,gBAElBrC,KAAA,CAAAuC,aAAA,CAAClC,iBAAiB;IAChBM,KAAK,EAAEA,KAAM;IACbwB,YAAY,EAAEA,YAAa;IAC3BpB,SAAS,EAAEA,SAAU;IACrBK,iBAAiB,EAAEA;EAAkB,CACtC,CAAC,gBAGFpB,KAAA,CAAAuC,aAAA,CAAAvC,KAAA,CAAA2C,QAAA,qBACE3C,KAAA,CAAAuC,aAAA,CAAC9B,WAAW;IACVE,KAAK,EAAEA,KAAM;IACbQ,sBAAsB,EAAEA;EAAuB,CAChD,CAAC,eACFnB,KAAA,CAAAuC,aAAA,CAAC/B,SAAS;IACRyB,IAAI,EAAEA,IAAK;IACXb,iBAAiB,EAAEA,iBAAkB;IACrCN,UAAU,EAAEA,UAAW;IACvBC,SAAS,EAAEA,SAAU;IACrBC,qBAAqB,EAAEA,qBAAsB;IAC7CK,aAAa,EAAEA,aAAc;IAC7Bc,YAAY,EAAEA;EAAa,CAC5B,CACD,CAED,CAAC,EACP,CAACE,OAAO,IAAInB,KAAK,IAAI,IAAI,iBAAIlB,KAAA,CAAAuC,aAAA,CAACjC,aAAa;IAACsC,OAAO,EAAE;EAAU,CAAE,CAAC,EAClE1B,KAAK,IAAI,IAAI,iBACZlB,KAAA,CAAAuC,aAAA,CAACjC,aAAa;IAACsC,OAAO,EAAE,uBAAuB1B,KAAK,CAAC0B,OAAO;EAAG,CAAE,CAEhE,CAAC;AAEV","ignoreList":[]}
+{"version":3,"file":"Table.js","names":["classNames","React","useCallback","useEffect","useRef","useState","ActionButton","LoadingStateTable","NonIdealState","styles","TableBody","TableHeader","BaseTable","table","isLoading","fetchNextPage","onRowClick","rowHeight","renderCellContextMenu","className","error","headerMenuFeatureFlags","editableConfig","tableContainerRef","isLoadingMore","setIsLoadingMore","fetchingRef","fetchMoreOnEndReached","containerRefElement","current","scrollHeight","scrollTop","clientHeight","handleScroll","e","currentTarget","rows","getRowModel","headerGroups","getHeaderGroups","hasData","length","hasEdits","Object","keys","cellEdits","handleSubmitEdits","onSubmitEdits","clearEdits","createElement","osdkTableWrapper","ref","osdkTableContainer","osdkTableContainerWithButton","onScroll","Fragment","message","submitButtonContainer","variant","onClick","disabled"],"sources":["Table.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 { Cell, RowData, Table } from \"@tanstack/react-table\";\nimport classNames from \"classnames\";\nimport React, {\n  type ReactElement,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { ActionButton } from \"../base-components/action-button/ActionButton.js\";\nimport { LoadingStateTable } from \"./LoadingStateTable.js\";\nimport { NonIdealState } from \"./NonIdealState.js\";\nimport styles from \"./Table.module.css\";\nimport { TableBody } from \"./TableBody.js\";\nimport { TableHeader } from \"./TableHeader.js\";\nimport type { HeaderMenuFeatureFlags } from \"./TableHeaderWithPopover.js\";\nimport type { CellValueState } from \"./utils/types.js\";\n\ndeclare module \"@tanstack/react-table\" {\n  interface ColumnMeta<TData extends RowData = unknown, TValue = unknown> {\n    columnName?: string;\n    isVisible?: boolean;\n    editable?: boolean;\n    dataType?: string;\n  }\n  interface TableMeta<TData extends RowData = unknown> {\n    onCellEdit?: (\n      cellId: string,\n      state: CellValueState,\n    ) => void;\n    cellEdits?: Record<string, CellValueState>;\n  }\n}\n\ninterface EditableConfig {\n  onSubmitEdits?: () => Promise<void>;\n  clearEdits?: () => void;\n  cellEdits?: Record<string, CellValueState>;\n}\n\nexport interface BaseTableProps<\n  TData extends RowData,\n> {\n  table: Table<TData>;\n  isLoading?: boolean;\n  fetchNextPage?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n  rowHeight?: number;\n  renderCellContextMenu?: (\n    row: TData,\n    cell: Cell<TData, unknown>,\n  ) => React.ReactNode;\n  className?: string;\n  error?: Error;\n  headerMenuFeatureFlags?: HeaderMenuFeatureFlags;\n  editableConfig?: EditableConfig;\n}\n\nexport function BaseTable<\n  TData extends RowData,\n>(\n  {\n    table,\n    isLoading,\n    fetchNextPage,\n    onRowClick,\n    rowHeight,\n    renderCellContextMenu,\n    className,\n    error,\n    headerMenuFeatureFlags,\n    editableConfig,\n  }: BaseTableProps<TData>,\n): ReactElement {\n  const tableContainerRef = useRef<HTMLDivElement>(null);\n  const [isLoadingMore, setIsLoadingMore] = useState(false);\n\n  // Using a ref to prevent duplicate fetches from rapid scroll events while a fetch is in-flight\n  const fetchingRef = useRef(false);\n\n  useEffect(() => {\n    if (!isLoading || fetchNextPage == null) {\n      setIsLoadingMore(false);\n    }\n  }, [isLoading, fetchNextPage]);\n\n  const fetchMoreOnEndReached = useCallback(\n    async (containerRefElement?: HTMLDivElement | null) => {\n      if (containerRefElement && !fetchingRef.current && !isLoadingMore) {\n        const { scrollHeight, scrollTop, clientHeight } = containerRefElement;\n        if (\n          scrollHeight - scrollTop - clientHeight < 100\n          && !isLoading && fetchNextPage != null\n        ) {\n          fetchingRef.current = true;\n          setIsLoadingMore(true);\n          try {\n            await fetchNextPage();\n          } finally {\n            fetchingRef.current = false;\n          }\n        }\n      }\n    },\n    [fetchNextPage, isLoading, isLoadingMore],\n  );\n\n  const handleScroll = useCallback(\n    async (e: React.UIEvent<HTMLDivElement>) => {\n      await fetchMoreOnEndReached(e.currentTarget);\n    },\n    [fetchMoreOnEndReached],\n  );\n\n  const rows = table.getRowModel().rows;\n  const headerGroups = table.getHeaderGroups();\n  const hasData = rows.length > 0;\n  const hasEdits = Object.keys(editableConfig?.cellEdits ?? {}).length > 0;\n\n  const handleSubmitEdits = useCallback(async () => {\n    await editableConfig?.onSubmitEdits?.();\n    editableConfig?.clearEdits?.();\n  }, [editableConfig]);\n\n  return (\n    <div className={classNames(styles.osdkTableWrapper, className)}>\n      <div\n        ref={tableContainerRef}\n        className={classNames(\n          styles.osdkTableContainer,\n          editableConfig && styles.osdkTableContainerWithButton,\n        )}\n        onScroll={handleScroll}\n      >\n        <table>\n          {isLoading && !hasData\n            ? (\n              <LoadingStateTable\n                table={table}\n                headerGroups={headerGroups}\n                rowHeight={rowHeight}\n                tableContainerRef={tableContainerRef}\n              />\n            )\n            : (\n              <>\n                <TableHeader\n                  table={table}\n                  headerMenuFeatureFlags={headerMenuFeatureFlags}\n                />\n                <TableBody\n                  rows={rows}\n                  tableContainerRef={tableContainerRef}\n                  onRowClick={onRowClick}\n                  rowHeight={rowHeight}\n                  renderCellContextMenu={renderCellContextMenu}\n                  isLoadingMore={isLoadingMore}\n                  headerGroups={headerGroups}\n                />\n              </>\n            )}\n        </table>\n        {!hasData && error == null && <NonIdealState message={\"No Data\"} />}\n        {error != null && (\n          <NonIdealState message={`Error Loading Data: ${error.message}`} />\n        )}\n      </div>\n      {editableConfig && (\n        <div className={styles.submitButtonContainer}>\n          <ActionButton\n            variant=\"primary\"\n            onClick={handleSubmitEdits}\n            disabled={!hasEdits}\n          >\n            Submit Edits\n          </ActionButton>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/build/esm/object-table/Table.module.css

@@ -14,9 +14,15 @@
  * limitations under the License.
  */
 
+.osdkTableWrapper {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  position: relative;
+}
+
 .osdkTableContainer {
   flex: 1;
-  height: 100%;
   min-height: 0;
   overflow: auto;
   position: relative;
@@ -26,4 +32,14 @@
   border-collapse: collapse;
   display: grid;
   table-layout: fixed;
+  width: max-content;
+  min-width: 100%;
+}
+
+.submitButtonContainer {
+  background-color: var(--osdk-surface-background-color-default-rest);
+  border-top: var(--osdk-table-border);
+  padding: var(--osdk-table-button-container-padding);
+  display: flex;
+  justify-content: flex-end;
 }

package/build/esm/object-table/TableBody.module.css

@@ -17,4 +17,6 @@
 .osdkTableBody {
   display: grid;
   position: relative;
+  width: max-content;
+  min-width: 100%;
 }

package/build/esm/object-table/TableCell.module.css

@@ -48,7 +48,9 @@
 }
 
 /* First right-pinned column - no right-pinned siblings before it */
-.osdkTableCell[data-pinned="right"]:not(:has(~ [data-pinned="right"]):nth-child(n+2)) {
+.osdkTableCell[data-pinned="right"]:not(
+    :has(~ [data-pinned="right"]):nth-child(n + 2)
+  ) {
   border-left: var(--osdk-table-pinned-column-border);
 }
 
@@ -57,6 +59,14 @@
   padding: 0;
 }
 
+/* Show focus state for editable cells */
+.osdkTableCell:not(:has([role="checkbox"])):has(input):focus-within {
+  border: var(--osdk-emphasis-focus-width) solid
+    var(--osdk-emphasis-focus-color);
+  border-radius: var(--osdk-surface-border-radius);
+  background-color: var(--osdk-table-cell-editable-bg);
+}
+
 .osdkTableCellContent:not(:has([role="checkbox"])) {
   overflow: hidden;
   text-overflow: ellipsis;

package/build/esm/object-table/TableHeader.module.css

@@ -18,7 +18,8 @@
   display: grid;
   position: sticky;
   top: 0;
-  width: 100%;
+  width: max-content;
+  min-width: 100%;
   height: var(--osdk-table-header-height);
   z-index: var(--osdk-surface-z-index-1);
   background-color: var(--osdk-table-header-bg);
@@ -31,7 +32,8 @@
 
 .osdkTableHeaderRow {
   display: flex;
-  width: 100%;
+  width: max-content;
+  min-width: 100%;
   border-bottom: var(--osdk-table-border);
 }
 

package/build/esm/object-table/TableRow.module.css

@@ -17,6 +17,8 @@
 .osdkTableRow {
   position: absolute;
   display: flex;
+  width: max-content;
+  min-width: 100%;
   background-color: var(--osdk-table-row-bg-default);
   border-top: var(--osdk-table-row-divider);
   border-bottom: var(--osdk-table-border-width) solid transparent;