@solidstarters/solid-core-ui 0.1.26 → 1.0.0

package/dist/components/core/model/FieldMetaDataForm.js

@@ -0,0 +1,1024 @@
+'use client';
+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 __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));
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useEffect, useRef, useState } from "react";
+import { useFormik } from "formik";
+import * as Yup from "yup";
+import { InputText } from "primereact/inputtext";
+import { Dropdown } from "primereact/dropdown";
+import { Button } from "primereact/button";
+import { classNames } from "primereact/utils";
+import { Message } from "primereact/message";
+import { Toast } from "primereact/toast";
+import { usePathname } from "next/navigation";
+import { SelectButton } from "primereact/selectbutton";
+import { InputTextarea } from "primereact/inputtextarea";
+import { TabPanel, TabView } from "primereact/tabview";
+import { AutoComplete } from "primereact/autocomplete";
+import { Checkbox } from "primereact/checkbox";
+import { useGetFieldDefaultMetaDataQuery } from "../../../redux/api/fieldApi";
+import { InputNumber } from "primereact/inputnumber";
+import { Calendar } from "primereact/calendar";
+import CodeEditor from "../../../components/common/CodeEditor";
+import qs from "qs";
+import { useLazyGetMediaStorageProvidersQuery } from "../../../redux/api/mediaStorageProviderApi";
+import FieldSelector from "./FieldSelector";
+import { capitalize } from "lodash";
+import { getSingularAndPlural } from "../../../helpers/helpers";
+import { RadioButton } from "primereact/radiobutton";
+import { useLazyGetModelsQuery } from "../../../redux/api/modelApi";
+import { useLazyGetmodulesQuery } from "../../../redux/api/moduleApi";
+import { SingleSelectAutoCompleteField } from "../../../components/common/SingleSelectAutoCompleteField";
+import { MultiSelect } from "primereact/multiselect";
+import { Dialog } from "primereact/dialog";
+var SolidFieldType;
+(function (SolidFieldType) {
+    // numeric types
+    SolidFieldType["int"] = "int";
+    SolidFieldType["bigint"] = "bigint";
+    SolidFieldType["float"] = "float";
+    // double = 'double',
+    SolidFieldType["decimal"] = "decimal";
+    // text types
+    SolidFieldType["shortText"] = "shortText";
+    SolidFieldType["longtext"] = "longText";
+    SolidFieldType["richText"] = "richText";
+    SolidFieldType["json"] = "json";
+    // boolean types
+    SolidFieldType["boolean"] = "boolean";
+    // date
+    SolidFieldType["date"] = "date";
+    SolidFieldType["datetime"] = "datetime";
+    SolidFieldType["time"] = "time";
+    // relation
+    SolidFieldType["relation"] = "relation";
+    // media
+    SolidFieldType["mediaSingle"] = "mediaSingle";
+    SolidFieldType["mediaMultiple"] = "mediaMultiple";
+    SolidFieldType["email"] = "email";
+    SolidFieldType["password"] = "password";
+    // selection
+    SolidFieldType["selectionStatic"] = "selectionStatic";
+    SolidFieldType["selectionDynamic"] = "selectionDynamic";
+    SolidFieldType["computed"] = "computed";
+    SolidFieldType["uuid"] = "uuid";
+})(SolidFieldType || (SolidFieldType = {}));
+var SelectionStaticValues = function (_a) {
+    var enumValue = _a.enumValue, onUpdate = _a.onUpdate, onDelete = _a.onDelete, onAdd = _a.onAdd;
+    var _b = enumValue.split(":"), value = _b[0], display = _b[1];
+    var handleValueChange = function (newValue) {
+        onUpdate("".concat(newValue, ":").concat(display || ""));
+    };
+    var handleDisplayChange = function (newDisplay) {
+        onUpdate("".concat(value || "", ":").concat(newDisplay));
+    };
+    return (_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(InputText, { value: value || "", onChange: function (e) { return handleValueChange(e.target.value); }, placeholder: "Value", className: "p-inputtext-sm small-input w-full" }), _jsx(InputText, { value: display || "", onChange: function (e) { return handleDisplayChange(e.target.value); }, placeholder: "Display", className: "p-inputtext-sm small-input w-full" }), _jsx(Button, { icon: "pi pi-plus", size: "small", className: "small-button", onClick: onAdd, type: "button" }), _jsx(Button, { icon: "pi pi-trash", size: "small", className: "small-button", onClick: onDelete, outlined: true, severity: "danger", type: "button" })] }));
+};
+var fieldBasedPayloadFormating = function (values, currentFields, fieldMetaData) {
+    // const booleanFields: string | any[] = [
+    //   "isSystem",
+    //   "defaultValue",
+    //   "required",
+    //   "unique",
+    //   "encrypt",
+    //   "index",
+    //   "private",
+    //   "relationCreateInverse"];
+    var transformedPayload = currentFields.reduce(function (acc, key) {
+        acc[key] = values[key]; // Set key and its value as the same string
+        // if (booleanFields.includes(acc[key])) {
+        //   acc[key] = values[key] == "false" ? "" : true
+        // }
+        return acc;
+    }, {});
+    transformedPayload.displayName = transformedPayload.displayName.trim();
+    transformedPayload.identifier = fieldMetaData ? fieldMetaData.identifier : Date.now();
+    if (fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id) {
+        transformedPayload.id = fieldMetaData.id;
+    }
+    if (currentFields.includes("mediaStorageProviderId")) {
+        transformedPayload.mediaStorageProvider = values.mediaStorageProvider;
+    }
+    if (currentFields.includes("selectionDynamicProviderCtxt")) {
+        var prettified = JSON.stringify(JSON.parse(values.selectionDynamicProviderCtxt), null, 2);
+        transformedPayload.selectionDynamicProviderCtxt = prettified;
+    }
+    if (currentFields.includes("computedFieldValueProviderCtxt")) {
+        var prettified = JSON.stringify(JSON.parse(values.computedFieldValueProviderCtxt), null, 2);
+        transformedPayload.computedFieldValueProviderCtxt = prettified;
+    }
+    if (currentFields.includes("relationCreateInverse")) {
+        transformedPayload.relationCreateInverse = values.relationCreateInverse == "false" ? "" : true;
+    }
+    return transformedPayload;
+};
+function fetchCurrentFields(solidFieldType, fieldDefaultMetaData) {
+    var _a;
+    if (solidFieldType) {
+        var allowedFields = (_a = fieldDefaultMetaData === null || fieldDefaultMetaData === void 0 ? void 0 : fieldDefaultMetaData.data) === null || _a === void 0 ? void 0 : _a.fieldTypes.filter(function (e) { return e.fieldType === solidFieldType; });
+        if (allowedFields.length > 0) {
+            return allowedFields[0].fields;
+        }
+    }
+    return [
+        "name",
+        "displayName",
+        "type",
+        "ormType",
+        "required",
+        "unique",
+        "index",
+        "private",
+        "encrypt",
+    ];
+}
+var createValidationSchema = function (currentFields, selectedType, allFields, fieldMetaData, encryptState) {
+    var reservedNames;
+    if (fieldMetaData) {
+        reservedNames = allFields.length > 0 ? allFields.filter(function (i) { return i.id !== fieldMetaData.id; }).map(function (f) { return f.name; }) : [];
+    }
+    else {
+        reservedNames = allFields.length > 0 ? allFields.map(function (f) { return f.name; }) : [];
+    }
+    var schema = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({ name: Yup.string()
+            // .matches(/^[a-z]+(-[a-z]+)*$/,"Invalid format. Use lowercase letters and hyphens only.")
+            .notOneOf(reservedNames, "Name Already in use. Please choose a different name.")
+            .required("Name is required."), displayName: Yup.string().required("Display Name is required"), description: Yup.string().nullable(), type: Yup.string().required("Type is required"), isSystem: Yup.boolean() }, (currentFields.includes("ormType") && {
+        ormType: Yup.string().required("Orm Type is required"),
+    })), (currentFields.includes("length") && {
+        length: Yup.number().typeError("Length must be an integer").nullable(),
+    })), (currentFields.includes("defaultValue") && {
+        defaultValue: Yup.mixed().nullable().when("type", function (type) {
+            switch (selectedType.value) {
+                case "int":
+                case "bigint":
+                    return Yup.number().nullable().typeError("Default value must be an integer")
+                        .integer("Default value must be an integer");
+                case "float":
+                case "decimal":
+                    return Yup.number().nullable().typeError("Default value must be an integer");
+                case "shortText":
+                case "longText":
+                case "richText":
+                case "json":
+                    return Yup.string().nullable().typeError("Default value must be an String");
+                case "boolean":
+                    return Yup.boolean().nullable().typeError("Default value must be a boolean");
+                case "date":
+                case "datetime":
+                case "time":
+                    return Yup.date().nullable().typeError("Default value must be an Date");
+                default:
+                    return Yup.mixed().nullable(); // Default fallback if no match
+            }
+        }),
+    })), (currentFields.includes("regexPattern") && {
+        regexPattern: Yup.string(),
+        regexPatternNotMatchingErrorMsg: Yup.string(),
+    })), (currentFields.includes("required") && {
+        required: Yup.boolean(),
+    })), (currentFields.includes("unique") && {
+        unique: Yup.boolean(),
+    })), (currentFields.includes("encrypt") && {
+        encrypt: Yup.boolean(),
+    })), (currentFields.includes("encryptionType") && encryptState == true && {
+        encryptionType: Yup.string().required("Encryption Type Value is required"),
+    })), (currentFields.includes("decryptWhen") && encryptState == true && {
+        decryptWhen: Yup.string().required("Decrypt When Value is required"),
+    })), (currentFields.includes("index") && {
+        index: Yup.boolean(),
+    })), (currentFields.includes("min") && {
+        min: Yup.mixed().nullable()
+            .when("type", function (type) {
+            switch (selectedType.value) {
+                case "int":
+                    return Yup.number().nullable().typeError("Min must be an integer")
+                        .integer("Min must be an integer");
+                case "decimal":
+                case "shortText":
+                case "longText":
+                case "richText":
+                case "json":
+                    return Yup.number().nullable().typeError("Min must be an integer");
+                default:
+                    return Yup.mixed().nullable().nullable(); // Default fallback if no match
+            }
+        }),
+    })), (currentFields.includes("max") && {
+        max: Yup.mixed()
+            .when("type", function (type) {
+            switch (selectedType.value) {
+                case "int":
+                    return Yup.number().nullable().typeError("Max must be an integer")
+                        .integer("Max must be an integer")
+                        .test("greater-than-min", "Max must be greater than Min", function (value) {
+                        var min = this.parent.min; // Access sibling field 'min'
+                        if (min != null && value == null) {
+                            // Trigger error if Min is filled but Max is empty
+                            return this.createError({
+                                message: "Max is required if Min is specified",
+                            });
+                        }
+                        return value == null || value > min; // Validate only if Max exists
+                    });
+                case "decimal":
+                case "shortText":
+                case "longText":
+                case "richText":
+                case "json":
+                    return Yup.number().nullable().typeError("Max must be an integer")
+                        .test("greater-than-min", "Max must be greater than Min", function (value) {
+                        var min = this.parent.min; // Access sibling field 'min'
+                        if (min != null && value == null) {
+                            // Trigger error if Min is filled but Max is empty
+                            return this.createError({
+                                message: "Max is required if Min is specified",
+                            });
+                        }
+                        return value == null || value > min; // Validate only if Max exists
+                    });
+                default:
+                    return Yup.mixed().nullable().nullable(); // Default fallback if no match
+            }
+        }),
+    })), (currentFields.includes("private") && {
+        private: Yup.boolean(),
+    })), (currentFields.includes("mediaTypes") && {
+        mediaTypes: Yup.mixed().required("Media Types must be an array").required("Media Types is required"),
+    })), (currentFields.includes("mediaMaxSizeKb") && {
+        mediaMaxSizeKb: Yup.number().required("Media Max Size is required"),
+    })), (currentFields.includes("mediaStorageProviderId") && {
+        mediaStorageProviderId: Yup.number().required("Media Storage Provider is required"),
+    })), (currentFields.includes("mediaStorageProviderId") && {
+        mediaStorageProvider: Yup.object().required("Media Storage Provider is required"),
+    })), (currentFields.includes("mediaEmbedded") && {
+        mediaEmbedded: Yup.boolean(),
+    })), (currentFields.includes("relationType") && {
+        relationType: Yup.string().required("Relation Type is required"),
+    })), (currentFields.includes("relationModelSingularName") && {
+        relationModelSingularName: Yup.string().required("Relation Model Singular Name is required"),
+    })), (currentFields.includes("relationModelFieldName") && {
+        relationModelFieldName: Yup.string()
+        // .required(
+        //   "Relation Model Field Name is required"
+        // ),
+    })), (currentFields.includes("relationCreateInverse") && {
+        relationCreateInverse: Yup.boolean(),
+    })), (currentFields.includes("relation") && {
+        relationCascade: Yup.string().when("relationType", function (relationType, schema) {
+            return relationType === "one-to-one"
+                ? schema.required("Relation Cascade Value is required for one-to-one relationships")
+                : schema.notRequired();
+        }),
+    })), (currentFields.includes("relationModelModuleName") && {
+        relationModelModuleName: Yup.string().required("Relation Model Module Name Value is required"),
+    })), (currentFields.includes("selectionDynamicProvider") && {
+        selectionDynamicProvider: Yup.string().required("Selection Dynamic Provider Value is required"),
+    })), (currentFields.includes("selectionDynamicProviderCtxt") && {
+        selectionDynamicProviderCtxt: Yup.string().required("Selection Dynamic Provider Context Value is required").test("is-valid-json", "Computed Field Value Provider Context Value must be valid JSON", function (value) {
+            if (!value)
+                return false; // Ensure it's required
+            try {
+                JSON.parse(value); // Check if it's valid JSON
+                return true;
+            }
+            catch (_a) {
+                return false;
+            }
+        }),
+    })), (currentFields.includes("selectionStaticValues") && {
+        selectionStaticValues: Yup.array().of(Yup.string().matches(/^[\w\s\d-]+:[\w\s-]+$/, "Label and Value are required.")),
+    })), (currentFields.includes("computedFieldValueProvider") && {
+        computedFieldValueProvider: Yup.string().required("Computed Field Function Value is required"),
+    })), (currentFields.includes("computedFieldValueProviderCtxt") && {
+        computedFieldValueProviderCtxt: Yup.string().required("Computed Field Value Provider Context Value is required").test("is-valid-json", "Computed Field Value Provider Context Value must be valid JSON", function (value) {
+            if (!value)
+                return false; // Ensure it's required
+            try {
+                JSON.parse(value); // Check if it's valid JSON
+                return true;
+            }
+            catch (_a) {
+                return false;
+            }
+        }),
+    })), (currentFields.includes("computedFieldValueType") && {
+        computedFieldValueType: Yup.string().required("Computed Field Value Type is required"),
+    })), (currentFields.includes("columnName") && {
+        columnName: Yup.string().nullable().matches(/^[a-z0-9_]+$/, "Column name must be in snake_case (lowercase letters, numbers, and underscores only)."),
+    }));
+    return Yup.object(schema);
+};
+var FieldMetaDataForm = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51;
+    var modelMetaData = _a.modelMetaData, fieldMetaData = _a.fieldMetaData, setFieldMetaData = _a.setFieldMetaData, allFields = _a.allFields, deleteModelFunction = _a.deleteModelFunction, setVisiblePopup = _a.setVisiblePopup;
+    var booleanOptions = ["false", "true"];
+    var _52 = useState(false), isBackPopupVisible = _52[0], setIsBackPopupVisible = _52[1];
+    var _53 = useState(false), showColumnName = _53[0], setShowColumnName = _53[1];
+    var pathname = usePathname();
+    var toast = useRef(null);
+    var _54 = useGetFieldDefaultMetaDataQuery(null), fieldDefaultMetaData = _54.data, isLoading = _54.isLoading, error = _54.error, refetch = _54.refetch;
+    var _55 = useState(fetchCurrentFields(fieldMetaData && fieldMetaData.type, fieldDefaultMetaData)), currentFields = _55[0], setCurrentFields = _55[1];
+    var _56 = useLazyGetMediaStorageProvidersQuery(), triggerGetMediaStorageProvider = _56[0], _57 = _56[1], MediaStorageProviderData = _57.data, isMediaStorageProviderFetching = _57.isFetching, MediaStorageProviderError = _57.error;
+    var _58 = useLazyGetmodulesQuery(), triggerGetModules = _58[0], _59 = _58[1], moduleData = _59.data, isModuleFetching = _59.isFetching, moduleError = _59.error;
+    var _60 = useLazyGetModelsQuery(), triggerGetModels = _60[0], _61 = _60[1], modelData = _61.data, ismodelFetching = _61.isFetching, modelError = _61.error;
+    var _62 = useState(), markdownText = _62[0], setMarkdownText = _62[1];
+    var _63 = useState(false), encryptState = _63[0], setEncryptState = _63[1];
+    var _64 = useState(fieldMetaData ? false : true), showTypeFilter = _64[0], setShowTypeFilter = _64[1];
+    var _65 = useState((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.type) && { label: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.type, value: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.type }), selectedType = _65[0], setSelectedType = _65[1];
+    var _66 = useState((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldValueType) && { label: fieldMetaData.computedFieldValueType, value: fieldMetaData.computedFieldValueType }), selectedComputedFieldValueType = _66[0], setSelectedComputedFieldValueType = _66[1];
+    var _67 = useState((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionDynamicProvider) && { label: fieldMetaData.selectionDynamicProvider, value: fieldMetaData.selectionDynamicProvider }), selectionDynamicProvider = _67[0], setSelectionDynamicProvider = _67[1];
+    // const [externalIdProvider, setExternalIdProvider] = useState(fieldMetaData?.externalIdProvider && { label: fieldMetaData.externalIdProvider, value: fieldMetaData.externalIdProvider });
+    var _68 = useState(fieldMetaData && fieldMetaData.selectionStaticValues && fieldMetaData.selectionStaticValues.length > 0 && (fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionStaticValues.filter(function (line) { return line.trim() !== ""; }).join("\n"))), selectionStaticValues = _68[0], setSelectionStaticValues = _68[1];
+    var _69 = useState([]), filteredComputedFieldValueTypes = _69[0], setFilteredComputedFieldValueTypes = _69[1];
+    var _70 = useState([]), filteredSelectionDynamicProvider = _70[0], setFilteredSelectionDynamicProvider = _70[1];
+    var _71 = useState([]), ormTypeOptions = _71[0], setOrmTypeOptions = _71[1];
+    var _72 = useState(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.ormType), selectedOrmType = _72[0], setSelectedOrmType = _72[1];
+    var _73 = useState([]), filteredExternalIdProvider = _73[0], setFilteredExternalIdProvider = _73[1];
+    var _74 = useState([]), filteredSelectionEncryptionType = _74[0], setFilteredSelectionEncryptionType = _74[1];
+    var _75 = useState([]), filteredSelectionDecryptWhen = _75[0], setFilteredSelectionDecryptWhen = _75[1];
+    var items = Array.from({ length: 100000 }).map(function (_, i) { return ({
+        label: "Item #".concat(i),
+        value: i,
+    }); });
+    var validationSchema = React.useMemo(function () { return createValidationSchema(currentFields, selectedType, allFields, fieldMetaData, encryptState); }, [currentFields, encryptState]);
+    var _76 = useState(false), typeSelected = _76[0], setTypeSelected = _76[1];
+    var searchMediaTypes = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, suggestionData;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                suggestionData = fieldDefaultMetaData.data.mediaTypes.filter(function (t) { return t.label.toLowerCase().startsWith(query.toLowerCase()); });
+                return [2 /*return*/, suggestionData];
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                return [2 /*return*/, []];
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var searchMediaStorageProvIderId = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, queryData, queryString, result, updatedSuggestion, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    query = event.query;
+                    queryData = {
+                        limit: 10,
+                        offset: 0,
+                        // filters: {
+                        //   name: {
+                        //     $containsi: query,
+                        //   },
+                        // },
+                    };
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true,
+                    });
+                    return [4 /*yield*/, triggerGetMediaStorageProvider(queryString).unwrap()];
+                case 1:
+                    result = _a.sent();
+                    if (result && result.records) {
+                        updatedSuggestion = __spreadArray([], result.records, true);
+                        return [2 /*return*/, updatedSuggestion];
+                    }
+                    else {
+                        return [2 /*return*/, []];
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_1 = _a.sent();
+                    return [2 /*return*/, []];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    var searchModel = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, queryData, queryString, result, filteredMenu;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    query = event.query;
+                    queryData = {
+                        limit: 10,
+                        offset: 0,
+                        // filters: {
+                        //   title: {
+                        //     $containsi: query
+                        //   }
+                        // }
+                    };
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true
+                    });
+                    return [4 /*yield*/, triggerGetModels(queryString).unwrap()];
+                case 1:
+                    result = _a.sent();
+                    // Map the API response to AutoComplete format
+                    if (result && result.records) {
+                        filteredMenu = result.records.map(function (m) { return ({
+                            label: m.name,
+                            value: m.id,
+                            name: m.name,
+                            id: m.id,
+                        }); });
+                        // Update the suggestions in state
+                        return [2 /*return*/, filteredMenu];
+                    }
+                    else {
+                        // Handle the case where no data is returned
+                        return [2 /*return*/, []];
+                    }
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    var searchOrmTypes = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, ormType, _filteredOrmType, suggestionData;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                ormType = fieldDefaultMetaData.data.ormType[modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.dataSourceType];
+                _filteredOrmType = ormType[formik.values.type].ormTypes.map(function (e) { return ({ label: e, value: e }); });
+                suggestionData = _filteredOrmType.filter(function (t) { return t.label.toLowerCase().startsWith(query.toLowerCase()); });
+                return [2 /*return*/, suggestionData];
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                return [2 /*return*/, []];
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var searchRelationModelModuleNames = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, queryData, queryString, result, updatedSuggestion, error_2;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    query = event.query;
+                    queryData = {
+                        limit: 10,
+                        offset: 0,
+                        filters: {
+                            name: {
+                                $containsi: query,
+                            },
+                        },
+                    };
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true,
+                    });
+                    return [4 /*yield*/, triggerGetModules(queryString).unwrap()];
+                case 1:
+                    result = _a.sent();
+                    if (result && result.records) {
+                        updatedSuggestion = __spreadArray([], result.records, true);
+                        return [2 /*return*/, updatedSuggestion];
+                    }
+                    else {
+                        return [2 /*return*/, []];
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_2 = _a.sent();
+                    return [2 /*return*/, []];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    var searchRelationModelSingularNames = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, queryData, queryString, result, updatedSuggestion, error_3;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    query = event.query;
+                    queryData = {
+                        limit: 10,
+                        offset: 0,
+                        filters: {
+                            module: {
+                                name: {
+                                    $containsi: formik.values.relationModelModuleName
+                                }
+                            }
+                        }
+                    };
+                    if (query) {
+                        queryData.filters.singularName = {
+                            $containsi: query,
+                        };
+                    }
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true,
+                    });
+                    return [4 /*yield*/, triggerGetModels(queryString).unwrap()];
+                case 1:
+                    result = _a.sent();
+                    if (result && result.records) {
+                        updatedSuggestion = __spreadArray([], result.records, true);
+                        return [2 /*return*/, updatedSuggestion];
+                    }
+                    else {
+                        return [2 /*return*/, []];
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_3 = _a.sent();
+                    return [2 /*return*/, []];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    var searchComputedFieldValueType = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, _filteredTypes;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                _filteredTypes = fieldDefaultMetaData.data.computedFieldValueTypes.filter(function (t) { return t.label.toLowerCase().startsWith(query.toLowerCase()); });
+                setFilteredComputedFieldValueTypes(_filteredTypes);
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                setFilteredComputedFieldValueTypes([]);
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var searchSelectionDynamicProvider = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, filterredData, transformedData;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                filterredData = fieldDefaultMetaData.data.selectionDynamicProviders.filter(function (t) { return t.provider.toLowerCase().startsWith(query.toLowerCase()); });
+                transformedData = filterredData.map(function (e) { return ({ label: e.provider, value: e.provider, help: e.help }); });
+                return [2 /*return*/, transformedData];
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                return [2 /*return*/, []];
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var searchComputedProvider = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, filterredData, transformedData;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                filterredData = fieldDefaultMetaData.data.computedProviders.filter(function (t) { return t.provider.toLowerCase().startsWith(query.toLowerCase()); });
+                transformedData = filterredData.map(function (e) { return ({ label: e.provider, value: e.provider, help: e.help }); });
+                return [2 /*return*/, transformedData];
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                return [2 /*return*/, []];
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var searchExternalIdProvider = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, filterredData, transformedData;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                filterredData = fieldDefaultMetaData.data.externalIdProviders.filter(function (t) { return t.provider.toLowerCase().startsWith(query.toLowerCase()); });
+                transformedData = filterredData.map(function (e) { return ({ label: e.provider, value: e.provider, help: e.help }); });
+                return [2 /*return*/, transformedData];
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                return [2 /*return*/, []];
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var searchSelectionEncryptionType = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, _filteredTypes;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                _filteredTypes = fieldDefaultMetaData.data.encryptionTypes.filter(function (t) { return t.label.toLowerCase().startsWith(query.toLowerCase()); });
+                setFilteredSelectionEncryptionType(_filteredTypes);
+                return [2 /*return*/, _filteredTypes];
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                setFilteredSelectionEncryptionType([]);
+                return [2 /*return*/, []];
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var searchSelectionDecryptWhen = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var query, _filteredTypes;
+        return __generator(this, function (_a) {
+            query = event.query;
+            try {
+                _filteredTypes = fieldDefaultMetaData.data.decryptWhenTypes.filter(function (t) { return t.label.toLowerCase().startsWith(query.toLowerCase()); });
+                setFilteredSelectionDecryptWhen(_filteredTypes);
+                return [2 /*return*/, _filteredTypes];
+            }
+            catch (error) {
+                console.error("Error fetching items:", error);
+                setFilteredSelectionDecryptWhen([]);
+                return [2 /*return*/, []];
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var isFormFieldValid = function (formik, fieldName) {
+        return formik.touched[fieldName] && formik.errors[fieldName];
+    };
+    var mediaStorageProviderId = [
+        { label: "mediaStorageProviderId", value: "mediaStorageProviderId" },
+        { label: "id2", value: "2" },
+    ];
+    var selctionValueTypes = [
+        { label: "String", value: "string" },
+        { label: "Int", value: "int" },
+    ];
+    var relationCreateInverses = [
+        { label: "True", value: "true" },
+        { label: "False", value: "false" },
+    ];
+    var _77 = useState(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.regexPattern), selectedPasswordPolicy = _77[0], setSelectedPasswordPolicy = _77[1];
+    var passwordPolicyOptions = [
+        { label: 'Lowercase and Uppercase Alphabets Required', value: '^(?=.*[a-z])(?=.*[A-Z]).*$' },
+        { label: 'Lowercase and Uppercase Alphabets and Numbers Required', value: '^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).*$' },
+        { label: 'Lowercase and Uppercase Alphabets, Numbers, and Special Characters Required', value: '^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&]).*$' },
+        { label: 'custom', value: 'custom' },
+    ];
+    var mediaTypesOptions = [
+        { label: 'Image (Supports JPEG, PNG, WEBP, etc.)', value: 'image' },
+        { label: 'Audio (Supports MP3, WAV, AAC, etc.)', value: 'audio' },
+        { label: 'Video (Supports MP4, AVI, MKV, etc.)', value: 'video' },
+        { label: 'File (Supports PDF, DOCX, TXT, etc.)', value: 'file' }
+    ];
+    var initialValues = {
+        name: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.name : null,
+        displayName: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.displayName : null,
+        description: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.description : null,
+        type: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.type : null,
+        ormType: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.ormType : null,
+        length: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.length : null,
+        defaultValue: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.defaultValue : null,
+        regexPattern: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.regexPattern : null,
+        regexPatternNotMatchingErrorMsg: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.regexPatternNotMatchingErrorMsg : "",
+        required: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.required : false,
+        unique: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.unique : false,
+        encrypt: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.encrypt : false,
+        encryptionType: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.encryptionType : null,
+        decryptWhen: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.decryptWhen : null,
+        index: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.index : false,
+        min: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.min : null,
+        max: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.max : null,
+        private: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.private : false,
+        mediaTypes: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.mediaTypes : null,
+        mediaMaxSizeKb: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.mediaMaxSizeKb : null,
+        mediaStorageProviderId: fieldMetaData ? (_b = fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.mediaStorageProvider) === null || _b === void 0 ? void 0 : _b.id : null,
+        mediaStorageProvider: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.mediaStorageProvider : null,
+        mediaEmbedded: fieldMetaData ? ((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.mediaEmbedded) && (fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.mediaEmbedded.toString())) : "true",
+        relationType: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.relationType : null,
+        relationModelSingularName: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.relationModelSingularName : null,
+        relationModelFieldName: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.relationModelFieldName : '',
+        relationCreateInverse: fieldMetaData && fieldMetaData.relationCreateInverse === false ? "false" : "true",
+        relationCascade: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.relationCascade : 'cascade',
+        relationModelModuleName: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.relationModelModuleName : modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.module.name,
+        selectionDynamicProvider: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionDynamicProvider : null,
+        selectionDynamicProviderCtxt: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionDynamicProviderCtxt : "",
+        selectionStaticValues: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionStaticValues : [""],
+        selectionValueType: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionValueType : null,
+        computedFieldValueProvider: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldValueProvider : null,
+        computedFieldValueType: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldValueType : null,
+        computedFieldValueProviderCtxt: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldValueProviderCtxt : "",
+        // externalIdProvider: fieldMetaData ? fieldMetaData?.externalIdProvider : null,
+        // externalIdProviderCtxt: fieldMetaData ? fieldMetaData?.externalIdProviderCtxt : "",
+        isSystem: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.isSystem : false,
+        columnName: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.columnName : null
+    };
+    var formik = useFormik({
+        initialValues: initialValues,
+        validationSchema: validationSchema,
+        enableReinitialize: true,
+        onSubmit: function (values) { return __awaiter(void 0, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                try {
+                    setFieldMetaData(function (prevItems) {
+                        var newFieldData = __assign(__assign({}, values), { isSystem: values.isSystem == true ? true : '' });
+                        var formtatedFieldPayload = fieldBasedPayloadFormating(newFieldData, currentFields, fieldMetaData);
+                        var existingIndex = prevItems.findIndex(function (item) { return item.identifier === formtatedFieldPayload.identifier; });
+                        if (existingIndex !== -1) {
+                            var updatedItems = __spreadArray([], prevItems, true);
+                            updatedItems[existingIndex] = formtatedFieldPayload;
+                            return updatedItems;
+                        }
+                        else {
+                            return __spreadArray(__spreadArray([], prevItems, true), [formtatedFieldPayload], false);
+                        }
+                    });
+                    // nextTab()
+                    setVisiblePopup(false);
+                }
+                catch (err) {
+                    console.error("Failed to create Radix Model:", err);
+                }
+                return [2 /*return*/];
+            });
+        }); },
+        validateOnBlur: false // Disable validation on blur
+    });
+    var showError = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var errors, errorMessages;
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0: return [4 /*yield*/, formik.validateForm()];
+                case 1:
+                    errors = _b.sent();
+                    errorMessages = Object.values(errors);
+                    if (errorMessages.length > 0) {
+                        (_a = toast === null || toast === void 0 ? void 0 : toast.current) === null || _a === void 0 ? void 0 : _a.show({
+                            severity: "error",
+                            summary: "Can you send me the report?",
+                            // sticky: true,
+                            life: 3000,
+                            //@ts-ignore
+                            content: function (props) { return (_jsx("div", { className: "flex flex-column align-items-left", style: { flex: "1" }, children: errorMessages.map(function (m, index) { return (_jsx("div", { className: "flex align-items-center gap-2", children: _jsx("span", { className: "font-bold text-900", children: String(m) }) }, index)); }) })); },
+                        });
+                    }
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    var handleTypeSelect = function (e) {
+        setShowTypeFilter(false);
+        setSelectedType({ label: e, value: e });
+        formik.setFieldValue("type", e);
+        if (e == "email") {
+            formik.setFieldValue("regexPattern", "/^[a-zA-Z0-9. _%+-]+@[a-zA-Z0-9. -]+\\. [a-zA-Z]{2,}$/");
+        }
+        else {
+            formik.setFieldValue("regexPattern", "");
+        }
+        var ormType = fieldDefaultMetaData.data.ormType[modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.dataSourceType];
+        var availableOrmTypes = ormType[e];
+        // setFilteredOrmTypes(availableOrmTypes.ormTypes.map((e: any) => ({
+        //   label: e,
+        //   value: e,
+        // })));
+        // setSelectedOrmType({ label: availableOrmTypes.ormTypes[0], value: availableOrmTypes.ormTypes[0] });
+        setOrmTypeOptions(availableOrmTypes.ormTypes);
+        formik.setFieldValue("ormType", availableOrmTypes.ormTypes[0].label);
+        setSelectedOrmType(availableOrmTypes.ormTypes[0].label);
+        setCurrentFields(fetchCurrentFields(e, fieldDefaultMetaData));
+        // setTypeSelected(true);
+    };
+    useEffect((function () {
+        setOrmTypeOptions(fieldDefaultMetaData && formik.values.type && fieldDefaultMetaData.data.ormType[modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.dataSourceType][formik.values.type].ormTypes);
+    }), [formik]);
+    useEffect(function () {
+        if (fieldMetaData && fieldMetaData.columnName) {
+            setShowColumnName(true);
+        }
+    }, [fieldMetaData]);
+    var updateEnumValues = function (index, updatedString) {
+        var updatedValues = formik.values.selectionStaticValues.map(function (enumValue, i) {
+            return i === index ? updatedString : enumValue;
+        });
+        formik.setFieldValue("selectionStaticValues", updatedValues);
+    };
+    var addEnumValue = function () {
+        formik.setFieldValue("selectionStaticValues", __spreadArray(__spreadArray([], formik.values.selectionStaticValues, true), [":"], false));
+    };
+    var deleteEnumValue = function (index) {
+        if (formik.values.selectionStaticValues.length > 1) {
+            var updatedRows = formik.values.selectionStaticValues.filter(function (_, rowIndex) { return rowIndex !== index; });
+            formik.setFieldValue("selectionStaticValues", updatedRows);
+        }
+        else {
+        }
+    };
+    return (_jsxs("div", { className: "field-popup", children: [_jsx(Toast, { ref: toast }), _jsx("div", { children: _jsxs("form", { onSubmit: formik.handleSubmit, children: [_jsx("div", { className: "field-popup-navigation", children: pathname.includes('create') ?
+                                _jsxs("div", { className: "flex gap-3 justify-content-between ", children: [showTypeFilter === false ?
+                                            _jsxs("div", { className: "flex text-2xl font-bold align-items-center", style: { color: '#000' }, children: [_jsx(Button, { icon: "pi pi-arrow-left", rounded: true, text: true, type: "reset", "aria-label": "Cancel", size: "small", onClick: function () {
+                                                            if (!formik.values.displayName) {
+                                                                setShowTypeFilter(true);
+                                                            }
+                                                            else {
+                                                                setIsBackPopupVisible(true);
+                                                            }
+                                                        } }), _jsx("p", { className: "field-popup-nav-heading", children: capitalize(modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.displayName) })] }) :
+                                            _jsx("div", { className: "flex text-2xl font-bold align-items-center ml-4", style: { color: '#000' }, children: _jsxs("p", { className: "field-popup-nav-heading", children: ["Model - ", capitalize(modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.displayName)] }) }), _jsx("div", { className: "flex align-items-center gap-3 close-popup", children: _jsx(Button, { icon: "pi pi-times", rounded: true, text: true, "aria-label": "Cancel", type: "reset", size: "small", onClick: function () { return setVisiblePopup(false); } }) })] }) :
+                                _jsxs("div", { className: "flex gap-3 justify-content-between ", children: [_jsxs("div", { className: "flex text-2xl font-bold align-items-center", style: { color: '#000' }, children: [!(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id) &&
+                                                    _jsx(Button, { icon: "pi pi-arrow-left", rounded: true, text: true, type: "reset", "aria-label": "Cancel", size: "small", onClick: function () {
+                                                            if (!formik.values.displayName) {
+                                                                setShowTypeFilter(true);
+                                                            }
+                                                            else {
+                                                                setIsBackPopupVisible(true);
+                                                            }
+                                                        } }), fieldMetaData ?
+                                                    _jsxs("p", { className: "field-popup-nav-heading ml-2", children: [capitalize(modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.displayName), " > ", capitalize(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.displayName)] })
+                                                    :
+                                                        _jsxs("p", { className: "field-popup-nav-heading ml-2", children: ["Add New Field to ", capitalize(modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.displayName)] })] }), _jsx("div", { className: "flex align-items-center gap-3 close-popup", children: _jsx(Button, { icon: "pi pi-times", rounded: true, text: true, "aria-label": "Cancel", type: "reset", size: "small", onClick: function () { return setVisiblePopup(false); } }) })] }) }), showTypeFilter === true ?
+                            _jsx(FieldSelector, { handleTypeSelect: handleTypeSelect, modelMetaData: modelMetaData })
+                            :
+                                _jsx("div", { className: "field-popup-form", children: _jsx("div", { className: "p-d-flex p-jc-center creat-field-for form-dem", children: _jsxs("div", { className: "p-fluid", style: { position: 'relative' }, children: [_jsx("div", { className: "field-popup-heading", children: _jsxs("p", { children: ["Add a new ", capitalize(selectedType.value), " Field"] }) }), _jsxs(TabView, { panelContainerClassName: "px-0 pb-0", children: [_jsx(TabPanel, { header: "Basic Info", className: (formik.touched.hasOwnProperty("name") && formik.errors.hasOwnProperty("name")) || (formik.touched.hasOwnProperty("displayName") && formik.errors.hasOwnProperty("displayName")) || (formik.touched.hasOwnProperty("displayName") && formik.errors.hasOwnProperty("ormType")) ? "tab-error-heading" : "", children: _jsxs("div", { className: "grid p-nogutter", children: [currentFields.includes("displayName") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "displayName", className: "form-label form-field-label", children: "Display Name" }), _jsx(InputText, { type: "text", disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, id: "displayName", name: "displayName", onChange: function (e) {
+                                                                                        formik.setFieldValue("displayName", e.target.value);
+                                                                                        var _a = getSingularAndPlural(e.target.value), toCamelCase = _a.toCamelCase, toSnakeCase = _a.toSnakeCase, toPluralCamelCase = _a.toPluralCamelCase;
+                                                                                        formik.setFieldValue("name", toCamelCase);
+                                                                                        if (showColumnName) {
+                                                                                            formik.setFieldValue("columnName", toSnakeCase);
+                                                                                        }
+                                                                                    }, value: formik.values.displayName, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                        "p-invalid": isFormFieldValid(formik, "displayName"),
+                                                                                    }) }), isFormFieldValid(formik, "displayName") && (_jsx(Message, { severity: "error", text: (_d = (_c = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _c === void 0 ? void 0 : _c.displayName) === null || _d === void 0 ? void 0 : _d.toString() }))] }) })), currentFields.includes("name") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "name", className: "form-label form-field-label", children: "Name" }), _jsx(InputText, { disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, type: "text", id: "name", name: "name", onChange: formik.handleChange, value: formik.values.name, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                        "p-invalid": isFormFieldValid(formik, "name"),
+                                                                                    }) }), isFormFieldValid(formik, "name") && (_jsx(Message, { severity: "error", text: (_f = (_e = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _e === void 0 ? void 0 : _e.name) === null || _f === void 0 ? void 0 : _f.toString() }))] }) })), currentFields.includes("description") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "description", className: "form-label form-field-label", children: "Description" }), _jsx(InputTextarea, { "aria-describedby": "Description of your field", id: "description", name: "description", onChange: formik.handleChange, value: formik.values.description, rows: 5, cols: 30, className: classNames("p-inputtext-sm w-full", {
+                                                                                        "p-invalid": isFormFieldValid(formik, "description"),
+                                                                                    }) }), isFormFieldValid(formik, "description") && (_jsx(Message, { severity: "error", text: (_h = (_g = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _g === void 0 ? void 0 : _g.description) === null || _h === void 0 ? void 0 : _h.toString() }))] }) })), currentFields.includes("columnName") && (_jsxs("div", { className: "md:col-6 sm:col-12", children: [_jsx("div", { className: "field mt-5", children: _jsx("div", { className: "flex align-items-center", children: _jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { onChange: function (e) {
+                                                                                                    setShowColumnName(e.checked);
+                                                                                                    if (e.checked === true) {
+                                                                                                        var _a = getSingularAndPlural(formik.values.displayName), toCamelCase = _a.toCamelCase, toSnakeCase = _a.toSnakeCase, toPluralCamelCase = _a.toPluralCamelCase;
+                                                                                                        if (pathname.includes('create')) {
+                                                                                                            formik.setFieldValue("columnName", toSnakeCase);
+                                                                                                        }
+                                                                                                    }
+                                                                                                }, checked: showColumnName }), _jsx("label", { htmlFor: "ingredient1", className: "ml-2", children: "Set Column Name" })] }) }) }), showColumnName &&
+                                                                                _jsxs("div", { className: "field mt-3", children: [_jsx("label", { htmlFor: "columnName", className: "form-label form-field-label", children: "Column Name" }), _jsx(InputText, { disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, type: "text", id: "columnName", name: "columnName", onChange: formik.handleChange, value: formik.values.columnName, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                "p-invalid": isFormFieldValid(formik, "columnName"),
+                                                                                            }) }), isFormFieldValid(formik, "columnName") && (_jsx(Message, { severity: "error", text: (_k = (_j = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _j === void 0 ? void 0 : _j.columnName) === null || _k === void 0 ? void 0 : _k.toString() }))] })] }))] }) }), _jsxs(TabPanel, { header: "Advance Config", children: [((_m = (_l = formik === null || formik === void 0 ? void 0 : formik.values) === null || _l === void 0 ? void 0 : _l.type) === null || _m === void 0 ? void 0 : _m.length) > 0 && (_jsxs("div", { className: "grid p-nogutter", children: [currentFields.includes("length") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "length", className: "form-label form-field-label", children: "Length" }), _jsx(InputNumber
+                                                                                    // type="text"
+                                                                                    , { 
+                                                                                        // type="text"
+                                                                                        id: "length", name: "length", onValueChange: formik.handleChange, value: formik.values.length, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "length"),
+                                                                                        }) }), isFormFieldValid(formik, "length") && (_jsx(Message, { severity: "error", text: (_p = (_o = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _o === void 0 ? void 0 : _o.length) === null || _p === void 0 ? void 0 : _p.toString() }))] }) })), currentFields.includes("defaultValue") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "defaultValue", className: "form-label form-field-label", children: "Default Value" }), (selectedType.value === "shortText" || selectedType.value === "longText" || selectedType.value === "richText" || selectedType.value === "json" || selectedType.value === "password" || selectedType.value === "selectionStatic") &&
+                                                                                        _jsx(InputText, { type: "text", id: "defaultValue", name: "defaultValue", onChange: formik.handleChange, value: formik.values.defaultValue, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                "p-invalid": isFormFieldValid(formik, "defaultValue"),
+                                                                                            }) }), (selectedType.value === "float" || selectedType.value === "decimal") &&
+                                                                                        _jsx(InputNumber, { id: "defaultValue", name: "defaultValue", minFractionDigits: 2, maxFractionDigits: 5, value: formik.values.defaultValue, onValueChange: function (e) { return formik.setFieldValue("defaultValue", e.value); }, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                "p-invalid": isFormFieldValid(formik, "defaultValue"),
+                                                                                            }) }), (selectedType.value === "int" || selectedType.value === "bigint") &&
+                                                                                        _jsx(InputNumber, { id: "defaultValue", name: "defaultValue", value: formik.values.defaultValue, onValueChange: function (e) { return formik.setFieldValue("defaultValue", e.value); }, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                "p-invalid": isFormFieldValid(formik, "defaultValue"),
+                                                                                            }) }), selectedType.value === "boolean" &&
+                                                                                        _jsx(SelectButton, { value: formik.values.defaultValue ? formik.values.defaultValue : "false", onChange: function (e) { return formik.setFieldValue("defaultValue", e.value); }, options: booleanOptions, className: classNames("p-inputtext-sm w-full small-input flex boolean-switch", {
+                                                                                                "p-invalid": isFormFieldValid(formik, "defaultValue"),
+                                                                                            }) }), (selectedType.value === "date" || selectedType.value === "datetime" || selectedType.value === "time") &&
+                                                                                        _jsx(Calendar, { id: "defaultValue", name: "defaultValue", value: formik.values.defaultValue ? new Date(formik.values.defaultValue) : new Date(), onChange: function (e) { return formik.setFieldValue("defaultValue", e.value); }, showTime: formik.values.type === "datetime", timeOnly: formik.values.type === "time", dateFormat: "yy-mm-dd", hourFormat: "24" // 24-hour format for time
+                                                                                            , className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                "p-invalid": isFormFieldValid(formik, "defaultValue"),
+                                                                                            }) }), isFormFieldValid(formik, "defaultValue") && (_jsx(Message, { severity: "error", text: (_r = (_q = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _q === void 0 ? void 0 : _q.defaultValue) === null || _r === void 0 ? void 0 : _r.toString() }))] }) })), currentFields.includes("mediaTypes") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "mediaTypes", className: "form-label form-field-label", children: "Media Type" }), isFormFieldValid(formik, "mediaTypes") && (_jsx(Message, { severity: "error", text: (_t = (_s = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _s === void 0 ? void 0 : _s.mediaTypes) === null || _t === void 0 ? void 0 : _t.toString() })), _jsx(MultiSelect, { value: formik.values.mediaTypes, onChange: function (e) { return formik.setFieldValue("mediaTypes", e.value); }, options: mediaTypesOptions, optionLabel: "label", placeholder: "Select Media Types", maxSelectedLabels: 3, display: "chip", className: "p-inputtext-sm w-full small-input" })] }) })), currentFields.includes("mediaMaxSizeKb") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "mediaMaxSizeKb", className: "form-label form-field-label", children: "Media Max Size (Mb)" }), _jsx(InputNumber, { id: "mediaMaxSizeKb", name: "mediaMaxSizeKb", onValueChange: formik.handleChange, value: formik.values.mediaMaxSizeKb, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "mediaMaxSizeKb"),
+                                                                                        }) }), isFormFieldValid(formik, "mediaMaxSizeKb") && (_jsx(Message, { severity: "error", text: (_v = (_u = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _u === void 0 ? void 0 : _u.mediaMaxSizeKb) === null || _v === void 0 ? void 0 : _v.toString() }))] }) })), currentFields.includes("mediaStorageProviderId") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field form-dropdown-select", children: [_jsx("label", { htmlFor: "mediaStorageProviderId", className: "form-label form-field-label", children: "Media  Storage Provider" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, relationField: true, fieldName: "mediaStorageProvider", fieldNameId: "mediaStorageProviderId", labelKey: "name", valueKey: "value", searchData: searchMediaStorageProvIderId, existingData: formik.values.mediaStorageProvider }, "mediaStorageProviderId"), isFormFieldValid(formik, "mediaStorageProvider") && (_jsx(Message, { severity: "error", text: (_x = (_w = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _w === void 0 ? void 0 : _w.mediaStorageProviderId) === null || _x === void 0 ? void 0 : _x.toString() }))] }) })), currentFields.includes("mediaEmbedded") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "mediaEmbedded", className: "form-label form-field-label", children: "Media Embedded" }), _jsx(SelectButton, { value: formik.values.mediaEmbedded, 
+                                                                                        // onChange={formik.handleChange}
+                                                                                        onChange: function (e) {
+                                                                                            formik.setFieldValue("mediaEmbedded", e.value);
+                                                                                        }, options: booleanOptions, className: classNames("p-inputtext-sm w-full small-input flex boolean-switch", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "mediaEmbedded"),
+                                                                                        }) }), isFormFieldValid(formik, "mediaEmbedded") && (_jsx(Message, { severity: "error", text: (_z = (_y = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _y === void 0 ? void 0 : _y.mediaEmbedded) === null || _z === void 0 ? void 0 : _z.toString() }))] }) })), currentFields.includes("relationType") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "relationType", className: "form-label form-field-label ", children: "Relation Type" }), _jsx(SelectButton, { value: formik.values.relationType, options: fieldDefaultMetaData.data.relationTypes, onChange: function (e) {
+                                                                                            return formik.setFieldValue("relationType", e.value);
+                                                                                        }, className: classNames("p-inputtext-sm w-full small-input flex boolean-switch", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "relationType"),
+                                                                                        }), optionLabel: "label" }), isFormFieldValid(formik, "relationType") && (_jsx(Message, { severity: "error", text: (_1 = (_0 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _0 === void 0 ? void 0 : _0.relationType) === null || _1 === void 0 ? void 0 : _1.toString() }))] }) })), currentFields.includes("relationType") && formik.values.relationType === "many-to-one" && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "relationCascade", className: "form-label form-field-label", children: "Relation Cascade" }), _jsx(Dropdown, { id: "relationCascade", name: "relationCascade", value: formik.values.relationCascade, options: fieldDefaultMetaData.data.cascadeTypes, onChange: function (e) {
+                                                                                            return formik.setFieldValue("relationCascade", e.value);
+                                                                                        }, placeholder: "Cascade", className: classNames("small-input p-inputtext-sm w-full", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "relationCascade"),
+                                                                                        }) }), isFormFieldValid(formik, "relationCascade") && (_jsx(Message, { severity: "error", text: (_3 = (_2 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _2 === void 0 ? void 0 : _2.relationCascade) === null || _3 === void 0 ? void 0 : _3.toString() }))] }) })), currentFields.includes("relationModelFieldName") && formik.values.relationType === "many-to-many" && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "relationModelFieldName", className: "form-label form-field-label", children: "Relation Model Field Name" }), _jsx(InputText, { type: "text", id: "relationModelFieldName", name: "relationModelFieldName", onChange: formik.handleChange, value: formik.values.relationModelFieldName, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "relationModelFieldName"),
+                                                                                        }) }), isFormFieldValid(formik, "relationModelFieldName") && (_jsx(Message, { severity: "error", text: (_5 = (_4 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _4 === void 0 ? void 0 : _4.relationModelFieldName) === null || _5 === void 0 ? void 0 : _5.toString() }))] }) })), currentFields.includes("relationCreateInverse") && formik.values.relationType === "many-to-many" && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "relationCreateInverse", className: "form-label form-field-label", children: "Relation Create Inverse" }), _jsx(Dropdown, { id: "relationCreateInverse", name: "relationCreateInverse", value: formik.values.relationCreateInverse, options: relationCreateInverses, onChange: function (e) {
+                                                                                            return formik.setFieldValue("relationCreateInverse", e.value);
+                                                                                        }, placeholder: "Select a Data Source", className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "relationCreateInverse"),
+                                                                                        }) }), isFormFieldValid(formik, "relationCreateInverse") && (_jsx(Message, { severity: "error", text: (_7 = (_6 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _6 === void 0 ? void 0 : _6.relationCreateInverse) === null || _7 === void 0 ? void 0 : _7.toString() }))] }) })), _jsx("div", { className: "md:col-12 sm:col-12", children: _jsxs("div", { className: "grid p-nogutter", children: [currentFields.includes("relationModelModuleName") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "relationModelModuleName", className: "form-label form-field-label", children: "Relation Model Module Name" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "relationModelModuleName", fieldNameId: "relationModelModuleName", labelKey: "name", valueKey: "name", searchData: searchRelationModelModuleNames, existingData: formik.values.relationModelModuleName, additionalAction: function (e) { return formik.setFieldValue("relationModelSingularName", ""); } }, "relationModelModuleName"), isFormFieldValid(formik, "relationModelModuleName") && (_jsx(Message, { severity: "error", text: (_9 = (_8 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _8 === void 0 ? void 0 : _8.relationModelModuleName) === null || _9 === void 0 ? void 0 : _9.toString() }))] }) })), currentFields.includes("relationModelSingularName") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "relationModelSingularName", className: "form-label form-field-label", children: "Relation Model Singular Name" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "relationModelSingularName", fieldNameId: "relationModelSingularName", labelKey: "displayName", valueKey: "singularName", searchData: searchRelationModelSingularNames, existingData: formik.values.relationModelSingularName }, "relationModelSingularName"), isFormFieldValid(formik, "relationModelSingularName") && (_jsx(Message, { severity: "error", text: (_11 = (_10 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _10 === void 0 ? void 0 : _10.relationModelSingularName) === null || _11 === void 0 ? void 0 : _11.toString() }))] }) }))] }) }), currentFields.includes("selectionDynamicProvider") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "selectionDynamicProvider", className: "form-label form-field-label", children: "Selection Dynamic Provider" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, 
+                                                                                        // relationField={false}
+                                                                                        fieldName: "selectionDynamicProvider", fieldNameId: null, labelKey: "label", valueKey: "value", searchData: searchSelectionDynamicProvider, existingData: formik.values.selectionDynamicProvider, additionalAction: function (e) { return setMarkdownText(e.target.value.help); } }, "selectionDynamicProvider"), isFormFieldValid(formik, "selectionDynamicProvider") && (_jsx(Message, { severity: "error", text: (_13 = (_12 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _12 === void 0 ? void 0 : _12.selectionDynamicProvider) === null || _13 === void 0 ? void 0 : _13.toString() }))] }) })), currentFields.includes("selectionValueType") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field form-dropdown-select", children: [_jsx("label", { htmlFor: "selectionValueType", className: "form-label form-field-label", children: "Selection Value Type" }), _jsx(Dropdown, { id: "selectionValueType", name: "selectionValueType", value: formik.values.selectionValueType, options: selctionValueTypes, onChange: function (e) {
+                                                                                            return formik.setFieldValue("selectionValueType", e.value);
+                                                                                        }, placeholder: "Select a Data Source", className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                            "p-invalid": isFormFieldValid(formik, "selectionValueType"),
+                                                                                        }) }), isFormFieldValid(formik, "selectionValueType") && (_jsx(Message, { severity: "error", text: (_15 = (_14 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _14 === void 0 ? void 0 : _14.selectionValueType) === null || _15 === void 0 ? void 0 : _15.toString() }))] }) })), currentFields.includes("selectionStaticValues") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "selectionStaticValues", className: "form-label form-field-label", children: "Selection Static Values" }), formik.values.selectionStaticValues.map(function (enumValue, index) { return (_jsx(SelectionStaticValues, { enumValue: enumValue, onUpdate: function (updatedString) { return updateEnumValues(index, updatedString); }, onDelete: function () { return deleteEnumValue(index); }, onAdd: addEnumValue }, index)); }), isFormFieldValid(formik, "selectionStaticValues") && (_jsx(Message, { severity: "error", text: (_17 = (_16 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _16 === void 0 ? void 0 : _16.selectionStaticValues) === null || _17 === void 0 ? void 0 : _17.toString() }))] }) })), currentFields.includes("computedFieldValueType") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "computedFieldValueType", className: "form-label form-field-label", children: "Computed Field Value Type" }), _jsx(AutoComplete, { value: selectedComputedFieldValueType, invalid: isFormFieldValid(formik, "computedFieldValueType"), suggestions: filteredComputedFieldValueTypes, completeMethod: searchComputedFieldValueType, virtualScrollerOptions: { itemSize: 38 }, field: "label", dropdown: true, className: "small-input", onChange: function (e) {
+                                                                                            setSelectedComputedFieldValueType(e.value);
+                                                                                            formik.setFieldValue("computedFieldValueType", e.value.value);
+                                                                                        } }), isFormFieldValid(formik, "computedFieldValueType") && (_jsx(Message, { severity: "error", text: (_19 = (_18 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _18 === void 0 ? void 0 : _18.computedFieldValueType) === null || _19 === void 0 ? void 0 : _19.toString() }))] }) })), currentFields.includes("computedFieldValueProvider") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "computedFieldValueProvider", className: "form-label form-field-label", children: "Computed Field Provider" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, 
+                                                                                        // relationField={false}
+                                                                                        fieldName: "computedFieldValueProvider", fieldNameId: null, labelKey: "label", valueKey: "value", searchData: searchComputedProvider, existingData: formik.values.computedFieldValueProvider, additionalAction: function (e) { return setMarkdownText(e.target.value.help); } }, "computedFieldValueProvider"), isFormFieldValid(formik, "computedFieldValueProvider") && (_jsx(Message, { severity: "error", text: (_21 = (_20 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _20 === void 0 ? void 0 : _20.computedFieldValueProvider) === null || _21 === void 0 ? void 0 : _21.toString() }))] }) })), currentFields.includes("selectionDynamicProviderCtxt") && (_jsx("div", { className: "md:col-12 sm:col-12", children: _jsx("div", { className: "grid p-nogutter", children: _jsx("div", { className: "md:col-12 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "selectionDynamicProviderCtxt", className: "form-label form-field-label", children: "Selection Dynamic Provider Context" }), _jsx(CodeEditor, { formik: formik, field: "selectionDynamicProviderCtxt" }), _jsx("div", { className: " form-field-label  mt-4", children: markdownText }), isFormFieldValid(formik, "selectionDynamicProviderCtxt") && (_jsx(Message, { severity: "error", text: (_23 = (_22 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _22 === void 0 ? void 0 : _22.selectionDynamicProviderCtxt) === null || _23 === void 0 ? void 0 : _23.toString() }))] }) }) }) })), currentFields.includes("computedFieldValueProviderCtxt") && (_jsx("div", { className: "md:col-12 sm:col-12", children: _jsx("div", { className: "grid p-nogutter", children: _jsx("div", { className: "md:col-12 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "computedFieldValueProviderCtxt", className: "form-label form-field-label", children: "Computed Field Value Provider Context" }), _jsx(CodeEditor, { formik: formik, field: "computedFieldValueProviderCtxt" }), _jsx("div", { className: "form-field-label mt-4", children: markdownText }), isFormFieldValid(formik, "computedFieldValueProviderCtxt") && (_jsx(Message, { severity: "error", text: (_25 = (_24 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _24 === void 0 ? void 0 : _24.computedFieldValueProviderCtxt) === null || _25 === void 0 ? void 0 : _25.toString() }))] }) }) }) }))] })), (currentFields.includes("regexPattern") || currentFields.includes("min") || currentFields.includes("max") || currentFields.includes("ormType")) && ormTypeOptions &&
+                                                                    _jsxs(_Fragment, { children: [_jsx("div", { className: "grid p-nogutter section-sub-heading", children: _jsx("div", { className: "md:col-12 sm:col-12", children: _jsx("p", { className: "form-subheading", children: "Validations" }) }) }), _jsxs("div", { className: "grid p-nogutter", children: [(currentFields.includes("regexPattern") && selectedType.value === "password") &&
+                                                                                        _jsx(_Fragment, { children: _jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "regexPattern", className: "form-label form-field-label", children: "Password Policy" }), _jsx(Dropdown, { value: selectedPasswordPolicy, onChange: function (e) {
+                                                                                                                setSelectedPasswordPolicy(e.value);
+                                                                                                                if (e.value !== "custom") {
+                                                                                                                    formik.setFieldValue('regexPattern', e.value);
+                                                                                                                }
+                                                                                                            }, options: passwordPolicyOptions, optionLabel: "label", placeholder: "Select a Password Policy", 
+                                                                                                            // className="w-full md:w-14rem"
+                                                                                                            className: "p-inputtext-sm w-full small-input", checkmark: true, highlightOnSelect: false })] }) }) }), currentFields.includes("regexPattern") && (_jsxs(_Fragment, { children: [_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "regexPattern", className: "form-label form-field-label", children: "Regex Pattern" }), _jsx(InputText, { type: "text", id: "regexPattern", name: "regexPattern", onChange: formik.handleChange, value: formik.values.regexPattern, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                                "p-invalid": isFormFieldValid(formik, "regexPattern"),
+                                                                                                            }) }), isFormFieldValid(formik, "regexPattern") && (_jsx(Message, { severity: "error", text: (_27 = (_26 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _26 === void 0 ? void 0 : _26.regexPattern) === null || _27 === void 0 ? void 0 : _27.toString() }))] }) }), currentFields.includes("regexPattern") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "regexPatternNotMatchingErrorMsg", className: "form-label form-field-label", children: "Regex Pattern Not Matching Error Msg" }), _jsx(InputText, { type: "text", id: "regexPatternNotMatchingErrorMsg", name: "regexPatternNotMatchingErrorMsg", onChange: formik.handleChange, value: formik.values.regexPatternNotMatchingErrorMsg, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                                "p-invalid": isFormFieldValid(formik, "regexPatternNotMatchingErrorMsg"),
+                                                                                                            }) }), isFormFieldValid(formik, "regexPatternNotMatchingErrorMsg") && (_jsx(Message, { severity: "error", text: (_29 = (_28 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _28 === void 0 ? void 0 : _28.regexPatternNotMatchingErrorMsg) === null || _29 === void 0 ? void 0 : _29.toString() }))] }) }))] })), (currentFields.includes("min") || currentFields.includes("max")) &&
+                                                                                        _jsx("div", { className: "md:col-12 sm:col-12", children: _jsxs("div", { className: "grid p-nogutter", children: [currentFields.includes("min") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "min", className: "form-label form-field-label", children: "Min (Characters Allowed)" }), (selectedType.value === "int" ||
+                                                                                                                    selectedType.value === "decimal" ||
+                                                                                                                    selectedType.value === "shortText" ||
+                                                                                                                    selectedType.value === "decimal" ||
+                                                                                                                    selectedType.value === "longText" ||
+                                                                                                                    selectedType.value === "richText" ||
+                                                                                                                    selectedType.value === "password" ||
+                                                                                                                    selectedType.value === "json") &&
+                                                                                                                    _jsx(InputNumber, { id: "min", name: "min", onValueChange: formik.handleChange, value: formik.values.min, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                                            "p-invalid": isFormFieldValid(formik, "min"),
+                                                                                                                        }) }), isFormFieldValid(formik, "min") && (_jsx(Message, { severity: "error", text: (_31 = (_30 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _30 === void 0 ? void 0 : _30.min) === null || _31 === void 0 ? void 0 : _31.toString() }))] }) })), currentFields.includes("max") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "max", className: "form-label form-field-label", children: "Max (Character allowed)" }), (selectedType.value === "int" ||
+                                                                                                                    selectedType.value === "decimal" ||
+                                                                                                                    selectedType.value === "shortText" ||
+                                                                                                                    selectedType.value === "decimal" ||
+                                                                                                                    selectedType.value === "longText" ||
+                                                                                                                    selectedType.value === "richText" ||
+                                                                                                                    selectedType.value === "password" ||
+                                                                                                                    selectedType.value === "json") &&
+                                                                                                                    _jsx(InputNumber, { id: "max", name: "max", onValueChange: formik.handleChange, value: formik.values.max, className: classNames("p-inputtext-sm w-full small-input", {
+                                                                                                                            "p-invalid": isFormFieldValid(formik, "max"),
+                                                                                                                        }) }), isFormFieldValid(formik, "max") && (_jsx(Message, { severity: "error", text: (_33 = (_32 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _32 === void 0 ? void 0 : _32.max) === null || _33 === void 0 ? void 0 : _33.toString() }))] }) }))] }) }), currentFields.includes("ormType") && (_jsx("div", { className: "md:col-12 sm:col-12", children: ormTypeOptions && ormTypeOptions.length > 1 &&
+                                                                                            _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "ormType", className: "form-label form-field-label", children: "Type" }), _jsx("div", { className: "ormTypeflex", children: ormTypeOptions && ormTypeOptions.map(function (ormType) {
+                                                                                                            return (_jsx(_Fragment, { children: _jsxs("div", { className: "mr-3 align-items-center", children: [_jsx(RadioButton, { inputId: ormType.label, name: "ormType", value: ormType.label, onChange: function (e) {
+                                                                                                                                formik.setFieldValue("ormType", e.value);
+                                                                                                                                setSelectedOrmType(e.value);
+                                                                                                                            }, checked: selectedOrmType === ormType.label }), _jsxs("label", { htmlFor: ormType.label, className: "ml-2", children: [ormType.label, _jsx("br", {}), _jsx("span", { className: "ml-4 fieldSubTitle", children: ormType.description })] })] }, ormType.key) }));
+                                                                                                        }) }), isFormFieldValid(formik, "ormType") && (_jsx(Message, { severity: "error", text: (_35 = (_34 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _34 === void 0 ? void 0 : _34.ormType) === null || _35 === void 0 ? void 0 : _35.toString() }))] }) }))] })] }), _jsx("div", { className: "grid p-nogutter section-sub-heading", children: _jsx("div", { className: "md:col-12 sm:col-12", children: _jsx("p", { className: "form-subheading", children: "Settings" }) }) }), _jsxs("div", { className: "grid p-nogutter", children: [currentFields.includes("required") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "required", onChange: function (e) {
+                                                                                                    formik.setFieldValue("required", e.checked);
+                                                                                                }, checked: formik.values.required }), _jsx("label", { htmlFor: "ingredient1", className: "form-label form-field-label ml-2", children: "Required" })] }), _jsx("p", { className: "fieldSubTitle", children: "You won't be able to create an entry if this field is empty" }), isFormFieldValid(formik, "required") && (_jsx(Message, { severity: "error", text: (_37 = (_36 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _36 === void 0 ? void 0 : _36.required) === null || _37 === void 0 ? void 0 : _37.toString() }))] }) })), currentFields.includes("unique") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "unique", onChange: function (e) {
+                                                                                                    formik.setFieldValue("unique", e.checked);
+                                                                                                }, checked: formik.values.unique }), _jsx("label", { htmlFor: "ingredient1", className: "form-label form-field-label ml-2", children: "Unique" })] }), _jsx("p", { className: "fieldSubTitle", children: "You won't be able to create an entry if there is an existing entry with identical content" }), isFormFieldValid(formik, "unique") && (_jsx(Message, { severity: "error", text: (_39 = (_38 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _38 === void 0 ? void 0 : _38.unique) === null || _39 === void 0 ? void 0 : _39.toString() }))] }) })), currentFields.includes("index") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "index", onChange: function (e) {
+                                                                                                    formik.setFieldValue("index", e.checked);
+                                                                                                }, checked: formik.values.index }), _jsx("label", { htmlFor: "ingredient1", className: "form-label form-field-label ml-2", children: "Index" })] }), isFormFieldValid(formik, "index") && (_jsx(Message, { severity: "error", text: (_41 = (_40 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _40 === void 0 ? void 0 : _40.index) === null || _41 === void 0 ? void 0 : _41.toString() }))] }) })), currentFields.includes("private") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "private", onChange: function (e) {
+                                                                                                    formik.setFieldValue("private", e.checked);
+                                                                                                }, checked: formik.values.private }), _jsx("label", { htmlFor: "ingredient1", className: "form-label form-field-label ml-2", children: "Private" })] }), _jsx("p", { className: "fieldSubTitle", children: "This field will not show up in the API response" }), isFormFieldValid(formik, "private") && (_jsx(Message, { severity: "error", text: (_43 = (_42 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _42 === void 0 ? void 0 : _42.private) === null || _43 === void 0 ? void 0 : _43.toString() }))] }) })), currentFields.includes("encrypt") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "encrypt", onChange: function (e) {
+                                                                                                    formik.setFieldValue("encrypt", e.checked);
+                                                                                                    setEncryptState(e.checked);
+                                                                                                }, checked: formik.values.encrypt }), _jsx("label", { htmlFor: "ingredient1", className: "form-label form-field-label ml-2", children: "Encrypt" })] }), isFormFieldValid(formik, "encrypt") && (_jsx(Message, { severity: "error", text: (_45 = (_44 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _44 === void 0 ? void 0 : _44.encrypt) === null || _45 === void 0 ? void 0 : _45.toString() }))] }) })), currentFields.includes("isSystem") && (_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "isSystem", onChange: function (e) {
+                                                                                                    formik.setFieldValue("isSystem", e.checked);
+                                                                                                }, checked: formik.values.isSystem }), _jsx("label", { htmlFor: "ingredient1", className: "form-label form-field-label ml-2", children: "isSystem" })] }), isFormFieldValid(formik, "isSystem") && (_jsx(Message, { severity: "error", text: (_47 = (_46 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _46 === void 0 ? void 0 : _46.isSystem) === null || _47 === void 0 ? void 0 : _47.toString() }))] }) }))] }), formik.values.encrypt === true && (_jsxs("div", { className: "grid p-nogutter mt-2", children: [_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "encryptionType", className: "form-label form-field-label", children: "Encryption Type" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "encryptionType", fieldNameId: "encryptionType", labelKey: "label", valueKey: "value", searchData: searchSelectionEncryptionType, existingData: formik.values.encryptionType }, "encryptionType"), isFormFieldValid(formik, "encryptionType") && (_jsx(Message, { severity: "error", text: (_49 = (_48 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _48 === void 0 ? void 0 : _48.encryptionType) === null || _49 === void 0 ? void 0 : _49.toString() }))] }) }), _jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field", children: [_jsx("label", { htmlFor: "decryptWhen", className: "form-label form-field-label", children: "Decrypt When" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "decryptWhen", fieldNameId: "decryptWhen", labelKey: "label", valueKey: "value", searchData: searchSelectionDecryptWhen, existingData: formik.values.decryptWhen }, "decryptWhen"), isFormFieldValid(formik, "decryptWhen") && (_jsx(Message, { severity: "error", text: (_51 = (_50 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _50 === void 0 ? void 0 : _50.decryptWhen) === null || _51 === void 0 ? void 0 : _51.toString() }))] }) })] }))] })] }), _jsxs("div", { className: "flex gap-3 justify-content-between", children: [_jsx("div", { className: "flex align-items-center gap-3 mt-3", children: _jsx(Button, { label: "Cancel", size: "small", severity: "secondary", type: "reset", onClick: function () { return setVisiblePopup(false); }, outlined: true, className: "small-button" }) }), _jsx("div", { className: "flex align-items-center gap-3 mt-3", children: _jsx(Button, { label: "Finish", size: "small", onClick: function () { return showError(); }, type: "submit", className: "small-button" }) })] })] }) }) })] }) }), _jsx(Dialog, { visible: isBackPopupVisible, header: "Select Type", headerClassName: "text-center", modal: true, footer: function () { return (_jsxs("div", { className: "flex justify-content-center", children: [_jsx(Button, { label: "Yes", icon: "pi pi-check", className: 'small-button', type: "reset", severity: "danger", autoFocus: true, onClick: function () {
+                                formik.resetForm();
+                                setIsBackPopupVisible(false);
+                                setShowTypeFilter(true);
+                            } }), _jsx(Button, { label: "No", icon: "pi pi-times", className: 'small-button', onClick: function () { return setIsBackPopupVisible(false); } })] })); }, onHide: function () { return setIsBackPopupVisible(false); }, children: _jsx("p", { children: "You have some unsaved data are you sure  you want to go back?" }) })] }));
+};
+export default FieldMetaDataForm;
+//# sourceMappingURL=FieldMetaDataForm.js.map