sccoreui 5.9.45 → 5.9.47
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/dist/App.scss +19 -2
- package/dist/components/ag-grid/advancedFeature/custom-sort.js +10 -7
- package/dist/components/ag-grid/advancedFeature/global-search.js +1 -1
- package/dist/components/ag-grid/advancedFeature/new-filter/conditions/Conditions.js +4 -4
- package/dist/components/ag-grid/advancedFeature/new-filter/table-filter.js +11 -4
- package/dist/components/ag-grid/advancedFeature/refresh-grid.js +1 -1
- package/dist/components/ag-grid/advancedFeature/remove-items.js +1 -1
- package/dist/components/ag-grid/constants.js +25 -25
- package/dist/components/ag-grid/context-provider.js +1 -1
- package/package.json +1 -1
package/dist/App.scss
CHANGED
|
@@ -969,6 +969,9 @@ button[aria-expanded="true"] {
|
|
|
969
969
|
color: var(--primary-400) !important;
|
|
970
970
|
}
|
|
971
971
|
|
|
972
|
+
.p-button.p-button-text:enabled:hover {
|
|
973
|
+
background: var(--primary-50);
|
|
974
|
+
}
|
|
972
975
|
/* AG GRID - styles */
|
|
973
976
|
@import url("./assets/theme.css");
|
|
974
977
|
@import url("./assets/sccoreui.css");
|
|
@@ -2076,14 +2079,23 @@ button[aria-expanded="true"] {
|
|
|
2076
2079
|
}
|
|
2077
2080
|
}
|
|
2078
2081
|
|
|
2082
|
+
.overlay_list_options {
|
|
2083
|
+
.p-overlaypanel-content {
|
|
2084
|
+
padding: 0;
|
|
2085
|
+
}
|
|
2086
|
+
}
|
|
2087
|
+
|
|
2088
|
+
|
|
2089
|
+
|
|
2090
|
+
|
|
2079
2091
|
.filter-btn-grid {
|
|
2080
|
-
padding: 10px
|
|
2092
|
+
padding: 10px;
|
|
2081
2093
|
}
|
|
2082
2094
|
.table-filter-overlay {
|
|
2083
2095
|
&:after, &:before {
|
|
2084
2096
|
margin-left: -12px !important;
|
|
2085
2097
|
}
|
|
2086
|
-
margin-left: -
|
|
2098
|
+
margin-left: -10px;
|
|
2087
2099
|
.p-overlaypanel-content {
|
|
2088
2100
|
padding: 0;
|
|
2089
2101
|
|
|
@@ -2096,6 +2108,11 @@ button[aria-expanded="true"] {
|
|
|
2096
2108
|
height: 24px;
|
|
2097
2109
|
}
|
|
2098
2110
|
|
|
2111
|
+
.icon-32x32 {
|
|
2112
|
+
width: 32px;
|
|
2113
|
+
height: 32px;
|
|
2114
|
+
}
|
|
2115
|
+
|
|
2099
2116
|
|
|
2100
2117
|
// loader styles
|
|
2101
2118
|
.loader-wrapper {
|
|
@@ -4,7 +4,7 @@ const tslib_1 = require("tslib");
|
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const overlaypanel_1 = require("primereact/overlaypanel");
|
|
7
|
-
|
|
7
|
+
// import { Divider } from "primereact/divider";
|
|
8
8
|
const radiobutton_1 = require("primereact/radiobutton");
|
|
9
9
|
const button_1 = require("primereact/button");
|
|
10
10
|
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
|
|
@@ -17,6 +17,7 @@ function Sort() {
|
|
|
17
17
|
const [sortInfo, setSortInfo] = (0, react_1.useState)();
|
|
18
18
|
const sortType = sortValue === null || sortValue === void 0 ? void 0 : sortValue.dataType;
|
|
19
19
|
const [isApplyDisable, setIsApplyDisable] = (0, react_1.useState)(true);
|
|
20
|
+
const [showBorder, setShowBorder] = (0, react_1.useState)(false);
|
|
20
21
|
const onClickSort = (event) => {
|
|
21
22
|
showShort.current.toggle(event);
|
|
22
23
|
};
|
|
@@ -33,6 +34,7 @@ function Sort() {
|
|
|
33
34
|
}
|
|
34
35
|
setSortInfo(sortDetails);
|
|
35
36
|
setSortValue(eachColumn);
|
|
37
|
+
setShowBorder(true);
|
|
36
38
|
}
|
|
37
39
|
};
|
|
38
40
|
const onSelectSortType = (column) => {
|
|
@@ -67,6 +69,7 @@ function Sort() {
|
|
|
67
69
|
onClickSort(e);
|
|
68
70
|
setSortBy({});
|
|
69
71
|
setSortValue({});
|
|
72
|
+
setShowBorder(false);
|
|
70
73
|
const sortDetails = {
|
|
71
74
|
isSortable: false,
|
|
72
75
|
columnToSort: "",
|
|
@@ -86,22 +89,22 @@ function Sort() {
|
|
|
86
89
|
}, [sortValue, sortBy]);
|
|
87
90
|
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `cursor-pointer sc_icon_hover flex align-items-center border-round ${isOverlayOpened || featureDetails.sort.isSortable
|
|
88
91
|
? "bg-primary-50"
|
|
89
|
-
: ""}` }, { children: [featureDetails.sort.isSortable && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "flex align-items-center text-primary-400 ml-2" }, { children: `Selected` }))), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "icon-
|
|
92
|
+
: ""}` }, { children: [featureDetails.sort.isSortable && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "flex align-items-center text-primary-400 ml-2" }, { children: `Selected` }))), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "icon-32x32 hover:bg-primary-50", text: true, onClick: (event) => onClickSort(event), icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "switch-vertical-02", size: 16, color: isOverlayOpened || featureDetails.sort.isSortable
|
|
90
93
|
? "text-gray-700"
|
|
91
|
-
: "text-gray-700" }) })] })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showShort, onShow: () => setIsOverlayOpened(true), onHide: () => setIsOverlayOpened(false), className: "w-18rem mt-2" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 text-lg font-semibold line-height-3 text-gray-900" }, { children: "Column Sorting" })), (0, jsx_runtime_1.jsx)(
|
|
94
|
+
: "text-gray-700" }) })] })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showShort, onShow: () => setIsOverlayOpened(true), onHide: () => setIsOverlayOpened(false), className: "w-18rem mt-2 overlay_list_options" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 text-lg font-semibold line-height-3 text-gray-900 border-bottom-1 border-gray-200" }, { children: "Column Sorting" })), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "pl-0 m-1 max-h-10rem overflow-auto" }, { children: columnData === null || columnData === void 0 ? void 0 : columnData.map((eachColumn, index) => {
|
|
92
95
|
if (eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.isSortable) {
|
|
93
96
|
const isSelected = eachColumn.field === (sortValue === null || sortValue === void 0 ? void 0 : sortValue.field);
|
|
94
|
-
return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: `${isSelected && "bg-primary-25"} cursor-pointer border-round-md flex align-items-center gap-2 px-3 py-2 text-base line-height-2 text-gray-700`, style: { listStyleType: "none" }, onClick: () => onSelectSortValue(eachColumn) }, { children: [(0, jsx_runtime_1.jsx)(radiobutton_1.RadioButton, { id: "tableSort", checked: isSelected, type: "circle", value: sortValue }), (0, jsx_runtime_1.jsx)("label", Object.assign({ className:
|
|
97
|
+
return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: `${isSelected && "bg-primary-25"} cursor-pointer border-round-md flex align-items-center gap-2 px-3 py-2 text-base line-height-2 text-gray-700`, style: { listStyleType: "none" }, onClick: () => onSelectSortValue(eachColumn) }, { children: [(0, jsx_runtime_1.jsx)(radiobutton_1.RadioButton, { id: "tableSort", checked: isSelected, type: "circle", value: sortValue }), (0, jsx_runtime_1.jsx)("label", Object.assign({ className: `cursor-pointer ${isSelected && "text-primary-400 font-semibold"}` }, { children: eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.headerName }))] }), index));
|
|
95
98
|
}
|
|
96
99
|
else {
|
|
97
100
|
return null;
|
|
98
101
|
}
|
|
99
|
-
}) })), (0, jsx_runtime_1.jsx)(
|
|
102
|
+
}) })), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: `p-1 my-0 ${showBorder ? "border-top-1 border-gray-200" : ""}` }, { children: (_a = constants_1.COLUMN_SORT_OPTIONS.filter((each) => each.dataType === sortType)) === null || _a === void 0 ? void 0 : _a.map((eachOption, index) => {
|
|
100
103
|
const seletedSort = eachOption.label === (sortBy === null || sortBy === void 0 ? void 0 : sortBy.label);
|
|
101
|
-
return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className:
|
|
104
|
+
return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: `cursor-pointer ${seletedSort && "bg-primary-25"} cursor-pointer border-round-md pl-0 px-3 py-2 flex align-items-center gap-2`, onClick: () => {
|
|
102
105
|
onSelectSortType(eachOption);
|
|
103
106
|
// setSortBy(eachOption);
|
|
104
107
|
} }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: index === 0 ? "arrow-down" : "arrow-up", size: 20 }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: `${seletedSort && "text-primary-400 font-semibold"} text-gray-700 font-medium text-base` }, { children: eachOption.label }))] }), index));
|
|
105
|
-
}) })), (0, jsx_runtime_1.
|
|
108
|
+
}) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between px-3 py-2 border-top-1 border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ disabled: false, id: "column_sort_dropdown", outlined: true, onClick: (e) => clearSort(e) }, { children: "Clear" })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ disabled: isApplyDisable, id: "column_sort_dropdown", onClick: (e) => applyTableSort(e) }, { children: "Apply" }))] }))] }))] })));
|
|
106
109
|
}
|
|
107
110
|
exports.default = Sort;
|
|
@@ -16,6 +16,6 @@ function Search({ searchPlaceHolder }) {
|
|
|
16
16
|
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: `p-input-icon-left ${featureDetails.searchedText.length > 0 && "p-input-icon-right"}` }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { color: "#667085", icon: "search-lg", size: 18 }) })), featureDetails.searchedText.length > 0 && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix cursor-pointer", onClick: () => {
|
|
17
17
|
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: "" })),
|
|
18
18
|
setInputValue("");
|
|
19
|
-
}, title: "Clear" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18 }) }))), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { value: inputValue, onChange: (e) => setInputValue(e.target.value), className: "w-21rem", placeholder: searchPlaceHolder || "
|
|
19
|
+
}, title: "Clear" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18 }) }))), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { value: inputValue, onChange: (e) => setInputValue(e.target.value), className: "w-21rem", placeholder: searchPlaceHolder || "Search by name or code" })] })) }));
|
|
20
20
|
}
|
|
21
21
|
exports.default = Search;
|
|
@@ -50,7 +50,7 @@ const Condtions = (props) => {
|
|
|
50
50
|
const dataType = (selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.type) ? selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.type : selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.dataType;
|
|
51
51
|
switch (dataType === null || dataType === void 0 ? void 0 : dataType.toLowerCase()) {
|
|
52
52
|
case "string": {
|
|
53
|
-
return ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, className: "border-noround-left w-12rem
|
|
53
|
+
return ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, className: "border-noround-left w-12rem focus:shadow-none lh-44 h-44", value: value, placeholder: "Enter", onChange: (event) => handleDynamicFieldState(event.target.value) }));
|
|
54
54
|
}
|
|
55
55
|
case "integer": {
|
|
56
56
|
const handleOnchangeEvent = (eventValue) => {
|
|
@@ -137,12 +137,12 @@ const Condtions = (props) => {
|
|
|
137
137
|
return ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { className: "border-noround-left mb-2 w-12rem filter-input-decimal", value: value, placeholder: "Enter", onChange: (event) => handleDynamicFieldState(event.target.value), maxFractionDigits: 2 }));
|
|
138
138
|
}
|
|
139
139
|
case "percent": {
|
|
140
|
-
return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown border-noround-left w-12rem
|
|
140
|
+
return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown border-noround-left w-12rem dropdown-focus-none", value: value, options: [], optionLabel: "name", placeholder: "Select", onChange: (event) => handleDynamicFieldState(event.value) }));
|
|
141
141
|
}
|
|
142
142
|
default:
|
|
143
|
-
return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown border-noround-left w-12rem
|
|
143
|
+
return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown border-noround-left w-12rem dropdown-focus-none", options: [], value: value, optionLabel: "name", placeholder: "Select", disabled: true }));
|
|
144
144
|
}
|
|
145
145
|
};
|
|
146
|
-
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex filter-dropdowns align-items-center" }, { children: [index !== 0 ? (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown w-5rem
|
|
146
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex filter-dropdowns align-items-center" }, { children: [index !== 0 ? (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown w-5rem mr-2 remove-focus", options: conditionTypes, optionLabel: "label", placeholder: "Select", value: conditionType, disabled: index !== 1, onChange: (event) => handleConditionType(event.target.value) }) : "", (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: `condtion-dropdown dropdown-focus-none border-noround-right w-12rem`, options: columnsArray, optionLabel: "name", placeholder: "Select", value: columnName, onChange: (event) => onUpdateColumnName(event.value) }), (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condition-type hide-focus border-noround remove-focus border-x-none w-12rem", options: conditionsArray.filter((each) => each.datatypes.includes(columnName === null || columnName === void 0 ? void 0 : columnName.dataType)).map((option) => { return Object.assign(Object.assign({}, option), { name: option.name.toLowerCase().split(' ').map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(' ') }); }), value: condition, disabled: columnName === '', optionLabel: "name", placeholder: "Select", onChange: (event) => onUpdateCondition(event.value), panelClassName: "w-15rem" }), renderDynamicField(columnName), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center ml-4 gap-3 mr-1" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, className: "focus:shadow-none sc_icon_hover h-auto p-0", onClick: () => onAddCondtion(index), disabled: false }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-circle", size: 20, color: "text-gray-500" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, disabled: condtionslenght === 1, className: "focus:shadow-none sc_icon_hover h-auto p-0", onClick: () => onRemoveCondtion(id) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", size: 20, color: "text-gray-500" }) }))] }))] })));
|
|
147
147
|
};
|
|
148
148
|
exports.default = Condtions;
|
|
@@ -91,6 +91,7 @@ const TableFilter = () => {
|
|
|
91
91
|
applyAdvancedFilter([]);
|
|
92
92
|
setConditionsArray([defaultCondtion]);
|
|
93
93
|
showFilter.current.toggle(false);
|
|
94
|
+
showFilter.current.hide();
|
|
94
95
|
};
|
|
95
96
|
const renderCondtion = (conditions, key) => {
|
|
96
97
|
const { columnName, condition, value, id } = conditions;
|
|
@@ -108,6 +109,7 @@ const TableFilter = () => {
|
|
|
108
109
|
showFilter.current.toggle(false);
|
|
109
110
|
};
|
|
110
111
|
const filterLogoToggle = () => {
|
|
112
|
+
console.log('calling filter logo toggle');
|
|
111
113
|
setIsOverlayOpened(false), setDisplayInput(false), setViewName("");
|
|
112
114
|
};
|
|
113
115
|
(0, react_1.useEffect)(() => {
|
|
@@ -129,14 +131,19 @@ const TableFilter = () => {
|
|
|
129
131
|
});
|
|
130
132
|
setAllFieldsFilled(isAllFieldsFilled && enbleApply);
|
|
131
133
|
}, [conditionsArray, enbleApply]);
|
|
132
|
-
|
|
134
|
+
console.log(isOverlayOpened, globalFilters.length, 'toggle property');
|
|
135
|
+
return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: `cursor-pointer filter-btn-grid font-semibold sc_icon_hover flex align-items-center gap-2 border-round-lg ${isOverlayOpened ||
|
|
133
136
|
(globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
|
|
134
137
|
? "bg-primary-50"
|
|
135
|
-
: "bg-white"}` }, { children:
|
|
138
|
+
: "bg-white"}` }, { children: (0, jsx_runtime_1.jsxs)("span", Object.assign({ onClick: (e) => onClickFilter(e), className: "flex" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines", size: 18, color: isOverlayOpened ||
|
|
136
139
|
(globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
|
|
137
140
|
? "#243DC6"
|
|
138
|
-
: "#667085" })
|
|
141
|
+
: "#667085" }), (globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1 && ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "flex gap-2 align-items-center text-primary-400 pl-2" }, { children: [`${globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length} Selected`, (0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: (e) => {
|
|
142
|
+
e.preventDefault();
|
|
143
|
+
e.stopPropagation();
|
|
144
|
+
onresetFilter();
|
|
145
|
+
} }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18, color: "#243DC6" }) }))] })))] })) })), (0, jsx_runtime_1.jsx)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showFilter, onShow: () => setIsOverlayOpened(true), onHide: filterLogoToggle, className: "table-filter-overlay" }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-lg font-semibold line-height-3 text-gray-900" }, { children: "Filters" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-sm text-gray-600" }, { children: "Streamline Your Search With Filters" }))] })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 pr-2" }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "max-h-14rem\toverflow-auto flex flex-column gap-1" }, { children: conditionsArray.map((eachCondition, index) => {
|
|
139
146
|
return ((0, jsx_runtime_1.jsx)("div", { children: renderCondtion(eachCondition, index) }, index));
|
|
140
|
-
}) })) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4 flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { text: true, className: "focus:shadow-none", label: "Reset Filter", onClick: onresetFilter }) }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [!displayInput && enableViewCreate && ((0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base px-2 font-semibold text-primary-400 flex gap-2 p-1 focus:shadow-none mr-3", label: "Create View", onClick: () => setDisplayInput(true), disabled: !allFieldsFilled, text: true, iconPos: "left", icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus", color: "text-primary-400 mr-2" }) })), displayInput && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `p-input-suffix` }, { children: [displayInput && ((0, jsx_runtime_1.jsx)(button_1.Button, { onClick: createViewFromFilters, disabled: !viewName.length, className: "p-0 h-auto", text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "check" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setViewName(""), className: "p-0 h-auto", disabled: !viewName.length, text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close" }) })] })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { placeholder: "Enter", value: viewName, onChange: (e) => setViewName(e.target.value), className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full px-3 mr-3" })] }))), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base font-semibold text-gray-600 p-1 focus:shadow-none text-white w-4rem", label: "Apply", onClick: onApplyFilter, disabled: !allFieldsFilled })] }))] }))] }) }))] }));
|
|
147
|
+
}) })) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4 flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { text: true, className: "focus:shadow-none font-semibold", label: "Reset Filter", onClick: onresetFilter }) }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [!displayInput && enableViewCreate && ((0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base px-2 font-semibold text-primary-400 flex gap-2 p-1 focus:shadow-none mr-3", label: "Create View", onClick: () => setDisplayInput(true), disabled: !allFieldsFilled, text: true, iconPos: "left", icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus", color: "text-primary-400 mr-2" }) })), displayInput && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `p-input-suffix` }, { children: [displayInput && ((0, jsx_runtime_1.jsx)(button_1.Button, { onClick: createViewFromFilters, disabled: !viewName.length, className: "p-0 h-auto", text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "check" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setViewName(""), className: "p-0 h-auto", disabled: !viewName.length, text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close" }) })] })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { placeholder: "Enter", value: viewName, onChange: (e) => setViewName(e.target.value), className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full px-3 mr-3" })] }))), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base font-semibold text-gray-600 p-1 focus:shadow-none text-white w-4rem", label: "Apply", onClick: onApplyFilter, disabled: !allFieldsFilled })] }))] }))] }) }))] }));
|
|
141
148
|
};
|
|
142
149
|
exports.default = TableFilter;
|
|
@@ -8,6 +8,6 @@ const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg
|
|
|
8
8
|
const button_1 = require("primereact/button");
|
|
9
9
|
function RefreshGrid() {
|
|
10
10
|
const { removeFeaturesAndRefresh } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
11
|
-
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { text: true, onClick: removeFeaturesAndRefresh, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "refresh-ccw-01", color: "text-gray-700" }) }) }));
|
|
11
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: "icon-32x32 hover:bg-primary-50", text: true, onClick: removeFeaturesAndRefresh, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "refresh-ccw-01", color: "text-gray-700" }) }) }));
|
|
12
12
|
}
|
|
13
13
|
exports.default = RefreshGrid;
|
|
@@ -13,6 +13,6 @@ function RemoveItems() {
|
|
|
13
13
|
currentFeature.isRemoveClicked = true;
|
|
14
14
|
callGrid(currentFeature);
|
|
15
15
|
};
|
|
16
|
-
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ onClick: removeItemsCallBack, text: true }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", color: "text-red-800" }) })) }));
|
|
16
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ className: "icon-32x32 hover:bg-red-50 flex justify-content-center", onClick: removeItemsCallBack, text: true }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", color: "text-red-800", size: 16 }) })) }));
|
|
17
17
|
}
|
|
18
18
|
exports.default = RemoveItems;
|
|
@@ -193,31 +193,31 @@ const booleanOptions = [
|
|
|
193
193
|
{ id: 2, label: 'False', value: false },
|
|
194
194
|
];
|
|
195
195
|
exports.conditionsList = [
|
|
196
|
-
{ name: "contains all of", datatypes: ["boolean"], value:
|
|
197
|
-
{ name: "contains any of ", datatypes: ["string"], value:
|
|
198
|
-
{ name: "doesn’t contain all of ", datatypes: ["boolean"], value:
|
|
199
|
-
{ name: "doesn’t contain any of", datatypes: ["string"], value:
|
|
200
|
-
{ name: "ends with any of", datatypes: ["string"], value:
|
|
201
|
-
{ name: "is after", datatypes: ["date"], value:
|
|
202
|
-
{ name: "is any of", datatypes: ["boolean"], value:
|
|
203
|
-
{ name: "is before", datatypes: ["date"], value:
|
|
204
|
-
{ name: "is between", datatypes: ["integer", "date"], value:
|
|
205
|
-
{ name: "is (not) equal to", datatypes: ["integer", "date"], value:
|
|
206
|
-
{ name: "is (not) equal to all of", datatypes: ["boolean"], value:
|
|
207
|
-
{ name: "is (not) equal to any of", datatypes: ["string"], value:
|
|
208
|
-
{ name: "is greater than", datatypes: ["integer"], value:
|
|
209
|
-
{ name: "is greater than or equalto", datatypes: ["integer"], value:
|
|
210
|
-
{ name: "is known", datatypes: ["boolean", "integer", "string"], value:
|
|
211
|
-
{ name: "is less than", datatypes: ["integer", "date"], value:
|
|
212
|
-
{ name: "is less than or equal to", datatypes: ["integer"], value:
|
|
213
|
-
{ name: "is more than", datatypes: ["integer", "date"], value:
|
|
214
|
-
{ name: "is none of", datatypes: ["boolean"], value:
|
|
215
|
-
{ name: "is not between", datatypes: ["integer", "date"], value:
|
|
216
|
-
{ name: "is unknown", datatypes: ["boolean", "integer", "string"], value:
|
|
217
|
-
{ name: "starts with any of ", datatypes: ["string"], value:
|
|
218
|
-
{ name: "is equal to", datatypes: ["integer", "date"], value:
|
|
219
|
-
{ name: "is equal to all of", datatypes: ["boolean"], value:
|
|
220
|
-
{ name: "is equal to any of", datatypes: ["string"], value:
|
|
196
|
+
{ name: "contains all of", datatypes: ["boolean"], value: 1 },
|
|
197
|
+
{ name: "contains any of ", datatypes: ["string"], value: 2 },
|
|
198
|
+
{ name: "doesn’t contain all of ", datatypes: ["boolean"], value: 3 },
|
|
199
|
+
{ name: "doesn’t contain any of", datatypes: ["string"], value: 4 },
|
|
200
|
+
{ name: "ends with any of", datatypes: ["string"], value: 5 },
|
|
201
|
+
{ name: "is after", datatypes: ["date"], value: 6 },
|
|
202
|
+
{ name: "is any of", datatypes: ["boolean"], value: 7 },
|
|
203
|
+
{ name: "is before", datatypes: ["date"], value: 8 },
|
|
204
|
+
{ name: "is between", datatypes: ["integer", "date"], value: 9 },
|
|
205
|
+
{ name: "is (not) equal to", datatypes: ["integer", "date"], value: 10 },
|
|
206
|
+
{ name: "is (not) equal to all of", datatypes: ["boolean"], value: 11 },
|
|
207
|
+
{ name: "is (not) equal to any of", datatypes: ["string"], value: 12 },
|
|
208
|
+
{ name: "is greater than", datatypes: ["integer"], value: 13 },
|
|
209
|
+
{ name: "is greater than or equalto", datatypes: ["integer"], value: 14 },
|
|
210
|
+
{ name: "is known", datatypes: ["boolean", "integer", "string"], value: 15 },
|
|
211
|
+
{ name: "is less than", datatypes: ["integer", "date"], value: 16 },
|
|
212
|
+
{ name: "is less than or equal to", datatypes: ["integer"], value: 17 },
|
|
213
|
+
{ name: "is more than", datatypes: ["integer", "date"], value: 18 },
|
|
214
|
+
{ name: "is none of", datatypes: ["boolean"], value: 19 },
|
|
215
|
+
{ name: "is not between", datatypes: ["integer", "date"], value: 20 },
|
|
216
|
+
{ name: "is unknown", datatypes: ["boolean", "integer", "string"], value: 21 },
|
|
217
|
+
{ name: "starts with any of ", datatypes: ["string"], value: 22 },
|
|
218
|
+
{ name: "is equal to", datatypes: ["integer", "date"], value: 23 },
|
|
219
|
+
{ name: "is equal to all of", datatypes: ["boolean"], value: 24 },
|
|
220
|
+
{ name: "is equal to any of", datatypes: ["string"], value: 25 }
|
|
221
221
|
];
|
|
222
222
|
const toasterStates = {
|
|
223
223
|
success: "success-tick-mark",
|
|
@@ -19,7 +19,7 @@ function MyProvider({ children, value }) {
|
|
|
19
19
|
// Returns based on length of filterQueries present
|
|
20
20
|
return length === 0 ? [0] : Array.from({ length }, (_, index) => index);
|
|
21
21
|
});
|
|
22
|
-
const conditionTypes = [{ id: 1, label: "
|
|
22
|
+
const conditionTypes = [{ id: 1, label: "AND" }, { id: 2, label: "OR" }];
|
|
23
23
|
const [conditionType, setConditionType] = (0, react_1.useState)((defaultFilters === null || defaultFilters === void 0 ? void 0 : defaultFilters.logicalOperator) ? conditionTypes.find((item) => item.id === (defaultFilters === null || defaultFilters === void 0 ? void 0 : defaultFilters.logicalOperator)) :
|
|
24
24
|
conditionTypes[0]);
|
|
25
25
|
const [globalFilters, setGlobalFilters] = (0, react_1.useState)([]);
|