awing-library 2.1.124-beta → 2.1.124

package/lib/AWING/DataForm/DataInput.js

@@ -10,6 +10,29 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -28,7 +51,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = require("react");
 var jsx_runtime_1 = require("react/jsx-runtime");
 // @ts-nocheck
-var react_2 = __importDefault(require("react"));
+var react_2 = __importStar(require("react"));
 var moment_1 = __importDefault(require("moment"));
 var react_i18next_1 = require("react-i18next");
 var material_1 = require("@mui/material");
@@ -43,14 +66,18 @@ var GeoFencing_1 = __importDefault(require("../../ACM-AXN/GeoFencing"));
 var i18n_1 = __importDefault(require("../../i18n"));
 var omit = require('lodash/omit');
 function DataInput(props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
     var t = (0, react_i18next_1.useTranslation)(undefined, { i18n: i18n_1.default }).t;
     var fieldDefinition = props.fieldDefinition, onChange = props.onChange, value = props.value, error = props.error, disableHelperText = props.disableHelperText;
     var fieldName = fieldDefinition.fieldName, type = fieldDefinition.type, onValidate = fieldDefinition.onValidate, min = fieldDefinition.min, max = fieldDefinition.max, pattern = fieldDefinition.pattern, other = __rest(fieldDefinition, ["fieldName", "type", "onValidate", "min", "max", "pattern"]);
-    var _k = react_2.default.useState(t('Common.InvalidData')), errorText = _k[0], setErrorText = _k[1];
+    var _o = react_2.default.useState(t('Common.InvalidData')), errorText = _o[0], setErrorText = _o[1];
+    var _p = react_2.default.useState(type === 'number' ? value : ''), numberValue = _p[0], setNumberValue = _p[1];
     var checkValidationValue = function (fieldDefinition, val) {
         if (!fieldDefinition.required &&
-            (val === undefined || val === null || val === '' || (Array.isArray(val) && val.length === 0)))
+            (val === undefined ||
+                val === null ||
+                val === '' ||
+                (Array.isArray(val) && val.length === 0)))
             return true;
         if (fieldDefinition.onValidate)
             return fieldDefinition.onValidate(val, fieldDefinition === null || fieldDefinition === void 0 ? void 0 : fieldDefinition.length, fieldDefinition === null || fieldDefinition === void 0 ? void 0 : fieldDefinition.pattern);
@@ -94,6 +121,18 @@ function DataInput(props) {
                 return (0, validation_1.notNullValid)(val);
         }
     };
+    (0, react_2.useEffect)(function () {
+        if (type === 'number' && Number(value) !== Number(numberValue))
+            setNumberValue(Number(value));
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [type, value]);
+    var handleParamValueChange = function () {
+        var newValue = Number(numberValue);
+        setNumberValue(newValue);
+        if (type === 'number' && Number(value) !== newValue) {
+            onChange(newValue, checkValidationValue(fieldDefinition, newValue));
+        }
+    };
     switch (type) {
         case 'logic-expression': {
             return ((0, jsx_runtime_1.jsx)(LogicExpression_1.default, __assign({ cf: function (newValue, valid) {
@@ -108,6 +147,7 @@ function DataInput(props) {
                         : '' }) }));
         }
         case 'autocomplete': {
+            var autocompleteValue_1 = (_b = fieldDefinition.value) !== null && _b !== void 0 ? _b : value;
             return ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { multiple: fieldDefinition.multiple, options: fieldDefinition.options, getOptionLabel: function (option) { var _a, _b; return (_b = (_a = option.label) !== null && _a !== void 0 ? _a : option.text) !== null && _b !== void 0 ? _b : ''; }, isOptionEqualToValue: function (option, value) {
                     return (option === null || option === void 0 ? void 0 : option.value) === (value === null || value === void 0 ? void 0 : value.value);
                 }, getOptionKey: function (option) { return option.value; }, disableclearable: fieldDefinition.disableClearable, getOptionDisabled: function (option) { return option === null || option === void 0 ? void 0 : option.disabled; }, onChange: function (e, value) {
@@ -117,9 +157,11 @@ function DataInput(props) {
                     onChange(newValue, checkValidationValue(fieldDefinition, newValue));
                 }, value: fieldDefinition.multiple
                     ? fieldDefinition.options.filter(function (x) {
-                        return (value !== null && value !== void 0 ? value : []).includes(x.value);
+                        return (autocompleteValue_1 !== null && autocompleteValue_1 !== void 0 ? autocompleteValue_1 : []).includes(x.value);
                     })
-                    : fieldDefinition.options.find(function (x) { return x.value === value; }) || null, clearOnEscape: true, fullWidth: true, disableCloseOnSelect: fieldDefinition.multiple, readOnly: fieldDefinition.readOnly, renderInput: function (params) {
+                    : (_c = fieldDefinition.options.find(function (x) {
+                        return x.value === autocompleteValue_1;
+                    })) !== null && _c !== void 0 ? _c : '', clearOnEscape: true, fullWidth: true, disableCloseOnSelect: fieldDefinition.multiple, readOnly: fieldDefinition.readOnly, renderInput: function (params) {
                     var _a;
                     return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({}, params, other, { variant: "standard", error: error, helperText: !disableHelperText && error
                             ? (_a = fieldDefinition.helperText) !== null && _a !== void 0 ? _a : t('Common.InvalidData')
@@ -134,7 +176,7 @@ function DataInput(props) {
                     : undefined }));
         }
         case 'checkbox': {
-            return ((0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { id: fieldName.toString(), name: fieldName.toString(), checked: value, onChange: function (event) {
+            return ((0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { disabled: (_d = fieldDefinition.disabled) !== null && _d !== void 0 ? _d : false, id: fieldName.toString(), name: fieldName.toString(), checked: value, onChange: function (event) {
                             return onChange(event.target.checked, checkValidationValue(fieldDefinition, event.target.checked));
                         }, color: "primary", readOnly: fieldDefinition.readOnly }), label: fieldDefinition.label }) }));
         }
@@ -143,7 +185,7 @@ function DataInput(props) {
                     return onChange(date === null || date === void 0 ? void 0 : date.toDate(), checkValidationValue(fieldDefinition, date === null || date === void 0 ? void 0 : date.toDate()));
                 }, readOnly: fieldDefinition.readOnly, slotProps: {
                     textField: __assign(__assign({ required: fieldDefinition.required, fullWidth: true, variant: 'standard' }, other), { error: error, helperText: !disableHelperText && error
-                            ? (_b = fieldDefinition.helperText) !== null && _b !== void 0 ? _b : t('Common.InvalidData')
+                            ? (_e = fieldDefinition.helperText) !== null && _e !== void 0 ? _e : t('Common.InvalidData')
                             : '' }),
                 } }));
         }
@@ -152,12 +194,12 @@ function DataInput(props) {
                     return onChange(date === null || date === void 0 ? void 0 : date.toDate(), checkValidationValue(fieldDefinition, date === null || date === void 0 ? void 0 : date.toDate()));
                 }, slotProps: {
                     textField: __assign(__assign({ required: fieldDefinition.required, fullWidth: true, variant: 'standard' }, other), { error: error, helperText: !disableHelperText && error
-                            ? (_c = fieldDefinition.helperText) !== null && _c !== void 0 ? _c : t('Common.InvalidData')
+                            ? (_f = fieldDefinition.helperText) !== null && _f !== void 0 ? _f : t('Common.InvalidData')
                             : '' }),
                 }, readOnly: fieldDefinition.readOnly }));
         }
         case 'date-range': {
-            var _l = other, isDayBlocked = _l.isDayBlocked, isOutsideRange = _l.isOutsideRange;
+            var _q = other, isDayBlocked = _q.isDayBlocked, isOutsideRange = _q.isOutsideRange;
             return ((0, jsx_runtime_1.jsx)(AWING_1.DateRangePicker, { noBorder: true, variant: "standard", textFieldProps: __assign({ fullWidth: true, style: { margin: '8px 0px' } }, omit(other, ['isDayBlocked', 'isOutsideRange'])), value: {
                     startDate: (value === null || value === void 0 ? void 0 : value[0]) || null,
                     endDate: (value === null || value === void 0 ? void 0 : value[1]) || null,
@@ -165,15 +207,16 @@ function DataInput(props) {
                     var newValue = [dateRange.startDate, dateRange.endDate];
                     onChange(newValue, checkValidationValue(fieldDefinition, newValue));
                 }, label: fieldDefinition.label, error: error, helperText: !disableHelperText && error
-                    ? (_d = fieldDefinition.helperText) !== null && _d !== void 0 ? _d : t('Common.InvalidData')
+                    ? (_g = fieldDefinition.helperText) !== null && _g !== void 0 ? _g : t('Common.InvalidData')
                     : '', disableHelperText: disableHelperText, isDayBlocked: isDayBlocked, isOutsideRange: isOutsideRange }));
         }
         case 'number': {
-            return ((0, jsx_runtime_1.jsx)(AWING_1.NumberFormat, __assign({ id: fieldName.toString(), name: fieldName.toString(), fullWidth: true, variant: "standard" }, other, { value: value !== null && value !== void 0 ? value : '', onChange: function (event) {
-                    var newValue = Number(event.target.value);
-                    onChange(newValue, checkValidationValue(fieldDefinition, newValue));
-                }, error: error, helperText: !disableHelperText && error
-                    ? (_e = fieldDefinition.helperText) !== null && _e !== void 0 ? _e : t('Common.InvalidData')
+            return ((0, jsx_runtime_1.jsx)(AWING_1.NumberFormat, __assign({ id: fieldName.toString(), name: fieldName.toString(), fullWidth: true, variant: "standard" }, other, { value: numberValue !== null && numberValue !== void 0 ? numberValue : '', onChange: function (event) {
+                    var newValue = event.target.value;
+                    setNumberValue(newValue);
+                    onChange(Number(newValue), checkValidationValue(fieldDefinition, Number(newValue)));
+                }, onBlur: handleParamValueChange, error: error, helperText: !disableHelperText && error
+                    ? (_h = fieldDefinition.helperText) !== null && _h !== void 0 ? _h : t('Common.InvalidData')
                     : '' })));
         }
         case 'radio': {
@@ -188,7 +231,7 @@ function DataInput(props) {
         case 'text':
         case 'text-area': {
             return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({ id: fieldName.toString(), name: fieldName.toString(), type: 'text', fullWidth: true, variant: "standard", multiline: fieldDefinition.type === 'text-area', error: error, helperText: !disableHelperText && error
-                    ? (_f = fieldDefinition.helperText) !== null && _f !== void 0 ? _f : errorText
+                    ? (_j = fieldDefinition.helperText) !== null && _j !== void 0 ? _j : errorText
                     : '' }, other, { value: value !== null && value !== void 0 ? value : '', onChange: function (event) {
                     return onChange(event.target.value, checkValidationValue(fieldDefinition, event.target.value));
                 } })));
@@ -200,7 +243,7 @@ function DataInput(props) {
                         : event.target.value;
                     onChange(event.target.value, checkValidationValue(fieldDefinition, newValue));
                 }, error: error, helperText: !disableHelperText && error
-                    ? (_g = fieldDefinition.helperText) !== null && _g !== void 0 ? _g : t('Common.InvalidData')
+                    ? (_k = fieldDefinition.helperText) !== null && _k !== void 0 ? _k : t('Common.InvalidData')
                     : '' }, other, { children: [!fieldDefinition.required && ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "", children: (0, jsx_runtime_1.jsx)("em", { children: t('Common.None') }) })), fieldDefinition.options.map(function (item, index) {
                         var _a;
                         return ((0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: item.value, disabled: item.disabled ||
@@ -214,7 +257,7 @@ function DataInput(props) {
             return ((0, jsx_runtime_1.jsx)(AWING_1.MultipleHierarchicalChoice, __assign({}, fieldDefinition, { variant: "standard", value: value, onChange: function (value) {
                     onChange(value, checkValidationValue(fieldDefinition, value));
                 }, error: error, helperText: !disableHelperText && error
-                    ? (_h = fieldDefinition.helperText) !== null && _h !== void 0 ? _h : t('Common.InvalidData')
+                    ? (_l = fieldDefinition.helperText) !== null && _l !== void 0 ? _l : t('Common.InvalidData')
                     : '' })));
         }
         case 'geo-fencing': {
@@ -227,7 +270,7 @@ function DataInput(props) {
             return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({ id: fieldName.toString(), name: fieldName.toString(), type: fieldDefinition.type, fullWidth: true, variant: "standard" }, other, { value: value !== null && value !== void 0 ? value : '', onChange: function (event) {
                     return onChange(event.target.value, checkValidationValue(fieldDefinition, event.target.value));
                 }, error: error, helperText: !disableHelperText && error
-                    ? (_j = fieldDefinition.helperText) !== null && _j !== void 0 ? _j : t('Common.InvalidData')
+                    ? (_m = fieldDefinition.helperText) !== null && _m !== void 0 ? _m : t('Common.InvalidData')
                     : '' })));
         }
     }

package/lib/AWING/DataForm/interface.d.ts

@@ -68,6 +68,7 @@ export interface NumberFieldDefinition<T extends DataObject> extends BaseFieldDe
     onValidate?(value?: number): boolean;
     defaultValue?: number;
     autoFormula?: string;
+    isFloat?: boolean;
     min?: number;
     max?: number;
 }

package/lib/AWING/DataGrid/index.js

@@ -39,6 +39,8 @@ var constants_1 = require("../constants");
 var Helpers_1 = require("../../Utils/Helpers");
 var get_1 = __importDefault(require("../Form/Utils/get"));
 var i18n_1 = __importDefault(require("../../i18n"));
+var lodash_1 = require("lodash");
+var Constant_1 = require("../../ACM-AXN/Common/Constant");
 var StyledTableRow = (0, styles_1.styled)(material_1.TableRow)({
     '& .MuiTableCell-root:last-child .MuiButtonBase-root': {
         visibility: 'hidden',
@@ -177,6 +179,10 @@ var DataGrid = function (props) {
         }
     };
     var calcOrder = function (index) { return pageIndex * pageSize + 1 + index; };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    var handleAction = react_1.default.useCallback((0, lodash_1.debounce)(function (rowAction, id) {
+        rowAction.action(id);
+    }, Constant_1.Constants.DEBOUNCE_TIME_300), []);
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.TableContainer, { component: material_1.Paper, children: [(0, jsx_runtime_1.jsxs)(material_1.Table, { "aria-label": "simple table", style: { tableLayout: 'fixed' }, children: [!hideHeader && ((0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [selected && onSelectedChange && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { padding: "checkbox", children: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { color: "primary", indeterminate: selected.length > 0 &&
                                                     selected.length < rows.length, checked: selected.length > 0 &&
                                                     selected.length === rows.length, onChange: function () { return handleSelectAll(); }, inputProps: {
@@ -255,7 +261,7 @@ var DataGrid = function (props) {
                                                                 : undefined, title: actionDef.tooltipTitle, children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: function (e) {
                                                                     if (!isShouldHide) {
                                                                         e.stopPropagation();
-                                                                        actionDef.action(id);
+                                                                        handleAction(actionDef, id);
                                                                     }
                                                                 }, style: {
                                                                     marginLeft: '4px',

package/lib/AWING/DateRangePicker/component.js

@@ -144,7 +144,7 @@ var defaultProps = {
 };
 var DateRangePickerWrapper = function (props) {
     var classes = useStyles();
-    var value = props.value, error = props.error, helperText = props.helperText, _a = props.autoFocus, autoFocus = _a === void 0 ? false : _a, _b = props.autoFocusEndDate, autoFocusEndDate = _b === void 0 ? false : _b, _c = props.initialStartDate, initialStartDate = _c === void 0 ? null : _c, _d = props.initialEndDate, initialEndDate = _d === void 0 ? null : _d, _e = props.callback, callback = _e === void 0 ? function () { } : _e, _f = props.label, label = _f === void 0 ? null : _f, _g = props.isShowCalendarInfo, isShowCalendarInfo = _g === void 0 ? false : _g, variant = props.variant, openDirection = props.openDirection, _h = props.isDayBlocked, isDayBlocked = _h === void 0 ? function (day) { return false; } : _h, _j = props.handleValid, handleValid = _j === void 0 ? function () { } : _j, _k = props.handleDateRangePopover, handleDateRangePopover = _k === void 0 ? function () { } : _k, disableHelperText = props.disableHelperText, _l = props.isFutureDate, isFutureDate = _l === void 0 ? false : _l;
+    var value = props.value, error = props.error, helperText = props.helperText, _a = props.autoFocus, autoFocus = _a === void 0 ? false : _a, _b = props.autoFocusEndDate, autoFocusEndDate = _b === void 0 ? false : _b, _c = props.initialStartDate, initialStartDate = _c === void 0 ? null : _c, _d = props.initialEndDate, initialEndDate = _d === void 0 ? null : _d, _e = props.callback, callback = _e === void 0 ? function () { } : _e, _f = props.label, label = _f === void 0 ? null : _f, _g = props.isShowCalendarInfo, isShowCalendarInfo = _g === void 0 ? false : _g, variant = props.variant, openDirection = props.openDirection, _h = props.isDayBlocked, isDayBlocked = _h === void 0 ? function (day) { return false; } : _h, _j = props.handleValid, handleValid = _j === void 0 ? function () { } : _j, _k = props.handleDateRangePopover, handleDateRangePopover = _k === void 0 ? function () { } : _k, disableHelperText = props.disableHelperText, _l = props.isFutureDate, isFutureDate = _l === void 0 ? false : _l, _m = props.required, required = _m === void 0 ? false : _m;
     var initialFocusedInput = null;
     if (autoFocus) {
         initialFocusedInput = constants_1.START_DATE;
@@ -152,12 +152,12 @@ var DateRangePickerWrapper = function (props) {
     else if (autoFocusEndDate) {
         initialFocusedInput = constants_1.END_DATE;
     }
-    var _m = (0, react_1.useState)(initialFocusedInput), focusedInput = _m[0], setFocusedInput = _m[1];
-    var _o = (0, react_1.useState)(initialStartDate), startDate = _o[0], setStartDate = _o[1];
-    var _p = (0, react_1.useState)(initialEndDate), endDate = _p[0], setEndDate = _p[1];
-    var _q = (0, react_1.useState)(true), isValid = _q[0], setIsValid = _q[1];
-    var _r = (0, react_1.useState)("".concat(moment(value ? value === null || value === void 0 ? void 0 : value.startDate : startDate).format('DD/MM/YYYY'), " - ").concat(moment(value ? value === null || value === void 0 ? void 0 : value.endDate : endDate).format('DD/MM/YYYY'))), inputValue = _r[0], setInputValue = _r[1];
-    var _s = (0, react_i18next_1.useTranslation)(), i18n = _s.i18n, t = _s.t;
+    var _o = (0, react_1.useState)(initialFocusedInput), focusedInput = _o[0], setFocusedInput = _o[1];
+    var _p = (0, react_1.useState)(initialStartDate), startDate = _p[0], setStartDate = _p[1];
+    var _q = (0, react_1.useState)(initialEndDate), endDate = _q[0], setEndDate = _q[1];
+    var _r = (0, react_1.useState)(true), isValid = _r[0], setIsValid = _r[1];
+    var _s = (0, react_1.useState)("".concat(moment(value ? value === null || value === void 0 ? void 0 : value.startDate : startDate).format('DD/MM/YYYY'), " - ").concat(moment(value ? value === null || value === void 0 ? void 0 : value.endDate : endDate).format('DD/MM/YYYY'))), inputValue = _s[0], setInputValue = _s[1];
+    var _t = (0, react_i18next_1.useTranslation)(), i18n = _t.i18n, t = _t.t;
     var momentLanguage = (0, react_1.useMemo)(function () { var _a, _b; return ((_b = (_a = i18n === null || i18n === void 0 ? void 0 : i18n.language) === null || _a === void 0 ? void 0 : _a.split('-')) === null || _b === void 0 ? void 0 : _b[0]) || 'en'; }, [i18n.language]);
     (0, react_1.useEffect)(function () {
         if (value !== undefined) {
@@ -235,36 +235,54 @@ var DateRangePickerWrapper = function (props) {
         onDatesChange(daterange);
         // setFocusedInput(null);
     };
+    var getDataSet = function (moment) {
+        return moment.set({
+            hour: 0,
+            minute: 0,
+            second: 0,
+            millisecond: 0,
+        });
+    };
+    var resetDate = function () {
+        setStartDate(initialStartDate);
+        setEndDate(initialEndDate);
+        setInputValue("".concat(moment(initialStartDate).format('DD/MM/YYYY'), " - ").concat(moment(initialEndDate).format('DD/MM/YYYY')));
+        callback({
+            startDate: getDataSet(moment(initialStartDate, 'DD/MM/YYYY')),
+            endDate: getDataSet(moment(initialEndDate, 'DD/MM/YYYY')),
+        });
+    };
     var handleChangeInput = function (e) {
         var fieldValue = e.target.value;
         setInputValue(fieldValue);
         var fieldValueArr = (fieldValue === null || fieldValue === void 0 ? void 0 : fieldValue.split(' - ')) || [];
         var year1900 = moment('1900-01-01');
         var momentStartDate = moment(fieldValueArr[0], 'DD/MM/YYYY');
+        var momentEndDate = moment(fieldValueArr[1], 'DD/MM/YYYY');
+        if (isDayBlocked && isDayBlocked(momentStartDate)) {
+            setIsValid(true);
+            resetDate();
+            return;
+        }
+        if (isDayBlocked && isDayBlocked(momentEndDate)) {
+            setIsValid(true);
+            resetDate();
+            return;
+        }
         if (momentStartDate.isValid() && momentStartDate.diff(year1900) >= 0) {
             setStartDate(momentStartDate);
         }
-        var momentEndDate = moment(fieldValueArr[1], 'DD/MM/YYYY');
         if (momentEndDate.isValid() && momentEndDate.diff(year1900) >= 0) {
             setEndDate(momentEndDate);
         }
         if (moment(fieldValueArr[0], 'DD/MM/YYYY', true).isValid() &&
             moment(fieldValueArr[1], 'DD/MM/YYYY', true).isValid() &&
             momentEndDate.diff(momentStartDate) >= 0) {
-            momentStartDate.set({
-                hour: 0,
-                minute: 0,
-                second: 0,
-                millisecond: 0,
-            });
-            momentEndDate.set({
-                hour: 0,
-                minute: 0,
-                second: 0,
-                millisecond: 0,
-            });
-            callback({ startDate: momentStartDate, endDate: momentEndDate });
             setIsValid(true);
+            callback({
+                startDate: getDataSet(momentStartDate),
+                endDate: getDataSet(momentEndDate),
+            });
         }
         else
             setIsValid(false);
@@ -312,8 +330,9 @@ var DateRangePickerWrapper = function (props) {
         'isDayBlocked',
         'handleValid',
         'handleDateRangePopover',
+        'required',
     ]);
-    var _t = react_1.default.useState(null), anchorElPopover = _t[0], setAnchorElPopover = _t[1];
+    var _u = react_1.default.useState(null), anchorElPopover = _u[0], setAnchorElPopover = _u[1];
     var openPopper = Boolean(anchorElPopover);
     var id = openPopper ? 'datePicker-popper' : undefined;
     var popperRef = react_1.default.useRef();
@@ -334,7 +353,7 @@ var DateRangePickerWrapper = function (props) {
     };
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_input_mask_1.default, { mask: "99/99/9999 - 99/99/9999", maskplaceholder: "dd/mm/yyyy - dd/mm/yyyy", value: inputValue, onChange: handleChangeInput, disabled: props.disabled, children: function () {
                     var _a;
-                    return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({ "aria-describedby": id, variant: variant, label: label, error: !isValid || error, helperText: !disableHelperText
+                    return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({ required: required, "aria-describedby": id, variant: variant, label: label, error: !isValid || error, helperText: !disableHelperText
                             ? error
                                 ? helperText || t('Common.InvalidData')
                                 : !isValid

package/lib/AWING/DateRangePicker/interface.d.ts

@@ -1,5 +1,6 @@
 import { MomentInput, Moment } from "moment";
 export interface DateRangePickerProps {
+    required?: boolean;
     disabled?: boolean;
     autoFocus?: boolean;
     autoFocusEndDate?: boolean;

package/lib/AWING/Form/useForm.js

@@ -53,7 +53,8 @@ var useForm = function (props) {
     var _updateFieldArray = function (name, value) {
         (0, set_1.default)(_formControl.current, name, value);
     };
-    var getValues = function (fieldNames) {
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    var getValues = react_1.default.useCallback(function (fieldNames) {
         var data = (0, convertToArrayPayload_1.default)(fieldNames).map(function (fieldName) {
             return (0, cloneProxy_1.default)((0, get_1.default)(_formControl.current, fieldName));
         });
@@ -61,7 +62,7 @@ var useForm = function (props) {
             return data;
         if (data.length && data.length === 1)
             return data[0];
-    };
+    }, []);
     var register = function (fieldPath, options) {
         var isRequired = options === null || options === void 0 ? void 0 : options.required;
         var onValidate = options === null || options === void 0 ? void 0 : options.onValidate;

package/lib/AWING/GoogleMap/GGMap.d.ts

@@ -0,0 +1,3 @@
+import { IGoogleMapProps } from './interface';
+declare const GGMap: ({ defaultLocation, onUpdateLocation, apiKey, geofenceRadius, sxMap, isDisplayAutoComplete, isTypeTracking, markerPositions, zoomCustomed, }: IGoogleMapProps) => import("react/jsx-runtime").JSX.Element;
+export default GGMap;

package/lib/AWING/GoogleMap/GGMap.js

@@ -0,0 +1,256 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var api_1 = require("@react-google-maps/api");
+var lodash_1 = __importDefault(require("lodash"));
+var react_1 = __importStar(require("react"));
+var react_i18next_1 = require("react-i18next");
+var utils_1 = require("./utils");
+var mapContainerStyle = {
+    height: '320px',
+    width: '100%',
+};
+var libraries = ['places'];
+var stylesDefault = {
+    position: 'relative',
+    '& .pac-container.pac-logo': {
+        top: '55px!important',
+        left: '0!important',
+    },
+};
+var GGMap = function (_a) {
+    var defaultLocation = _a.defaultLocation, onUpdateLocation = _a.onUpdateLocation, apiKey = _a.apiKey, geofenceRadius = _a.geofenceRadius, sxMap = _a.sxMap, _b = _a.isDisplayAutoComplete, isDisplayAutoComplete = _b === void 0 ? false : _b, _c = _a.isTypeTracking, isTypeTracking = _c === void 0 ? false : _c, markerPositions = _a.markerPositions, zoomCustomed = _a.zoomCustomed;
+    var radiusDefault = 500;
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var _d = (0, react_1.useState)(), map = _d[0], setMap = _d[1];
+    var _e = (0, react_1.useState)(''), error = _e[0], setError = _e[1];
+    var autocompleteRef = (0, react_1.useRef)(null);
+    var boxRef = (0, react_1.useRef)(null);
+    var makerRefs = (0, react_1.useRef)([]);
+    var _f = (0, react_1.useState)(zoomCustomed || 5), zoom = _f[0], setZoom = _f[1];
+    var onLoad = function (autocomplete) {
+        autocompleteRef.current = autocomplete;
+    };
+    var getValidValue = function (value, defaultValue) {
+        return value < defaultValue ? defaultValue : value;
+    };
+    var markerConvert = (0, react_1.useMemo)(function () {
+        var _a;
+        var coordMap = (_a = markerPositions === null || markerPositions === void 0 ? void 0 : markerPositions.reduce(function (acc, _a) {
+            var longitude = _a.longitude, latitude = _a.latitude;
+            if (!longitude || !latitude)
+                return acc;
+            var key = "".concat(longitude, ",").concat(latitude);
+            if (acc[key]) {
+                acc[key].count += 1;
+            }
+            else {
+                acc[key] = { longitude: longitude, latitude: latitude, count: 1 };
+            }
+            return acc;
+        }, {})) !== null && _a !== void 0 ? _a : {};
+        return Object.values(coordMap).map(function (item, index, arr) {
+            var _a;
+            item.radius = getValidValue((((_a = item.count) !== null && _a !== void 0 ? _a : 0) /
+                arr.reduce(function (acc, item) { var _a; return acc + ((_a = item === null || item === void 0 ? void 0 : item.count) !== null && _a !== void 0 ? _a : 0); }, 0)) *
+                10000 *
+                Math.pow(2, 10 - Math.max(zoom, 4)), radiusDefault);
+            return item;
+        });
+        // Convert the object to an array
+    }, [markerPositions, zoom]);
+    var onPlaceChanged = function () {
+        var _a, _b, _c, _d;
+        if (autocompleteRef.current !== null) {
+            var place = autocompleteRef.current.getPlace();
+            if (place.geometry) {
+                var newLat = (_b = (_a = place === null || place === void 0 ? void 0 : place.geometry) === null || _a === void 0 ? void 0 : _a.location) === null || _b === void 0 ? void 0 : _b.lat();
+                var newLng = (_d = (_c = place === null || place === void 0 ? void 0 : place.geometry) === null || _c === void 0 ? void 0 : _c.location) === null || _d === void 0 ? void 0 : _d.lng();
+                onUpdateLocation &&
+                    onUpdateLocation({
+                        latitude: newLat !== null && newLat !== void 0 ? newLat : 0,
+                        longitude: newLng !== null && newLng !== void 0 ? newLng : 0,
+                    });
+                map === null || map === void 0 ? void 0 : map.panTo({ lat: newLat !== null && newLat !== void 0 ? newLat : 0, lng: newLng !== null && newLng !== void 0 ? newLng : 0 });
+                setZoom(18);
+            }
+        }
+        else {
+            console.log('Autocomplete is not loaded yet!');
+        }
+    };
+    var onLoadMap = react_1.default.useCallback(function (mapInstance) {
+        setMap(mapInstance);
+    }, []);
+    //Lấy vị trí hiện tại của người dùng
+    var getCurrentLocation = function () {
+        var showPosition = function (position) {
+            onUpdateLocation &&
+                onUpdateLocation({
+                    latitude: position.coords.latitude,
+                    longitude: position.coords.longitude,
+                });
+        };
+        var showError = function (error) {
+            switch (error.code) {
+                case error.PERMISSION_DENIED:
+                    setError('User denied the request for Geolocation.');
+                    break;
+                case error.POSITION_UNAVAILABLE:
+                    setError('Location information is unavailable.');
+                    break;
+                case error.TIMEOUT:
+                    setError('The request to get user location timed out.');
+                    break;
+                default:
+                    setError('An unknown error occurred.');
+                    break;
+            }
+        };
+        if (navigator.geolocation) {
+            navigator.geolocation.getCurrentPosition(showPosition, showError);
+        }
+        else {
+            setError('Geolocation is not supported by this browser.');
+        }
+    };
+    var onMapClick = react_1.default.useCallback(function (e) {
+        var _a, _b, _c, _d;
+        onUpdateLocation &&
+            onUpdateLocation({
+                latitude: (_b = (_a = e === null || e === void 0 ? void 0 : e.latLng) === null || _a === void 0 ? void 0 : _a.lat()) !== null && _b !== void 0 ? _b : 0,
+                longitude: (_d = (_c = e === null || e === void 0 ? void 0 : e.latLng) === null || _c === void 0 ? void 0 : _c.lng()) !== null && _d !== void 0 ? _d : 0,
+            });
+    }, []);
+    (0, react_1.useEffect)(function () {
+        if (lodash_1.default.isNil(defaultLocation) ||
+            defaultLocation.lat === 0 ||
+            defaultLocation.lng === 0) {
+            getCurrentLocation();
+        }
+    }, [defaultLocation]);
+    (0, react_1.useEffect)(function () {
+        if (map) {
+            makerRefs.current.forEach(function (marker) {
+                marker.setMap(null);
+            });
+            makerRefs.current = markerConvert.map(function (item) {
+                var _a, _b;
+                var maker = new google.maps.Circle({
+                    center: {
+                        lat: (_a = item.latitude) !== null && _a !== void 0 ? _a : 0,
+                        lng: (_b = item.longitude) !== null && _b !== void 0 ? _b : 0,
+                    },
+                    radius: item.radius,
+                    strokeColor: '#4285F4',
+                    strokeOpacity: 0.8,
+                    strokeWeight: 2,
+                    fillColor: '#4285F4',
+                    fillOpacity: 0.35,
+                });
+                maker.setMap(map);
+                return maker;
+            });
+        }
+    }, [markerConvert]);
+    var handleZoom = (0, react_1.useCallback)(function (zoom) {
+        setZoom(zoom);
+    }, []);
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: sxMap ? sxMap : stylesDefault, ref: boxRef, children: (0, jsx_runtime_1.jsxs)(api_1.LoadScript, { googleMapsApiKey: apiKey || '', libraries: libraries, children: [!isDisplayAutoComplete && ((0, jsx_runtime_1.jsx)(api_1.Autocomplete, { onPlaceChanged: onPlaceChanged, onLoad: onLoad, children: (0, jsx_runtime_1.jsx)("input", { type: "text", placeholder: t('Common.PlaceHolderLocation'), onFocus: function () {
+                            var _a;
+                            var ggSuggest = document.querySelector('.pac-container.pac-logo');
+                            if (ggSuggest) {
+                                (_a = boxRef.current) === null || _a === void 0 ? void 0 : _a.append(ggSuggest);
+                            }
+                        }, style: {
+                            boxSizing: "border-box",
+                            border: "1px solid transparent",
+                            width: "378px",
+                            height: "40px",
+                            padding: "0 12px",
+                            borderRadius: "3px",
+                            boxShadow: "0 2px 6px rgba(0, 0, 0, 0.3)",
+                            fontSize: "14px",
+                            outline: "none",
+                            textOverflow: "ellipses",
+                            position: 'inherit',
+                            right: '3%',
+                            margin: '10px 0',
+                            zIndex: 99,
+                            top: '50px',
+                        } }) })), !isTypeTracking ? ((0, jsx_runtime_1.jsx)(MaprenderWithoutTracking, { onLoadMap: onLoadMap, onMapClick: onMapClick, onZoomChanged: handleZoom, defaultLocation: defaultLocation !== null && defaultLocation !== void 0 ? defaultLocation : {
+                        lat: 21.0063107,
+                        lng: 105.8279467,
+                    }, geofenceRadius: geofenceRadius !== null && geofenceRadius !== void 0 ? geofenceRadius : 0, zoomCustomed: zoomCustomed !== null && zoomCustomed !== void 0 ? zoomCustomed : 10 })) : ((0, jsx_runtime_1.jsx)(Maprender, { onLoadMap: onLoadMap, onMapClick: onMapClick, onZoomChanged: handleZoom }))] }) }));
+};
+exports.default = GGMap;
+var Maprender = react_1.default.memo(function (_a) {
+    var onLoadMap = _a.onLoadMap, onMapClick = _a.onMapClick, onZoomChanged = _a.onZoomChanged, _b = _a.zoom, zoom = _b === void 0 ? 5.4 : _b;
+    var mapInstance = (0, react_1.useRef)(null);
+    return ((0, jsx_runtime_1.jsx)(api_1.GoogleMap, { id: "map", mapContainerStyle: { width: '100%', height: "".concat(521, "px") }, zoom: zoom, center: {
+            lat: 16.453539,
+            lng: 107.4947103,
+        }, onZoomChanged: function () {
+            var _a, _b;
+            onZoomChanged((_b = (_a = mapInstance.current) === null || _a === void 0 ? void 0 : _a.getZoom()) !== null && _b !== void 0 ? _b : 0);
+        }, onLoad: function (instance) {
+            mapInstance.current = instance;
+            onLoadMap(instance);
+        }, onClick: onMapClick, options: {
+            disableDefaultUI: true,
+            styles: utils_1.mapStyles,
+            zoomControl: true,
+            streetViewControl: false,
+            mapTypeControl: false,
+            fullscreenControl: false,
+            minZoom: 2,
+            maxZoom: 13,
+        } }));
+});
+var MaprenderWithoutTracking = react_1.default.memo(function (_a) {
+    var onLoadMap = _a.onLoadMap, onMapClick = _a.onMapClick, onZoomChanged = _a.onZoomChanged, defaultLocation = _a.defaultLocation, geofenceRadius = _a.geofenceRadius, zoomCustomed = _a.zoomCustomed;
+    var mapInstance = (0, react_1.useRef)(null);
+    return ((0, jsx_runtime_1.jsx)(api_1.GoogleMap, { id: "map", mapContainerStyle: mapContainerStyle, zoom: zoomCustomed !== null && zoomCustomed !== void 0 ? zoomCustomed : 10, center: defaultLocation, onZoomChanged: function () {
+            var _a, _b;
+            onZoomChanged((_b = (_a = mapInstance.current) === null || _a === void 0 ? void 0 : _a.getZoom()) !== null && _b !== void 0 ? _b : 0);
+        }, onLoad: function (instance) {
+            mapInstance.current = instance;
+            onLoadMap(instance);
+        }, onClick: onMapClick, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(api_1.Marker, { position: defaultLocation !== null && defaultLocation !== void 0 ? defaultLocation : {
+                        lat: 21.0063107,
+                        lng: 105.8279467,
+                    } }), (0, jsx_runtime_1.jsx)(api_1.Circle, { center: defaultLocation, radius: geofenceRadius, options: {
+                        fillColor: 'red',
+                        fillOpacity: 0.2,
+                        strokeColor: 'red',
+                        strokeOpacity: 1,
+                        strokeWeight: 2,
+                    } })] }) }));
+});