sccoreui 6.2.68 → 6.2.70

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 (27) hide show
  1. package/dist/App.js +1 -1
  2. package/dist/App.scss +53 -57
  3. package/dist/components/ag-grid/advancedFeature/advanced-feature.js +13 -2
  4. package/dist/components/ag-grid/advancedFeature/column-group.js +4 -3
  5. package/dist/components/ag-grid/advancedFeature/custom-sort.js +4 -2
  6. package/dist/components/ag-grid/advancedFeature/global-search.js +5 -3
  7. package/dist/components/ag-grid/advancedFeature/gridS-search.js +5 -3
  8. package/dist/components/ag-grid/advancedFeature/hide-column.js +4 -2
  9. package/dist/components/ag-grid/advancedFeature/new-filter/table-filter.js +5 -3
  10. package/dist/components/ag-grid/advancedFeature/refresh-grid.js +9 -2
  11. package/dist/components/ag-grid/advancedFeature/remove-items.js +9 -5
  12. package/dist/components/ag-grid/context-provider.js +2 -1
  13. package/dist/components/ag-grid/helper.js +16 -5
  14. package/dist/components/ag-grid/parent-for-grid.js +2 -2
  15. package/dist/components/dropdown/dropdown.js +6 -6
  16. package/dist/components/form/form-fields/form-fields.js +44 -35
  17. package/dist/components/formula-template/FormulaCoponent.js +7 -1
  18. package/dist/components/list-box-dropdown/list-box-dropdown.js +3 -1
  19. package/dist/components/types/type.js +7 -5
  20. package/dist/directives/svg-component.js +2 -2
  21. package/dist/types/components/ag-grid/Types.d.ts +12 -12
  22. package/dist/types/components/ag-grid/context-provider.d.ts +2 -1
  23. package/dist/types/components/ag-grid/helper.d.ts +1 -0
  24. package/dist/types/components/dropdown/dropdown.d.ts +1 -1
  25. package/dist/types/components/types/type.d.ts +5 -0
  26. package/dist/types/directives/svg-component.d.ts +2 -1
  27. package/package.json +1 -1
package/dist/App.js CHANGED
@@ -4,6 +4,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
4
4
  require("./App.scss");
5
5
  // import Home from "./pages/home";
6
6
  const App = () => {
7
- return (0, jsx_runtime_1.jsx)("div", {});
7
+ return ((0, jsx_runtime_1.jsx)("div", {}));
8
8
  };
9
9
  exports.default = App;
package/dist/App.scss CHANGED
@@ -47,29 +47,29 @@
47
47
  --grey-bg: #101828;
48
48
  --border-none: border-none;
49
49
  --box-shadow-none: none;
50
- // --_primary-800: #0e184f;
51
- // --_primary-700: #111c5b;
52
- // --_primary-600: #132067;
53
- // --_primary-500: #162578;
54
- // --_primary-400: #243dc6;
55
- // --_primary-300: #d0d5dd;
56
- // --_primary-100: #ced4f6;
57
- // --_primary-200: #8794db;
58
- // --_primary-50: #e2e5fa;
59
- // --_primary-25: #f5f6fd;
60
-
61
- // --_gray-700: #344054;
62
- // --_gray-800: #1d2939;
63
- // --_gray-200: #eaecf0;
64
- // --_gray-300: #d0d5dd;
65
- // --_gray-50: #f9fafb;
66
- // --_base-white: #fff;
67
-
68
- // --_text-secondary-600: #475467;
69
- // --_outline-800: #1d2939;
70
- // --_outline-200: #eaecf0;
71
- // --_outline-300: #d0d5dd;
72
- // --_outline-50: #f9fafb;
50
+ --_primary-800: #0e184f;
51
+ --_primary-700: #111c5b;
52
+ --_primary-600: #132067;
53
+ --_primary-500: #162578;
54
+ --_primary-400: #243dc6;
55
+ --_primary-300: #d0d5dd;
56
+ --_primary-100: #ced4f6;
57
+ --_primary-200: #8794db;
58
+ --_primary-50: #e2e5fa;
59
+ --_primary-25: #f5f6fd;
60
+
61
+ --_gray-700: #344054;
62
+ --_gray-800: #1d2939;
63
+ --_gray-200: #eaecf0;
64
+ --_gray-300: #d0d5dd;
65
+ --_gray-50: #f9fafb;
66
+ --_base-white: #fff;
67
+
68
+ --_text-secondary-600: #475467;
69
+ --_outline-800: #1d2939;
70
+ --_outline-200: #eaecf0;
71
+ --_outline-300: #d0d5dd;
72
+ --_outline-50: #f9fafb;
73
73
  --_base-white: #fff;
74
74
  }
75
75
 
@@ -97,90 +97,90 @@
97
97
  .p-button {
98
98
  border: 0 !important;
99
99
  &.btn-primary {
100
- background-color: var(--primary-500);
100
+ background-color: var(--_primary-500);
101
101
  color: var(--_base-white);
102
102
  padding: 8px 14px;
103
103
  &:hover {
104
- background-color: var(--primary-700);
104
+ background-color: var(--_primary-700);
105
105
  }
106
106
  &:focus {
107
- background-color: var(--primary-700);
107
+ background-color: var(--_primary-700);
108
108
  }
109
109
  &:disabled {
110
- background-color: var(--primary-200);
110
+ background-color: var(--_primary-200);
111
111
  color: var(--_base-white);
112
112
  }
113
113
  }
114
114
 
115
115
  &.btn-outline {
116
- background-color: var(--_base-white);
117
- color: var(--gray-600);
118
- border: 1px solid var(--gray-300) !important;
116
+ background-color: var(--base-white);
117
+ color: var(--_gray-600);
118
+ border: 1px solid var(--_gray-300) !important;
119
119
  padding: 6px 12px;
120
120
  &:hover {
121
- background-color: var(--gray-50) !important;
122
- color: var(--gray-700) !important;
121
+ background-color: var(--_gray-50) !important;
122
+ color: var(--_gray-700) !important;
123
123
  }
124
124
  &:focus {
125
125
  background-color: var(--gray-50);
126
126
  }
127
127
  &:disabled {
128
- background-color: var(--gray-200);
128
+ background-color: var(--_gray-200);
129
129
  color: var(--_base-white);
130
130
  }
131
131
  }
132
132
 
133
133
  &.btn-secondary {
134
- background-color: var(--primary-50);
135
- color: var(--primary-500);
134
+ background-color: var(--_primary-50);
135
+ color: var(--_primary-500);
136
136
  padding: 8px 14px;
137
137
  &:hover {
138
- background-color: var(--primary-100) !important;
139
- color: var(--primary-800) !important;
138
+ background-color: var(--_primary-100) !important;
139
+ color: var(--_primary-800) !important;
140
140
  }
141
141
  &:focus {
142
- background-color: var(--primary-100);
142
+ background-color: var(--_primary-100);
143
143
  }
144
144
  &:disabled {
145
- background-color: var(--primary-50);
146
- color: var(--gray-300);
145
+ background-color: var(--_primary-50);
146
+ color: var(--_gray-300);
147
147
  }
148
148
  }
149
149
 
150
150
  &.btn-text {
151
151
  background-color: var(--_base-white);
152
- color: var(--gray-600);
152
+ color: var(--_gray-600);
153
153
  padding: 8px 14px;
154
154
  border: 0 !important;
155
155
  &:hover {
156
- background-color: var(--gray-50) !important;
157
- color: var(--gray-700) !important;
156
+ background-color: var(--_gray-50) !important;
157
+ color: var(--_gray-700) !important;
158
158
  }
159
159
  &:focus {
160
- background-color: var(--gray-50);
161
- color: var(--gray-700);
160
+ background-color: var(--_gray-50);
161
+ color: var(--_gray-700);
162
162
  border: 0px !important;
163
163
  }
164
164
  &:disabled {
165
- background-color: var(--primary-50) !important;
166
- color: var(--gray-300);
165
+ background-color: var(--_primary-50) !important;
166
+ color: var(--_gray-300);
167
167
  }
168
168
  }
169
169
  &.btn-text-primary {
170
170
  background-color: var(--_base-white);
171
- color: var(--primary-400);
171
+ color: var(--_primary-400);
172
172
  padding: 8px 14px;
173
173
  border: 0 !important;
174
174
  &:hover {
175
- background-color: var(--primary-25) !important;
176
- color: var(--primary-600) !important;
175
+ background-color: var(--_primary-25) !important;
176
+ color: var(--_primary-600) !important;
177
177
  }
178
178
  &:focus {
179
- background-color: var(--primary-25) !important;
180
- color: var(--primary-600) !important;
179
+ background-color: var(--_primary-25) !important;
180
+ color: var(--_primary-600) !important;
181
181
  }
182
182
  &:disabled {
183
- color: var(--gray-300);
183
+ color: var(--_gray-300);
184
184
  }
185
185
  }
186
186
  }
@@ -223,10 +223,6 @@ code {
223
223
  padding-right: 60px !important;
224
224
  }
225
225
 
226
- .h-32 {
227
- height: 32px;
228
- }
229
-
230
226
  // h1 {
231
227
  // font-size: var(--fs-24);
232
228
  // font-weight: var(--fw-600);
@@ -14,13 +14,24 @@ const hide_column_1 = tslib_1.__importDefault(require("./hide-column"));
14
14
  const gridS_search_1 = tslib_1.__importDefault(require("./gridS-search"));
15
15
  const bulk_edit_action_1 = tslib_1.__importDefault(require("./bulk-edit-action"));
16
16
  const column_group_1 = tslib_1.__importDefault(require("./column-group"));
17
+ const type_1 = require("../../types/type");
17
18
  function AdvancedFeatures({ props }) {
18
19
  const { featureDetails } = (0, react_1.useContext)(context_provider_1.FeatureContext);
19
20
  const conditionsToDisplay = props === null || props === void 0 ? void 0 : props.conditionsToDisplay;
20
21
  const { bulkActionComponent: BulkAction, BulkEditComponent: BulkEdit,
21
22
  // discardEditComponent: DiscardEdit,
22
23
  // SaveEdit: SaveChanges,
23
- EditHeadingDetails: EditDetails, AdvancedFilter } = props;
24
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (props === null || props === void 0 ? void 0 : props.editMode) ? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between py-3 px-4" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayEditHeading) && (props === null || props === void 0 ? void 0 : props.EditHeadingDetails) && (0, jsx_runtime_1.jsx)(EditDetails, {}) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySearch) && ((0, jsx_runtime_1.jsx)(gridS_search_1.default, {})) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySidePanel) && (0, jsx_runtime_1.jsx)(hide_column_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkEdit) && (props === null || props === void 0 ? void 0 : props.BulkEditComponent) && (0, jsx_runtime_1.jsx)(BulkEdit, {}), (props === null || props === void 0 ? void 0 : props.editMode) && (0, jsx_runtime_1.jsx)(bulk_edit_action_1.default, { props: props })] }))] }))) : ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between py-3 px-4" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySearch) && ((0, jsx_runtime_1.jsx)(global_search_1.default, { searchPlaceHolder: props === null || props === void 0 ? void 0 : props.placeholder })), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayFilter) && (0, jsx_runtime_1.jsx)(table_filter_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayAdvancedFilter) && (0, jsx_runtime_1.jsx)(AdvancedFilter, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRowGroupingElement) && (0, jsx_runtime_1.jsx)(column_group_1.default, { dataFromProps: props })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySidePanel) && (0, jsx_runtime_1.jsx)(hide_column_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRemoveItems) && (0, jsx_runtime_1.jsx)(remove_items_1.default, { removeCallBack: props.removeCallBack }), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkEdit) && (props === null || props === void 0 ? void 0 : props.BulkEditComponent) && (0, jsx_runtime_1.jsx)(BulkEdit, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkAction) && (props === null || props === void 0 ? void 0 : props.bulkActionComponent) && ((0, jsx_runtime_1.jsx)(BulkAction, { checkBoxSelection: featureDetails.checkBoxSelection })), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRefresh) && (0, jsx_runtime_1.jsx)(refresh_grid_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySort) && (0, jsx_runtime_1.jsx)(custom_sort_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRecords) && (0, jsx_runtime_1.jsx)(record_detail_1.default, {})] }))] }))) }));
24
+ EditHeadingDetails: EditDetails, AdvancedFilter, } = props;
25
+ const isComponentVisible = (state) => {
26
+ return (state === type_1.VisibilityState.ENABLE || state === type_1.VisibilityState.DISABLE);
27
+ };
28
+ const AdvanceFilterWrapper = () => {
29
+ return AdvancedFilter && (0, jsx_runtime_1.jsx)(AdvancedFilter, {});
30
+ };
31
+ return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (props === null || props === void 0 ? void 0 : props.editMode) ? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between py-3 px-4" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: (isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayEditHeading) &&
32
+ (props === null || props === void 0 ? void 0 : props.EditHeadingDetails)) && (0, jsx_runtime_1.jsx)(EditDetails, {}) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySearch) && ((0, jsx_runtime_1.jsx)(gridS_search_1.default, {})) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySidePanel) && (0, jsx_runtime_1.jsx)(hide_column_1.default, {}), (isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkEdit) &&
33
+ (props === null || props === void 0 ? void 0 : props.BulkEditComponent)) && (0, jsx_runtime_1.jsx)(BulkEdit, {}), (props === null || props === void 0 ? void 0 : props.editMode) && (0, jsx_runtime_1.jsx)(bulk_edit_action_1.default, { props: props })] }))] }))) : ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between py-3 px-4" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySearch) && ((0, jsx_runtime_1.jsx)(global_search_1.default, { searchPlaceHolder: props === null || props === void 0 ? void 0 : props.placeholder })), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayFilter) && ((0, jsx_runtime_1.jsx)(table_filter_1.default, {})), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayAdvancedFilter) && ((0, jsx_runtime_1.jsx)(AdvanceFilterWrapper, {})), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRowGroupingElement) && (0, jsx_runtime_1.jsx)(column_group_1.default, { dataFromProps: props })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySidePanel) && (0, jsx_runtime_1.jsx)(hide_column_1.default, {}), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRemoveItems) && ((0, jsx_runtime_1.jsx)(remove_items_1.default, { removeCallBack: props.removeCallBack })), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkEdit) &&
34
+ (props === null || props === void 0 ? void 0 : props.BulkEditComponent) && (0, jsx_runtime_1.jsx)(BulkEdit, {}), (isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkAction) &&
35
+ (props === null || props === void 0 ? void 0 : props.bulkActionComponent)) && ((0, jsx_runtime_1.jsx)(BulkAction, { checkBoxSelection: featureDetails.checkBoxSelection })), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRefresh) && (0, jsx_runtime_1.jsx)(refresh_grid_1.default, {}), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySort) && (0, jsx_runtime_1.jsx)(custom_sort_1.default, {}), isComponentVisible(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRecords) && (0, jsx_runtime_1.jsx)(record_detail_1.default, {})] }))] }))) }));
25
36
  }
26
37
  exports.default = AdvancedFeatures;
@@ -19,13 +19,14 @@ const ColumnGroup = (props) => {
19
19
  const btnRef = (0, react_1.useRef)(null);
20
20
  const [searchText, setSearchedText] = (0, react_1.useState)("");
21
21
  const [checkedColumns, setCheckedColumns] = (0, react_1.useState)(new Set());
22
- const { gridApi, setGridData, setSelectedGroup, setFeatureDetails, featureDetails, initialCheckBoxData, intialColumns,
22
+ const { gridApi, setGridData, setSelectedGroup, setFeatureDetails, featureDetails, initialCheckBoxData, intialColumns, conditionsToDisplay,
23
23
  // setIntialColumns,
24
24
  } = (0, react_1.useContext)(context_provider_1.FeatureContext);
25
25
  const [columns, setColumns] = (0, react_1.useState)([]);
26
26
  const [renderColumns, setRenderColumns] = (0, react_1.useState)([]);
27
27
  const [columnsSelectedForGroup, setColumnsSelectedForGroup] = (0, react_1.useState)([]);
28
28
  const [selectedCheckBoxesLength, setSelectedCheckBoxesLength] = (0, react_1.useState)(null);
29
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displayRowGroupingElement);
29
30
  console.log("intiallllllllll", intialColumns, selectedCheckBoxesLength);
30
31
  // const [featureDetails, setFeatureDetails] = useState<Features>({
31
32
  // searchedText: "",
@@ -197,9 +198,9 @@ const ColumnGroup = (props) => {
197
198
  }, [(_d = (_c = (_b = (_a = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current) === null || _a === void 0 ? void 0 : _a.api) === null || _b === void 0 ? void 0 : _b.columnModel) === null || _c === void 0 ? void 0 : _c.columnDefs) === null || _d === void 0 ? void 0 : _d.length]);
198
199
  return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `${(columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length) > 0
199
200
  ? "bg-primary-50 h-38"
200
- : "bg-white icon-38x38"} hover:bg-primary-25 br-8 sc_icon_hover cursor-pointer px-2 flex align-items-cente gap-1 zoom_animate`, ref: btnRef, onClick: showColumnOptions }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "grid-01", size: 18, color: (columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length) > 0
201
+ : "bg-white icon-38x38"} hover:bg-primary-25 br-8 sc_icon_hover cursor-pointer px-2 flex align-items-cente gap-1 zoom_animate`, ref: btnRef, onClick: (e) => !isDisabled && showColumnOptions(e) }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "grid-01", size: 18, disabled: isDisabled, color: (columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length) > 0
201
202
  ? "text-primary-400"
202
- : "text-gray-500" }), (columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length) > 0 && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-center" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-primary-400 font-semibold ml-1" }, { children: columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-2 text-primary-400 font-semibold" }, { children: [(0, jsx_runtime_1.jsx)("p", Object.assign({ className: "ml-2 text-primary-400" }, { children: "Selected" })), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: (e) => clearListItems(e), className: "h-auto p-0 pad_0", text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", color: "text-primary-400", size: 18 }) })] }))] })))] })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: columnGroupRef, className: "column-group p-1", onHide: handleHide }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "column-header" }, { children: [(0, jsx_runtime_1.jsx)("h3", Object.assign({ className: "my-0" }, { children: "Grouping" })), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "my-0 mb-4" }, { children: "Select one or two columns for sorting" }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "column-body" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-right w-full p-2 bg-gray-50" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix top-0", style: { right: "20px" } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "search-md" }) })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { onChange: (e) => setSearchedText(e.target.value), value: searchText, disabled: false, placeholder: "Enter any column name", className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full" })] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column gap-1 m-1 max-h-15rem max-w-30rem overflow-y-auto" }, { children: renderColumns.length > 0 ? (renderColumns === null || renderColumns === void 0 ? void 0 : renderColumns.map((column, index) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [checkedColumns.has(column === null || column === void 0 ? void 0 : column.id) && ((0, jsx_runtime_1.jsx)("img", { onDragStart: (e) => onDragStart(e, index), onDragOver: onDragOver, onDrop: (e) => onDrop(e, index), src: drag_and_drop_icon_png_1.default, width: 20, height: 20, className: checkedColumns.has(column === null || column === void 0 ? void 0 : column.id)
203
+ : "text-gray-500" }), !isDisabled && (columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length) > 0 && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-center" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-primary-400 font-semibold ml-1" }, { children: columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-2 text-primary-400 font-semibold" }, { children: [(0, jsx_runtime_1.jsx)("p", Object.assign({ className: "ml-2 text-primary-400" }, { children: "Selected" })), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: (e) => clearListItems(e), className: "h-auto p-0 pad_0", text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", color: "text-primary-400", size: 18 }) })] }))] })))] })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: columnGroupRef, className: "column-group p-1", onHide: handleHide }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "column-header" }, { children: [(0, jsx_runtime_1.jsx)("h3", Object.assign({ className: "my-0" }, { children: "Grouping" })), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "my-0 mb-4" }, { children: "Select one or two columns for sorting" }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "column-body" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-right w-full p-2 bg-gray-50" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix top-0", style: { right: "20px" } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "search-md" }) })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { onChange: (e) => setSearchedText(e.target.value), value: searchText, disabled: false, placeholder: "Enter any column name", className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full" })] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column gap-1 m-1 max-h-15rem max-w-30rem overflow-y-auto" }, { children: renderColumns.length > 0 ? (renderColumns === null || renderColumns === void 0 ? void 0 : renderColumns.map((column, index) => ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [checkedColumns.has(column === null || column === void 0 ? void 0 : column.id) && ((0, jsx_runtime_1.jsx)("img", { onDragStart: (e) => onDragStart(e, index), onDragOver: onDragOver, onDrop: (e) => onDrop(e, index), src: drag_and_drop_icon_png_1.default, width: 20, height: 20, className: checkedColumns.has(column === null || column === void 0 ? void 0 : column.id)
203
204
  ? "col-gr-icon-active mr-2"
204
205
  : "col-gr-icon" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `flex gap-2 ${checkedColumns.has(column === null || column === void 0 ? void 0 : column.id) && "bg-primary-25"} hover:bg-primary-25 border-round-sm p-3 w-full` }, { children: [(0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { checked: checkedColumns.has(column === null || column === void 0 ? void 0 : column.id), onChange: (e) => onSelectedCheckbox(column, e), disabled: checkedColumns.size === 2 &&
205
206
  !checkedColumns.has(column === null || column === void 0 ? void 0 : column.id) }), (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "max-w-28rem line-clamp line-clamp-1 inline-block", title: column.headerName }, { children: column.headerName }))] }))] }), column === null || column === void 0 ? void 0 : column.id)))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "no-content" }, { children: "No Content" }))) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "column-footer gap-2 border-top-1 border-gray-200 flex align-items-center justify-content-between" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: "cursor-pointer", text: true, label: "Remove Grouping", onClick: (e) => clearListItems(e) }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "cursor-pointer", label: "Save Grouping", onClick: (e) => clearSearchAndSaveGrouping(e), disabled: (checkedColumns === null || checkedColumns === void 0 ? void 0 : checkedColumns.size) === 0 })] }))] }))] }));
@@ -9,14 +9,16 @@ 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"));
11
11
  const context_provider_1 = require("../context-provider");
12
+ const helper_1 = require("../helper");
12
13
  function Sort() {
13
14
  var _a, _b;
14
- const { sortValue, setSortValue, sortBy, setSortBy, isOverlayOpened, setIsOverlayOpened, featureDetails, callGrid, columnData, sortModelText, sortOptions } = (0, react_1.useContext)(context_provider_1.FeatureContext);
15
+ const { sortValue, setSortValue, sortBy, setSortBy, isOverlayOpened, setIsOverlayOpened, featureDetails, callGrid, columnData, sortModelText, sortOptions, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
15
16
  const showShort = (0, react_1.useRef)(null);
16
17
  const [sortInfo, setSortInfo] = (0, react_1.useState)();
17
18
  const sortType = sortValue === null || sortValue === void 0 ? void 0 : sortValue.dataType;
18
19
  const [isApplyDisable, setIsApplyDisable] = (0, react_1.useState)(true);
19
20
  const [showBorder, setShowBorder] = (0, react_1.useState)(false);
21
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displaySort);
20
22
  const onClickSort = (event) => {
21
23
  showShort.current.toggle(event);
22
24
  };
@@ -87,7 +89,7 @@ function Sort() {
87
89
  }
88
90
  }, [sortValue, sortBy]);
89
91
  return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `cursor-pointer sc_icon_hover flex align-items-center border-round hover:bg-primary-25 ${isOverlayOpened || featureDetails.sort.isSortable
90
- ? "bg-primary-50" : "bg-white"}` }, { children: [featureDetails.sort.isSortable && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "flex align-items-center text-primary-400 ml-3" }, { children: (sortModelText === null || sortModelText === void 0 ? void 0 : sortModelText.onSelectedSort) ? sortModelText.onSelectedSort : `Selected` }))), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `rounded_btn sc_icon_hover border-round-md`, onClick: (event) => onClickSort(event) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "switch-vertical-02", size: 16, color: isOverlayOpened || featureDetails.sort.isSortable
92
+ ? "bg-primary-50" : "bg-white"}` }, { children: [featureDetails.sort.isSortable && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "flex align-items-center text-primary-400 ml-3" }, { children: (sortModelText === null || sortModelText === void 0 ? void 0 : sortModelText.onSelectedSort) ? sortModelText.onSelectedSort : `Selected` }))), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `rounded_btn sc_icon_hover border-round-md`, onClick: (event) => !isDisabled && onClickSort(event) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "switch-vertical-02", disabled: isDisabled, size: 16, color: isOverlayOpened || featureDetails.sort.isSortable
91
93
  ? "text-primary-400"
92
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: (sortModelText === null || sortModelText === void 0 ? void 0 : sortModelText.header) ? sortModelText.header : "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) => {
93
95
  if (eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.isSortable) {
@@ -8,9 +8,11 @@ const react_1 = require("react");
8
8
  const context_provider_1 = require("../context-provider");
9
9
  const hooks_1 = require("primereact/hooks");
10
10
  const constants_1 = require("../constants");
11
+ const helper_1 = require("../helper");
11
12
  function Search({ searchPlaceHolder }) {
12
- const { featureDetails, setFeatureDetails, rowModelType, gridApi, quickSearch, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
13
+ const { featureDetails, setFeatureDetails, rowModelType, gridApi, quickSearch, conditionsToDisplay, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
13
14
  const [inputValue, deboucedValue, setInputValue] = (0, hooks_1.useDebounce)("", 500);
15
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displaySearch);
14
16
  (0, react_1.useEffect)(() => {
15
17
  var _a, _b, _c;
16
18
  if (rowModelType === constants_1.ROWMODELTYPE.CLIENT_SIDE && quickSearch) {
@@ -29,9 +31,9 @@ function Search({ searchPlaceHolder }) {
29
31
  setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: deboucedValue }));
30
32
  }
31
33
  }, [deboucedValue]);
32
- return ((0, jsx_runtime_1.jsxs)("div", 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 zoom_animate" }, { 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 zoom_animate", onClick: () => {
34
+ return ((0, jsx_runtime_1.jsxs)("div", 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 zoom_animate" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { color: "#667085", icon: "search-lg", size: 18, disabled: isDisabled }) })), featureDetails.searchedText.length > 0 && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix cursor-pointer zoom_animate", onClick: () => {
33
35
  setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: "" })),
34
36
  setInputValue("");
35
- }, 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" })] })));
37
+ }, 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) => !isDisabled && setInputValue(e.target.value), className: "w-21rem", placeholder: searchPlaceHolder || "Search by name or code", disabled: isDisabled })] })));
36
38
  }
37
39
  exports.default = Search;
@@ -6,14 +6,16 @@ const react_1 = require("react");
6
6
  const context_provider_1 = require("../context-provider");
7
7
  const inputtext_1 = require("primereact/inputtext");
8
8
  const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
9
+ const helper_1 = require("../helper");
9
10
  function GridSearch() {
10
- const { gridApi } = (0, react_1.useContext)(context_provider_1.FeatureContext);
11
+ const { gridApi, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
12
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displaySearch);
11
13
  const onFilterTextBoxChanged = (0, react_1.useCallback)(() => {
12
14
  var _a;
13
- if (gridApi === null || gridApi === void 0 ? void 0 : gridApi.current) {
15
+ if ((gridApi === null || gridApi === void 0 ? void 0 : gridApi.current) && !isDisabled) {
14
16
  (_a = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api) === null || _a === void 0 ? void 0 : _a.setGridOption("quickFilterText", document.getElementById("filter-text-box").value);
15
17
  }
16
18
  }, []);
17
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-20rem" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "search-md", size: 20 }) })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { type: "text", id: "filter-text-box", placeholder: "Search", onInput: onFilterTextBoxChanged, className: "text-lg font-normal text-gray-500 hover:text-gray-900 lh-40 w-full" })] })));
19
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-20rem" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "search-md", size: 20, disabled: isDisabled }) })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { type: "text", id: "filter-text-box", placeholder: "Search", onInput: onFilterTextBoxChanged, disabled: isDisabled, className: "text-lg font-normal text-gray-500 hover:text-gray-900 lh-40 w-full" })] })));
18
20
  }
19
21
  exports.default = GridSearch;
@@ -10,14 +10,16 @@ const inputswitch_1 = require("primereact/inputswitch");
10
10
  const inputtext_1 = require("primereact/inputtext");
11
11
  const sidebar_1 = require("primereact/sidebar");
12
12
  const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
13
+ const helper_1 = require("../helper");
13
14
  function HideColumn() {
14
- const { columnToRender, gridData, gridApi, updateColumnsForGrid, enableManageColumnsCallback, sidePanelText } = (0, react_1.useContext)(context_provider_1.FeatureContext);
15
+ const { columnToRender, gridData, gridApi, updateColumnsForGrid, enableManageColumnsCallback, sidePanelText, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
15
16
  const [visibleRight, setVisibleRight] = (0, react_1.useState)(false);
16
17
  const [enableManageColumnsCallbackAPI, setEnableManageColumnsCallbackAPI] = (0, react_1.useState)(false);
17
18
  const [inpValue, setInputValue] = (0, react_1.useState)("");
18
19
  const [storeNodes, setStoreNodes] = (0, react_1.useState)();
19
20
  const [nodes, setNodes] = (0, react_1.useState)();
20
21
  const [hidePanelNodes, setHidePanelNodes] = (0, react_1.useState)([]);
22
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displaySidePanel);
21
23
  const addColumns = () => {
22
24
  var _a;
23
25
  const columns = [];
@@ -164,7 +166,7 @@ function HideColumn() {
164
166
  setVisibleRight(false);
165
167
  setInputValue("");
166
168
  };
167
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ onClick: () => setVisibleRight(true), className: "rounded_btn sc_icon_hover" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "columns-02", size: 18 }) })), (0, jsx_runtime_1.jsxs)(sidebar_1.Sidebar, Object.assign({ className: "md:w-6 lg:w-4 overflow-hidden h-full ag_grid_sidebar", visible: visibleRight, position: "right", onHide: () => hidePanel() }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "sticky top-0 z-5 bg-white" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between align-items-center px-4 py-3 border-bottom-1 border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-gray-900 text-lg font-semibold line-height-3" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.header) || "Configure Columns" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: "font-semibold", text: true, label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.disacrd_button) || "Discard", onClick: () => hidePanel() }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "font-semibold", label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.update_button) || "Update", disabled: (storeNodes === null || storeNodes === void 0 ? void 0 : storeNodes.filter((node) => node.checked).length) > 15 ? true : false, onClick: () => updateColumns() })] }))] })), enableManageColumnsCallback &&
169
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ onClick: () => !isDisabled && setVisibleRight(true), className: "rounded_btn sc_icon_hover" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "columns-02", size: 18, disabled: isDisabled }) })), (0, jsx_runtime_1.jsxs)(sidebar_1.Sidebar, Object.assign({ className: "md:w-6 lg:w-4 overflow-hidden h-full ag_grid_sidebar", visible: visibleRight, position: "right", onHide: () => hidePanel() }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "sticky top-0 z-5 bg-white" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between align-items-center px-4 py-3 border-bottom-1 border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-gray-900 text-lg font-semibold line-height-3" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.header) || "Configure Columns" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: "font-semibold", text: true, label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.disacrd_button) || "Discard", onClick: () => hidePanel() }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "font-semibold", label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.update_button) || "Update", disabled: (storeNodes === null || storeNodes === void 0 ? void 0 : storeNodes.filter((node) => node.checked).length) > 15 ? true : false, onClick: () => updateColumns() })] }))] })), enableManageColumnsCallback &&
168
170
  (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4 pb-0" }, { children: [(0, jsx_runtime_1.jsxs)("h3", Object.assign({ className: "flex align-items-center justify-content-between my-0" }, { children: [(sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.apply_to_all_views) || "Apply to all views", (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: enableManageColumnsCallbackAPI, onChange: (e) => setEnableManageColumnsCallbackAPI(e.value) })] })), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "my-0 text-sm" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.apply_subHeading) || "Apply the chosen column selection to all available views" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "mt-2" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "search-md" }) })), (inpValue === null || inpValue === void 0 ? void 0 : inpValue.length) > 0 && (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix cursor-pointer zoom_animate", onClick: clearSearch }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18 }) })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { id: "email", value: inpValue, onChange: (e) => {
169
171
  searchHandler(e.target.value);
170
172
  }, disabled: false, placeholder: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.search_placeHolder) || "Search by column name", className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full my-2 lh-40" })] })) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4 pt-0" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "py-2 my-0 text-gray-900 text-lg font-semibold border-bottom-1 border-gray-200" }, { children: [(sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.selected_attributes) || "Selected Attributes", " ", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "text-gray-500 text-lg font-normal ml-1" }, { children: [`(`, nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.selected).length, "/", nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.unSelected || node.selected).length, `)`] }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "w-full -mt-2" }, { children: (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "list-none p-0 px-3" }, { children: (nodes === null || nodes === void 0 ? void 0 : nodes.length) > 0 ?
@@ -11,9 +11,10 @@ const inputtext_1 = require("primereact/inputtext");
11
11
  const overlaypanel_1 = require("primereact/overlaypanel");
12
12
  const svg_component_1 = tslib_1.__importDefault(require("../../../../directives/svg-component"));
13
13
  const constants_1 = tslib_1.__importDefault(require("../../constants"));
14
+ const helper_1 = require("../../helper");
14
15
  // import "./TableFilter.module.scss";
15
16
  const TableFilter = () => {
16
- const { featureDetails, columnData, conditionType, conditionTypes, globalFilters, setConditionType, setGlobalFilters, setFeatureDetails, callGrid, setViewName, viewName, createView, enableViewCreate, filterModelText, enableAdvancedFilter, gridApi, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
17
+ const { featureDetails, columnData, conditionType, conditionTypes, globalFilters, setConditionType, setGlobalFilters, setFeatureDetails, callGrid, setViewName, viewName, createView, enableViewCreate, filterModelText, enableAdvancedFilter, gridApi, conditionsToDisplay, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
17
18
  const columnId = "field";
18
19
  const columnName = "headerName";
19
20
  const showFilter = (0, react_1.useRef)(null);
@@ -22,6 +23,7 @@ const TableFilter = () => {
22
23
  const [enbleApply, setEnableApply] = (0, react_1.useState)(true);
23
24
  const [isOverlayOpened, setIsOverlayOpened] = (0, react_1.useState)(false);
24
25
  const [displayInput, setDisplayInput] = (0, react_1.useState)(false);
26
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displayFilter);
25
27
  const tableColumns = columnData === null || columnData === void 0 ? void 0 : columnData.filter((eachColumn) => eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.isFilterable).map((eachColumn) => ({
26
28
  name: eachColumn[columnName],
27
29
  code: eachColumn[columnId],
@@ -163,10 +165,10 @@ const TableFilter = () => {
163
165
  return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `cursor-pointer filter-btn-grid font-semibold hover:bg-primary-25 sc_icon_hover flex align-items-center gap-2 border-round-lg ${isOverlayOpened ||
164
166
  (globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
165
167
  ? "bg-primary-50"
166
- : "bg-white"}` }, { children: [(0, jsx_runtime_1.jsx)("div", { id: "advancedFilterParent", className: "hidden" }), (0, jsx_runtime_1.jsxs)("span", Object.assign({ onClick: (e) => onClickFilter(e), className: "flex zoom_animate", id: "advance-filter-id" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines", size: 18, color: isOverlayOpened ||
168
+ : "bg-white"}` }, { children: [(0, jsx_runtime_1.jsx)("div", { id: "advancedFilterParent", className: "hidden" }), (0, jsx_runtime_1.jsxs)("span", Object.assign({ onClick: (e) => !isDisabled && onClickFilter(e), className: "flex zoom_animate", id: "advance-filter-id" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines", size: 18, color: isOverlayOpened ||
167
169
  (globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
168
170
  ? "#243DC6"
169
- : "#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} ${(filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.onSelectedFilter)
171
+ : "#667085", disabled: isDisabled }), (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} ${(filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.onSelectedFilter)
170
172
  ? filterModelText.onSelectedFilter
171
173
  : "Selected"}`, (0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: (e) => {
172
174
  e.preventDefault();
@@ -5,8 +5,15 @@ const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  const react_1 = require("react");
6
6
  const context_provider_1 = require("../context-provider");
7
7
  const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
8
+ const helper_1 = require("../helper");
8
9
  function RefreshGrid() {
9
- const { removeFeaturesAndRefresh } = (0, react_1.useContext)(context_provider_1.FeatureContext);
10
- return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "rounded_btn sc_icon_hover", onClick: removeFeaturesAndRefresh }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "refresh-ccw-01", color: "text-gray-700" }) })));
10
+ const { removeFeaturesAndRefresh, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
11
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displayRefresh);
12
+ const refreshHandler = () => {
13
+ if (!isDisabled) {
14
+ removeFeaturesAndRefresh();
15
+ }
16
+ };
17
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "rounded_btn sc_icon_hover", onClick: refreshHandler }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "refresh-ccw-01", color: "text-gray-700", disabled: isDisabled }) })));
11
18
  }
12
19
  exports.default = RefreshGrid;
@@ -5,14 +5,18 @@ const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  const react_1 = require("react");
6
6
  const context_provider_1 = require("../context-provider");
7
7
  const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
8
+ const helper_1 = require("../helper");
8
9
  function RemoveItems(props) {
9
- const { featureDetails } = (0, react_1.useContext)(context_provider_1.FeatureContext);
10
+ const { featureDetails, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
10
11
  const { removeCallBack } = props;
12
+ const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displayRemoveItems);
11
13
  const removeItemsCallBack = () => {
12
- const currentFeature = Object.assign({}, featureDetails);
13
- // Callback from products
14
- removeCallBack(currentFeature);
14
+ if (!isDisabled && removeCallBack) {
15
+ const currentFeature = Object.assign({}, featureDetails);
16
+ // Callback from products
17
+ removeCallBack(currentFeature);
18
+ }
15
19
  };
16
- return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "rounded_btn sc_icon_hover", onClick: removeItemsCallBack }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", color: "text-red-800", size: 18 }) })));
20
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "rounded_btn sc_icon_hover", onClick: removeItemsCallBack }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", color: "text-red-800", size: 18, disabled: isDisabled }) })));
17
21
  }
18
22
  exports.default = RemoveItems;
@@ -6,7 +6,7 @@ const react_1 = require("react");
6
6
  const helper_1 = require("./helper");
7
7
  exports.FeatureContext = (0, react_1.createContext)(null);
8
8
  function MyProvider({ children, value }) {
9
- const { featureDetails, setFeatureDetails, gridData, callGrid, totalRecords, initialFeature, defaultFilters, createView, enableViewCreate, filterModelText, sortModelText, recordDetailModelText, sidePanelText, sortOptions, filterConditions, clearFilters, setGridData, gridApi, updateColumnsForGrid, enableManageColumnsCallback, columnToRender, selectedGroup, setSelectedGroup, initialCheckBoxData, intialColumns, setIntialColumns, rowModelType, quickSearch, enableAdvancedFilter, } = value;
9
+ const { featureDetails, setFeatureDetails, gridData, callGrid, totalRecords, initialFeature, defaultFilters, createView, enableViewCreate, filterModelText, sortModelText, recordDetailModelText, sidePanelText, sortOptions, filterConditions, clearFilters, setGridData, gridApi, updateColumnsForGrid, enableManageColumnsCallback, columnToRender, selectedGroup, setSelectedGroup, initialCheckBoxData, intialColumns, setIntialColumns, rowModelType, quickSearch, enableAdvancedFilter, conditionsToDisplay, } = value;
10
10
  // States for sort
11
11
  const [columnData] = (0, react_1.useState)(gridData === null || gridData === void 0 ? void 0 : gridData.columnData);
12
12
  const [sortValue, setSortValue] = (0, react_1.useState)({});
@@ -108,6 +108,7 @@ function MyProvider({ children, value }) {
108
108
  rowModelType,
109
109
  quickSearch,
110
110
  enableAdvancedFilter,
111
+ conditionsToDisplay,
111
112
  } }, { children: children })));
112
113
  }
113
114
  exports.default = MyProvider;
@@ -1,9 +1,10 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.deepClone = exports.handleCheckboxClick = exports.getGroupIds = exports.handleUncheckedState = exports.handleCheckedState = exports.updateGroupState = exports.determineConditions = exports.updateRecords = exports.autoGroupColumnDef = exports.fillOperation = exports.updateCells = exports.getCheckedStatus = exports.sortColumns = exports.parseIfNeeded = exports.applyDefaultFilters = exports.initialCheckBoxData = void 0;
3
+ exports.deepClone = exports.handleCheckboxClick = exports.getGroupIds = exports.handleUncheckedState = exports.handleCheckedState = exports.updateGroupState = exports.determineConditions = exports.updateRecords = exports.autoGroupColumnDef = exports.fillOperation = exports.updateCells = exports.getCheckedStatus = exports.sortColumns = exports.parseIfNeeded = exports.applyDefaultFilters = exports.isComponentDisable = exports.initialCheckBoxData = void 0;
4
4
  const tslib_1 = require("tslib");
5
5
  const react_1 = tslib_1.__importDefault(require("react"));
6
6
  const constants_1 = require("./constants");
7
+ const type_1 = require("../types/type");
7
8
  // initial checkbox data
8
9
  exports.initialCheckBoxData = {
9
10
  allBoxChecked: false,
@@ -12,6 +13,10 @@ exports.initialCheckBoxData = {
12
13
  excludedRecords: [],
13
14
  headerCheckBoxStatus: constants_1.GRID_CHECKBOX_STATUS.NEUTRAL,
14
15
  };
16
+ const isComponentDisable = (state) => {
17
+ return state === type_1.VisibilityState.DISABLE;
18
+ };
19
+ exports.isComponentDisable = isComponentDisable;
15
20
  const applyDefaultFilters = (defaultFilters) => {
16
21
  const filters = defaultFilters === null || defaultFilters === void 0 ? void 0 : defaultFilters.map((item) => {
17
22
  const obj = {
@@ -402,16 +407,22 @@ exports.handleUncheckedState = handleUncheckedState;
402
407
  // Utility function to update checkbox data in the state
403
408
  const updateCheckboxData = (newIncludedRecords, newExcludedRecords, gridData, featureDetails, setFeatureDetails, allBoxChecked) => {
404
409
  var _a, _b, _c, _d;
405
- if ((newIncludedRecords === null || newIncludedRecords === void 0 ? void 0 : newIncludedRecords.length) === 0 && ((_a = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _a === void 0 ? void 0 : _a.length) === 0 && !allBoxChecked) {
410
+ if ((newIncludedRecords === null || newIncludedRecords === void 0 ? void 0 : newIncludedRecords.length) === 0 &&
411
+ ((_a = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _a === void 0 ? void 0 : _a.length) === 0 &&
412
+ !allBoxChecked) {
406
413
  setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: Object.assign(Object.assign({}, featureDetails.checkBoxSelection), { excludedRecords: [], includedRecords: [], isIndeterminate: false, allBoxChecked: false }) }));
407
414
  }
408
- else if ((newIncludedRecords === null || newIncludedRecords === void 0 ? void 0 : newIncludedRecords.length) === ((_b = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _b === void 0 ? void 0 : _b.length) && (newIncludedRecords === null || newIncludedRecords === void 0 ? void 0 : newIncludedRecords.length) > 0) {
415
+ else if ((newIncludedRecords === null || newIncludedRecords === void 0 ? void 0 : newIncludedRecords.length) === ((_b = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _b === void 0 ? void 0 : _b.length) &&
416
+ (newIncludedRecords === null || newIncludedRecords === void 0 ? void 0 : newIncludedRecords.length) > 0) {
409
417
  setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: Object.assign(Object.assign({}, featureDetails.checkBoxSelection), { excludedRecords: [], includedRecords: [], isIndeterminate: false, allBoxChecked: true }) }));
410
418
  }
411
- else if ((newExcludedRecords === null || newExcludedRecords === void 0 ? void 0 : newExcludedRecords.length) === 0 && ((_c = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _c === void 0 ? void 0 : _c.length) === 0 && allBoxChecked) {
419
+ else if ((newExcludedRecords === null || newExcludedRecords === void 0 ? void 0 : newExcludedRecords.length) === 0 &&
420
+ ((_c = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _c === void 0 ? void 0 : _c.length) === 0 &&
421
+ allBoxChecked) {
412
422
  setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: Object.assign(Object.assign({}, featureDetails.checkBoxSelection), { excludedRecords: [], includedRecords: [], isIndeterminate: false, allBoxChecked: true }) }));
413
423
  }
414
- else if ((newExcludedRecords === null || newExcludedRecords === void 0 ? void 0 : newExcludedRecords.length) === ((_d = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _d === void 0 ? void 0 : _d.length) && (newExcludedRecords === null || newExcludedRecords === void 0 ? void 0 : newExcludedRecords.length) > 0) {
424
+ else if ((newExcludedRecords === null || newExcludedRecords === void 0 ? void 0 : newExcludedRecords.length) === ((_d = gridData === null || gridData === void 0 ? void 0 : gridData.rowData) === null || _d === void 0 ? void 0 : _d.length) &&
425
+ (newExcludedRecords === null || newExcludedRecords === void 0 ? void 0 : newExcludedRecords.length) > 0) {
415
426
  setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: Object.assign(Object.assign({}, featureDetails.checkBoxSelection), { excludedRecords: [], includedRecords: [], isIndeterminate: false, allBoxChecked: false }) }));
416
427
  }
417
428
  else {
@@ -408,7 +408,7 @@ function ParentForGrid(props) {
408
408
  setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: initialCheckBoxData }));
409
409
  }
410
410
  }, [props === null || props === void 0 ? void 0 : props.emptyCheckboxStatus]);
411
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(error_ui_1.default, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ id: "wrapper", style: { height: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.height, width: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.width }, className: `ag-grid-container ${(props === null || props === void 0 ? void 0 : props.enableAdvancedFilter) ? "hide-advance-filter" : ""}` }, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(context_provider_1.default, Object.assign({ value: Object.assign({ rowModelType: props.rowModelType, quickSearch: props === null || props === void 0 ? void 0 : props.quickSearch, featureDetails,
411
+ return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(error_ui_1.default, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ id: "wrapper", style: { height: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.height, width: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.width }, className: `ag-grid-container ${(props === null || props === void 0 ? void 0 : props.enableAdvancedFilter) ? "hide-advance-filter" : ""}` }, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(context_provider_1.default, Object.assign({ value: Object.assign(Object.assign({ rowModelType: props.rowModelType, quickSearch: props === null || props === void 0 ? void 0 : props.quickSearch, featureDetails,
412
412
  setFeatureDetails,
413
413
  gridData,
414
414
  callGrid,
@@ -417,6 +417,6 @@ function ParentForGrid(props) {
417
417
  defaultFilters, createView: props === null || props === void 0 ? void 0 : props.createView, enableViewCreate: (_k = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _k === void 0 ? void 0 : _k.enableViewCreate, filterModelText: (_l = props === null || props === void 0 ? void 0 : props.dynamicText) === null || _l === void 0 ? void 0 : _l.filterModelText, sortModelText: (_m = props === null || props === void 0 ? void 0 : props.dynamicText) === null || _m === void 0 ? void 0 : _m.sortModelText, recordDetailModelText: (_o = props === null || props === void 0 ? void 0 : props.dynamicText) === null || _o === void 0 ? void 0 : _o.recordDetailModelText, sidePanelText: (_p = props === null || props === void 0 ? void 0 : props.dynamicText) === null || _p === void 0 ? void 0 : _p.sidePanelText, sortOptions: (props === null || props === void 0 ? void 0 : props.sortOptions)
418
418
  ? props.sortOptions
419
419
  : constants_1.COLUMN_SORT_OPTIONS, filterConditions: props === null || props === void 0 ? void 0 : props.filterConditions, clearFilters: props === null || props === void 0 ? void 0 : props.clearFilters, setGridData, gridApi: gridRef, updateColumnsForGrid: props === null || props === void 0 ? void 0 : props.updateColumnsForGrid, enableManageColumnsCallback: props.enableManageColumnsCallback, columnToRender: gridData.columnData, selectedGroup: selectedGroup, setSelectedGroup: setSelectedGroup, initialCheckBoxData: initialCheckBoxData, intialColumns,
420
- setIntialColumns, enableAdvancedFilter: props === null || props === void 0 ? void 0 : props.enableAdvancedFilter }, ((props === null || props === void 0 ? void 0 : props.rowData) && { rowData: props === null || props === void 0 ? void 0 : props.rowData })) }, { children: ((_q = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _q === void 0 ? void 0 : _q.displayFeaturesHeader) && ((0, jsx_runtime_1.jsx)(advanced_feature_1.default, { props: props })) })), (0, jsx_runtime_1.jsx)(AgGrid_1.default, { style: gridStyle, gridOptions: gridOptions, onGridReady: (props === null || props === void 0 ? void 0 : props.rowData) ? undefined : onGridReady, gridRef: gridRef })] }) })) }) }));
420
+ setIntialColumns, enableAdvancedFilter: props === null || props === void 0 ? void 0 : props.enableAdvancedFilter }, ((props === null || props === void 0 ? void 0 : props.rowData) && { rowData: props === null || props === void 0 ? void 0 : props.rowData })), { conditionsToDisplay: props === null || props === void 0 ? void 0 : props.conditionsToDisplay }) }, { children: ((_q = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _q === void 0 ? void 0 : _q.displayFeaturesHeader) && ((0, jsx_runtime_1.jsx)(advanced_feature_1.default, { props: props })) })), (0, jsx_runtime_1.jsx)(AgGrid_1.default, { style: gridStyle, gridOptions: gridOptions, onGridReady: (props === null || props === void 0 ? void 0 : props.rowData) ? undefined : onGridReady, gridRef: gridRef })] }) })) }) }));
421
421
  }
422
422
  exports.default = ParentForGrid;
@@ -7,13 +7,13 @@ const dropdown_1 = require("primereact/dropdown");
7
7
  const DropdownComponent = () => {
8
8
  const [selectedCity, setSelectedCity] = (0, react_1.useState)(null);
9
9
  const cities = [
10
- { name: "New York", code: "NY" },
11
- { name: "Rome", code: "RM" },
12
- { name: "London", code: "LDN" },
13
- { name: "Istanbul", code: "IST" },
14
- { name: "Paris", code: "PRS" },
10
+ { name: 'New York', code: 'NY' },
11
+ { name: 'Rome', code: 'RM' },
12
+ { name: 'London', code: 'LDN' },
13
+ { name: 'Istanbul', code: 'IST' },
14
+ { name: 'Paris', code: 'PRS' },
15
15
  ];
16
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "card flex justify-content-center" }, { children: [(0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: selectedCity, onChange: (e) => setSelectedCity(e.value), options: cities, optionLabel: "name", placeholder: "Select a City", className: "w-full md:w-14rem" }), (0, jsx_runtime_1.jsx)("p", { className: "errorField flex align-items-center text-sm" })] })));
16
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "card flex justify-content-center" }, { children: (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: selectedCity, onChange: (e) => setSelectedCity(e.value), options: cities, optionLabel: "name", placeholder: "Select a City", className: "w-full md:w-14rem" }) })));
17
17
  };
18
18
  exports.DropdownComponent = DropdownComponent;
19
19
  exports.default = dropdown_1.Dropdown;
@@ -12,58 +12,76 @@ const max_1 = tslib_1.__importStar(require("react-phone-number-input/max"));
12
12
  const inputnumber_1 = require("primereact/inputnumber");
13
13
  const skeleton_1 = require("primereact/skeleton");
14
14
  const InputTextField = (props) => {
15
- const { errors, touched, name, length, label, placeholder, optional, maxLength, className, validate, disabled, isLoading, } = props;
16
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [!isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && ((0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] }))), !optional && ((0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label }))), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name, validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, Object.assign({ maxLength: maxLength, autoComplete: "off", disabled: disabled, placeholder: placeholder }, field, { className: ` ${errors[name] && touched[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"} ${className}`, id: name }))) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : "form_field"} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) })))] })));
15
+ const { errors, touched, name, length, label, placeholder, optional, maxLength, className, validate, disabled, isLoading } = props;
16
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [!isLoading ?
17
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && (0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] })), !optional && (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label })), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name, validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, Object.assign({ maxLength: maxLength, autoComplete: "off", disabled: disabled, placeholder: placeholder }, field, { className: ` ${errors[name] && touched[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'} ${className}`, id: name }))) }))] })
18
+ :
19
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : 'form_field'} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] }), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) }))] })));
17
20
  };
18
21
  const InputNumberField = (props) => {
19
- const { errors, touched, name, length, label, placeholder, useGrouping = false, optional, setFieldValue, min, max, maxLength, className, validate, disabled, isLoading, inputClassName, icon, iconPos, maxFractionDigits, minFractionDigits, } = props;
20
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [!isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && ((0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] }))), !optional && ((0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label }))), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: name, errors: errors, touched: touched, validate: validate }, { children: ({}) => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: icon ? ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: `p-input-icon-${iconPos}` }, { children: [(0, jsx_runtime_1.jsx)("i", { className: `pi pi-${icon} text-base` }), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { useGrouping: useGrouping, maxFractionDigits: maxFractionDigits ? maxFractionDigits : 0, minFractionDigits: minFractionDigits ? minFractionDigits : 0, inputClassName: inputClassName ? inputClassName : "", min: min, max: max, disabled: disabled, maxLength: maxLength, placeholder: placeholder, onValueChange: (e) => setFieldValue(name, e.value !== null ? e.value : min), className: ` ${errors[name] && touched[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"} ${className}`, id: name })] }))) : ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { useGrouping: useGrouping, maxFractionDigits: maxFractionDigits ? maxFractionDigits : 0, minFractionDigits: minFractionDigits ? minFractionDigits : 0, inputClassName: inputClassName ? inputClassName : "", min: min, max: max, disabled: disabled, maxLength: maxLength, placeholder: placeholder, onValueChange: (e) => setFieldValue(name, e.value !== null ? e.value : min), className: ` ${errors[name] && touched[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"} ${className}`, id: name })) })) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : "form_field"} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) })))] })));
22
+ const { errors, touched, name, length, label, placeholder, useGrouping = false, optional, setFieldValue, min, max, maxLength, className, validate, disabled, isLoading, inputClassName, icon, iconPos, maxFractionDigits, minFractionDigits } = props;
23
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column" }, { children: !isLoading ?
24
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && (0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] })), !optional && (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label })), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: name, errors: errors, touched: touched, validate: validate }, { children: ({}) => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: icon ?
25
+ (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: `p-input-icon-${iconPos}` }, { children: [(0, jsx_runtime_1.jsx)("i", { className: `pi pi-${icon} text-base` }), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { useGrouping: useGrouping, maxFractionDigits: maxFractionDigits ? maxFractionDigits : 0, minFractionDigits: minFractionDigits ? minFractionDigits : 0, inputClassName: inputClassName ? inputClassName : '', min: min, max: max, disabled: disabled, maxLength: maxLength, placeholder: placeholder, onValueChange: (e) => setFieldValue(name, e.value !== null ? e.value : min), className: ` ${errors[name] && touched[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'} ${className}`, id: name })] }))
26
+ :
27
+ (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { useGrouping: useGrouping, maxFractionDigits: maxFractionDigits ? maxFractionDigits : 0, minFractionDigits: minFractionDigits ? minFractionDigits : 0, inputClassName: inputClassName ? inputClassName : '', min: min, max: max, disabled: disabled, maxLength: maxLength, placeholder: placeholder, onValueChange: (e) => setFieldValue(name, e.value !== null ? e.value : min), className: ` ${errors[name] && touched[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'} ${className}`, id: name }) })) })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) }))] })
28
+ :
29
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : 'form_field'} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] }) })));
21
30
  };
22
31
  const InputCurrencyField = (props) => {
23
- const { errors, spanClassName, touched, name, length, label, placeholder, optional, setFieldValue, min, max, maxLength, className, validate, disabled, isLoading, } = props;
24
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [!isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && ((0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] }))), !optional && ((0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label }))), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: name, errors: errors, touched: touched, validate: validate }, { children: ({}) => ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: `${spanClassName} p-input-icon-left form_field` }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix text-lg text-gray-600 font-normal" }, { children: "$" })), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { "aria-autocomplete": "none", minFractionDigits: 2, disabled: disabled, min: min, max: max, maxLength: maxLength, onValueChange: (e) => setFieldValue(name, e.value !== null ? e.value : min), maxFractionDigits: 2, placeholder: placeholder, className: ` customNumberField ${errors[name] && touched[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"} ${className}`, id: name })] }))) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : "form_field"} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) })))] })));
32
+ const { errors, spanClassName, touched, name, length, label, placeholder, optional, setFieldValue, min, max, maxLength, className, validate, disabled, isLoading } = props;
33
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column" }, { children: !isLoading ?
34
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && (0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] })), !optional && (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label })), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: name, errors: errors, touched: touched, validate: validate }, { children: ({}) => ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: `${spanClassName} p-input-icon-left form_field` }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix text-lg text-gray-600 font-normal" }, { children: "$" })), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { "aria-autocomplete": "none", minFractionDigits: 2, disabled: disabled, min: min, max: max, maxLength: maxLength, onValueChange: (e) => setFieldValue(name, e.value !== null ? e.value : min), maxFractionDigits: 2, placeholder: placeholder, className: ` customNumberField ${errors[name] && touched[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'} ${className}`, id: name })] }))) })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) }))] })
35
+ :
36
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : 'form_field'} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] }) })));
25
37
  };
26
38
  const InputTextAreaField = (props) => {
27
39
  const [charCount, setCharCount] = (0, react_1.useState)(0);
28
- const { errors, touched, name, length, label, placeholder, optional, values, className, maxLength, validate, isLoading, } = props;
40
+ const { errors, touched, name, length, label, placeholder, optional, values, className, maxLength, validate, isLoading } = props;
29
41
  (0, react_1.useEffect)(() => {
30
42
  setCharCount(values[name].length);
31
43
  }, [values[name]]);
32
44
  (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }));
33
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column relative" }, { children: [!isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && ((0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] }))), !optional && ((0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label }))), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: name, type: "textarea", validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(inputtextarea_1.InputTextarea, Object.assign({ autoComplete: "off", placeholder: placeholder, style: {
34
- height: "154px",
35
- resize: "none",
36
- overflowY: "scroll",
37
- } }, field, { maxLength: maxLength, className: `pt-2 ${errors[name] && touched[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"} ${className}`, id: name })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "absolute text-base font-normal text-gray-600", style: { bottom: "20px", right: "12px" } }, { children: [charCount, "/", maxLength] }))] })) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : "form_field"} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) })))] })));
45
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column relative" }, { children: !isLoading ?
46
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && (0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] })), !optional && (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label })), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: name, type: "textarea", validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(inputtextarea_1.InputTextarea, Object.assign({ autoComplete: "off", placeholder: placeholder, style: { height: '154px', resize: 'none', overflowY: 'scroll' } }, field, { maxLength: maxLength, className: `pt-2 ${errors[name] && touched[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'} ${className}`, id: name })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "absolute text-base font-normal text-gray-600", style: { bottom: '20px', right: '12px' } }, { children: [charCount, "/", maxLength] }))] })) })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) }))] })
47
+ :
48
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : 'form_field'} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] }) })));
38
49
  };
39
50
  const DropDownField = (props) => {
40
- const { errors, touched, name, length, label, onFocus, placeholder, panelClassName, showClear, options, optional, customSelectedTemplate, customFieldsTemplate, optionLabel, optionDisabled, className, validate, disabled, filter, panelStyle, isLoading, } = props;
41
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [!isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && ((0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] }))), !optional && ((0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label }))), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name, validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({ onFocus: () => {
42
- onFocus && onFocus();
43
- }, panelClassName: panelClassName, showClear: showClear, panelStyle: panelStyle || "", filter: filter || false, disabled: disabled, placeholder: placeholder }, field, { options: options, itemTemplate: customFieldsTemplate, valueTemplate: customSelectedTemplate, optionDisabled: optionDisabled, optionLabel: optionLabel, className: ` ${errors[name] && touched[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"} ${className}`, id: name }))) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : "form_field"} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) })))] })));
51
+ const { errors, touched, name, length, label, onFocus, placeholder, panelClassName, showClear, options, optional, customSelectedTemplate, customFieldsTemplate, optionLabel, optionDisabled, className, validate, disabled, filter, panelStyle, isLoading } = props;
52
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column" }, { children: !isLoading ?
53
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && (0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] })), !optional && (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label })), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name, validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({ onFocus: () => { onFocus && onFocus(); }, panelClassName: panelClassName, showClear: showClear, panelStyle: panelStyle || '', filter: filter || false, disabled: disabled, placeholder: placeholder }, field, { options: options, itemTemplate: customFieldsTemplate, valueTemplate: customSelectedTemplate, optionDisabled: optionDisabled, optionLabel: optionLabel, className: ` ${errors[name] && touched[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'} ${className}`, id: name }))) })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) }))] })
54
+ :
55
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : 'form_field'} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] }) })));
44
56
  };
45
57
  const MultiSelectField = (props) => {
46
- const { errors, touched, name, length, label, placeholder, options, optional, customFieldsTemplate, optionLabel, optionDisabled, className, validate, disabled, isLoading, filter, } = props;
47
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [!isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && ((0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] }))), !optional && ((0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label }))), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name, validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(multiselect_1.MultiSelect, Object.assign({ filter: filter ? filter : false, disabled: disabled, placeholder: placeholder }, field, { options: options, itemTemplate: customFieldsTemplate, optionDisabled: optionDisabled, optionLabel: optionLabel, className: ` ${errors[name] && touched[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"} ${className}`, id: name }))) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : "form_field"} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) })))] })));
58
+ const { errors, touched, name, length, label, placeholder, options, optional, customFieldsTemplate, optionLabel, optionDisabled, className, validate, disabled, isLoading, filter } = props;
59
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column" }, { children: !isLoading ?
60
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && (0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] })), !optional && (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label })), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name, validate: validate }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(multiselect_1.MultiSelect, Object.assign({ filter: filter ? filter : false, disabled: disabled, placeholder: placeholder }, field, { options: options, itemTemplate: customFieldsTemplate, optionDisabled: optionDisabled, optionLabel: optionLabel, className: ` ${errors[name] && touched[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'} ${className}`, id: name }))) })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) }))] })
61
+ :
62
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `${className ? className : 'form_field'} ` }, { children: (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px" }) }))] }) })));
48
63
  };
49
64
  const PhoneNumberField = (props) => {
50
- const { errors, touched, name, length, values, label, placeholder, optional, position, setFieldValue, isLoading, } = props;
65
+ const { errors, touched, name, length, values, label, placeholder, optional, position, setFieldValue, isLoading } = props;
51
66
  const customCountry = (props) => {
52
67
  const customCountryTemplate = (options) => {
53
68
  let callCode = (0, max_1.getCountryCallingCode)(options.value);
54
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-2" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: `https://catamphetamine.github.io/country-flag-icons/3x2/${options.value}.svg`, alt: "countries", className: "border-circle", style: { width: "1.5rem", height: "1.5rem", objectFit: "cover" } }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-lg font-medium text-gray-900 line-height-3" }, { children: options.label })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "text-lg font-normal text-gray-600 line-height-3" }, { children: ["+", callCode] }))] })));
69
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'flex align-items-center gap-2' }, { children: [(0, jsx_runtime_1.jsx)("img", { src: `https://catamphetamine.github.io/country-flag-icons/3x2/${options.value}.svg`, alt: 'countries', className: 'border-circle', style: { width: '1.5rem', height: '1.5rem', objectFit: 'cover' } }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'text-lg font-medium text-gray-900 line-height-3' }, { children: options.label })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: 'text-lg font-normal text-gray-600 line-height-3' }, { children: ["+", callCode] }))] })));
55
70
  };
56
71
  const customSelectedVal = (options) => {
57
72
  if (options) {
58
- return ((0, jsx_runtime_1.jsx)("img", { src: `https://catamphetamine.github.io/country-flag-icons/3x2/${options.value}.svg`, alt: "selected-country", className: "border-circle ml-2", style: { width: "1.5rem", height: "1.5rem", objectFit: "cover" } }));
73
+ return ((0, jsx_runtime_1.jsx)("img", { src: `https://catamphetamine.github.io/country-flag-icons/3x2/${options.value}.svg`, alt: 'selected-country', className: 'border-circle ml-2', style: { width: '1.5rem', height: '1.5rem', objectFit: 'cover' } }));
59
74
  }
60
- return (0, jsx_runtime_1.jsx)("div", { children: placeholder });
75
+ return ((0, jsx_runtime_1.jsx)("div", { children: placeholder }));
61
76
  };
62
- return ((0, jsx_runtime_1.jsx)("div", Object.assign({ id: "customCountryDropDown" }, { children: (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: "countryCode" }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({ filter: true, filterBy: "label", options: props.options }, field, { panelClassName: `${position === "left" ? "" : "phoneNumberClass"}`, panelStyle: { maxWidth: "18rem" } }, props, { itemTemplate: customCountryTemplate, valueTemplate: customSelectedVal, optionLabel: "value", onChange: (e) => {
63
- setFieldValue("countryCode", e.value);
77
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ id: 'customCountryDropDown' }, { children: (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ name: "countryCode" }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({ filter: true, filterBy: 'label', options: props.options }, field, { panelClassName: `${position === 'left' ? '' : 'phoneNumberClass'}`, panelStyle: { maxWidth: '18rem' } }, props, { itemTemplate: customCountryTemplate, valueTemplate: customSelectedVal, optionLabel: 'value', onChange: (e) => {
78
+ setFieldValue('countryCode', e.value);
64
79
  } }))) })) })));
65
80
  };
66
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column gap-1" }, { children: [!isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && ((0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] }))), !optional && ((0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label }))), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(max_1.default, Object.assign({ international: true, countryCallingCodeEditable: false, withCountryCallingCode: false, countrySelectComponent: customCountry, usenationalformatfordefaultcountryvalue: "true", defaultCountry: values[name], limitMaxLength: true, className: ` flex align-items-center ${errors[name] ? "p-invalid" : ""} ${length === "full" ? "full_form_field" : "form_field"}` }, field, { onChange: (e) => setFieldValue(name, e) }))) }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px", className: `full_form_field` })] })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "errorField flex align-items-center text-sm" }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) })))] })));
81
+ return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex flex-column gap-1" }, { children: !isLoading ?
82
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [optional && (0, jsx_runtime_1.jsxs)("label", Object.assign({ className: "font-medium text-base mb-1 w-full flex justify-content-between", htmlFor: name }, { children: [label, (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-base font-medium font-italic text-gray-600" }, { children: "Optional" }))] })), !optional && (0, jsx_runtime_1.jsx)("label", Object.assign({ className: "font-medium text-base mb-1", htmlFor: name }, { children: label })), (0, jsx_runtime_1.jsx)(formik_1.Field, Object.assign({ type: "text", name: name }, { children: ({ field }) => ((0, jsx_runtime_1.jsx)(max_1.default, Object.assign({ international: true, countryCallingCodeEditable: false, withCountryCallingCode: false, countrySelectComponent: customCountry, usenationalformatfordefaultcountryvalue: "true", defaultCountry: values[name], limitMaxLength: true, className: ` flex align-items-center ${errors[name] ? 'p-invalid' : ''} ${length === 'full' ? 'full_form_field' : 'form_field'}` }, field, { onChange: (e) => setFieldValue(name, e) }))) })), errors[name] && touched[name] ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: errors[name] }) }))) : (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'errorField flex align-items-center text-sm' }, { children: (0, jsx_runtime_1.jsx)("span", { children: "\u00A0" }) }))] })
83
+ :
84
+ (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "20px", className: "mb-1 w-5rem" }), (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px", className: `full_form_field` })] }) })));
67
85
  };
68
86
  // const InputGroupField = (props: any) => {
69
87
  // const { errors, touched, name, length, label, placeholder, optional, position, setFieldValue, validate } = props;
@@ -84,13 +102,4 @@ const PhoneNumberField = (props) => {
84
102
  // </div>
85
103
  // )
86
104
  // }
87
- exports.default = {
88
- InputTextField,
89
- InputNumberField,
90
- InputCurrencyField,
91
- InputTextAreaField,
92
- DropDownField,
93
- MultiSelectField,
94
- PhoneNumberField,
95
- Field: formik_1.Field,
96
- };
105
+ exports.default = { InputTextField, InputNumberField, InputCurrencyField, InputTextAreaField, DropDownField, MultiSelectField, PhoneNumberField, Field: formik_1.Field };
@@ -493,7 +493,13 @@ const FormulaComponent = (props) => {
493
493
  }
494
494
  case "INCREASE_BY_PERCENTAGE":
495
495
  case "DECREASE_BY_PERCENTAGE": {
496
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-6 relative" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "absolute left-0 h-full flex align-items-center px-2" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "percent-01", size: 16, color: "#344054" }) })), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, Object.assign({ useGrouping: false, min: 0, max: 99, minFractionDigits: 2, maxFractionDigits: 2, maxLength: (props === null || props === void 0 ? void 0 : props.maxLength) || Infinity }, props === null || props === void 0 ? void 0 : props.field, { onValueChange: (e) => (props === null || props === void 0 ? void 0 : props.onChange) && (props === null || props === void 0 ? void 0 : props.onChange(e)), placeholder: "Enter Number", value: props === null || props === void 0 ? void 0 : props.inputValue, className: "border-none w-full", inputClassName: "border-none pl-8 focus:shadow-none" }))] })));
496
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-6 relative" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "absolute left-0 h-full flex align-items-center px-2" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "percent-01", size: 16, color: "#344054" }) })), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, Object.assign({ useGrouping: false, min: 0, max: 100, minFractionDigits: 2, maxFractionDigits: 2, maxLength: (props === null || props === void 0 ? void 0 : props.maxLength) || Infinity }, props === null || props === void 0 ? void 0 : props.field, { onChange: (e) => {
497
+ const value = e.value > 100 ? 100 : e.value;
498
+ e.originalEvent.target.value = value
499
+ ? value === null || value === void 0 ? void 0 : value.toFixed(2)
500
+ : 0;
501
+ console.log(e.value + "onCHange");
502
+ }, onValueChange: (e) => (props === null || props === void 0 ? void 0 : props.onChange) && (props === null || props === void 0 ? void 0 : props.onChange(e)), placeholder: "Enter Number", value: props === null || props === void 0 ? void 0 : props.inputValue, className: "border-none w-full", inputClassName: "border-none pl-8 focus:shadow-none" }))] })));
497
503
  }
498
504
  case "MANUAL": {
499
505
  return ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, Object.assign({ useGrouping: false, min: 0, minFractionDigits: 2, maxFractionDigits: 2, maxLength: (props === null || props === void 0 ? void 0 : props.maxLength) || Infinity }, props === null || props === void 0 ? void 0 : props.field, { onValueChange: (e) => (props === null || props === void 0 ? void 0 : props.onChange) && (props === null || props === void 0 ? void 0 : props.onChange(e)), placeholder: "Enter Number", value: props === null || props === void 0 ? void 0 : props.inputValue, className: "border-none w-6", inputClassName: "border-none focus:shadow-none" })));
@@ -111,7 +111,9 @@ onChange, footeTemplate, headerTemplate, labelIcon, labelIconPos, label, labelIc
111
111
  ? listBoxclassName
112
112
  : "w-16rem border-none "} `, filterPlaceholder: filterPlaceholder ? filterPlaceholder : "" }), footeTemplate && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: footeTemplate() })] }))),
113
113
  },
114
- ] }), !showChips ? ((0, jsx_runtime_1.jsx)(button_1.Button, { type: "button", className: `list_box_button focus:shadow-none p-0 h-max h-auto p-0 mx-2 ${buttonClassName}`, link: link ? true : false, icon: labelIcon ? labelIcon : "", size: labelIconSize ? labelIconSize : "", iconPos: labelIconPos ? labelIconPos : "", label: label, onClick: (event) => optionsMenuRef.current.toggle(event) })) : ((0, jsx_runtime_1.jsxs)("ul", Object.assign({ className: `pl-0 grid row-gap-2 list_box_chips ${chipsParentClassName}` }, { children: [(0, jsx_runtime_1.jsx)("li", Object.assign({ className: `cursor-pointer min-w-max mx-2 max-w-max ${buttonClassName}` }, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { type: "button", className: `list_box_button focus:shadow-none p-0 h-max h-auto mx-2`, link: link ? true : false, icon: labelIcon ? labelIcon : "", size: labelIconSize ? labelIconSize : "", iconPos: labelIconPos ? labelIconPos : "", label: label, onClick: (event) => optionsMenuRef.current.toggle(event), "aria-controls": "popup_menu_right", "aria-haspopup": true, ref: buttonRef }) })), selectedItems &&
114
+ ] }), !showChips ? ((0, jsx_runtime_1.jsx)(button_1.Button, { type: "button", className: `list_box_button focus:shadow-none p-0 h-max h-auto p-0 mx-2 ${buttonClassName}`, link: link ? true : false, icon: labelIcon ? labelIcon : "", size: labelIconSize ? labelIconSize : "", iconPos: labelIconPos ? labelIconPos : "", label: label, onClick: (event) => optionsMenuRef.current.toggle(event) })) : ((0, jsx_runtime_1.jsxs)("ul", Object.assign({ className: `pl-0 grid row-gap-2 list_box_chips ${chipsParentClassName}` }, { children: [(0, jsx_runtime_1.jsx)("li", Object.assign({ className: `cursor-pointer min-w-max mx-2 max-w-max ${buttonClassName}` }, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { type: "button",
115
+ // className={`list_box_button focus:shadow-none p-0 h-max h-auto mx-2`}
116
+ link: link ? true : false, icon: labelIcon ? labelIcon : "", size: labelIconSize ? labelIconSize : "", iconPos: labelIconPos ? labelIconPos : "", label: label, onClick: (event) => optionsMenuRef.current.toggle(event), "aria-controls": "popup_menu_right", "aria-haspopup": true, ref: buttonRef }) })), selectedItems &&
115
117
  (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.map((item, index) => {
116
118
  var _a, _b;
117
119
  return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isDraggable !== undefined ? ((0, jsx_runtime_1.jsx)("li", Object.assign({ draggable: isDraggable, onDragStart: (e) => handleDragStart(e, index), onDragOver: (e) => handleDragOver(e), onDrop: (e) => handleDrop(e, index), className: `${chipClassName ? chipClassName : ""} cursor-pointer min-w-max mx-2 max-w-max p-1 flex align-items-center bg-gray-50 text-gray-700 text-base border-1 border-gray-300 border-round-lg ${showRemoveIcon ? "pr-6 relative" : ""}` }, { children: chipTemplate ? (chipTemplate(item)) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [" ", typeof item === "object"
@@ -1,7 +1,9 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- ;
4
- ;
5
- ;
6
- ;
7
- ;
3
+ exports.VisibilityState = void 0;
4
+ var VisibilityState;
5
+ (function (VisibilityState) {
6
+ VisibilityState["ENABLE"] = "ENABLE";
7
+ VisibilityState["DISABLE"] = "DISABLE";
8
+ VisibilityState["HIDE"] = "HIDE";
9
+ })(VisibilityState = exports.VisibilityState || (exports.VisibilityState = {}));
@@ -22,12 +22,12 @@ const colorFunction = (data) => {
22
22
  return data;
23
23
  }
24
24
  };
25
- const SvgComponent = ({ icon, size, color, className }) => {
25
+ const SvgComponent = ({ icon, size, color, className, disabled }) => {
26
26
  const data2 = svg_icons_1.iconList.find((iconObject) => iconObject.name === icon);
27
27
  const data = data2 === null || data2 === void 0 ? void 0 : data2.svg.replace('width="24" height="24"', `width=${size ? `${size}` : 16} size=${size ? `${size}` : 16}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`).replace('stroke="#667085"', `stroke=${color ? colorFunction(color) : "#667085"}`);
28
28
  if (data === undefined) {
29
29
  return null;
30
30
  }
31
- return (0, jsx_runtime_1.jsx)("span", { className: `flex align-items-center justify-content-center${!className ? "" : ` ${className}`}`, dangerouslySetInnerHTML: { __html: data } });
31
+ return ((0, jsx_runtime_1.jsx)("span", { className: `flex align-items-center justify-content-center${!className ? "" : ` ${className}`} ${disabled && "p-disabled"}`, dangerouslySetInnerHTML: { __html: data } }));
32
32
  };
33
33
  exports.default = SvgComponent;
@@ -79,30 +79,30 @@ export interface GridData {
79
79
  columnData: ColumnDef[];
80
80
  }
81
81
  export interface ConditionsToDisplay {
82
- displayFilter?: boolean;
83
- displayAdvancedFilter?: boolean;
84
- displaySort?: boolean;
85
- displaySearch?: boolean;
86
- displayRefresh?: boolean;
87
- displayRemoveItems?: boolean;
88
- displayRecords?: boolean;
82
+ displayFilter?: string;
83
+ displayAdvancedFilter?: string;
84
+ displaySort?: string;
85
+ displaySearch?: string;
86
+ displayRefresh?: string;
87
+ displayRemoveItems?: string;
88
+ displayRecords?: string;
89
89
  displayGrouping?: boolean;
90
90
  displayColumnHide?: boolean;
91
- displayBulkAction?: boolean;
91
+ displayBulkAction?: string;
92
92
  enableViewCreate?: boolean;
93
- displaySidePanel?: boolean;
93
+ displaySidePanel?: string;
94
94
  enableFillHandle?: boolean;
95
- displayBulkEdit?: boolean;
95
+ displayBulkEdit?: string;
96
96
  displayDiscardEdit?: boolean;
97
97
  displaySaveEditButton?: boolean;
98
- displayEditHeading?: boolean;
98
+ displayEditHeading?: string;
99
99
  displayFeaturesHeader?: boolean;
100
100
  displayCheckboxOnRight?: boolean;
101
101
  displayCheckboxForGroupChild?: boolean;
102
102
  enableCheckboxForGroupHeader?: boolean;
103
103
  displayCheckboxForGroups?: boolean;
104
104
  displayGroupCount?: boolean;
105
- displayRowGroupingElement?: boolean;
105
+ displayRowGroupingElement?: string;
106
106
  isGridAutoHeight?: boolean;
107
107
  }
108
108
  export interface PropsFromProduct {
@@ -1,4 +1,4 @@
1
- import { CheckBoxSelection, ColumnDef, Features, FilterCondition, FilterModelText, GridData, RecordDetailModelText, SidePanelText, SortModelText } from "./Types";
1
+ import { CheckBoxSelection, ColumnDef, ConditionsToDisplay, Features, FilterCondition, FilterModelText, GridData, RecordDetailModelText, SidePanelText, SortModelText } from "./Types";
2
2
  export declare const FeatureContext: import("react").Context<any>;
3
3
  interface MyProviderProps {
4
4
  children: React.ReactNode;
@@ -32,6 +32,7 @@ interface MyProviderProps {
32
32
  rowModelType: string;
33
33
  quickSearch?: boolean;
34
34
  enableAdvancedFilter?: boolean;
35
+ conditionsToDisplay: ConditionsToDisplay;
35
36
  };
36
37
  }
37
38
  declare function MyProvider({ children, value }: MyProviderProps): import("react/jsx-runtime").JSX.Element;
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  import { CheckBoxSelection } from "./Types";
3
3
  export declare const initialCheckBoxData: CheckBoxSelection;
4
+ export declare const isComponentDisable: (state?: string) => boolean;
4
5
  export declare const applyDefaultFilters: (defaultFilters: any) => any;
5
6
  export declare const parseIfNeeded: (value: any) => any;
6
7
  export declare const sortColumns: (columns: any) => any;
@@ -1,3 +1,3 @@
1
- import { Dropdown } from "primereact/dropdown";
1
+ import { Dropdown } from 'primereact/dropdown';
2
2
  export declare const DropdownComponent: () => import("react/jsx-runtime").JSX.Element;
3
3
  export default Dropdown;
@@ -330,4 +330,9 @@ export interface FormulaTemplateTypes {
330
330
  field?: any;
331
331
  maxLength?: number;
332
332
  }
333
+ export declare enum VisibilityState {
334
+ ENABLE = "ENABLE",
335
+ DISABLE = "DISABLE",
336
+ HIDE = "HIDE"
337
+ }
333
338
  export {};
@@ -4,6 +4,7 @@ interface icon {
4
4
  color?: string;
5
5
  size?: number;
6
6
  className?: string;
7
+ disabled?: boolean;
7
8
  }
8
- declare const SvgComponent: ({ icon, size, color, className }: icon) => import("react/jsx-runtime").JSX.Element;
9
+ declare const SvgComponent: ({ icon, size, color, className, disabled }: icon) => import("react/jsx-runtime").JSX.Element;
9
10
  export default SvgComponent;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sccoreui",
3
- "version": "6.2.68",
3
+ "version": "6.2.70",
4
4
  "description": "ui-sccore",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",