@osdk/react-components 0.2.0-beta.1 → 0.2.0-beta.2

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.
Files changed (44) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/README.md +21 -5
  3. package/build/browser/base-components/checkbox/Checkbox.js +27 -32
  4. package/build/browser/base-components/checkbox/Checkbox.module.css +79 -0
  5. package/build/browser/base-components/checkbox/Checkbox.module.css.js +7 -0
  6. package/build/browser/object-table/CellContextMenu.js +23 -20
  7. package/build/browser/object-table/CellContextMenu.module.css +20 -0
  8. package/build/browser/object-table/CellContextMenu.module.css.js +6 -0
  9. package/build/browser/object-table/LoadingCell.js +24 -29
  10. package/build/browser/object-table/LoadingCell.module.css +48 -0
  11. package/build/browser/object-table/LoadingCell.module.css.js +8 -0
  12. package/build/browser/object-table/LoadingRow.js +24 -50
  13. package/build/browser/object-table/LoadingStateTable.js +46 -340
  14. package/build/browser/object-table/NonIdealState.js +23 -20
  15. package/build/browser/object-table/NonIdealState.module.css +28 -0
  16. package/build/browser/object-table/NonIdealState.module.css.js +7 -0
  17. package/build/browser/object-table/Table.js +51 -933
  18. package/build/browser/object-table/Table.js.map +1 -1
  19. package/build/browser/object-table/Table.module.css +22 -0
  20. package/build/browser/object-table/Table.module.css.js +6 -0
  21. package/build/browser/object-table/TableBody.js +36 -260
  22. package/build/browser/object-table/TableBody.module.css +20 -0
  23. package/build/browser/object-table/TableBody.module.css.js +6 -0
  24. package/build/browser/object-table/TableCell.js +31 -111
  25. package/build/browser/object-table/TableCell.module.css +62 -0
  26. package/build/browser/object-table/TableCell.module.css.js +7 -0
  27. package/build/browser/object-table/TableHeader.js +38 -215
  28. package/build/browser/object-table/TableHeader.module.css +101 -0
  29. package/build/browser/object-table/TableHeader.module.css.js +10 -0
  30. package/build/browser/object-table/TableHeaderContent.js +21 -18
  31. package/build/browser/object-table/TableHeaderContent.module.css +30 -0
  32. package/build/browser/object-table/TableHeaderContent.module.css.js +6 -0
  33. package/build/browser/object-table/TableHeaderWithPopover.js +66 -80
  34. package/build/browser/object-table/TableHeaderWithPopover.module.css +110 -0
  35. package/build/browser/object-table/TableHeaderWithPopover.module.css.js +15 -0
  36. package/build/browser/object-table/TableRow.js +26 -144
  37. package/build/browser/object-table/TableRow.module.css +60 -0
  38. package/build/browser/object-table/TableRow.module.css.js +6 -0
  39. package/build/browser/styles.css +615 -0
  40. package/build/cjs/public/experimental.cjs +5 -5
  41. package/build/cjs/public/experimental.cjs.map +1 -1
  42. package/build/esm/object-table/Table.js +5 -5
  43. package/build/esm/object-table/Table.js.map +1 -1
  44. package/package.json +9 -6
@@ -1,338 +1,44 @@
1
- // build/browser/object-table/LoadingStateTable.js
2
- import classNames3 from "classnames";
3
- import React6, { useEffect, useRef, useState as useState2 } from "react";
1
+ /*
2
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
3
+ *
4
+ * Licensed under the Apache License, Version 2.0 (the "License");
5
+ * you may not use this file except in compliance with the License.
6
+ * You may obtain a copy of the License at
7
+ *
8
+ * http://www.apache.org/licenses/LICENSE-2.0
9
+ *
10
+ * Unless required by applicable law or agreed to in writing, software
11
+ * distributed under the License is distributed on an "AS IS" BASIS,
12
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
+ * See the License for the specific language governing permissions and
14
+ * limitations under the License.
15
+ */
4
16
 
5
- // build/browser/object-table/LoadingCell.module.css
6
- var css = '/*\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\n.osdkLoadingCell {\n height: var(--osdk-table-cell-fontSize);\n border-radius: calc(var(--osdk-surface-border-radius) * 0.5);\n flex: 1;\n}\n\n/* Blueprint skeleton animation keyframes */\n@keyframes skeleton-glow {\n from {\n background: var(--osdk-table-skeleton-color-from);\n border-color: var(--osdk-table-skeleton-color-from);\n }\n\n to {\n background: var(--osdk-table-skeleton-color-to);\n border-color: var(--osdk-table-skeleton-color-to);\n }\n}\n\n.osdkCellSkeleton {\n animation: 1000ms linear infinite alternate skeleton-glow;\n background: var(--osdk-table-skeleton-color-from);\n background-clip: padding-box;\n border-color: var(--osdk-table-skeleton-color-from);\n border-radius: calc(var(--osdk-surface-border-radius) * 0.5);\n border: 1px solid var(--osdk-table-skeleton-border-color);\n box-shadow: none;\n color: transparent;\n cursor: default;\n pointer-events: none;\n user-select: none;\n}\n';
7
- if (typeof document !== "undefined") {
8
- const style = document.createElement("style");
9
- style.textContent = css;
10
- document.head.appendChild(style);
11
- }
12
- var LoadingCell_default = { "osdkLoadingCell": "osdkLoadingCell", "osdkCellSkeleton": "osdkCellSkeleton" };
13
-
14
- // build/browser/object-table/LoadingRow.js
15
- import React2 from "react";
16
17
  import classNames from "classnames";
17
- import React from "react";
18
- var css2 = '/*\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\n.osdkLoadingCell {\n height: var(--osdk-table-cell-fontSize);\n border-radius: calc(var(--osdk-surface-border-radius) * 0.5);\n flex: 1;\n}\n\n/* Blueprint skeleton animation keyframes */\n@keyframes skeleton-glow {\n from {\n background: var(--osdk-table-skeleton-color-from);\n border-color: var(--osdk-table-skeleton-color-from);\n }\n\n to {\n background: var(--osdk-table-skeleton-color-to);\n border-color: var(--osdk-table-skeleton-color-to);\n }\n}\n\n.osdkCellSkeleton {\n animation: 1000ms linear infinite alternate skeleton-glow;\n background: var(--osdk-table-skeleton-color-from);\n background-clip: padding-box;\n border-color: var(--osdk-table-skeleton-color-from);\n border-radius: calc(var(--osdk-surface-border-radius) * 0.5);\n border: 1px solid var(--osdk-table-skeleton-border-color);\n box-shadow: none;\n color: transparent;\n cursor: default;\n pointer-events: none;\n user-select: none;\n}\n';
19
- if (typeof document !== "undefined") {
20
- const style = document.createElement("style");
21
- style.textContent = css2;
22
- document.head.appendChild(style);
23
- }
24
- var LoadingCell_default2 = { "osdkLoadingCell": "osdkLoadingCell", "osdkCellSkeleton": "osdkCellSkeleton" };
25
- var css22 = '/*\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\n.osdkTableCell {\n display: flex;\n align-items: center;\n text-align: left;\n position: relative;\n padding: var(--osdk-table-cell-padding);\n font-size: var(--osdk-table-cell-fontSize);\n color: var(--osdk-table-cell-color);\n background-color: inherit;\n border-right: var(--osdk-table-cell-divider);\n\n &:first-child {\n border-left: var(--osdk-table-border);\n }\n\n &:last-child {\n border-right: var(--osdk-table-border);\n }\n}\n\n.osdkTableCell[data-pinned="left"],\n.osdkTableCell[data-pinned="right"] {\n position: sticky;\n z-index: var(--osdk-surface-z-index-1);\n}\n\n/* Last left-pinned column - no left-pinned siblings after it */\n.osdkTableCell[data-pinned="left"]:not(:has(~ [data-pinned="left"])) {\n border-right: var(--osdk-table-pinned-column-border);\n}\n\n/* First right-pinned column - no right-pinned siblings before it */\n.osdkTableCell[data-pinned="right"]:not(:has(~ [data-pinned="right"]):nth-child(n+2)) {\n border-left: var(--osdk-table-pinned-column-border);\n}\n\n.osdkTableCell:has([role="checkbox"]) {\n justify-content: center;\n}\n\n.osdkTableCellContent:not(:has([role="checkbox"])) {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n text-align: left;\n}\n';
26
- if (typeof document !== "undefined") {
27
- const style = document.createElement("style");
28
- style.textContent = css22;
29
- document.head.appendChild(style);
30
- }
31
- var TableCell_default = { "osdkTableCell": "osdkTableCell", "osdkTableCellContent": "osdkTableCellContent" };
32
- function LoadingCell({
33
- width
34
- }) {
35
- return /* @__PURE__ */ React.createElement("td", {
36
- className: TableCell_default.osdkTableCell,
37
- style: {
38
- width
39
- }
40
- }, /* @__PURE__ */ React.createElement("div", {
41
- className: classNames(LoadingCell_default2.osdkLoadingCell, LoadingCell_default2.osdkCellSkeleton)
42
- }));
43
- }
44
- var css3 = '/*\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\n.osdkTableRow {\n position: absolute;\n display: flex;\n background-color: var(--osdk-table-row-bg-default);\n border-top: var(--osdk-table-row-divider);\n border-bottom: var(--osdk-table-border-width) solid transparent;\n\n &:last-child {\n border-bottom: var(--osdk-table-border);\n }\n\n /* Zebra rows */\n &:nth-child(even) {\n background-color: var(\n --osdk-table-row-bg-alternate,\n var(--osdk-table-row-bg-default)\n );\n }\n\n &:hover {\n z-index: 1;\n background-color: var(\n --osdk-table-row-bg-hover,\n var(--osdk-surface-background-color-default-hover)\n );\n border-top-color: var(--osdk-table-row-border-color-hover);\n border-bottom-color: var(--osdk-table-row-border-color-hover);\n }\n\n &[data-selected="true"] {\n z-index: 2;\n background-color: var(--osdk-table-row-bg-active);\n border-top-color: var(--osdk-table-row-border-color-active);\n border-bottom-color: var(--osdk-table-row-border-color-active);\n }\n\n &[data-selected="true"] + &[data-selected="true"] {\n border-top-color: transparent;\n }\n\n &[data-selected="true"]:has(+ &[data-selected="true"]) {\n border-bottom-color: transparent;\n }\n}\n';
45
- if (typeof document !== "undefined") {
46
- const style = document.createElement("style");
47
- style.textContent = css3;
48
- document.head.appendChild(style);
49
- }
50
- var TableRow_default = { "osdkTableRow": "osdkTableRow" };
51
- function LoadingRow({
52
- headers,
53
- columnCount,
54
- translateY,
55
- rowHeight = 40,
56
- columnWidth = 80
57
- }) {
58
- return /* @__PURE__ */ React2.createElement("tr", {
59
- className: TableRow_default.osdkTableRow,
60
- style: {
61
- height: `${rowHeight}px`,
62
- transform: `translateY(${translateY}px)`
63
- }
64
- }, /* @__PURE__ */ React2.createElement(React2.Fragment, null, Array.from({
65
- length: columnCount
66
- }).map((_, index) => {
67
- const width = headers.length > index ? headers[index].getSize() : columnWidth;
68
- return /* @__PURE__ */ React2.createElement(LoadingCell, {
69
- key: `loading-cell-${index}`,
70
- width
71
- });
72
- })));
73
- }
74
-
75
- // build/browser/object-table/TableBody.module.css
76
- var css4 = '/*\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\n.osdkTableBody {\n display: grid;\n position: relative;\n}\n';
77
- if (typeof document !== "undefined") {
78
- const style = document.createElement("style");
79
- style.textContent = css4;
80
- document.head.appendChild(style);
81
- }
82
- var TableBody_default = { "osdkTableBody": "osdkTableBody" };
83
-
84
- // build/browser/object-table/TableHeader.js
85
- import React5 from "react";
86
-
87
- // build/browser/object-table/TableHeader.module.css
88
- var css5 = '/*\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\n.osdkTableHeader {\n display: grid;\n position: sticky;\n top: 0;\n z-index: var(--osdk-surface-z-index-1);\n background-color: var(--osdk-table-header-bg);\n}\n\n.osdkTableHeader[data-resizing="true"] {\n cursor: col-resize;\n user-select: none;\n}\n\n.osdkTableHeaderRow {\n display: flex;\n}\n\n.osdkTableHeaderCell {\n display: flex;\n align-items: center;\n text-align: left;\n position: relative;\n padding: var(--osdk-table-cell-padding);\n font-weight: var(--osdk-table-header-fontWeight);\n font-size: var(--osdk-table-header-fontSize);\n color: var(--osdk-table-header-color);\n border-top: var(--osdk-table-border);\n border-right: var(--osdk-table-header-divider);\n background-color: inherit;\n\n &:first-child {\n border-left: var(--osdk-table-border);\n }\n\n &:last-child {\n border-right: var(--osdk-table-border);\n }\n}\n\n.osdkTableHeaderCell[data-pinned="left"],\n.osdkTableHeaderCell[data-pinned="right"] {\n position: sticky;\n z-index: var(--osdk-surface-z-index-2);\n}\n\n/* Last left-pinned column - no left-pinned siblings after it */\n.osdkTableHeaderCell[data-pinned="left"]:not(:has(~ [data-pinned="left"])) {\n border-right: var(--osdk-table-pinned-column-border);\n}\n\n/* First right-pinned column - no right-pinned siblings before it */\n.osdkTableHeaderCell[data-pinned="right"]:not(\n :has(~ [data-pinned="right"]):nth-child(n + 2)\n ) {\n border-left: var(--osdk-table-pinned-column-border);\n}\n\n.osdkTableHeaderCell:has([role="checkbox"]) {\n justify-content: center;\n}\n\n.osdkTableHeaderResizer {\n background: none;\n cursor: col-resize;\n height: 100%;\n position: absolute;\n right: calc(-1 * var(--osdk-table-border-width));\n top: 0;\n touch-action: none;\n width: 3px;\n z-index: var(--osdk-surface-z-index-2);\n\n &:hover {\n background: var(--osdk-intent-primary-hover);\n }\n\n &:active {\n background: var(--osdk-intent-primary-active);\n }\n}\n\n.osdkLoadingHeaderCell {\n height: var(--osdk-table-header-fontSize);\n flex: 1;\n}\n';
89
- if (typeof document !== "undefined") {
90
- const style = document.createElement("style");
91
- style.textContent = css5;
92
- document.head.appendChild(style);
93
- }
94
- var TableHeader_default = { "osdkTableHeader": "osdkTableHeader", "osdkTableHeaderRow": "osdkTableHeaderRow", "osdkTableHeaderCell": "osdkTableHeaderCell", "osdkTableHeaderResizer": "osdkTableHeaderResizer", "osdkLoadingHeaderCell": "osdkLoadingHeaderCell" };
95
-
96
- // build/browser/object-table/TableHeaderContent.js
97
- import { flexRender } from "@tanstack/react-table";
98
- import React3 from "react";
99
-
100
- // build/browser/object-table/TableHeaderContent.module.css
101
- var css6 = '/*\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\n.osdkHeaderContent {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n text-align: left;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.osdkHeaderContent:has([role="checkbox"]) {\n display: flex;\n justify-content: center;\n}\n';
102
- if (typeof document !== "undefined") {
103
- const style = document.createElement("style");
104
- style.textContent = css6;
105
- document.head.appendChild(style);
106
- }
107
- var TableHeaderContent_default = { "osdkHeaderContent": "osdkHeaderContent" };
108
-
109
- // build/browser/object-table/TableHeaderContent.js
110
- function TableHeaderContent({
111
- header
112
- }) {
113
- return /* @__PURE__ */ React3.createElement("div", {
114
- className: TableHeaderContent_default.osdkHeaderContent
115
- }, flexRender(header.column.columnDef.header, header.getContext()));
116
- }
117
-
118
- // build/browser/object-table/TableHeaderWithPopover.js
119
- import { Menu } from "@base-ui/react/menu";
120
- import { ChevronDown, Pin, Remove, SortAlphabetical, SortAlphabeticalDesc, Unpin, VerticalDistribution } from "@blueprintjs/icons";
121
- import classNames2 from "classnames";
122
- import React4, { useCallback, useState } from "react";
123
-
124
- // build/browser/object-table/TableHeaderWithPopover.module.css
125
- var css7 = '/*\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\n.osdkCenterContainer {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.osdkContentGap {\n display: flex;\n gap: var(--osdk-surface-spacing);\n}\n\n.osdkHeaderContainer {\n justify-content: space-between;\n flex: 1;\n min-width: 0;\n align-self: stretch;\n}\n\n.osdkHeaderContentLeft {\n min-width: 0;\n flex-shrink: 1;\n}\n\n.osdkHeaderContentRight {\n flex-shrink: 0;\n}\n\n.osdkHeaderPopoverTrigger {\n padding: 0;\n flex-shrink: 0;\n flex-grow: 0;\n border: var(--osdk-surface-border-width) solid\n var(--osdk-surface-border-color-default);\n border-radius: var(--osdk-surface-border-radius);\n color: var(--osdk-intent-default-foreground);\n user-select: none;\n outline: none;\n\n &:hover {\n background-color: var(--osdk-intent-default-hover);\n }\n\n &[data-popup-open] {\n background-color: var(--osdk-intent-primary-rest);\n }\n\n &:focus-visible {\n outline: var(--osdk-focus-visible-outline);\n outline-offset: var(--osdk-focus-visible-outline-offset);\n }\n}\n\n.osdkHeaderIcon {\n width: var(--osdk-iconography-size-small);\n height: var(--osdk-iconography-size-small);\n}\n\n.osdkHeaderPopup {\n box-sizing: border-box;\n padding: var(--osdk-surface-spacing);\n border-radius: var(--osdk-surface-border-radius);\n border: var(--osdk-surface-border-width) solid\n var(--osdk-surface-border-color-default);\n background-color: var(--osdk-surface-background-color-default);\n color: var(--osdk-typography-color-default-rest);\n box-shadow: var(--osdk-surface-shadow-2);\n font-size: var(--osdk-typography-size-body-medium);\n outline: none;\n}\n\n.osdkHeaderMenuItem {\n justify-content: flex-start;\n padding: var(--osdk-surface-spacing);\n cursor: pointer;\n}\n\n.osdkHeaderMenuItem:hover {\n outline: none;\n background-color: var(--osdk-surface-background-color-default-hover);\n border-radius: var(--osdk-surface-border-radius);\n}\n\n.osdkHeaderActiveMenuItem {\n background-color: var(--osdk-intent-primary-rest);\n color: var(--osdk-intent-primary-foreground);\n}\n\n.osdkHeaderActiveMenuItem:hover {\n background-color: var(--osdk-intent-primary-hover);\n}\n\n.osdkHeaderActiveMenuItem:active {\n background-color: var(--osdk-intent-primary-active);\n}\n';
126
- if (typeof document !== "undefined") {
127
- const style = document.createElement("style");
128
- style.textContent = css7;
129
- document.head.appendChild(style);
130
- }
131
- var TableHeaderWithPopover_default = { "osdkCenterContainer": "osdkCenterContainer", "osdkContentGap": "osdkContentGap", "osdkHeaderContainer": "osdkHeaderContainer", "osdkHeaderContentLeft": "osdkHeaderContentLeft", "osdkHeaderContentRight": "osdkHeaderContentRight", "osdkHeaderPopoverTrigger": "osdkHeaderPopoverTrigger", "osdkHeaderIcon": "osdkHeaderIcon", "osdkHeaderPopup": "osdkHeaderPopup", "osdkHeaderMenuItem": "osdkHeaderMenuItem", "osdkHeaderActiveMenuItem": "osdkHeaderActiveMenuItem" };
132
-
133
- // build/browser/object-table/TableHeaderWithPopover.js
134
- function HeaderMenuItem({
135
- onClick,
136
- icon: Icon,
137
- label,
138
- active = false
139
- }) {
140
- return /* @__PURE__ */ React4.createElement(Menu.Item, {
141
- closeOnClick: true,
142
- className: classNames2(TableHeaderWithPopover_default.osdkCenterContainer, TableHeaderWithPopover_default.osdkContentGap, TableHeaderWithPopover_default.osdkHeaderMenuItem, active && TableHeaderWithPopover_default.osdkHeaderActiveMenuItem),
143
- onClick
144
- }, /* @__PURE__ */ React4.createElement(Icon, {
145
- className: TableHeaderWithPopover_default.osdkHeaderIcon,
146
- color: "currentColor"
147
- }), /* @__PURE__ */ React4.createElement("span", null, label));
148
- }
149
- function TableHeaderWithPopover({
150
- header,
151
- isColumnPinned,
152
- setColumnPinning,
153
- onSortChange,
154
- onResetSize
155
- }) {
156
- const [isOpen, setIsOpen] = useState(false);
157
- const handlePinLeft = useCallback(() => {
158
- setColumnPinning((prev) => {
159
- return {
160
- left: [...prev.left || [], header.column.id],
161
- right: prev.right?.filter((id) => id !== header.column.id) || []
162
- };
163
- });
164
- }, [header.column.id, setColumnPinning]);
165
- const handleUnpin = useCallback(() => {
166
- setColumnPinning((prev) => {
167
- return {
168
- left: prev.left?.filter((id) => id !== header.column.id) || [],
169
- right: prev.right?.filter((id) => id !== header.column.id) || []
170
- };
171
- });
172
- }, [header.column.id, setColumnPinning]);
173
- const handleSortAscending = useCallback(() => {
174
- header.column.toggleSorting(false);
175
- onSortChange?.([{
176
- id: header.column.id,
177
- desc: false
178
- }]);
179
- }, [header.column, onSortChange]);
180
- const handleSortDescending = useCallback(() => {
181
- header.column.toggleSorting(true);
182
- onSortChange?.([{
183
- id: header.column.id,
184
- desc: true
185
- }]);
186
- }, [header.column, onSortChange]);
187
- const handleClearAllSorts = useCallback(() => {
188
- header.column.clearSorting();
189
- onSortChange?.([]);
190
- }, [header.column, onSortChange]);
191
- const handleResetSize = useCallback(() => {
192
- header.column.resetSize();
193
- if (onResetSize) {
194
- onResetSize();
195
- }
196
- }, [header.column, onResetSize]);
197
- const handleInteraction = useCallback((e) => {
198
- e.preventDefault();
199
- setIsOpen((prev) => !prev);
200
- }, []);
201
- const isSorted = header.column.getIsSorted();
202
- const isSortable = header.column.getCanSort();
203
- return /* @__PURE__ */ React4.createElement(Menu.Root, {
204
- open: isOpen,
205
- onOpenChange: setIsOpen
206
- }, /* @__PURE__ */ React4.createElement("div", {
207
- className: classNames2(TableHeaderWithPopover_default.osdkCenterContainer, TableHeaderWithPopover_default.osdkContentGap, TableHeaderWithPopover_default.osdkHeaderContainer),
208
- onContextMenu: handleInteraction
209
- }, /* @__PURE__ */ React4.createElement("div", {
210
- className: classNames2(TableHeaderWithPopover_default.osdkCenterContainer, TableHeaderWithPopover_default.osdkContentGap, TableHeaderWithPopover_default.osdkHeaderContentLeft)
211
- }, isColumnPinned && /* @__PURE__ */ React4.createElement(Pin, {
212
- className: TableHeaderWithPopover_default.osdkHeaderIcon,
213
- color: "currentColor"
214
- }), /* @__PURE__ */ React4.createElement(TableHeaderContent, {
215
- header
216
- })), /* @__PURE__ */ React4.createElement("div", {
217
- className: classNames2(TableHeaderWithPopover_default.osdkCenterContainer, TableHeaderWithPopover_default.osdkContentGap, TableHeaderWithPopover_default.osdkHeaderContentRight)
218
- }, isSorted && /* @__PURE__ */ React4.createElement("div", {
219
- className: TableHeaderWithPopover_default.osdkCenterContainer
220
- }, isSorted === "asc" ? /* @__PURE__ */ React4.createElement(SortAlphabetical, {
221
- className: TableHeaderWithPopover_default.osdkHeaderIcon,
222
- color: "currentColor"
223
- }) : /* @__PURE__ */ React4.createElement(SortAlphabeticalDesc, {
224
- className: TableHeaderWithPopover_default.osdkHeaderIcon,
225
- color: "currentColor"
226
- })), /* @__PURE__ */ React4.createElement(Menu.Trigger, {
227
- "aria-label": `Open header menu for column with id=${header.column.id}`,
228
- className: classNames2(TableHeaderWithPopover_default.osdkCenterContainer, TableHeaderWithPopover_default.osdkHeaderPopoverTrigger)
229
- }, /* @__PURE__ */ React4.createElement(ChevronDown, {
230
- className: TableHeaderWithPopover_default.osdkHeaderIcon
231
- }))), /* @__PURE__ */ React4.createElement(Menu.Portal, {
232
- container: document.body
233
- }, /* @__PURE__ */ React4.createElement(Menu.Positioner, {
234
- sideOffset: 4
235
- }, /* @__PURE__ */ React4.createElement(Menu.Popup, {
236
- className: TableHeaderWithPopover_default.osdkHeaderPopup
237
- }, !isColumnPinned && /* @__PURE__ */ React4.createElement(HeaderMenuItem, {
238
- onClick: handlePinLeft,
239
- icon: Pin,
240
- label: "Pin column"
241
- }), isColumnPinned && /* @__PURE__ */ React4.createElement(HeaderMenuItem, {
242
- onClick: handleUnpin,
243
- icon: Unpin,
244
- label: "Unpin Column",
245
- active: true
246
- }), isSortable && /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(HeaderMenuItem, {
247
- onClick: handleSortAscending,
248
- icon: SortAlphabetical,
249
- label: "Sort ascending",
250
- active: isSorted === "asc"
251
- }), /* @__PURE__ */ React4.createElement(HeaderMenuItem, {
252
- onClick: handleSortDescending,
253
- icon: SortAlphabeticalDesc,
254
- label: "Sort descending",
255
- active: isSorted === "desc"
256
- })), !!isSorted && /* @__PURE__ */ React4.createElement(HeaderMenuItem, {
257
- onClick: handleClearAllSorts,
258
- icon: Remove,
259
- label: "Clear all sorts"
260
- }), /* @__PURE__ */ React4.createElement(HeaderMenuItem, {
261
- onClick: handleResetSize,
262
- icon: VerticalDistribution,
263
- label: "Reset Column Size"
264
- }))))));
265
- }
266
-
267
- // build/browser/object-table/utils/constants.js
268
- var SELECTION_COLUMN_ID = "__selection__";
269
-
270
- // build/browser/object-table/utils/getColumnPinningStyles.js
271
- function getColumnPinningStyles(column) {
272
- const isPinned = column.getIsPinned();
273
- return {
274
- columnStyles: {
275
- left: isPinned === "left" ? `${column.getStart("left")}px` : void 0,
276
- right: isPinned === "right" ? `${column.getAfter("right")}px` : void 0,
277
- width: column.getSize()
278
- }
279
- };
280
- }
281
-
282
- // build/browser/object-table/TableHeader.js
283
- function TableHeader({
284
- table
285
- }) {
286
- const isResizing = !!table.getState().columnSizingInfo?.isResizingColumn;
287
- return /* @__PURE__ */ React5.createElement("thead", {
288
- className: TableHeader_default.osdkTableHeader,
289
- "data-resizing": isResizing
290
- }, table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ React5.createElement("tr", {
291
- key: headerGroup.id,
292
- className: TableHeader_default.osdkTableHeaderRow
293
- }, headerGroup.headers.map((header) => {
294
- const {
295
- columnStyles
296
- } = getColumnPinningStyles(header.column);
297
- const isColumnPinned = header.column.getIsPinned();
298
- const isSelectColumn = header.id === SELECTION_COLUMN_ID;
299
- return /* @__PURE__ */ React5.createElement("th", {
300
- key: header.id,
301
- "data-pinned": header.column.getIsPinned(),
302
- className: TableHeader_default.osdkTableHeaderCell,
303
- style: columnStyles
304
- }, header.isPlaceholder ? null : isSelectColumn ? /* @__PURE__ */ React5.createElement(TableHeaderContent, {
305
- header
306
- }) : /* @__PURE__ */ React5.createElement(TableHeaderWithPopover, {
307
- header,
308
- isColumnPinned,
309
- setColumnPinning: table.setColumnPinning
310
- }), header.column.getCanResize() && /* @__PURE__ */ React5.createElement("div", {
311
- className: TableHeader_default.osdkTableHeaderResizer,
312
- onDoubleClick: () => header.column.resetSize(),
313
- onMouseDown: header.getResizeHandler(),
314
- onTouchStart: header.getResizeHandler()
315
- }));
316
- }))));
317
- }
318
-
319
- // build/browser/object-table/LoadingStateTable.js
320
- var MIN_ROWS = 5;
321
- function LoadingStateTable({
18
+ import React, { useEffect, useRef, useState } from "react";
19
+ import loadingStyles from "./LoadingCell.module.css.js";
20
+ import { LoadingRow } from "./LoadingRow.js";
21
+ import bodyStyles from "./TableBody.module.css.js";
22
+ import { TableHeader } from "./TableHeader.js";
23
+ import headerStyles from "./TableHeader.module.css.js";
24
+ const MIN_ROWS = 5;
25
+ export function LoadingStateTable({
322
26
  table,
323
27
  tableContainerRef,
324
28
  headerGroups,
325
29
  rowHeight = 40,
326
30
  columnWidth = 120
327
31
  }) {
32
+ // If selection enabled, there will be a header for the selection column
328
33
  const isSelectionEnabled = table.options.enableRowSelection;
329
34
  const minHeaderCount = isSelectionEnabled ? 1 : 0;
330
35
  const headers = headerGroups[0]?.headers ?? [];
331
36
  const hasHeadersLoaded = headers.length > minHeaderCount;
332
37
  const headerRef = useRef(null);
333
38
  const bodyRef = useRef(null);
334
- const [loadingRowCount, setLoadingRowCount] = useState2(MIN_ROWS);
335
- const [loadingColumnCount, setLoadingColumnCount] = useState2(headers.length);
39
+ const [loadingRowCount, setLoadingRowCount] = useState(MIN_ROWS);
40
+ const [loadingColumnCount, setLoadingColumnCount] = useState(headers.length);
41
+ // Calculate number of columns needed to fill container width
336
42
  useEffect(() => {
337
43
  if (hasHeadersLoaded) {
338
44
  setLoadingColumnCount(headers.length);
@@ -346,6 +52,8 @@ function LoadingStateTable({
346
52
  }
347
53
  }
348
54
  }, [columnWidth, hasHeadersLoaded, headers, tableContainerRef]);
55
+
56
+ // Calculate number of rows needed to fill container height
349
57
  useEffect(() => {
350
58
  if (tableContainerRef.current) {
351
59
  const containerHeight = tableContainerRef.current.clientHeight;
@@ -356,40 +64,38 @@ function LoadingStateTable({
356
64
  }
357
65
  }
358
66
  }, [tableContainerRef, rowHeight]);
359
- return /* @__PURE__ */ React6.createElement(React6.Fragment, null, hasHeadersLoaded ? /* @__PURE__ */ React6.createElement(TableHeader, {
360
- table
361
- }) : /* @__PURE__ */ React6.createElement("thead", {
362
- className: TableHeader_default.osdkTableHeader,
67
+ return /*#__PURE__*/React.createElement(React.Fragment, null, hasHeadersLoaded ? /*#__PURE__*/React.createElement(TableHeader, {
68
+ table: table
69
+ }) : /*#__PURE__*/React.createElement("thead", {
70
+ className: headerStyles.osdkTableHeader,
363
71
  ref: headerRef
364
- }, /* @__PURE__ */ React6.createElement("tr", {
365
- className: TableHeader_default.osdkTableHeaderRow
72
+ }, /*#__PURE__*/React.createElement("tr", {
73
+ className: headerStyles.osdkTableHeaderRow
366
74
  }, Array.from({
367
75
  length: loadingColumnCount
368
76
  }).map((_, index) => {
369
77
  const width = headers.length > index ? headers[index].getSize() : columnWidth;
370
- return /* @__PURE__ */ React6.createElement("th", {
78
+ return /*#__PURE__*/React.createElement("th", {
371
79
  key: `loading-header-${index}`,
372
- className: TableHeader_default.osdkTableHeaderCell,
80
+ className: headerStyles.osdkTableHeaderCell,
373
81
  style: {
374
82
  width
375
83
  }
376
- }, /* @__PURE__ */ React6.createElement("div", {
377
- className: classNames3(TableHeader_default.osdkLoadingHeaderCell, LoadingCell_default.osdkCellSkeleton)
84
+ }, /*#__PURE__*/React.createElement("div", {
85
+ className: classNames(headerStyles.osdkLoadingHeaderCell, loadingStyles.osdkCellSkeleton)
378
86
  }));
379
- }))), /* @__PURE__ */ React6.createElement("tbody", {
380
- className: TableBody_default.osdkTableBody,
87
+ }))), /*#__PURE__*/React.createElement("tbody", {
88
+ className: bodyStyles.osdkTableBody,
381
89
  ref: bodyRef
382
90
  }, Array.from({
383
91
  length: loadingRowCount
384
- }).map((_, index) => /* @__PURE__ */ React6.createElement(LoadingRow, {
92
+ }).map((_, index) => /*#__PURE__*/React.createElement(LoadingRow, {
385
93
  key: `skeleton-${index}`,
386
94
  columnCount: loadingColumnCount,
387
- headers,
95
+ headers: headers,
388
96
  translateY: rowHeight * index,
389
- rowHeight,
390
- columnWidth
97
+ rowHeight: rowHeight,
98
+ columnWidth: columnWidth
391
99
  }))));
392
100
  }
393
- export {
394
- LoadingStateTable
395
- };
101
+ //# sourceMappingURL=LoadingStateTable.js.map
@@ -1,25 +1,28 @@
1
- // build/browser/object-table/NonIdealState.js
2
- import React from "react";
3
-
4
- // build/browser/object-table/NonIdealState.module.css
5
- var css = '/*\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\n.container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n min-height: 80px;\n}\n\n.message {\n color: var(--osdk-typography-color-muted);\n}\n';
6
- if (typeof document !== "undefined") {
7
- const style = document.createElement("style");
8
- style.textContent = css;
9
- document.head.appendChild(style);
10
- }
11
- var NonIdealState_default = { "container": "container", "message": "message" };
1
+ /*
2
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
3
+ *
4
+ * Licensed under the Apache License, Version 2.0 (the "License");
5
+ * you may not use this file except in compliance with the License.
6
+ * You may obtain a copy of the License at
7
+ *
8
+ * http://www.apache.org/licenses/LICENSE-2.0
9
+ *
10
+ * Unless required by applicable law or agreed to in writing, software
11
+ * distributed under the License is distributed on an "AS IS" BASIS,
12
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
+ * See the License for the specific language governing permissions and
14
+ * limitations under the License.
15
+ */
12
16
 
13
- // build/browser/object-table/NonIdealState.js
14
- function NonIdealState({
17
+ import React from "react";
18
+ import styles from "./NonIdealState.module.css.js";
19
+ export function NonIdealState({
15
20
  message
16
21
  }) {
17
- return /* @__PURE__ */ React.createElement("div", {
18
- className: NonIdealState_default.container
19
- }, /* @__PURE__ */ React.createElement("div", {
20
- className: NonIdealState_default.message
22
+ return /*#__PURE__*/React.createElement("div", {
23
+ className: styles.container
24
+ }, /*#__PURE__*/React.createElement("div", {
25
+ className: styles.message
21
26
  }, message));
22
27
  }
23
- export {
24
- NonIdealState
25
- };
28
+ //# sourceMappingURL=NonIdealState.js.map
@@ -0,0 +1,28 @@
1
+ /*
2
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
3
+ *
4
+ * Licensed under the Apache License, Version 2.0 (the "License");
5
+ * you may not use this file except in compliance with the License.
6
+ * You may obtain a copy of the License at
7
+ *
8
+ * http://www.apache.org/licenses/LICENSE-2.0
9
+ *
10
+ * Unless required by applicable law or agreed to in writing, software
11
+ * distributed under the License is distributed on an "AS IS" BASIS,
12
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
+ * See the License for the specific language governing permissions and
14
+ * limitations under the License.
15
+ */
16
+
17
+ .container {
18
+ display: flex;
19
+ align-items: center;
20
+ justify-content: center;
21
+ width: 100%;
22
+ height: 100%;
23
+ min-height: 80px;
24
+ }
25
+
26
+ .message {
27
+ color: var(--osdk-typography-color-muted);
28
+ }
@@ -0,0 +1,7 @@
1
+ // CSS Module proxy for NonIdealState.module.css
2
+ const styles = {
3
+ "container": "NonIdealState-module__container___43YWBKdO",
4
+ "message": "NonIdealState-module__message___6OFyA4q-"
5
+ };
6
+
7
+ export default styles;