@monolith-forensics/monolith-ui 1.2.92 → 1.2.94
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.
|
@@ -52,8 +52,8 @@ export const MenuComponent = forwardRef((_a, forwardedRef) => {
|
|
|
52
52
|
});
|
|
53
53
|
const click = useClick(context, {
|
|
54
54
|
event: "click",
|
|
55
|
-
toggle:
|
|
56
|
-
ignoreMouse:
|
|
55
|
+
toggle: true,
|
|
56
|
+
ignoreMouse: false,
|
|
57
57
|
});
|
|
58
58
|
const role = useRole(context, { role: "menu" });
|
|
59
59
|
const dismiss = useDismiss(context, { bubbles: true });
|
|
@@ -75,8 +75,8 @@ export const MenuComponent = forwardRef((_a, forwardedRef) => {
|
|
|
75
75
|
useEffect(() => {
|
|
76
76
|
if (!tree)
|
|
77
77
|
return;
|
|
78
|
-
function handleTreeClick() {
|
|
79
|
-
if (!multiselect) {
|
|
78
|
+
function handleTreeClick(event) {
|
|
79
|
+
if (!multiselect && !event.nested) {
|
|
80
80
|
setIsOpen(false);
|
|
81
81
|
}
|
|
82
82
|
}
|
|
@@ -107,7 +107,7 @@ export const MenuComponent = forwardRef((_a, forwardedRef) => {
|
|
|
107
107
|
(_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
|
|
108
108
|
setHasFocusInside(false);
|
|
109
109
|
parent.setHasFocusInside(true);
|
|
110
|
-
} }))), { rightSection: arrow ? (_jsx(ChevronDownIcon, { size: 12 })) : isNested ? (_jsx(ChevronRightIcon, { size: 12 })) : null, size: buttonSize, variant: variant, selected: isOpen }, buttonProps, { children: label })), _jsx(MenuContext.Provider, { value: {
|
|
110
|
+
} }))), { rightSection: arrow ? (_jsx(ChevronDownIcon, { size: 12 })) : isNested ? (_jsx(ChevronRightIcon, { size: 12 })) : null, size: buttonSize, variant: variant, selected: isOpen, nested: isNested }, buttonProps, { children: label })), _jsx(MenuContext.Provider, { value: {
|
|
111
111
|
activeIndex,
|
|
112
112
|
setActiveIndex,
|
|
113
113
|
getItemProps,
|
|
@@ -17,7 +17,7 @@ import { useFloatingTree, useListItem, useMergeRefs } from "@floating-ui/react";
|
|
|
17
17
|
import { MenuContext } from "./MenuContext";
|
|
18
18
|
import Tooltip from "../../Tooltip";
|
|
19
19
|
export const MenuItem = styled(forwardRef((_a, forwardedRef) => {
|
|
20
|
-
var { label, children, disabled, multiselect, TooltipContent, itemData } = _a, props = __rest(_a, ["label", "children", "disabled", "multiselect", "TooltipContent", "itemData"]);
|
|
20
|
+
var { label, children, disabled, multiselect, TooltipContent, itemData, nested } = _a, props = __rest(_a, ["label", "children", "disabled", "multiselect", "TooltipContent", "itemData", "nested"]);
|
|
21
21
|
const menu = useContext(MenuContext);
|
|
22
22
|
const item = useListItem({ label: disabled ? null : label });
|
|
23
23
|
const tree = useFloatingTree();
|
|
@@ -26,7 +26,7 @@ export const MenuItem = styled(forwardRef((_a, forwardedRef) => {
|
|
|
26
26
|
onClick(event) {
|
|
27
27
|
var _a;
|
|
28
28
|
(_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, event);
|
|
29
|
-
tree === null || tree === void 0 ? void 0 : tree.events.emit("click");
|
|
29
|
+
tree === null || tree === void 0 ? void 0 : tree.events.emit("click", { nested });
|
|
30
30
|
},
|
|
31
31
|
onFocus(event) {
|
|
32
32
|
var _a;
|
|
@@ -27,7 +27,7 @@ const FlexedRow = styled.div `
|
|
|
27
27
|
}
|
|
28
28
|
`;
|
|
29
29
|
const TableMenu = () => {
|
|
30
|
-
var _a, _b, _c;
|
|
30
|
+
var _a, _b, _c, _d;
|
|
31
31
|
const { data, columnState, searchState, toggleColumnVisibility, tableMenuOptions, runSearch, enableSelection, compactState, toggleCompact, totalRecords, getCalculatedSelectionTotal, filterState, handleFilterChange, } = useTable();
|
|
32
32
|
if ((tableMenuOptions === null || tableMenuOptions === void 0 ? void 0 : tableMenuOptions.enabled) !== true)
|
|
33
33
|
return null;
|
|
@@ -59,7 +59,13 @@ const TableMenu = () => {
|
|
|
59
59
|
label: item.label,
|
|
60
60
|
});
|
|
61
61
|
};
|
|
62
|
-
return (_jsxs(StyledContainer, { children: [_jsxs(FlexedRow, { className: "justify-sb", children: [_jsxs(FlexedRow, { children: [(addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.enabled) === true &&
|
|
62
|
+
return (_jsxs(StyledContainer, { children: [_jsxs(FlexedRow, { className: "justify-sb", children: [_jsxs(FlexedRow, { children: [(addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.enabled) === true &&
|
|
63
|
+
((addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.type) === "button" ||
|
|
64
|
+
(addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.type) === undefined) && (_jsx(Button, Object.assign({ color: "primary", variant: "contained", size: "xxs", onClick: () => { var _a; return (_a = addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.onClick) === null || _a === void 0 ? void 0 : _a.call(addButtonOptions); } }, addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.buttonProps, { children: ((_a = tableMenuOptions === null || tableMenuOptions === void 0 ? void 0 : tableMenuOptions.addButtonOptions) === null || _a === void 0 ? void 0 : _a.label) || "+ Add Record" }))), (addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.enabled) === true &&
|
|
65
|
+
(addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.type) === "menu" && (_jsx(DropDownMenu, Object.assign({ data: [], variant: "contained", arrow: true, size: "xxs", buttonProps: {
|
|
66
|
+
color: "primary",
|
|
67
|
+
size: "xxs",
|
|
68
|
+
} }, addButtonOptions === null || addButtonOptions === void 0 ? void 0 : addButtonOptions.dropdownOptions, { children: ((_b = tableMenuOptions === null || tableMenuOptions === void 0 ? void 0 : tableMenuOptions.addButtonOptions) === null || _b === void 0 ? void 0 : _b.label) || "Options" }))), (filterOptions === null || filterOptions === void 0 ? void 0 : filterOptions.enabled) === true && (_jsx(DropDownMenu, { variant: "outlined", size: "xs", data: ((_c = filterOptions === null || filterOptions === void 0 ? void 0 : filterOptions.filterDefinitions) === null || _c === void 0 ? void 0 : _c.map((filter) => ({
|
|
63
69
|
label: filter.label,
|
|
64
70
|
value: filter.dataField,
|
|
65
71
|
data: filter,
|
|
@@ -100,9 +106,9 @@ const TableMenu = () => {
|
|
|
100
106
|
})), multiselect: true, searchable: true, buttonProps: {
|
|
101
107
|
title: "Show/Hide Columns",
|
|
102
108
|
size: "xs",
|
|
103
|
-
style: { padding: "0px 4px" },
|
|
109
|
+
style: { padding: "0px 4px", height: 24 },
|
|
104
110
|
}, dropDownProps: {
|
|
105
111
|
style: { width: 175, maxWidth: 400 },
|
|
106
|
-
}, children: _jsx(Columns3Icon, { size: 14 }) })), (searchOptions === null || searchOptions === void 0 ? void 0 : searchOptions.enabled) === true && (_jsx(TextInput, { size: "xs", placeholder: ((
|
|
112
|
+
}, children: _jsx(Columns3Icon, { size: 14 }) })), (searchOptions === null || searchOptions === void 0 ? void 0 : searchOptions.enabled) === true && (_jsx(TextInput, { size: "xs", placeholder: ((_d = tableMenuOptions === null || tableMenuOptions === void 0 ? void 0 : tableMenuOptions.searchOptions) === null || _d === void 0 ? void 0 : _d.placeholder) || "Search", defaultValue: searchState, onChange: handleSearch }))] })] }), _jsx(QueryFilter, { queryFilter: queryFilter })] }));
|
|
107
113
|
};
|
|
108
114
|
export default TableMenu;
|
package/dist/Table/types.d.ts
CHANGED
|
@@ -2,6 +2,8 @@ import { LucideIcon } from "lucide-react";
|
|
|
2
2
|
import { MutableRefObject, Ref } from "react";
|
|
3
3
|
import { SelectionStatus, TableExportOptions } from "./enums";
|
|
4
4
|
import { FilterDefinition, Query } from "../QueryFilter";
|
|
5
|
+
import { DropDownMenuProps } from "../DropDownMenu";
|
|
6
|
+
import { ButtonProps } from "../Button";
|
|
5
7
|
export type StateStorage = {
|
|
6
8
|
enabled: boolean;
|
|
7
9
|
type: "localStorage";
|
|
@@ -213,7 +215,10 @@ export type TableMenuOptions = {
|
|
|
213
215
|
addButtonOptions?: {
|
|
214
216
|
enabled?: boolean;
|
|
215
217
|
label?: string;
|
|
218
|
+
type?: "button" | "menu";
|
|
216
219
|
onClick?: () => void;
|
|
220
|
+
buttonProps?: ButtonProps;
|
|
221
|
+
dropdownOptions?: DropDownMenuProps;
|
|
217
222
|
};
|
|
218
223
|
tableCountOptions?: {
|
|
219
224
|
recordsTotalEnabled?: boolean;
|