@trackunit/react-table 1.13.27 → 1.13.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.cjs.js +4 -4
- package/index.esm.js +4 -4
- package/package.json +4 -4
package/index.cjs.js
CHANGED
|
@@ -169,7 +169,7 @@ const ActionButton = ({ action, id, ...rest }) => {
|
|
|
169
169
|
return (jsxRuntime.jsx(reactComponents.Button, { asChild: true, id: id, loading: action.loading, prefix: jsxRuntime.jsx(ActionIcon, { action: action }), ...rest, children: jsxRuntime.jsx(reactRouter.Link, { to: action.url, children: action.label }) }));
|
|
170
170
|
}
|
|
171
171
|
const content = (jsxRuntime.jsx(reactComponents.Button, { id: id, loading: action.loading, onClick: e => action.method(e), prefix: jsxRuntime.jsx(ActionIcon, { action: action }), ...rest, children: action.label }));
|
|
172
|
-
return action.tip ? (jsxRuntime.jsx(reactComponents.Tooltip, {
|
|
172
|
+
return action.tip ? (jsxRuntime.jsx(reactComponents.Tooltip, { label: action.tip, children: content })) : (content);
|
|
173
173
|
};
|
|
174
174
|
/**
|
|
175
175
|
* Converts an action model to a MenuItem component.
|
|
@@ -496,7 +496,7 @@ const ColumnFilter = ({ columns, setColumnOrder, defaultColumnOrder = [], column
|
|
|
496
496
|
const visibleColumnsCount = react.useMemo(() => {
|
|
497
497
|
return columns.filter(col => col.getIsVisible()).length;
|
|
498
498
|
}, [columns]);
|
|
499
|
-
return (jsxRuntime.jsx(reactDnd.DndProvider, { backend: reactDndHtml5Backend.HTML5Backend, children: jsxRuntime.jsx(reactComponents.Tooltip, {
|
|
499
|
+
return (jsxRuntime.jsx(reactDnd.DndProvider, { backend: reactDndHtml5Backend.HTML5Backend, children: jsxRuntime.jsx(reactComponents.Tooltip, { label: t("table.columnFilters.tooltip"), placement: "bottom", children: jsxRuntime.jsxs(reactComponents.Popover, { placement: "bottom-start", children: [jsxRuntime.jsx(reactComponents.PopoverTrigger, { children: jsxRuntime.jsx(reactComponents.IconButton, { icon: jsxRuntime.jsx(reactComponents.Icon, { name: "Cog6Tooth", size: "small" }), size: "small", variant: "secondary" }) }), jsxRuntime.jsx(reactComponents.PopoverContent, { children: () => (jsxRuntime.jsxs(reactComponents.MenuList, { className: "relative max-h-[55vh] w-72 overflow-y-auto", children: [jsxRuntime.jsxs("div", { className: "mb-2 flex items-center gap-1", children: [jsxRuntime.jsx(reactFormComponents.Search, { autoFocus: true, className: "flex-1", fieldSize: "small", id: "column-search", onChange: e => setSearchText(e.currentTarget.value.toLowerCase()), onClear: () => setSearchText(""), placeholder: t("table.search.placeholder"), value: searchText }), jsxRuntime.jsx(reactComponents.Button, { "data-testid": "resetColumnState", onClick: resetColumnState, size: "small", variant: "ghost-neutral", children: t("layout.actions.reset") })] }), jsxRuntime.jsx(ColumnFiltersDragAndDrop, { columns: sortedColumns, isSortDisabled: !!searchText, onUserEvent: onUserEvent, setColumnOrder: setColumnOrder, visibleColumnsCount: visibleColumnsCount })] })) })] }) }) }));
|
|
500
500
|
};
|
|
501
501
|
const ColumnFiltersDragAndDrop = ({ columns, setColumnOrder, onUserEvent, isSortDisabled, visibleColumnsCount, }) => {
|
|
502
502
|
const [localColumns, setLocalColumns] = react.useState(columns);
|
|
@@ -567,7 +567,7 @@ const Sorting = ({ columns, }) => {
|
|
|
567
567
|
const chosenColumn = sortableColumns.find(column => column.id === currentSortValue);
|
|
568
568
|
chosenColumn?.toggleSorting(selectedValue === "desc");
|
|
569
569
|
};
|
|
570
|
-
return (jsxRuntime.jsx(reactComponents.Tooltip, {
|
|
570
|
+
return (jsxRuntime.jsx(reactComponents.Tooltip, { label: t("table.sorting.toolip"), placement: "bottom", children: jsxRuntime.jsxs(reactComponents.Popover, { placement: "bottom-start", children: [jsxRuntime.jsx(reactComponents.PopoverTrigger, { children: jsxRuntime.jsx(reactComponents.Button, { prefix: currentSortDirection === "asc" ? (jsxRuntime.jsx(reactComponents.Icon, { name: "BarsArrowUp", size: "small" })) : (jsxRuntime.jsx(reactComponents.Icon, { name: "BarsArrowDown", size: "small" })), size: "small", variant: "ghost-neutral", children: jsxRuntime.jsx("span", { className: "hidden sm:block", children: t("table.sorting.label") }) }) }), jsxRuntime.jsx(reactComponents.PopoverContent, { children: jsxRuntime.jsxs(reactComponents.MenuList, { className: "max-h-[55vh] overflow-y-auto", children: [jsxRuntime.jsx(reactFormComponents.RadioGroup, { id: "sortProperty", onChange: handleSelectionChange, value: currentSortValue ?? "", children: sortableColumns.map(column => (jsxRuntime.jsx(reactFormComponents.RadioItem, { className: "w-full", label: column.columnDef.header?.toString() ?? "", value: column.id }, column.id))) }), jsxRuntime.jsxs(reactFormComponents.RadioGroup, { id: "sortOrder", onChange: onSelectOrder, value: currentSortDirection, children: [jsxRuntime.jsx(reactFormComponents.RadioItem, { className: "w-full", label: t("table.sorting.ascending"), value: "asc" }), jsxRuntime.jsx(reactFormComponents.RadioItem, { className: "w-full", label: t("table.sorting.descending"), value: "desc" })] })] }) })] }) }));
|
|
571
571
|
};
|
|
572
572
|
|
|
573
573
|
/**
|
|
@@ -621,7 +621,7 @@ const TextWithTooltip = ({ children, tooltipLabel, weight, }) => {
|
|
|
621
621
|
window.removeEventListener("resize", debouncedCheckTruncation);
|
|
622
622
|
};
|
|
623
623
|
}, [debouncedCheckTruncation, checkIfTruncated, children]);
|
|
624
|
-
return tooltipLabel ? (jsxRuntime.jsx(reactComponents.Tooltip, {
|
|
624
|
+
return tooltipLabel ? (jsxRuntime.jsx(reactComponents.Tooltip, { disabled: !isTextTruncated || hideTooltip, label: tooltipLabel, placement: "bottom", children: jsxRuntime.jsx(reactComponents.Text, { className: "truncate", ref: textRef, type: "span", weight: weight, children: children }) })) : (jsxRuntime.jsx("div", { onMouseDown: () => setHideTooltip(true), onMouseUp: () => setHideTooltip(false), children: jsxRuntime.jsx(reactComponents.Text, { className: "truncate", ref: textRef, type: "span", weight: weight, children: children }) }));
|
|
625
625
|
};
|
|
626
626
|
|
|
627
627
|
/**
|
package/index.esm.js
CHANGED
|
@@ -168,7 +168,7 @@ const ActionButton = ({ action, id, ...rest }) => {
|
|
|
168
168
|
return (jsx(Button, { asChild: true, id: id, loading: action.loading, prefix: jsx(ActionIcon, { action: action }), ...rest, children: jsx(Link, { to: action.url, children: action.label }) }));
|
|
169
169
|
}
|
|
170
170
|
const content = (jsx(Button, { id: id, loading: action.loading, onClick: e => action.method(e), prefix: jsx(ActionIcon, { action: action }), ...rest, children: action.label }));
|
|
171
|
-
return action.tip ? (jsx(Tooltip, {
|
|
171
|
+
return action.tip ? (jsx(Tooltip, { label: action.tip, children: content })) : (content);
|
|
172
172
|
};
|
|
173
173
|
/**
|
|
174
174
|
* Converts an action model to a MenuItem component.
|
|
@@ -495,7 +495,7 @@ const ColumnFilter = ({ columns, setColumnOrder, defaultColumnOrder = [], column
|
|
|
495
495
|
const visibleColumnsCount = useMemo(() => {
|
|
496
496
|
return columns.filter(col => col.getIsVisible()).length;
|
|
497
497
|
}, [columns]);
|
|
498
|
-
return (jsx(DndProvider, { backend: HTML5Backend, children: jsx(Tooltip, {
|
|
498
|
+
return (jsx(DndProvider, { backend: HTML5Backend, children: jsx(Tooltip, { label: t("table.columnFilters.tooltip"), placement: "bottom", children: jsxs(Popover, { placement: "bottom-start", children: [jsx(PopoverTrigger, { children: jsx(IconButton, { icon: jsx(Icon, { name: "Cog6Tooth", size: "small" }), size: "small", variant: "secondary" }) }), jsx(PopoverContent, { children: () => (jsxs(MenuList, { className: "relative max-h-[55vh] w-72 overflow-y-auto", children: [jsxs("div", { className: "mb-2 flex items-center gap-1", children: [jsx(Search, { autoFocus: true, className: "flex-1", fieldSize: "small", id: "column-search", onChange: e => setSearchText(e.currentTarget.value.toLowerCase()), onClear: () => setSearchText(""), placeholder: t("table.search.placeholder"), value: searchText }), jsx(Button, { "data-testid": "resetColumnState", onClick: resetColumnState, size: "small", variant: "ghost-neutral", children: t("layout.actions.reset") })] }), jsx(ColumnFiltersDragAndDrop, { columns: sortedColumns, isSortDisabled: !!searchText, onUserEvent: onUserEvent, setColumnOrder: setColumnOrder, visibleColumnsCount: visibleColumnsCount })] })) })] }) }) }));
|
|
499
499
|
};
|
|
500
500
|
const ColumnFiltersDragAndDrop = ({ columns, setColumnOrder, onUserEvent, isSortDisabled, visibleColumnsCount, }) => {
|
|
501
501
|
const [localColumns, setLocalColumns] = useState(columns);
|
|
@@ -566,7 +566,7 @@ const Sorting = ({ columns, }) => {
|
|
|
566
566
|
const chosenColumn = sortableColumns.find(column => column.id === currentSortValue);
|
|
567
567
|
chosenColumn?.toggleSorting(selectedValue === "desc");
|
|
568
568
|
};
|
|
569
|
-
return (jsx(Tooltip, {
|
|
569
|
+
return (jsx(Tooltip, { label: t("table.sorting.toolip"), placement: "bottom", children: jsxs(Popover, { placement: "bottom-start", children: [jsx(PopoverTrigger, { children: jsx(Button, { prefix: currentSortDirection === "asc" ? (jsx(Icon, { name: "BarsArrowUp", size: "small" })) : (jsx(Icon, { name: "BarsArrowDown", size: "small" })), size: "small", variant: "ghost-neutral", children: jsx("span", { className: "hidden sm:block", children: t("table.sorting.label") }) }) }), jsx(PopoverContent, { children: jsxs(MenuList, { className: "max-h-[55vh] overflow-y-auto", children: [jsx(RadioGroup, { id: "sortProperty", onChange: handleSelectionChange, value: currentSortValue ?? "", children: sortableColumns.map(column => (jsx(RadioItem, { className: "w-full", label: column.columnDef.header?.toString() ?? "", value: column.id }, column.id))) }), jsxs(RadioGroup, { id: "sortOrder", onChange: onSelectOrder, value: currentSortDirection, children: [jsx(RadioItem, { className: "w-full", label: t("table.sorting.ascending"), value: "asc" }), jsx(RadioItem, { className: "w-full", label: t("table.sorting.descending"), value: "desc" })] })] }) })] }) }));
|
|
570
570
|
};
|
|
571
571
|
|
|
572
572
|
/**
|
|
@@ -620,7 +620,7 @@ const TextWithTooltip = ({ children, tooltipLabel, weight, }) => {
|
|
|
620
620
|
window.removeEventListener("resize", debouncedCheckTruncation);
|
|
621
621
|
};
|
|
622
622
|
}, [debouncedCheckTruncation, checkIfTruncated, children]);
|
|
623
|
-
return tooltipLabel ? (jsx(Tooltip, {
|
|
623
|
+
return tooltipLabel ? (jsx(Tooltip, { disabled: !isTextTruncated || hideTooltip, label: tooltipLabel, placement: "bottom", children: jsx(Text, { className: "truncate", ref: textRef, type: "span", weight: weight, children: children }) })) : (jsx("div", { onMouseDown: () => setHideTooltip(true), onMouseUp: () => setHideTooltip(false), children: jsx(Text, { className: "truncate", ref: textRef, type: "span", weight: weight, children: children }) }));
|
|
624
624
|
};
|
|
625
625
|
|
|
626
626
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/react-table",
|
|
3
|
-
"version": "1.13.
|
|
3
|
+
"version": "1.13.28",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
@@ -14,12 +14,12 @@
|
|
|
14
14
|
"react-dnd-html5-backend": "16.0.1",
|
|
15
15
|
"@tanstack/react-router": "1.114.29",
|
|
16
16
|
"tailwind-merge": "^2.0.0",
|
|
17
|
-
"@trackunit/react-components": "1.17.
|
|
17
|
+
"@trackunit/react-components": "1.17.25",
|
|
18
18
|
"@trackunit/shared-utils": "1.13.43",
|
|
19
19
|
"@trackunit/css-class-variance-utilities": "1.11.43",
|
|
20
20
|
"@trackunit/ui-icons": "1.11.42",
|
|
21
|
-
"@trackunit/react-table-base-components": "1.13.
|
|
22
|
-
"@trackunit/react-form-components": "1.14.
|
|
21
|
+
"@trackunit/react-table-base-components": "1.13.28",
|
|
22
|
+
"@trackunit/react-form-components": "1.14.28",
|
|
23
23
|
"@trackunit/i18n-library-translation": "1.12.28",
|
|
24
24
|
"@trackunit/iris-app-runtime-core-api": "1.12.24",
|
|
25
25
|
"graphql": "^16.10.0"
|