awing-library 2.1.78-beta → 2.1.78

package/lib/ACM-AXN/Template/CreateOrEdit/Recoils.js

@@ -0,0 +1,83 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isErrorParameterState = exports.isEditState = exports.templateParametersState = exports.templateEventState = exports.templateInfoState = exports.templateState = void 0;
+var recoil_1 = require("recoil");
+var defaultValidation = "<!-- return function(fields) {\n    // Parameter fields: [{fieldName, fieldValue}]\n    // VALID_CODE: 200, NOT_VALID_CODE: 100\n    // Return array include field name, error message and check code of them\n    // Eg: Check field \"text\" must have equal or more than 10 character\n    return new Promise((resolve, reject) => {\n        const needCheckField = fields.find(field => field.fieldName === \"text\")\n        const isOk = needCheckField.fieldValue.length >= 10\n        resolve([\n            {\n                fieldName: needCheckField.fieldName,\n                code: isOk ? 200 : 100,\n                errorMessage: \"Text has less than 10 character\"\n            }\n        ])\n    })\n} -->";
+var defaultHandleEvent = "<!-- return function(fields, fieldChange) {\n    // Parameter fields: [{fieldName, fieldValue}], fieldChange: field which change\n    // Return array of field need update with new value\n    // In case no update, return empty array\n    // Eg: Auto update value of \"textUpperCase\" field when value of \"text\" field changed\n    return new Promise((resolve, reject) => {\n        if(fieldChange.fieldName === \"text\") {\n            resolve([\n                {\n                    fieldName: \"textUpperCase\",\n                    newValue: fieldChange.fieldValue.toUpperCase()\n                }\n            ])\n        }else resolve([])\n    })\n} -->";
+exports.templateState = (0, recoil_1.atom)({
+    key: "templateState",
+    default: {
+        template: {
+            pageCode: 'lgn',
+            description: '',
+            templateTypeId: undefined,
+            autoField: defaultHandleEvent,
+            validation: defaultValidation,
+            directoryId: '',
+            id: '',
+        },
+        templateParameters: [],
+        templateEvents: [],
+    },
+});
+exports.templateInfoState = (0, recoil_1.selector)({
+    key: "templateInfoState",
+    get: function (_a) {
+        var get = _a.get;
+        return get(exports.templateState).template;
+    },
+    set: function (_a, newValue) {
+        var set = _a.set;
+        set(exports.isEditState, true);
+        set(exports.templateState, function (oldValue) {
+            return __assign(__assign({}, oldValue), { template: newValue });
+        });
+    }
+});
+exports.templateEventState = (0, recoil_1.selector)({
+    key: "templateEventState",
+    get: function (_a) {
+        var get = _a.get;
+        return get(exports.templateState).templateEvents;
+    },
+    set: function (_a, newValue) {
+        var set = _a.set;
+        set(exports.isEditState, true);
+        set(exports.templateState, function (oldValue) {
+            return __assign(__assign({}, oldValue), { templateEvents: newValue });
+        });
+    }
+});
+exports.templateParametersState = (0, recoil_1.selector)({
+    key: "templateParametersState",
+    get: function (_a) {
+        var get = _a.get;
+        return get(exports.templateState).templateParameters;
+    },
+    set: function (_a, newValue) {
+        var set = _a.set;
+        set(exports.isEditState, true);
+        set(exports.templateState, function (oldValue) {
+            return __assign(__assign({}, oldValue), { templateParameters: newValue });
+        });
+    }
+});
+exports.isEditState = (0, recoil_1.atom)({
+    key: "isEditState",
+    default: false,
+});
+exports.isErrorParameterState = (0, recoil_1.atom)({
+    key: "isErrorParameterState",
+    default: false,
+});

package/lib/ACM-AXN/Template/CreateOrEdit/Script.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+declare const Script: FC;
+export default Script;

package/lib/ACM-AXN/Template/CreateOrEdit/Script.js

@@ -0,0 +1,58 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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");
+/* eslint-disable react-hooks/exhaustive-deps */
+var material_1 = require("@mui/material");
+var Constant_1 = require("../../../ACM-AXN/Common/Constant");
+var MonacoEditor_1 = __importDefault(require("../../../ACM-AXN/ViewTemplate/TemplateField/Fields/BasicField/MonacoEditor"));
+var lodash_1 = require("lodash");
+var react_1 = require("react");
+var react_i18next_1 = require("react-i18next");
+var recoil_1 = require("recoil");
+var Recoils_1 = require("./Recoils");
+var Script = function () {
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var _a = (0, recoil_1.useRecoilState)(Recoils_1.templateInfoState), templateInfo = _a[0], setTemplateInfo = _a[1];
+    var handleChangeValidation = (0, react_1.useCallback)((0, lodash_1.debounce)(function (validation) {
+        setTemplateInfo(function (prev) { return (__assign(__assign({}, prev), { validation: validation })); });
+    }, Constant_1.Constants.DEBOUNCE_TIME_300), [setTemplateInfo]);
+    var handleChangeAutoField = (0, react_1.useCallback)((0, lodash_1.debounce)(function (autoField) {
+        setTemplateInfo(function (prev) { return (__assign(__assign({}, prev), { autoField: autoField })); });
+    }, Constant_1.Constants.DEBOUNCE_TIME_300), [setTemplateInfo]);
+    return ((0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, sx: { flexGrow: 1, padding: function (theme) { return theme.spacing(3); } }, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, component: material_1.Paper, sx: { padding: function (theme) { return theme.spacing(2); }, width: '100%' }, children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, xs: 12, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle1", sx: {
+                                fontWeight: 'bold',
+                                color: '#BDC7CC',
+                                paddingTop: '16px',
+                                paddingBottom: '4px',
+                            }, children: t('TemplateManagement.TemplateValidation') }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                pointerEvents: 'unset',
+                                border: '1px solid #e4e4e4',
+                                padding: '10px 0',
+                                borderRadius: '4px',
+                            }, children: (0, jsx_runtime_1.jsx)(MonacoEditor_1.default, { value: templateInfo.validation, height: "30vh", language: "html", onChange: handleChangeValidation, isShowMinimap: true }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, xs: 12, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle1", sx: {
+                                fontWeight: 'bold',
+                                color: '#BDC7CC',
+                                paddingTop: '16px',
+                                paddingBottom: '4px',
+                            }, children: t('TemplateManagement.FieldAutoUpdate') }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                pointerEvents: 'unset',
+                                border: '1px solid #e4e4e4',
+                                padding: '10px 0',
+                                borderRadius: '4px',
+                            }, children: (0, jsx_runtime_1.jsx)(MonacoEditor_1.default, { value: templateInfo.autoField, height: "30vh", language: "html", onChange: handleChangeAutoField, isShowMinimap: true }) })] })] }) }));
+};
+exports.default = Script;

package/lib/ACM-AXN/Template/CreateOrEdit/Script.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom/extend-expect';

package/lib/ACM-AXN/Template/CreateOrEdit/Script.test.js

@@ -0,0 +1,162 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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");
+/* eslint-disable testing-library/no-wait-for-side-effects */
+require("@testing-library/jest-dom/extend-expect");
+var react_1 = require("@testing-library/react");
+var Script_1 = __importDefault(require("./Script"));
+var recoil_1 = require("recoil");
+var Recoils_1 = require("./Recoils");
+// Mock i18next
+jest.mock('react-i18next', function () { return (__assign(__assign({}, jest.requireActual('react-i18next')), { useTranslation: function () { return ({ t: jest.fn(function (key) { return key; }) }); } })); });
+// Mock Monaco
+jest.mock('ACM-AXN/ViewTemplate/TemplateField/Fields/BasicField/MonacoEditor', function () { return ({
+    __esModule: true,
+    default: function (props) { return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("p", { children: props.value }), (0, jsx_runtime_1.jsx)("button", { onClick: function () {
+                    props.onChange('aaaaabbb');
+                }, children: "onChange" })] })); },
+}); });
+// props
+var props = {
+    directories: [
+        {
+            directoryId: '5202880755274023966',
+            name: 'template',
+            parentDirectoryId: '4913100144472996590',
+            objectTypeCode: 'template',
+            level: 3,
+            isFile: false,
+            isSystem: true,
+            order: 0,
+            description: null,
+            directoryPath: '.0.90.4913100144472996590.5202880755274023966.',
+        },
+        {
+            directoryId: '4736019141892318583',
+            name: 'Beta template',
+            parentDirectoryId: '5202880755274023966',
+            objectTypeCode: 'template',
+            level: 4,
+            isFile: false,
+            isSystem: false,
+            order: 0,
+            description: '',
+            directoryPath: '.0.90.4913100144472996590.5202880755274023966.4736019141892318583.',
+        },
+    ],
+    templateTypes: [
+        {
+            id: 1,
+            name: 'Banner',
+            templateTypeCode: 'lgn',
+        },
+        {
+            id: 5,
+            name: 'Customize',
+            templateTypeCode: 'lgn',
+        },
+        {
+            id: 7,
+            name: 'Customize',
+            templateTypeCode: 'wlc',
+        },
+    ],
+    handleTemplateData: function (fn) {
+        fn({ template: {} });
+    },
+};
+var templateData = {
+    template: {
+        id: '5126659046455609087',
+        directoryId: '5202880755274023966',
+        directoryPath: '.0.90.4913100144472996590.5202880755274023966.5126659046455609087.',
+        name: 'video_square',
+        templateHtml: 'templateHtml',
+        layoutId: '5197905656409960384',
+        pageCode: 'lgn',
+        description: 'Square Video',
+        templateTypeId: 18,
+        validation: 'validation-Monaco1',
+        autoField: 'autoField-Monaco2',
+    },
+};
+describe('Template Infomation Tab Component', function () {
+    var renderUi = function () {
+        return (0, react_1.render)((0, jsx_runtime_1.jsx)(recoil_1.RecoilRoot, { initializeState: function (_a) {
+                var set = _a.set;
+                set(Recoils_1.templateState, templateData);
+            }, children: (0, jsx_runtime_1.jsx)(Script_1.default, {}) }));
+    };
+    it('renders without crashing', function () {
+        renderUi();
+    });
+    it('update info data', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var updateSpy;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    updateSpy = jest.spyOn(props, 'handleTemplateData');
+                    renderUi();
+                    react_1.screen.getAllByText('onChange').forEach(function (btn) {
+                        react_1.fireEvent.click(btn);
+                    });
+                    return [4 /*yield*/, (0, react_1.waitFor)(function () {
+                            expect(updateSpy).toBeCalledTimes(2);
+                        })];
+                case 1:
+                    _a.sent();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+});

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Parameter.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+interface ParameterProps {
+    templateId: string;
+}
+export declare const OmitListType: {
+    IMAGE: string;
+    TEXT_FIELD: string;
+    VIDEO: string;
+    TEXT_FIELD_NUMBER: string;
+    HTML: string;
+    CHECKBOX: string;
+    TEXTAREA: string;
+    DROPDOWN_LIST: string;
+    CHECKBOX_LIST: string;
+    LIST: string;
+    OBJECT: string;
+    COLOR: string;
+    URL: string;
+};
+declare const _default: React.NamedExoticComponent<ParameterProps>;
+export default _default;

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Parameter.js

@@ -0,0 +1,308 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OmitListType = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var icons_material_1 = require("@mui/icons-material");
+var Add_1 = __importDefault(require("@mui/icons-material/Add"));
+var material_1 = require("@mui/material");
+var Enum_1 = require("../../../../ACM-AXN/ViewTemplate/Enum");
+var AWING_1 = require("../../../../AWING");
+var immer_1 = require("immer");
+var react_1 = __importStar(require("react"));
+var react_i18next_1 = require("react-i18next");
+var recoil_1 = require("recoil");
+var Recoils_1 = require("../Recoils");
+var Utils_1 = require("./Utils");
+exports.OmitListType = __assign({}, Enum_1.TYPE_FIELD_TEMPLATE);
+delete exports.OmitListType.LIST;
+var Parameter = function (_a) {
+    var templateId = _a.templateId;
+    var _b = (0, recoil_1.useRecoilState)(Recoils_1.templateParametersState), rows = _b[0], handleSetParameter = _b[1];
+    var setErrors = (0, recoil_1.useSetRecoilState)(Recoils_1.isErrorParameterState);
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var defaultParam = {
+        id: String(Date.now()),
+        templateId: templateId,
+        fieldName: '',
+        fieldType: Enum_1.TYPE_FIELD_TEMPLATE.IMAGE,
+        defaultValue: undefined,
+        labelName: undefined,
+        isRequired: false,
+        isAdvanced: false,
+        childrens: [],
+    };
+    var tableRow = react_1.default.useMemo(function () { return (0, Utils_1.flattenParameter)(rows); }, [rows]);
+    react_1.default.useEffect(function () {
+        setErrors(tableRow.some(function (item) { return item.errField; }));
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [tableRow]);
+    var handleAddParameter = function () {
+        handleSetParameter(function (prev) { return __spreadArray(__spreadArray([], prev, true), [defaultParam], false); });
+    };
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    var handleChange = function (event) {
+        var _a, _b;
+        var _c = event.target, name = _c.name, value = _c.value, checked = _c.checked;
+        var _d = name.split('-').filter(Boolean), field = _d[0], ids = _d.slice(1);
+        var handleValue = [
+            Utils_1.FIELDS.IS_REQUIRED,
+            Utils_1.FIELDS.IS_ADVANCED,
+        ].includes(field)
+            ? checked
+            : field === Utils_1.FIELDS.FIELD_NAME ? ((_b = (_a = value === null || value === void 0 ? void 0 : value.split('.')) === null || _a === void 0 ? void 0 : _a.at(ids.length - 1)) !== null && _b !== void 0 ? _b : '').trim() : value;
+        handleSetParameter((0, immer_1.produce)(function (rows) {
+            (0, Utils_1.enhancedUpdate)(rows, ids, field, handleValue, defaultParam);
+        }));
+    };
+    var handleRemoveRow = function (id) {
+        handleChange({
+            target: {
+                name: [Utils_1.FIELDS.REMOVE, id].join('-'),
+                value: defaultParam,
+            },
+        });
+    };
+    var handleAddChildren = function (id) {
+        handleChange({
+            target: {
+                name: [Utils_1.FIELDS.CHILDRENS, id].join('-'),
+                value: defaultParam,
+            },
+        });
+    };
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { mt: 3, children: (0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, justifyContent: "space-between", alignItems: "center", children: (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle1", sx: {
+                                fontWeight: 'bold',
+                                color: '#000000',
+                            }, children: t('TemplateManagement.Parameter') }) }) }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { mt: 2, sx: {
+                    '.MuiTableCell-root:last-child .MuiButtonBase-root': {
+                        visibility: 'visible!important',
+                    },
+                }, component: 'form', onChange: handleChange, children: (0, jsx_runtime_1.jsx)(AWING_1.DataGrid, { getRowId: function (obj) { return [obj.parentId, obj.id].flat().join('-'); }, columns: [
+                        {
+                            // width: '150px',
+                            field: Utils_1.FIELDS.FIELD_TYPE,
+                            headerName: t('TemplateManagement.fieldType'),
+                            dynamicTableCellProps: function (row) {
+                                return {
+                                    sx: {
+                                        paddingRight: '8px',
+                                        paddingLeft: "".concat(row.parentId.length * 24 || 8, "px"),
+                                        minWidth: 72,
+                                    },
+                                };
+                            },
+                            valueGetter: function (row, idx) {
+                                return ((0, jsx_runtime_1.jsx)(material_1.Select, { fullWidth: true, variant: "standard", MenuProps: {
+                                        anchorOrigin: {
+                                            vertical: 'bottom',
+                                            horizontal: 'left',
+                                        },
+                                        transformOrigin: {
+                                            vertical: 'top',
+                                            horizontal: 'left',
+                                        },
+                                    }, name: [
+                                        'fieldType',
+                                        row.parentId,
+                                        row.id,
+                                    ]
+                                        .flat()
+                                        .join('-'), value: row.fieldType, inputProps: {
+                                        onChange: handleChange,
+                                    }, children: Object.entries(row.parentFieldType ===
+                                        Enum_1.TYPE_FIELD_TEMPLATE.LIST
+                                        ? exports.OmitListType
+                                        : Enum_1.TYPE_FIELD_TEMPLATE).map(function (_a) {
+                                        var id = _a[0], value = _a[1];
+                                        return ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: value, children: value }, id));
+                                    }) }, idx));
+                            },
+                        },
+                        {
+                            field: Utils_1.FIELDS.FIELD_NAME,
+                            headerName: t('TemplateManagement.FieldName'),
+                            TableCellProps: {
+                                sx: {
+                                    padding: '8px',
+                                },
+                            },
+                            valueGetter: function (row, idx) {
+                                return ((0, jsx_runtime_1.jsx)(material_1.TextField
+                                // inputProps={{}}
+                                , { 
+                                    // inputProps={{}}
+                                    error: row.errField, required: true, fullWidth: true, name: [
+                                        'fieldName',
+                                        row.parentId,
+                                        row.id,
+                                    ]
+                                        .flat()
+                                        .join('-'), variant: "standard", value: (0, Utils_1.getFieldName)(row) }, idx));
+                            },
+                        },
+                        {
+                            field: Utils_1.FIELDS.LABEL_NAME,
+                            headerName: t('Common.Label'),
+                            TableCellProps: {
+                                sx: {
+                                    padding: '8px',
+                                },
+                            },
+                            valueGetter: function (row, idx) {
+                                return ((0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, name: [
+                                        Utils_1.FIELDS.LABEL_NAME,
+                                        row.parentId,
+                                        row.id,
+                                    ]
+                                        .flat()
+                                        .join('-'), variant: "standard", defaultValue: row.labelName }, idx));
+                            },
+                        },
+                        {
+                            field: Utils_1.FIELDS.DEFAULT_VALUE,
+                            headerName: t('Common.DefaultValue'),
+                            TableCellProps: {
+                                sx: {
+                                    padding: '8px',
+                                },
+                            },
+                            valueGetter: function (row, idx) {
+                                return ((0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, multiline: row.fieldType === Enum_1.TYPE_FIELD_TEMPLATE.TEXTAREA, disabled: [
+                                        Enum_1.TYPE_FIELD_TEMPLATE.OBJECT,
+                                        Enum_1.TYPE_FIELD_TEMPLATE.LIST,
+                                    ].includes(row.fieldType), name: [
+                                        'defaultValue',
+                                        row.parentId,
+                                        row.id,
+                                    ]
+                                        .flat()
+                                        .join('-'), variant: "standard", defaultValue: row.defaultValue }, idx));
+                            },
+                        },
+                        {
+                            field: Utils_1.FIELDS.IS_REQUIRED,
+                            width: '85px',
+                            headerName: t('Common.Require'),
+                            TableCellProps: {
+                                sx: {
+                                    padding: '8px',
+                                },
+                            },
+                            dynamicTableCellProps: function (row) {
+                                return {
+                                    sx: {
+                                        '& > span': {
+                                            visibility: row.parentFieldType ===
+                                                Enum_1.TYPE_FIELD_TEMPLATE.LIST ||
+                                                row.fieldType ===
+                                                    Enum_1.TYPE_FIELD_TEMPLATE.OBJECT
+                                                ? 'hidden'
+                                                : 'visible',
+                                        }
+                                    },
+                                };
+                            },
+                            valueGetter: function (row, idx) {
+                                return ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { name: [
+                                        Utils_1.FIELDS.IS_REQUIRED,
+                                        row.parentId,
+                                        row.id,
+                                    ]
+                                        .flat()
+                                        .join('-'), color: "primary", defaultChecked: row.isRequired }, idx));
+                            },
+                        },
+                        {
+                            field: Utils_1.FIELDS.IS_ADVANCED,
+                            width: '85px',
+                            headerName: t('Common.Advance'),
+                            TableCellProps: {
+                                sx: {
+                                    padding: '8px',
+                                },
+                            },
+                            dynamicTableCellProps: function (row) {
+                                return {
+                                    sx: {
+                                        '& > span': {
+                                            visibility: Boolean(row.parentFieldType) ? 'hidden' : 'visible'
+                                        }
+                                    },
+                                };
+                            },
+                            valueGetter: function (row, idx) {
+                                return ((0, jsx_runtime_1.jsx)(material_1.Checkbox, { name: [
+                                        'isAdvanced',
+                                        row.parentId,
+                                        row.id,
+                                    ]
+                                        .flat()
+                                        .join('-'), color: "primary", defaultChecked: row.isAdvanced }, idx));
+                            },
+                        },
+                    ], rows: tableRow, rowActions: [
+                        {
+                            icon: (0, jsx_runtime_1.jsx)(icons_material_1.DeleteForever, {}),
+                            tooltipTitle: t('Common.Delete'),
+                            action: handleRemoveRow,
+                            isShouldHideActions: function (row) {
+                                return !row.shouldRemove && row.parentFieldType;
+                            },
+                        },
+                        {
+                            icon: (0, jsx_runtime_1.jsx)(Add_1.default, {}),
+                            tooltipTitle: t('Common.Add'),
+                            action: handleAddChildren,
+                            isShouldHideActions: function (row) {
+                                return !(Enum_1.TYPE_FIELD_TEMPLATE.OBJECT === row.fieldType);
+                            },
+                        },
+                    ] }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { mt: 3, children: (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, justifyContent: "space-between", alignItems: "center", children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { xs: 6, container: true, item: true, children: (0, jsx_runtime_1.jsx)(material_1.Button, { name: "master-add-parameter", "aria-label": "button-add", variant: "contained", onClick: handleAddParameter, disabled: false, title: t('Common.Add'), children: (0, jsx_runtime_1.jsx)(Add_1.default, {}) }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { xs: 6, container: true, item: true, justifyContent: "flex-end", children: (0, jsx_runtime_1.jsx)(material_1.Typography, { sx: { padding: '8px' }, children: t('TemplateManagement.NamingFieldNotice') }) })] }) })] }));
+};
+exports.default = (0, react_1.memo)(Parameter);

package/lib/ACM-AXN/Template/CreateOrEdit/Template/Parameter.test.d.ts

@@ -0,0 +1 @@
+export {};