pixelize-design-library 2.1.62 → 2.1.63
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.
|
@@ -57,6 +57,7 @@ var ManageColumns = function (_a) {
|
|
|
57
57
|
var _b = (0, react_1.useState)(columns.map(function (o) { return (__assign(__assign({}, o), { isHidden: !o.isHidden })); })), items = _b[0], setItems = _b[1];
|
|
58
58
|
var _c = (0, react_1.useState)(""), searchTerm = _c[0], setSearchTerm = _c[1];
|
|
59
59
|
var _d = (0, react_1.useState)(null), draggedItemIndex = _d[0], setDraggedItemIndex = _d[1];
|
|
60
|
+
var _e = (0, react_1.useState)(null), error = _e[0], setError = _e[1];
|
|
60
61
|
(0, react_1.useImperativeHandle)(childInputMethodsRef, function () {
|
|
61
62
|
return {
|
|
62
63
|
getManageColumnsData: function () {
|
|
@@ -83,8 +84,14 @@ var ManageColumns = function (_a) {
|
|
|
83
84
|
};
|
|
84
85
|
var toggleCheckbox = function (index) {
|
|
85
86
|
var newItems = __spreadArray([], items, true);
|
|
87
|
+
var visibleCount = newItems.filter(function (i) { return i.isHidden; }).length;
|
|
88
|
+
if (visibleCount === 1 && newItems[index].isHidden) {
|
|
89
|
+
setError("At least one column must remain visible.");
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
86
92
|
newItems[index].isHidden = !newItems[index].isHidden;
|
|
87
93
|
setItems(newItems);
|
|
94
|
+
setError(null);
|
|
88
95
|
};
|
|
89
96
|
var filteredItems = items.filter(function (item) {
|
|
90
97
|
return item.label.toString().toLowerCase().includes(searchTerm.toLowerCase());
|
|
@@ -94,14 +101,16 @@ var ManageColumns = function (_a) {
|
|
|
94
101
|
!searchTerm.length && (react_1.default.createElement(react_2.Flex, { align: "center", mb: "2" },
|
|
95
102
|
react_1.default.createElement(Checkbox_1.default, { label: "Select all", isChecked: items.every(function (item) { return item.isHidden; }), onChange: function () {
|
|
96
103
|
var allChecked = items.every(function (item) { return item.isHidden; });
|
|
104
|
+
if (allChecked) {
|
|
105
|
+
setError("At least one column must remain visible.");
|
|
106
|
+
return;
|
|
107
|
+
}
|
|
97
108
|
setItems(items.map(function (item) { return (__assign(__assign({}, item), { isHidden: !allChecked })); }));
|
|
109
|
+
setError(null);
|
|
98
110
|
} }))),
|
|
99
|
-
react_1.default.createElement(react_2.List, { spacing: "2" }, filteredItems.length > 0 ? (filteredItems.map(function (item, index) { return (react_1.default.createElement(react_2.ListItem, { key: item.id, draggable: true, onDragStart: function () { return handleDragStart(index); }, onDragOver: function (e) { return handleDragOver(e, index); }, onDragEnd: handleDragEnd, bg: theme.colors.gray[50], display: "flex", alignItems: "center",
|
|
100
|
-
// justifyContent="space-between"
|
|
101
|
-
borderRadius: "md", border: "1px solid", borderColor: "gray.200", cursor: "grab", position: "relative", fontSize: 14 },
|
|
111
|
+
react_1.default.createElement(react_2.List, { spacing: "2" }, filteredItems.length > 0 ? (filteredItems.map(function (item, index) { return (react_1.default.createElement(react_2.ListItem, { key: item.id, draggable: true, onDragStart: function () { return handleDragStart(index); }, onDragOver: function (e) { return handleDragOver(e, index); }, onDragEnd: handleDragEnd, bg: theme.colors.gray[50], display: "flex", alignItems: "center", borderRadius: "md", border: "1px solid", borderColor: "gray.200", cursor: "grab", position: "relative", fontSize: 14 },
|
|
102
112
|
react_1.default.createElement(react_2.IconButton, { "aria-label": "Drag", icon: react_1.default.createElement(lucide_react_1.GripVertical, null), variant: "ghost", cursor: "grab", mr: "1" }),
|
|
103
|
-
react_1.default.createElement(Checkbox_1.default, { isChecked: item.isHidden, label: String(item.label), onChange: function () { return toggleCheckbox(index); }, sx: {
|
|
104
|
-
|
|
105
|
-
} }))); })) : (react_1.default.createElement(react_2.Text, { color: "gray.500", textAlign: "center" }, "No items found")))));
|
|
113
|
+
react_1.default.createElement(Checkbox_1.default, { isChecked: item.isHidden, label: String(item.label), onChange: function () { return toggleCheckbox(index); }, sx: { marginRight: "4" } }))); })) : (react_1.default.createElement(react_2.Text, { color: "gray.500", textAlign: "center" }, "No items found"))),
|
|
114
|
+
error && (react_1.default.createElement(react_2.Text, { color: "red.500", mt: "3", fontSize: "sm" }, error))));
|
|
106
115
|
};
|
|
107
116
|
exports.default = ManageColumns;
|