sccoreui 6.2.10 → 6.2.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/App.scss CHANGED
@@ -342,13 +342,24 @@ code {
342
342
  align-items: center;
343
343
  padding: 10px 0px !important;
344
344
 
345
+ .chip_comp {
346
+ height: 44px !important;
347
+ border: 1px solid var(--gray-300);
348
+ overflow-y: auto;
349
+ .p-inputtext {
350
+ padding: 6px 20px 7px 20px;
351
+ height: 44px !important;
352
+ }
353
+ }
354
+
345
355
  .p-chips-multiple-container {
346
356
  padding: 7px 10px 6px 10px;
347
357
  width: 100%;
348
- max-height: 40px !important;
358
+ // max-height: 40px !important;
349
359
  border-top-left-radius: 0;
350
360
  border-bottom-left-radius: 0;
351
361
  overflow: auto;
362
+ height: 44px;
352
363
 
353
364
  &:not(.p-disabled):hover {
354
365
  border-color: var(--gray-300);
@@ -360,6 +371,18 @@ code {
360
371
  }
361
372
  }
362
373
 
374
+ .conditional_btn {
375
+ height: 30px;
376
+ width: 30px;
377
+ display: flex;
378
+ justify-content: center;
379
+ align-items: center;
380
+ // &:hover {
381
+ // background-color: var(--primary-25);
382
+ // border-radius: 6px;
383
+ // }
384
+ }
385
+
363
386
  .multi-pl-32 {
364
387
  padding-left: 40px;
365
388
  border: 1px solid red;
@@ -4,7 +4,6 @@ const tslib_1 = require("tslib");
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  // import { Dropdown, Button, SvgComponent, InputText, InputNumber, Calendar, MultiSelectDropDown } from "sccoreui";
6
6
  const Types_1 = require("../../../Types");
7
- const button_1 = require("primereact/button");
8
7
  const calendar_1 = require("primereact/calendar");
9
8
  const dropdown_1 = require("primereact/dropdown");
10
9
  const inputnumber_1 = require("primereact/inputnumber");
@@ -56,7 +55,7 @@ const Conditions = (props) => {
56
55
  return ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, className: "border-noround-left col-4 focus:shadow-none lh-44 h-44 flex align-items-center pl-3", value: value, placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.elementThreePlaceHolder_Input) ? filterModelText.elementThreePlaceHolder_Input : "Enter", onChange: (event) => handleDynamicFieldState(event.target.value) }));
57
56
  }
58
57
  else {
59
- return ((0, jsx_runtime_1.jsx)(chips_1.Chips, { value: value, disabled: !condition, className: "table_filters_1 border-noround-left col-4 focus:shadow-none lh-44 h-44 flex align-items-center", onChange: (e) => handleDynamicFieldState(e.target.value), placeholder: "Enter", separator: "," }));
58
+ return ((0, jsx_runtime_1.jsx)(chips_1.Chips, { value: value, disabled: !condition, className: "table_filters_1 border-noround-left col-4 focus:shadow-none lh-44 h-44 chip_comp flex align-items-center", onChange: (e) => handleDynamicFieldState(e.target.value), placeholder: "Enter", separator: "," }));
60
59
  }
61
60
  }
62
61
  case Types_1.FilterDataType.DECIMAL:
@@ -113,12 +112,12 @@ const Conditions = (props) => {
113
112
  return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "border-noround-left col-4 focus:shadow-none lh-44 h-44 flex align-items-center dropdown-focus-none pl-3", options: [], value: value, optionLabel: "name", placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.elementThreePlaceHolder_DropDown) ? filterModelText.elementThreePlaceHolder_DropDown : "Select", disabled: true }));
114
113
  }
115
114
  };
116
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "grid my-1 align-items-center" }, { children: [index !== 0 ?
115
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "grid my-1 align-items-center pt-2" }, { children: [index !== 0 ?
117
116
  (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "operator-type col-2 w-7rem mx-4 border-1 mb-1 border-gray-300 lh-44 h-44", options: conditionTypes, optionLabel: "label", placeholder: "Select", value: conditionType, disabled: index !== 1, onChange: (event) => handleConditionType(event.target.value) }) : (0, jsx_runtime_1.jsx)("div", { className: "col-2 w-7rem mx-4" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-9 grid filter-dropdowns overflow-y-hidden" }, { children: [(0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: `condition-dropdown dropdown-focus-none border-noround-right col-4 pl-3`, options: columnsArray, optionLabel: "name", placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.elementOnePlaceHolder) ? filterModelText.elementOnePlaceHolder : "Select", value: columnsArray.find((item) => item.code === columnName.code), onChange: (event) => onUpdateColumnName(event.value), panelClassName: "w-14rem" }), (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condition-type hide-focus border-noround remove-focus border-x-none filter-dropdown-grid col-4", value: condition, options: conditionsArray
118
117
  .filter((each) => {
119
118
  var _a;
120
119
  return (_a = constants_1.default.accessBasedOnDataType
121
120
  .find((access) => access.datatype === (columnName === null || columnName === void 0 ? void 0 : columnName.dataType))) === null || _a === void 0 ? void 0 : _a.conditions.includes(each.value);
122
- }), disabled: columnName === '', optionLabel: "name", placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.elementTwoPlaceHolder) ? filterModelText.elementTwoPlaceHolder : "Select", onChange: (event) => onUpdateCondition(event.value), panelClassName: "w-14rem" }), renderDynamicField(columnName)] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-start gap-1 col-1" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, className: "focus:shadow-none sc_icon_hover mb-2 h-auto p-0", onClick: () => onAddCondition(index), disabled: false }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-circle", size: 20, color: "text-gray-500" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, disabled: conditionsLength === 1, className: "focus:shadow-none sc_icon_hover h-auto p-0 mb-2", onClick: () => onRemoveCondition(id) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", size: 20, color: "text-gray-500" }) }))] }))] })));
121
+ }), disabled: columnName === '', optionLabel: "name", placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.elementTwoPlaceHolder) ? filterModelText.elementTwoPlaceHolder : "Select", onChange: (event) => onUpdateCondition(event.value), panelClassName: "w-14rem" }), renderDynamicField(columnName)] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-1 col-1 -mt-2" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "cursor-pointer conditional_btn", onClick: () => onAddCondition(index) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-circle", size: 20, color: "text-gray-500" }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `cursor-pointer conditional_btn ${conditionsLength === 1 ? "p-disabled" : ""}`, onClick: () => onRemoveCondition(id) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", size: 20, color: "text-gray-500" }) }))] }))] })));
123
122
  };
124
123
  exports.default = Conditions;
@@ -153,6 +153,6 @@ const TableFilter = () => {
153
153
  onresetFilter();
154
154
  } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18, color: "#243DC6" }) }))] })))] })) })), (0, jsx_runtime_1.jsx)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showFilter, onShow: () => setIsOverlayOpened(true), onHide: filterLogoToggle, className: "table-filter-overlay" }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-lg font-semibold line-height-3 text-gray-900" }, { children: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.header) ? filterModelText.header : "Filter" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-sm text-gray-600" }, { children: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.subHeader) ? filterModelText.subHeader : "Streamline Your Search With Filters" }))] })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-2" }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "max-h-14rem\toverflow-y-auto overflow-x-hidden flex flex-column gap-1" }, { children: conditionsArray.map((eachCondition, index) => {
155
155
  return ((0, jsx_runtime_1.jsx)("div", { children: renderCondition(eachCondition, index) }, index));
156
- }) })) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4 flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { text: true, className: "focus:shadow-none font-semibold", label: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.resetFilterAction) ? filterModelText.resetFilterAction : "Reset Filter", onClick: onresetFilter }) }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [!displayInput && enableViewCreate && ((0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base px-2 font-semibold text-primary-400 flex gap-2 p-1 px-4 flex justify-content-center focus:shadow-none mr-3", label: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.createViewAction) ? filterModelText.createViewAction : "Create view", onClick: () => setDisplayInput(true), disabled: !allFieldsFilled, text: true, iconPos: "left", icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus", color: "text-primary-400 mr-2" }) })), displayInput && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `p-input-suffix` }, { children: [displayInput && ((0, jsx_runtime_1.jsx)(button_1.Button, { onClick: createViewFromFilters, disabled: !viewName.length, className: "p-0 h-auto mr-2", text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "check", color: "text-gray-500" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setViewName(""), className: "p-0 h-auto", disabled: !viewName.length, text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", color: "text-gray-500" }) })] })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.createViewInputPlaceHolder) ? filterModelText.createViewInputPlaceHolder : "Enter", value: viewName, onChange: (e) => setViewName(e.target.value), className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full pl-3 pr-60 mr-3" })] }))), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base font-semibold text-gray-600 p-1 focus:shadow-none text-white w-4rem", label: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.applyAction) ? filterModelText.applyAction : "Apply", onClick: onApplyFilter, disabled: !allFieldsFilled })] }))] }))] }) }))] }));
156
+ }) })) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4 flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { outlined: true, className: "focus:shadow-none font-semibold border-none hover:bg-primary-25", label: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.resetFilterAction) ? filterModelText.resetFilterAction : "Reset Filter", onClick: onresetFilter }) }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [!displayInput && enableViewCreate && ((0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base px-2 font-semibold text-primary-400 flex gap-2 p-1 px-4 flex justify-content-center focus:shadow-none mr-3", label: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.createViewAction) ? filterModelText.createViewAction : "Create view", onClick: () => setDisplayInput(true), disabled: !allFieldsFilled, text: true, iconPos: "left", icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus", color: "text-primary-400 mr-2" }) })), displayInput && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `p-input-suffix` }, { children: [displayInput && ((0, jsx_runtime_1.jsx)(button_1.Button, { onClick: createViewFromFilters, disabled: !viewName.length, className: "p-0 h-auto mr-2", text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "check", color: "text-gray-500" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setViewName(""), className: "p-0 h-auto", disabled: !viewName.length, text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", color: "text-gray-500" }) })] })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.createViewInputPlaceHolder) ? filterModelText.createViewInputPlaceHolder : "Enter", value: viewName, onChange: (e) => setViewName(e.target.value), className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full pl-3 pr-60 mr-3" })] }))), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base font-semibold text-gray-600 p-1 focus:shadow-none text-white w-4rem", label: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.applyAction) ? filterModelText.applyAction : "Apply", onClick: onApplyFilter, disabled: !allFieldsFilled })] }))] }))] }) }))] }));
157
157
  };
158
158
  exports.default = TableFilter;
@@ -245,10 +245,12 @@ function ParentForGrid(props) {
245
245
  }
246
246
  return (0, jsx_runtime_1.jsx)(Wrapper, {});
247
247
  };
248
- const GridHeaderComponent = (props) => {
249
- if (props === null || props === void 0 ? void 0 : props.GroupHeaderComponent)
250
- return props === null || props === void 0 ? void 0 : props.GroupHeaderComponent;
251
- return (0, jsx_runtime_1.jsx)("span", { children: "Group Grid" });
248
+ const GridHeaderComponent = () => {
249
+ if (props === null || props === void 0 ? void 0 : props.GroupHeaderComponent) {
250
+ const CustomComponent = props === null || props === void 0 ? void 0 : props.GroupHeaderComponent;
251
+ return (0, jsx_runtime_1.jsx)(CustomComponent, {});
252
+ }
253
+ return (0, jsx_runtime_1.jsx)("span", { children: "Group " });
252
254
  };
253
255
  // Cell renderer with checkbox
254
256
  const cellRendererConditionally = (params) => {
@@ -310,7 +312,12 @@ function ParentForGrid(props) {
310
312
  return Object.assign(Object.assign({}, column), { headerName: (_b = column === null || column === void 0 ? void 0 : column.headerName) === null || _b === void 0 ? void 0 : _b.toUpperCase() });
311
313
  }
312
314
  }),
313
- autoGroupColumnDef: manageColumnGrouping(),
315
+ // autoGroupColumnDef: manageColumnGrouping(),
316
+ // Manage column grouping and use valueFormatter to handle display of '--'
317
+ autoGroupColumnDef: Object.assign(Object.assign({}, manageColumnGrouping()), { valueFormatter: (params) => {
318
+ // Replace '--' with an empty string or a custom placeholder
319
+ return (params === null || params === void 0 ? void 0 : params.value) === '--' ? '' : params === null || params === void 0 ? void 0 : params.value;
320
+ } }),
314
321
  treeData: (props === null || props === void 0 ? void 0 : props.enableTree) ? props === null || props === void 0 ? void 0 : props.enableTree : false,
315
322
  getDataPath: (props === null || props === void 0 ? void 0 : props.enableTree) ? getDataPath : null,
316
323
  defaultColDef: defaultColDef,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sccoreui",
3
- "version": "6.2.10",
3
+ "version": "6.2.12",
4
4
  "description": "ui-sccore",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -26,10 +26,38 @@
26
26
  "devDependencies": {
27
27
  "@types/react": "^18.2.8",
28
28
  "@types/react-dom": "^18.2.4",
29
+ "cross-env": "^7.0.3",
29
30
  "sass": "^1.62.1"
30
31
  },
31
32
  "dependencies": {
33
+ "@ag-grid-community/client-side-row-model": "^31.3.2",
34
+ "@ag-grid-community/core": "^31.3.2",
35
+ "@ag-grid-community/csv-export": "^31.3.2",
36
+ "@ag-grid-community/infinite-row-model": "^31.3.2",
37
+ "@ag-grid-community/react": "^31.3.2",
38
+ "@ag-grid-community/styles": "^31.3.2",
39
+ "@ag-grid-enterprise/advanced-filter": "^31.3.2",
40
+ "@ag-grid-enterprise/charts-enterprise": "^31.3.2",
41
+ "@ag-grid-enterprise/clipboard": "^31.3.2",
42
+ "@ag-grid-enterprise/column-tool-panel": "^31.3.2",
43
+ "@ag-grid-enterprise/core": "^31.3.2",
44
+ "@ag-grid-enterprise/excel-export": "^31.3.2",
45
+ "@ag-grid-enterprise/filter-tool-panel": "^31.3.2",
46
+ "@ag-grid-enterprise/master-detail": "^31.3.2",
47
+ "@ag-grid-enterprise/menu": "^31.3.2",
48
+ "@ag-grid-enterprise/multi-filter": "^31.3.2",
49
+ "@ag-grid-enterprise/range-selection": "^31.3.2",
50
+ "@ag-grid-enterprise/rich-select": "^31.3.2",
51
+ "@ag-grid-enterprise/row-grouping": "^31.3.2",
52
+ "@ag-grid-enterprise/server-side-row-model": "^31.3.2",
53
+ "@ag-grid-enterprise/set-filter": "^31.3.2",
54
+ "@ag-grid-enterprise/side-bar": "^31.3.2",
55
+ "@ag-grid-enterprise/sparklines": "^31.3.2",
56
+ "@ag-grid-enterprise/status-bar": "^31.3.2",
57
+ "@ag-grid-enterprise/viewport-row-model": "^31.3.2",
32
58
  "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
59
+ "@types/react": "18",
60
+ "@types/react-dom": "18",
33
61
  "ag-grid-react": "^31.2.1",
34
62
  "axios": "^1.6.8",
35
63
  "chart.js": "^4.3.0",
@@ -40,42 +68,15 @@
40
68
  "primeicons": "^6.0.1",
41
69
  "primereact": "^9.5.0",
42
70
  "quill": "^1.3.7",
71
+ "react": "18",
43
72
  "react-color": "^2.19.3",
73
+ "react-dom": "18",
44
74
  "react-froala-wysiwyg": "^4.1.2",
45
75
  "react-phone-number-input": "^3.3.6",
46
76
  "react-router-dom": "^6.12.0",
47
77
  "react-scripts": "^5.0.1",
48
78
  "typescript": "^4.9.5",
49
- "yup": "^1.3.2",
50
- "react": "18",
51
- "react-dom": "18",
52
- "@types/react": "18",
53
- "@types/react-dom": "18",
54
- "@ag-grid-community/react": "^31.3.2",
55
- "@ag-grid-community/core": "^31.3.2",
56
- "@ag-grid-community/styles": "^31.3.2",
57
- "@ag-grid-community/client-side-row-model": "^31.3.2",
58
- "@ag-grid-community/infinite-row-model": "^31.3.2",
59
- "@ag-grid-community/csv-export": "^31.3.2",
60
- "@ag-grid-enterprise/core": "^31.3.2",
61
- "@ag-grid-enterprise/charts-enterprise": "^31.3.2",
62
- "@ag-grid-enterprise/sparklines": "^31.3.2",
63
- "@ag-grid-enterprise/clipboard": "^31.3.2",
64
- "@ag-grid-enterprise/column-tool-panel": "^31.3.2",
65
- "@ag-grid-enterprise/excel-export": "^31.3.2",
66
- "@ag-grid-enterprise/filter-tool-panel": "^31.3.2",
67
- "@ag-grid-enterprise/master-detail": "^31.3.2",
68
- "@ag-grid-enterprise/menu": "^31.3.2",
69
- "@ag-grid-enterprise/range-selection": "^31.3.2",
70
- "@ag-grid-enterprise/rich-select": "^31.3.2",
71
- "@ag-grid-enterprise/row-grouping": "^31.3.2",
72
- "@ag-grid-enterprise/server-side-row-model": "^31.3.2",
73
- "@ag-grid-enterprise/set-filter": "^31.3.2",
74
- "@ag-grid-enterprise/multi-filter": "^31.3.2",
75
- "@ag-grid-enterprise/advanced-filter": "^31.3.2",
76
- "@ag-grid-enterprise/side-bar": "^31.3.2",
77
- "@ag-grid-enterprise/status-bar": "^31.3.2",
78
- "@ag-grid-enterprise/viewport-row-model": "^31.3.2"
79
+ "yup": "^1.3.2"
79
80
  },
80
81
  "browserslist": {
81
82
  "production": [