sccoreui 6.2.76 → 6.2.78
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 +31 -5
- package/dist/components/ag-grid/advancedFeature/advanced-feature.js +5 -5
- package/dist/components/ag-grid/advancedFeature/bulk-edit-action.js +3 -1
- package/dist/components/ag-grid/advancedFeature/column-group.js +4 -3
- package/dist/components/ag-grid/advancedFeature/custom-sort.js +7 -4
- package/dist/components/ag-grid/advancedFeature/global-search.js +2 -1
- package/dist/components/ag-grid/advancedFeature/gridS-search.js +2 -1
- package/dist/components/ag-grid/advancedFeature/hide-column.js +2 -1
- package/dist/components/ag-grid/advancedFeature/new-filter/table-filter.js +5 -4
- package/dist/components/ag-grid/advancedFeature/record-detail.js +3 -1
- package/dist/components/ag-grid/advancedFeature/refresh-grid.js +2 -1
- package/dist/components/ag-grid/advancedFeature/remove-items.js +2 -1
- package/dist/components/form/form-fields/form-fields.js +1 -1
- package/dist/components/skeletons/FeatureSkeleton.js +8 -0
- package/dist/types/components/skeletons/FeatureSkeleton.d.ts +2 -0
- package/package.json +1 -1
package/dist/App.scss
CHANGED
|
@@ -381,6 +381,12 @@ code {
|
|
|
381
381
|
}
|
|
382
382
|
}
|
|
383
383
|
|
|
384
|
+
.disabled {
|
|
385
|
+
cursor: not-allowed;
|
|
386
|
+
pointer-events: none;
|
|
387
|
+
opacity: 0.2;
|
|
388
|
+
}
|
|
389
|
+
|
|
384
390
|
// CUSTOM multiselect style started
|
|
385
391
|
.Multi_select_dropdown_panel {
|
|
386
392
|
.p-multiselect-header {
|
|
@@ -1054,6 +1060,31 @@ button[aria-expanded="true"] {
|
|
|
1054
1060
|
width: 30px !important;
|
|
1055
1061
|
}
|
|
1056
1062
|
|
|
1063
|
+
.icon-38x38 {
|
|
1064
|
+
height: 38px !important;
|
|
1065
|
+
width: 38px !important;
|
|
1066
|
+
display: flex;
|
|
1067
|
+
justify-content: center;
|
|
1068
|
+
align-items: center;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.icon-40x40 {
|
|
1072
|
+
height: 40px !important;
|
|
1073
|
+
width: 40px !important;
|
|
1074
|
+
display: flex;
|
|
1075
|
+
justify-content: center;
|
|
1076
|
+
align-items: center;
|
|
1077
|
+
&.feature-hover {
|
|
1078
|
+
&:hover {
|
|
1079
|
+
svg {
|
|
1080
|
+
path {
|
|
1081
|
+
stroke: var(--primary-400);
|
|
1082
|
+
}
|
|
1083
|
+
}
|
|
1084
|
+
}
|
|
1085
|
+
}
|
|
1086
|
+
}
|
|
1087
|
+
|
|
1057
1088
|
.list_box_dropdown {
|
|
1058
1089
|
.p-listbox-header {
|
|
1059
1090
|
padding: 12px !important;
|
|
@@ -2514,11 +2545,6 @@ button[aria-expanded="true"] {
|
|
|
2514
2545
|
height: 32px;
|
|
2515
2546
|
}
|
|
2516
2547
|
|
|
2517
|
-
.icon-38x38 {
|
|
2518
|
-
width: 32px;
|
|
2519
|
-
height: 32px;
|
|
2520
|
-
}
|
|
2521
|
-
|
|
2522
2548
|
.h-38 {
|
|
2523
2549
|
height: 38px;
|
|
2524
2550
|
}
|
|
@@ -28,10 +28,10 @@ function AdvancedFeatures({ props }) {
|
|
|
28
28
|
const AdvanceFilterWrapper = () => {
|
|
29
29
|
return AdvancedFilter && (0, jsx_runtime_1.jsx)(AdvancedFilter, {});
|
|
30
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:
|
|
32
|
-
(props === null || props === void 0 ? void 0 : props.EditHeadingDetails)
|
|
33
|
-
(props === null || props === void 0 ? void 0 : props.BulkEditComponent)
|
|
34
|
-
(props === null || props === void 0 ? void 0 : props.BulkEditComponent) && (0, jsx_runtime_1.jsx)(BulkEdit, {}),
|
|
35
|
-
(props === null || props === void 0 ? void 0 : props.bulkActionComponent)
|
|
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, {}))] }))] }))) }));
|
|
36
36
|
}
|
|
37
37
|
exports.default = AdvancedFeatures;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
3
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
5
|
const button_1 = require("primereact/button");
|
|
5
6
|
const utilComponents_1 = require("../utilComponents");
|
|
7
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../skeletons/FeatureSkeleton"));
|
|
6
8
|
function BulkEditAction({ props }) {
|
|
7
9
|
var _a, _b, _c;
|
|
8
10
|
const { dynamicText } = props;
|
|
@@ -16,6 +18,6 @@ function BulkEditAction({ props }) {
|
|
|
16
18
|
return;
|
|
17
19
|
props === null || props === void 0 ? void 0 : props.discardBulkEdit();
|
|
18
20
|
};
|
|
19
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
21
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, {})) : ((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: "text-base font-semibold", text: true, onClick: onDiscard, label: ((_a = dynamicText === null || dynamicText === void 0 ? void 0 : dynamicText.bulkEditAction) === null || _a === void 0 ? void 0 : _a.discard) || "Discard" }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base font-semibold", disabled: !((_b = props === null || props === void 0 ? void 0 : props.bulkEditedRecords) === null || _b === void 0 ? void 0 : _b.length), onClick: onSave, label: ((_c = dynamicText === null || dynamicText === void 0 ? void 0 : dynamicText.bulkEditAction) === null || _c === void 0 ? void 0 : _c.save) || "Update Changes" })] })));
|
|
20
22
|
}
|
|
21
23
|
exports.default = BulkEditAction;
|
|
@@ -12,6 +12,7 @@ const button_1 = require("primereact/button");
|
|
|
12
12
|
const context_provider_1 = require("../context-provider");
|
|
13
13
|
const helper_1 = require("../helper");
|
|
14
14
|
const utilComponents_1 = require("../utilComponents");
|
|
15
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../skeletons/FeatureSkeleton"));
|
|
15
16
|
// import { ColumnDef } from "../Types";
|
|
16
17
|
const ColumnGroup = (props) => {
|
|
17
18
|
var _a, _b, _c, _d;
|
|
@@ -197,9 +198,9 @@ const ColumnGroup = (props) => {
|
|
|
197
198
|
setRenderColumns(columnsFromGrid);
|
|
198
199
|
}
|
|
199
200
|
}, [(_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]);
|
|
200
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
201
|
-
|
|
202
|
-
|
|
201
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, {})) : ((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 ? "bg-primary-50" : "bg-white"} hover:bg-primary-25 br-8 icon-40x40 sc_icon_hover cursor-pointer px-2 flex align-items-cente gap-1 zoom_animate ${isDisabled && "disabled"}`, ref: btnRef, onClick: (e) => !isDisabled && showColumnOptions(e), title: "Column Grouping" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "grid-01", size: 18,
|
|
202
|
+
// disabled={isDisabled}
|
|
203
|
+
color: (columnsSelectedForGroup === null || columnsSelectedForGroup === void 0 ? void 0 : columnsSelectedForGroup.length) > 0
|
|
203
204
|
? "text-primary-400"
|
|
204
205
|
: "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)
|
|
205
206
|
? "col-gr-icon-active mr-2"
|
|
@@ -11,6 +11,7 @@ const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg
|
|
|
11
11
|
const context_provider_1 = require("../context-provider");
|
|
12
12
|
const helper_1 = require("../helper");
|
|
13
13
|
const utilComponents_1 = require("../utilComponents");
|
|
14
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../skeletons/FeatureSkeleton"));
|
|
14
15
|
function Sort() {
|
|
15
16
|
var _a, _b;
|
|
16
17
|
const { sortValue, setSortValue, sortBy, setSortBy, isOverlayOpened, setIsOverlayOpened, featureDetails, callGrid, columnData, sortModelText, sortOptions, conditionsToDisplay, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
@@ -89,13 +90,15 @@ function Sort() {
|
|
|
89
90
|
setIsApplyDisable(true);
|
|
90
91
|
}
|
|
91
92
|
}, [sortValue, sortBy]);
|
|
92
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
93
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, {})) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `icon-40x40 cursor-pointer sc_icon_hover flex align-items-center border-round hover:bg-primary-25 ${isDisabled && "disabled"} ${isOverlayOpened || featureDetails.sort.isSortable
|
|
93
94
|
? "bg-primary-50"
|
|
94
|
-
: "bg-white"}
|
|
95
|
+
: "bg-white"}`, title: "Column Sorting" }, { 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)
|
|
95
96
|
? sortModelText.onSelectedSort
|
|
96
|
-
: `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",
|
|
97
|
+
: `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",
|
|
98
|
+
// disabled={isDisabled}
|
|
99
|
+
size: 16, color: isOverlayOpened || featureDetails.sort.isSortable
|
|
97
100
|
? "text-primary-400"
|
|
98
|
-
: "text-gray-
|
|
101
|
+
: "text-gray-500" }) }))] })), (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) => {
|
|
99
102
|
if (eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.isSortable) {
|
|
100
103
|
const isSelected = eachColumn.field === (sortValue === null || sortValue === void 0 ? void 0 : sortValue.field);
|
|
101
104
|
return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ title: eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.headerName, className: `${isSelected && "bg-primary-25"} cursor-pointer br-6 flex align-items-center gap-2 px-3 py-2 text-base line-height-2 text-gray-700 hover:bg-primary-25 mb-1`, style: { listStyleType: "none" }, onClick: () => onSelectSortValue(eachColumn) }, { children: [(0, jsx_runtime_1.jsx)(radiobutton_1.RadioButton, { id: "tableSort", checked: isSelected, type: "circle", value: sortValue }), (0, jsx_runtime_1.jsx)("label", Object.assign({ className: `cursor-pointer line-clamp line-clamp-1 block w-15rem ${isSelected && "text-primary-400 font-semibold"}` }, { children: eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.headerName }))] }), index));
|
|
@@ -10,6 +10,7 @@ const hooks_1 = require("primereact/hooks");
|
|
|
10
10
|
const constants_1 = require("../constants");
|
|
11
11
|
const helper_1 = require("../helper");
|
|
12
12
|
const utilComponents_1 = require("../utilComponents");
|
|
13
|
+
const skeleton_1 = require("primereact/skeleton");
|
|
13
14
|
function Search({ searchPlaceHolder }) {
|
|
14
15
|
const { featureDetails, setFeatureDetails, rowModelType, gridApi, quickSearch, conditionsToDisplay, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
15
16
|
const [inputValue, deboucedValue, setInputValue] = (0, hooks_1.useDebounce)("", 500);
|
|
@@ -32,7 +33,7 @@ function Search({ searchPlaceHolder }) {
|
|
|
32
33
|
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: deboucedValue }));
|
|
33
34
|
}
|
|
34
35
|
}, [deboucedValue]);
|
|
35
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
36
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px", width: "336px" })) : ((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: () => {
|
|
36
37
|
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: "" }));
|
|
37
38
|
setInputValue("");
|
|
38
39
|
}, 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 })] })));
|
|
@@ -8,6 +8,7 @@ const inputtext_1 = require("primereact/inputtext");
|
|
|
8
8
|
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
|
|
9
9
|
const helper_1 = require("../helper");
|
|
10
10
|
const utilComponents_1 = require("../utilComponents");
|
|
11
|
+
const skeleton_1 = require("primereact/skeleton");
|
|
11
12
|
function GridSearch() {
|
|
12
13
|
const { gridApi, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
13
14
|
const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displaySearch);
|
|
@@ -17,6 +18,6 @@ function GridSearch() {
|
|
|
17
18
|
(_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);
|
|
18
19
|
}
|
|
19
20
|
}, []);
|
|
20
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
21
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px", width: "336px" })) : ((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" })] })));
|
|
21
22
|
}
|
|
22
23
|
exports.default = GridSearch;
|
|
@@ -12,6 +12,7 @@ const sidebar_1 = require("primereact/sidebar");
|
|
|
12
12
|
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
|
|
13
13
|
const helper_1 = require("../helper");
|
|
14
14
|
const utilComponents_1 = require("../utilComponents");
|
|
15
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../skeletons/FeatureSkeleton"));
|
|
15
16
|
function HideColumn() {
|
|
16
17
|
const { columnToRender, gridData, gridApi, updateColumnsForGrid, enableManageColumnsCallback, sidePanelText, conditionsToDisplay, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
17
18
|
const [visibleRight, setVisibleRight] = (0, react_1.useState)(false);
|
|
@@ -167,7 +168,7 @@ function HideColumn() {
|
|
|
167
168
|
setVisibleRight(false);
|
|
168
169
|
setInputValue("");
|
|
169
170
|
};
|
|
170
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
171
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, {})) : ((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 icon-40x40 ${isDisabled && "disabled"}`, title: "Manage Columns" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "columns-02", color: "text-gray-500", 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
|
|
171
172
|
? true
|
|
172
173
|
: false, onClick: () => updateColumns() })] }))] })), enableManageColumnsCallback && ((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) ||
|
|
173
174
|
"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) => {
|
|
@@ -13,6 +13,7 @@ const svg_component_1 = tslib_1.__importDefault(require("../../../../directives/
|
|
|
13
13
|
const constants_1 = tslib_1.__importDefault(require("../../constants"));
|
|
14
14
|
const helper_1 = require("../../helper");
|
|
15
15
|
const utilComponents_1 = require("../../utilComponents");
|
|
16
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../../skeletons/FeatureSkeleton"));
|
|
16
17
|
// import "./TableFilter.module.scss";
|
|
17
18
|
const TableFilter = () => {
|
|
18
19
|
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);
|
|
@@ -163,19 +164,19 @@ const TableFilter = () => {
|
|
|
163
164
|
});
|
|
164
165
|
setAllFieldsFilled(isAllFieldsFilled && enbleApply);
|
|
165
166
|
}, [conditionsArray, enbleApply]);
|
|
166
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
167
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, {})) : ((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 icon-40x40 sc_icon_hover flex align-items-center gap-2 border-round-lg ${isDisabled && "disabled"} ${isOverlayOpened ||
|
|
167
168
|
(globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
|
|
168
169
|
? "bg-primary-50"
|
|
169
|
-
: "bg-white"}
|
|
170
|
+
: "bg-white"}`, title: "Apply Filters" }, { 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 ||
|
|
170
171
|
(globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
|
|
171
172
|
? "#243DC6"
|
|
172
|
-
: "#667085"
|
|
173
|
+
: "#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)
|
|
173
174
|
? filterModelText.onSelectedFilter
|
|
174
175
|
: "Selected"}`, (0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: (e) => {
|
|
175
176
|
e.preventDefault();
|
|
176
177
|
e.stopPropagation();
|
|
177
178
|
onresetFilter();
|
|
178
|
-
} }, { 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)
|
|
179
|
+
} }, { 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 mt-5 -ml-2" }, { 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)
|
|
179
180
|
? filterModelText.subHeader
|
|
180
181
|
: "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) => {
|
|
181
182
|
return ((0, jsx_runtime_1.jsx)("div", { children: renderCondition(eachCondition, index) }, index));
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
3
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
5
|
const react_1 = require("react");
|
|
5
6
|
const context_provider_1 = require("../context-provider");
|
|
6
7
|
const utilComponents_1 = require("../utilComponents");
|
|
8
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../skeletons/FeatureSkeleton"));
|
|
7
9
|
function RecordDetail() {
|
|
8
10
|
const { totalRecords, recordDetailModelText } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
9
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
11
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, { width: "100px" })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (recordDetailModelText === null || recordDetailModelText === void 0 ? void 0 : recordDetailModelText.totalRecordHeader)
|
|
10
12
|
? `${recordDetailModelText.totalRecordHeader} ${totalRecords} `
|
|
11
13
|
: `Total ${totalRecords} records` }));
|
|
12
14
|
}
|
|
@@ -7,6 +7,7 @@ const context_provider_1 = require("../context-provider");
|
|
|
7
7
|
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
|
|
8
8
|
const helper_1 = require("../helper");
|
|
9
9
|
const utilComponents_1 = require("../utilComponents");
|
|
10
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../skeletons/FeatureSkeleton"));
|
|
10
11
|
function RefreshGrid() {
|
|
11
12
|
const { removeFeaturesAndRefresh, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
12
13
|
const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displayRefresh);
|
|
@@ -15,6 +16,6 @@ function RefreshGrid() {
|
|
|
15
16
|
removeFeaturesAndRefresh();
|
|
16
17
|
}
|
|
17
18
|
};
|
|
18
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
19
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, {})) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `rounded_btn sc_icon_hover icon-40x40 ${isDisabled && "disabled"}`, onClick: refreshHandler, title: "Refresh" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "refresh-ccw-01", color: "text-gray-500" }) })));
|
|
19
20
|
}
|
|
20
21
|
exports.default = RefreshGrid;
|
|
@@ -7,6 +7,7 @@ const context_provider_1 = require("../context-provider");
|
|
|
7
7
|
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
|
|
8
8
|
const helper_1 = require("../helper");
|
|
9
9
|
const utilComponents_1 = require("../utilComponents");
|
|
10
|
+
const FeatureSkeleton_1 = tslib_1.__importDefault(require("../../skeletons/FeatureSkeleton"));
|
|
10
11
|
function RemoveItems(props) {
|
|
11
12
|
const { featureDetails, conditionsToDisplay } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
12
13
|
const { removeCallBack } = props;
|
|
@@ -18,6 +19,6 @@ function RemoveItems(props) {
|
|
|
18
19
|
removeCallBack(currentFeature);
|
|
19
20
|
}
|
|
20
21
|
};
|
|
21
|
-
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(
|
|
22
|
+
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(FeatureSkeleton_1.default, {})) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `rounded_btn sc_icon_hover icon-40x40 ${isDisabled && "disabled"}`, onClick: removeItemsCallBack, title: "Remove" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", color: "text-red-800", size: 18 }) })));
|
|
22
23
|
}
|
|
23
24
|
exports.default = RemoveItems;
|
|
@@ -21,7 +21,7 @@ const InputNumberField = (props) => {
|
|
|
21
21
|
};
|
|
22
22
|
const InputCurrencyField = (props) => {
|
|
23
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.jsx)("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 })] }))) })), 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" }) })))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "16px", 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" }) })), (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" }) }))] })) })));
|
|
24
|
+
return ((0, jsx_runtime_1.jsx)("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: ({ field }) => ((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, Object.assign({ "aria-autocomplete": "none", minFractionDigits: 2, disabled: disabled, min: min, max: max, maxLength: maxLength }, field, { 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" }) })))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "16px", 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" }) })), (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" }) }))] })) })));
|
|
25
25
|
};
|
|
26
26
|
const InputTextAreaField = (props) => {
|
|
27
27
|
const [charCount, setCharCount] = (0, react_1.useState)(0);
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
const skeleton_1 = require("primereact/skeleton");
|
|
5
|
+
const FeatureSkeleton = ({ height, width }) => {
|
|
6
|
+
return ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: height ? height : "30px", width: width ? width : "30px" }));
|
|
7
|
+
};
|
|
8
|
+
exports.default = FeatureSkeleton;
|