awing-library 2.1.26-beta → 2.1.26

package/lib/ACM-AXN/ViewTemplate/TemplateField/Fields/ObjectField.d.ts

@@ -1,3 +1,5 @@
 import { FieldProps, FieldInfo } from "../../interface";
+import { DataObject } from "../../../../AWING";
 export default function ObjectField(props: FieldProps): import("react/jsx-runtime").JSX.Element;
+export declare const getChilds: <T extends Record<string, DataObject>>(child: T, action: (p: T) => any) => any;
 export declare const getObjectDefaultValue: (fieldInfo: FieldInfo) => any;

package/lib/ACM-AXN/ViewTemplate/TemplateField/Fields/ObjectField.js

@@ -14,13 +14,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getObjectDefaultValue = void 0;
+exports.getObjectDefaultValue = exports.getChilds = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var ListField_1 = require("./ListField");
 var material_1 = require("@mui/material");
 var styles_1 = require("@mui/styles");
 var TemplateField_1 = __importDefault(require("../../TemplateField"));
 var react_1 = require("react");
+var Helpers_1 = require("../../../../Utils/Helpers");
+var lodash_1 = require("lodash");
 var useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
     root: {
         textAlign: "center",
@@ -70,13 +72,27 @@ function ObjectField(props) {
                     fieldChild.fieldName.split(".").slice(-1)[0]) }), index)); }) })] }));
 }
 exports.default = ObjectField;
+var getChilds = function (child, action) {
+    var _a;
+    action(child);
+    if (((_a = child === null || child === void 0 ? void 0 : child.childrens) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+        return child.childrens.map(function (c) { return (0, exports.getChilds)(c, action); });
+    }
+};
+exports.getChilds = getChilds;
 var getObjectDefaultValue = function (fieldInfo) {
     var _a;
     var result = {};
     (_a = fieldInfo === null || fieldInfo === void 0 ? void 0 : fieldInfo.childrens) === null || _a === void 0 ? void 0 : _a.map(function (child) {
         if (child.fieldType !== "list") {
-            var defaultValue = child.defaultValue || "";
-            result[child.fieldName.split(".").slice(-1)[0]] = defaultValue;
+            var item_1 = {};
+            (0, exports.getChilds)(child, function (el) {
+                var keys = el.fieldName.split('.');
+                if (keys.length > 1) {
+                    (0, Helpers_1.setObject)(item_1, keys, el.defaultValue);
+                }
+            });
+            result[child.fieldName.split(".").slice(-1)[0]] = (0, lodash_1.get)(item_1, child.fieldName);
         }
         else {
             result[child.fieldName.split(".").slice(-1)[0]] =

package/lib/ACM-AXN/ViewTemplate/TemplateField/Utils.d.ts

@@ -0,0 +1,5 @@
+import { ViewTemplateEvents } from "./Event";
+export declare const validEvents: (events: ViewTemplateEvents[]) => {
+    valid: boolean;
+    message: string;
+};

package/lib/ACM-AXN/ViewTemplate/TemplateField/Utils.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validEvents = void 0;
+var validEvents = function (events) {
+    var result = {
+        valid: true,
+        message: '',
+    };
+    console.log("aa12aa", events);
+    // const aa = uniqWith(events, (a, b) => a.event === b.event)
+    // console.log("aa", aa, events)
+    return result;
+};
+exports.validEvents = validEvents;

package/lib/ACM-AXN/ViewTemplate/container.d.ts

@@ -1,2 +1,2 @@
 import { ViewTemplateProps } from "./interface";
-export default function ViewTemplate({ templateDatas, pagePath, enablePreview, advanceFields, templateLabelName, domainId, validStatus, scriptAutoField, scriptValidate, configs, onChange, onChangeViewValid, onChangeValidateProcess, onNotifyError, onUploadFile, }: ViewTemplateProps): import("react/jsx-runtime").JSX.Element;
+export default function ViewTemplate({ templateDatas, pagePath, enablePreview, advanceFields, templateLabelName, domainId, validStatus, scriptAutoField, scriptValidate, configs, onChange, onChangeViewValid, onChangeValidateProcess, onNotifyError, onUploadFile, ...props }: ViewTemplateProps): import("react/jsx-runtime").JSX.Element;

package/lib/ACM-AXN/ViewTemplate/container.js

@@ -10,6 +10,17 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -33,7 +44,7 @@ function ViewTemplate(_a) {
         console.log(processValue);
     } : _l, _m = _a.onNotifyError, onNotifyError = _m === void 0 ? function (errorMessage) {
         console.log(errorMessage);
-    } : _m, onUploadFile = _a.onUploadFile;
+    } : _m, onUploadFile = _a.onUploadFile, props = __rest(_a, ["templateDatas", "pagePath", "enablePreview", "advanceFields", "templateLabelName", "domainId", "validStatus", "scriptAutoField", "scriptValidate", "configs", "onChange", "onChangeViewValid", "onChangeValidateProcess", "onNotifyError", "onUploadFile"]);
     var t = (0, react_i18next_1.useTranslation)().t;
     var _o = (0, react_1.useState)(false), advanceOptionExpand = _o[0], setAdvanceOptionExpand = _o[1];
     var CONFIGS = (0, common_1.fillConfigs)(configs);
@@ -106,7 +117,7 @@ var addChilds = function (fields, fieldInfo) {
     return result;
 };
 var convertToTreeData = function (data) {
-    return data
+    var treeData = data
         .map(function (item) { return addChilds(data, item); })
         .filter(function (item) { return !item.fieldName.includes("."); })
         .map(function (item) {
@@ -121,4 +132,5 @@ var convertToTreeData = function (data) {
             return item;
         }
     });
+    return treeData;
 };

package/lib/ACM-AXN/ViewTemplate/index.d.ts

@@ -1,2 +1,3 @@
-export declare function ViewTemplate(props: any): import("react/jsx-runtime").JSX.Element;
+import { ViewTemplateProps } from "./interface";
+export declare function ViewTemplate(props: ViewTemplateProps): import("react/jsx-runtime").JSX.Element;
 export default ViewTemplate;

package/lib/ACM-AXN/ViewTemplate/interface.d.ts

@@ -1,3 +1,4 @@
+import { EventsProps } from "./TemplateField/Event";
 export interface Configs {
     TEMPLATE_FILE_PATH?: string;
     FILE_TEMP_PATH?: string;
@@ -48,7 +49,7 @@ export interface FieldProps {
     onNotifyError: (errorMessage: string) => void;
     onUploadFile: (files: any[]) => Promise<string>;
 }
-export interface ViewTemplateProps {
+export interface ViewTemplateProps extends Partial<EventsProps> {
     templateDatas: FieldInfo[];
     /**
      * Đường dẫn tuyệt đối các file của page
@@ -90,5 +91,5 @@ export interface ViewTemplateProps {
      * Hiển thị thông báo lỗi
      */
     onNotifyError?: (errorMessage: string) => void;
-    onUploadFile: (files: any[]) => Promise<string>;
+    onUploadFile: (files: any[]) => Promise<any>;
 }

package/lib/AWING/AdvancedSearch/component.js

@@ -60,7 +60,7 @@ var AdvancedSearch = function (props) {
                                                             : undefined, onChange: function (val) {
                                                             var _a;
                                                             return onChangeValue(__assign(__assign({}, value), (_a = {}, _a[fieldName] = val, _a)));
-                                                        }, isOutsideRange: fieldDef.isOutsideRange, isDayBlocked: fieldDef.isDayBlocked, children: fieldDef.label }, fieldName));
+                                                        }, isOutsideRange: fieldDef.isOutsideRange, isDayBlocked: fieldDef.isDayBlocked, isShowCalendarInfo: fieldDef.isShowCalendarInfo, children: fieldDef.label }, fieldName));
                                                 case 'directory':
                                                     return ((0, jsx_runtime_1.jsx)(DirectoryTree_1.default, { labelSearch: fieldDef.label, rootDirectoryId: fieldDef.rootId || '', defaultValue: fieldValue, options: options !== null && options !== void 0 ? options : [], onChange: function (val) {
                                                             var _a;

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

@@ -7,6 +7,7 @@ export interface AdvancedSearchFieldDefinition extends BaseTextFieldProps {
     icon?: React.ReactElement;
     label: string;
     type: 'select' | 'date-range' | 'autocomplete' | 'directory';
+    isShowCalendarInfo?: boolean;
     options?: MenuOption[];
     loading?: boolean;
     width?: number;

package/lib/AWING/BasicDataForm/index.js

@@ -33,8 +33,10 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var BasicDataForm_1 = __importDefault(require("./BasicDataForm"));
 var i18n_1 = __importDefault(require("../../i18n"));
 var react_i18next_1 = require("react-i18next");
+var x_date_pickers_1 = require("@mui/x-date-pickers");
+var AdapterMoment_1 = require("@mui/x-date-pickers/AdapterMoment");
 function BasicDataForm(props) {
-    return ((0, jsx_runtime_1.jsx)(react_i18next_1.I18nextProvider, { i18n: i18n_1.default, children: (0, jsx_runtime_1.jsx)(BasicDataForm_1.default, __assign({}, props)) }));
+    return ((0, jsx_runtime_1.jsx)(react_i18next_1.I18nextProvider, { i18n: i18n_1.default, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.LocalizationProvider, { dateAdapter: AdapterMoment_1.AdapterMoment, children: (0, jsx_runtime_1.jsx)(BasicDataForm_1.default, __assign({}, props)) }) }));
 }
 exports.BasicDataForm = BasicDataForm;
 __exportStar(require("./interface"), exports);

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

@@ -21,14 +21,14 @@ export interface BasicFieldDefinition extends BaseTextFieldProps {
     /**
      * Định dạng regex cho hàm textValid
     */
-    pattern?: RegExp;
+    pattern?: RegExp | false;
     /**
     *
     * @param value
     * @param length - Độ dài byte, only type text và text-area
     * @param pattern - Định dạng regex, only type text và text-area
     */
-    checkValid?(value: any, length?: number, pattern?: RegExp): boolean;
+    checkValid?(value: any, length?: number, pattern?: RegExp | false): boolean;
     options?: MenuOption[];
     loading?: boolean;
     readOnly?: boolean;

package/lib/AWING/ButtonDateRangePicker/ButtonDateRangePicker.js

@@ -50,7 +50,7 @@ var DateRangePicker_1 = __importDefault(require("../DateRangePicker"));
 var react_i18next_1 = require("react-i18next");
 var ButtonDateRangePicker = function (props) {
     var t = (0, react_i18next_1.useTranslation)().t;
-    var defaultValue = props.value, onChange = props.onChange, isOutsideRange = props.isOutsideRange, isDayBlocked = props.isDayBlocked, other = __rest(props, ["value", "onChange", "isOutsideRange", "isDayBlocked"]);
+    var defaultValue = props.value, onChange = props.onChange, isOutsideRange = props.isOutsideRange, isDayBlocked = props.isDayBlocked, isShowCalendarInfo = props.isShowCalendarInfo, other = __rest(props, ["value", "onChange", "isOutsideRange", "isDayBlocked", "isShowCalendarInfo"]);
     var _a = react_1.default.useState(false), open = _a[0], setOpen = _a[1];
     var anchorRef = react_1.default.useRef(null);
     var handleToggle = function () {
@@ -105,7 +105,7 @@ var ButtonDateRangePicker = function (props) {
                                                         dateRange.startDate,
                                                         dateRange.endDate,
                                                     ]);
-                                                }, isOutsideRange: isOutsideRange, isDayBlocked: isDayBlocked }) })] }) }) }) })));
+                                                }, isOutsideRange: isOutsideRange, isDayBlocked: isDayBlocked, isShowCalendarInfo: isShowCalendarInfo }) })] }) }) }) })));
                 } })] }));
 };
 exports.ButtonDateRangePicker = ButtonDateRangePicker;

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

@@ -5,4 +5,5 @@ export interface ButtonDateRangePickerProps extends ButtonProps {
     onChange?(value: any): void;
     isOutsideRange?(date: Moment): boolean;
     isDayBlocked?(date: Moment): boolean;
+    isShowCalendarInfo?: boolean;
 }

package/lib/AWING/ButtonSelect/index.js

@@ -59,9 +59,9 @@ var ButtonSelect = function (props) {
     var handleClose = function () {
         setAnchorEl(null);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.Button, __assign({ id: "".concat(elementId, "-button-select"), "aria-controls": "".concat(elementId, "-menu"), "aria-haspopup": "true", "aria-expanded": open ? "true" : undefined, onClick: handleClick, endIcon: (0, jsx_runtime_1.jsx)(KeyboardArrowDown_1.default, {}), style: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, __assign({ id: "".concat(elementId, "-button-select"), "aria-controls": "".concat(elementId, "-menu"), "aria-haspopup": "true", "aria-expanded": open ? "true" : undefined, onClick: handleClick, endIcon: (0, jsx_runtime_1.jsx)(KeyboardArrowDown_1.default, {}), sx: {
                     textTransform: "none",
-                    color: "white",
+                    color: function (theme) { return theme.palette.text.primary; },
                     fontWeight: "normal",
                 } }, other)), (0, jsx_runtime_1.jsx)(material_1.Menu, { id: "".concat(elementId, "-menu"), anchorEl: anchorEl, open: open, onClose: handleClose, MenuListProps: {
                     "aria-labelledby": "".concat(elementId, "-button-select"),

package/lib/AWING/Chart/BarLineComponent.d.ts

@@ -1,12 +1,15 @@
+import { DataObject } from '../../AWING/interface';
+import { ChartOptions, ChartType } from 'chart.js';
 import 'chartjs-adapter-moment';
-import { ChartProps } from 'react-chartjs-2/dist/types';
-interface IChartJsContainer extends ChartProps {
+import { BaseChartComponent, ChartProps } from 'react-chartjs-2/dist/types';
+export interface IChartJsContainer extends ChartProps {
     width?: number;
     height?: number;
     timeline?: number;
-    optionCustom?: any;
-    chart: any;
-    dataChart: any;
+    optionCustom?: ChartOptions<ChartType>;
+    chart: BaseChartComponent;
+    dataChart: DataObject[];
+    optionsDefault?: boolean;
 }
 declare const BarLineComponent: (props: IChartJsContainer) => import("react/jsx-runtime").JSX.Element;
 export default BarLineComponent;

package/lib/AWING/Chart/BarLineComponent.js

@@ -19,10 +19,12 @@ var Helpers_1 = require("../../Utils/Helpers");
 require("chartjs-adapter-moment");
 var moment_1 = __importDefault(require("moment"));
 var react_i18next_1 = require("react-i18next");
-var Styles_1 = require("./Styles");
+var i18n_1 = __importDefault(require("../../i18n"));
 var Enums_1 = require("./Enums");
+var Styles_1 = require("./Styles");
 var BarLineComponent = function (props) {
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)(undefined, { i18n: i18n_1.default }).t;
+    var optionsDefault = props.optionsDefault;
     var chart = props.chart, _a = props.width, width = _a === void 0 ? 'auto' : _a, _b = props.height, height = _b === void 0 ? 350 : _b, _c = props.timeline, timeline = _c === void 0 ? Enums_1.TYPE_TIMELINE.DAY : _c, _d = props.optionCustom, optionCustom = _d === void 0 ? {} : _d, dataChart = props.dataChart, type = props.type, _e = props.options, options = _e === void 0 ? {
         responsive: true,
         maintainAspectRatio: false,
@@ -39,8 +41,8 @@ var BarLineComponent = function (props) {
                 bodySpacing: 8,
                 callbacks: {
                     title: function (tooltipItems) {
-                        //Sửa lại với thời gian theo giờ
                         var _a;
+                        //Sửa lại với thời gian theo giờ
                         var timeFormat = (_a = tooltipItems[0].raw) === null || _a === void 0 ? void 0 : _a.x;
                         var isTimelineHour = (timeFormat === null || timeFormat === void 0 ? void 0 : timeFormat.length) > 8;
                         if (isTimelineHour) {
@@ -60,7 +62,7 @@ var BarLineComponent = function (props) {
                                 .slice(0, -1)
                                 .join(' ');
                         }
-                        labels += ' ' + tooltipItem.formattedValue;
+                        labels += ': ' + tooltipItem.formattedValue;
                         return ' ' + labels;
                     },
                 },
@@ -90,33 +92,37 @@ var BarLineComponent = function (props) {
             },
         },
         scales: {
-            x: {
-                type: 'time',
-                display: true,
-                grid: { display: false },
-                time: {
-                    parser: timeline === Enums_1.TYPE_TIMELINE.DAY
-                        ? 'YYYYMMDD'
-                        : 'YYYYMMDDHH',
-                    unit: timeline === Enums_1.TYPE_TIMELINE.DAY ? 'day' : 'hour',
-                    displayFormats: {
-                        day: 'DD/MM',
-                        hour: 'HH:mm',
+            x: optionsDefault
+                ? {}
+                : {
+                    type: 'time',
+                    display: true,
+                    grid: { display: false },
+                    time: {
+                        parser: timeline === Enums_1.TYPE_TIMELINE.DAY
+                            ? 'YYYYMMDD'
+                            : 'YYYYMMDDHH',
+                        unit: timeline === Enums_1.TYPE_TIMELINE.DAY
+                            ? 'day'
+                            : 'hour',
+                        displayFormats: {
+                            day: 'DD/MM',
+                            hour: 'HH:mm',
+                        },
                     },
-                },
-                offset: true,
-                ticks: {
-                    maxTicksLimit: 10,
-                    autoSkipPadding: 16,
-                    maxRotation: 0,
-                },
-                title: {
-                    font: {
-                        size: 14,
-                        family: 'Roboto',
+                    offset: true,
+                    ticks: {
+                        maxTicksLimit: 10,
+                        autoSkipPadding: 16,
+                        maxRotation: 0,
+                    },
+                    title: {
+                        font: {
+                            size: 14,
+                            family: 'Roboto',
+                        },
                     },
                 },
-            },
             y: {
                 type: 'linear',
                 display: true,

package/lib/AWING/Chart/PieComponent.d.ts

@@ -1,10 +1,11 @@
-import { ChartProps } from 'react-chartjs-2/dist/types';
-interface IPieComponent extends ChartProps {
-    dataConvert?: any;
-    widthChart?: any;
-    heightChart?: any;
-    optionCustom?: any;
-    chart: any;
+import { ChartData, ChartOptions, ChartType } from 'chart.js';
+import { ChartProps, TypedChartComponent } from 'react-chartjs-2/dist/types';
+export interface IPieComponent extends ChartProps {
+    dataConvert?: ChartData<ChartType>;
+    widthChart?: number;
+    heightChart?: number;
+    optionCustom?: ChartOptions<ChartType>;
+    chart: TypedChartComponent<"pie">;
 }
 declare const PieComponent: ({ chart, data, dataConvert, widthChart, heightChart, optionCustom, options, }: IPieComponent) => import("react/jsx-runtime").JSX.Element;
 export default PieComponent;

package/lib/AWING/Chart/PieComponent.js

@@ -2,14 +2,13 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var Helpers_1 = require("../../Utils/Helpers");
-// const chartColorDefaults = ['#0055b8', '#dd040c', '#80b0ff']
 var chartColorDefaults = [
     '#80b0ff',
     '#0055b8',
     '#dd040c',
     '#aed6dc',
     '#ff9a8d',
-    '#4a536b'
+    '#4a536b',
 ];
 var PieComponent = function (_a) {
     var chart = _a.chart, data = _a.data, _b = _a.dataConvert, dataConvert = _b === void 0 ? {

package/lib/AWING/Chart/Styles.d.ts

@@ -4,8 +4,12 @@ export declare const styledLineFill: (defaultStyle: any, variant: any) => any;
 export declare const getStyle: (defaultStyle: any, type: any, color: any) => any;
 export declare const dataSetCommonStyled: {
     barStyle: {
-        primary: {};
-        secondary: {};
+        primary: {
+            backgroundColor: string;
+        };
+        secondary: {
+            backgroundColor: string;
+        };
         default: {
             backgroundColor: string;
         };

package/lib/AWING/Chart/Styles.js

@@ -95,8 +95,12 @@ var getStyle = function (defaultStyle, type, color) {
 exports.getStyle = getStyle;
 exports.dataSetCommonStyled = {
     barStyle: {
-        primary: {},
-        secondary: {},
+        primary: {
+            backgroundColor: '#0055b8',
+        },
+        secondary: {
+            backgroundColor: '#dd040c',
+        },
         default: {
             backgroundColor: '#80b0ff',
         },

package/lib/AWING/Chart/index.d.ts

@@ -0,0 +1,3 @@
+import BarLineComponent from './BarLineComponent';
+import PieComponent from './PieComponent';
+export { BarLineComponent, PieComponent };

package/lib/AWING/Chart/index.js

@@ -0,0 +1,10 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PieComponent = exports.BarLineComponent = void 0;
+var BarLineComponent_1 = __importDefault(require("./BarLineComponent"));
+exports.BarLineComponent = BarLineComponent_1.default;
+var PieComponent_1 = __importDefault(require("./PieComponent"));
+exports.PieComponent = PieComponent_1.default;

package/lib/AWING/DataForm/DataInput.js

@@ -43,14 +43,14 @@ 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;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     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, other = __rest(fieldDefinition, ["fieldName", "type", "onValidate", "min", "max"]);
-    var _j = react_2.default.useState(t('Common.InvalidData')), errorText = _j[0], setErrorText = _j[1];
+    var _k = react_2.default.useState(t('Common.InvalidData')), errorText = _k[0], setErrorText = _k[1];
     var checkValidationValue = function (fieldDefinition, val) {
         if (!fieldDefinition.required &&
-            (val === undefined || val === null || val === '' || val === []))
+            (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);
@@ -63,6 +63,8 @@ function DataInput(props) {
                 else
                     return (0, validation_1.notNullValid)(val);
             }
+            case 'multiple-hierarchical':
+                return (0, validation_1.arrayIsNotEmptyValid)(val);
             case 'month':
             case 'date':
                 return (0, validation_1.dateValid)(val);
@@ -108,10 +110,10 @@ function DataInput(props) {
         case 'autocomplete': {
             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);
-                }, onChange: function (e, value) {
+                }, disableclearable: fieldDefinition.disableClearable, getOptionDisabled: function (option) { return option === null || option === void 0 ? void 0 : option.disabled; }, onChange: function (e, value) {
                     var newValue = fieldDefinition.multiple
-                        ? value.map(function (x) { return x.value; })
-                        : value.value;
+                        ? value.map(function (x) { return x === null || x === void 0 ? void 0 : x.value; })
+                        : value === null || value === void 0 ? void 0 : value.value;
                     onChange(newValue, checkValidationValue(fieldDefinition, newValue));
                 }, value: fieldDefinition.multiple
                     ? fieldDefinition.options.filter(function (x) {
@@ -155,7 +157,7 @@ function DataInput(props) {
                 }, readOnly: fieldDefinition.readOnly }));
         }
         case 'date-range': {
-            var _k = other, isDayBlocked = _k.isDayBlocked, isOutsideRange = _k.isOutsideRange;
+            var _l = other, isDayBlocked = _l.isDayBlocked, isOutsideRange = _l.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,
@@ -168,8 +170,8 @@ function DataInput(props) {
         }
         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 = event.target.value;
-                    onChange(event.target.value, checkValidationValue(fieldDefinition, newValue));
+                    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')
                     : '' })));
@@ -208,6 +210,13 @@ function DataInput(props) {
                         }), { children: (_a = item.label) !== null && _a !== void 0 ? _a : item.text }), "".concat(fieldName.toString(), "-opt-").concat(index)));
                     })] })));
         }
+        case 'multiple-hierarchical': {
+            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')
+                    : '' })));
+        }
         case 'geo-fencing': {
             var configs = fieldDefinition.configs, label = fieldDefinition.label, initValue = fieldDefinition.initValue, value_1 = fieldDefinition.value, limit = fieldDefinition.limit, isOnlyMap = fieldDefinition.isOnlyMap;
             return ((0, jsx_runtime_1.jsx)("div", { style: { marginTop: '16px' }, children: (0, jsx_runtime_1.jsx)(GeoFencing_1.default, { configs: configs, label: label, initValue: initValue, value: value_1, limit: limit, isOnlyMap: isOnlyMap, onChange: function (newValue) {
@@ -218,7 +227,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
-                    ? (_h = fieldDefinition.helperText) !== null && _h !== void 0 ? _h : t('Common.InvalidData')
+                    ? (_j = fieldDefinition.helperText) !== null && _j !== void 0 ? _j : t('Common.InvalidData')
                     : '' })));
         }
     }

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

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { BaseTextFieldProps } from '@mui/material/TextField';
-import { DataObject, MenuOption } from '../../AWING';
+import { DataObject, IMultipleHierarchicalChoiceProps, MenuOption } from '../../AWING';
 import { IMainObj, IListFunctions } from '../../AWING/LogicExpression/interface';
 import { GeoFencingValue, IConfig } from '../../ACM-AXN/GeoFencing/interface';
 import { Moment } from 'moment';
@@ -44,6 +44,7 @@ export type AutocompleteFieldDefinition<T extends DataObject> = BaseFieldDefinit
     type: 'autocomplete';
     options: Array<MenuOption>;
     loading?: boolean;
+    disableClearable?: boolean;
 };
 export interface CheckBoxFieldDefinition<T extends DataObject> extends BaseFieldDefinition<T> {
     type: 'checkbox';
@@ -86,14 +87,14 @@ export interface TextFieldDefinition<T extends DataObject> extends BaseFieldDefi
     /**
      * Định dạng regex cho hàm textValid
      */
-    pattern?: RegExp;
+    pattern?: RegExp | false;
     /**
      *
      * @param value
      * @param length - Độ dài byte, only type text và text-area
      * @param pattern - Định dạng regex, only type text và text-area
      */
-    onValidate?(value?: string, length?: number, pattern?: RegExp): boolean;
+    onValidate?(value?: string, length?: number, pattern?: RegExp | false): boolean;
     defaultValue?: string;
     autoFormula?: string;
 }
@@ -122,5 +123,8 @@ export type SelectFieldDefinition<T extends DataObject> = BaseFieldDefinition<T>
     row?: Partial<T>;
     onDisabledSelectItem?: (value: any, row?: Partial<T>) => boolean;
 };
-export type FieldDefinition<T extends DataObject> = AsyncAutocompleteFieldDefinition<T> | AutocompleteFieldDefinition<T> | LogicExpressionDefinition<T> | CheckBoxFieldDefinition<T> | DateTimeFieldDefinition<T> | DateRangeFieldDefinition<T> | NumberFieldDefinition<T> | RadioFieldDefinition<T> | SelectFieldDefinition<T> | TextFieldDefinition<T> | GeoFencingDefinition<T>;
+export type MultipleHierarchicalDefinition<T extends DataObject> = BaseFieldDefinition<T> & Omit<IMultipleHierarchicalChoiceProps, 'defaultValue' | 'onChange'> & {
+    type: 'multiple-hierarchical';
+};
+export type FieldDefinition<T extends DataObject> = AsyncAutocompleteFieldDefinition<T> | AutocompleteFieldDefinition<T> | LogicExpressionDefinition<T> | CheckBoxFieldDefinition<T> | DateTimeFieldDefinition<T> | DateRangeFieldDefinition<T> | NumberFieldDefinition<T> | RadioFieldDefinition<T> | SelectFieldDefinition<T> | TextFieldDefinition<T> | GeoFencingDefinition<T> | MultipleHierarchicalDefinition<T>;
 export {};