@solidstarters/solid-core-ui 1.1.206 → 1.1.208

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

@@ -87,6 +87,7 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from "react"
 import * as Yup from "yup";
 import FieldSelector from "./FieldSelector";
 import { ERROR_MESSAGES } from "../../../constants/error-messages";
+import { getVirtualScrollerOptions } from "../../../helpers/autoCompleteVirtualScroll";
 var SolidFieldType;
 (function (SolidFieldType) {
     // numeric types
@@ -163,7 +164,7 @@ var SelectComputedFieldTriggerValues = function (_a) {
             return item.label.toLowerCase().includes(query);
         }));
     };
-    return (_jsxs("div", { className: "flex align-items-start gap-3 mt-2", children: [_jsxs("div", { className: "", children: [_jsx("label", { htmlFor: "moduleName", className: "form-field-label", children: "Module" }), _jsx("div", { className: "mt-2", children: _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "computedFieldTriggerConfig[".concat(index, "].moduleName"), fieldNameId: "computedFieldTriggerConfig[".concat(index, "].moduleName"), labelKey: "displayName", valueKey: "name", searchData: searchModuleName, existingData: row.moduleName
+    return (_jsxs("div", { className: "flex align-items-start gap-3 mt-2 flex-wrap md:flex-nowrap", children: [_jsxs("div", { className: "", children: [_jsx("label", { htmlFor: "moduleName", className: "form-field-label", children: "Module" }), _jsx("div", { className: "mt-2", children: _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "computedFieldTriggerConfig[".concat(index, "].moduleName"), fieldNameId: "computedFieldTriggerConfig[".concat(index, "].moduleName"), labelKey: "displayName", valueKey: "name", searchData: searchModuleName, existingData: row.moduleName
                                 ? {
                                     name: row.moduleName,
                                     displayName: row.displayName || formatDisplayName(row.moduleName),
@@ -452,42 +453,42 @@ var createValidationSchema = function (currentFields, selectedType, allFields, f
     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, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65;
+    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, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68;
     var setIsDirty = _a.setIsDirty, modelMetaData = _a.modelMetaData, fieldMetaData = _a.fieldMetaData, setFieldMetaData = _a.setFieldMetaData, allFields = _a.allFields, deleteModelFunction = _a.deleteModelFunction, setVisiblePopup = _a.setVisiblePopup, params = _a.params, setIsRequiredPopUp = _a.setIsRequiredPopUp, showToaster = _a.showToaster;
     var booleanOptions = ["false", "true"];
-    var _66 = useState(false), isBackPopupVisible = _66[0], setIsBackPopupVisible = _66[1];
-    var _67 = useState(false), showColumnName = _67[0], setShowColumnName = _67[1];
+    var _69 = useState(false), isBackPopupVisible = _69[0], setIsBackPopupVisible = _69[1];
+    var _70 = useState(false), showColumnName = _70[0], setShowColumnName = _70[1];
     var pathname = usePathname();
     var toast = useRef(null);
-    var _68 = useGetFieldDefaultMetaDataQuery(null), fieldDefaultMetaData = _68.data, isLoading = _68.isLoading, error = _68.error, refetch = _68.refetch;
-    var _69 = useState(fetchCurrentFields(fieldMetaData && fieldMetaData.type, fieldDefaultMetaData)), currentFields = _69[0], setCurrentFields = _69[1];
-    var _70 = useLazyGetMediaStorageProvidersQuery(), triggerGetMediaStorageProvider = _70[0], _71 = _70[1], MediaStorageProviderData = _71.data, isMediaStorageProviderFetching = _71.isFetching, MediaStorageProviderError = _71.error;
-    var _72 = useLazyGetmodulesQuery(), triggerGetModules = _72[0], _73 = _72[1], moduleData = _73.data, isModuleFetching = _73.isFetching, moduleError = _73.error;
-    var _74 = useLazyGetModelsQuery(), triggerGetModels = _74[0], _75 = _74[1], modelData = _75.data, ismodelFetching = _75.isFetching, modelError = _75.error;
-    var _76 = useUpdateUserKeyMutation(), updateUserKey = _76[0], _77 = _76[1], isUpdateUserKeyLoading = _77.isLoading, isUpdateUserKeySuccess = _77.isSuccess, isUpdateUserKeyError = _77.isError, UpdateUserKeyError = _77.error, newModel = _77.data;
-    var _78 = useState(), markdownText = _78[0], setMarkdownText = _78[1];
-    var _79 = useState(false), encryptState = _79[0], setEncryptState = _79[1];
-    var _80 = useState(fieldMetaData ? false : true), showTypeFilter = _80[0], setShowTypeFilter = _80[1];
-    var _81 = 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 = _81[0], setSelectedType = _81[1];
-    var _82 = useState((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldValueType) && { label: fieldMetaData.computedFieldValueType, value: fieldMetaData.computedFieldValueType }), selectedComputedFieldValueType = _82[0], setSelectedComputedFieldValueType = _82[1];
-    var _83 = useState((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionDynamicProvider) && { label: fieldMetaData.selectionDynamicProvider, value: fieldMetaData.selectionDynamicProvider }), selectionDynamicProvider = _83[0], setSelectionDynamicProvider = _83[1];
+    var _71 = useGetFieldDefaultMetaDataQuery(null), fieldDefaultMetaData = _71.data, isLoading = _71.isLoading, error = _71.error, refetch = _71.refetch;
+    var _72 = useState(fetchCurrentFields(fieldMetaData && fieldMetaData.type, fieldDefaultMetaData)), currentFields = _72[0], setCurrentFields = _72[1];
+    var _73 = useLazyGetMediaStorageProvidersQuery(), triggerGetMediaStorageProvider = _73[0], _74 = _73[1], MediaStorageProviderData = _74.data, isMediaStorageProviderFetching = _74.isFetching, MediaStorageProviderError = _74.error;
+    var _75 = useLazyGetmodulesQuery(), triggerGetModules = _75[0], _76 = _75[1], moduleData = _76.data, isModuleFetching = _76.isFetching, moduleError = _76.error;
+    var _77 = useLazyGetModelsQuery(), triggerGetModels = _77[0], _78 = _77[1], modelData = _78.data, ismodelFetching = _78.isFetching, modelError = _78.error;
+    var _79 = useUpdateUserKeyMutation(), updateUserKey = _79[0], _80 = _79[1], isUpdateUserKeyLoading = _80.isLoading, isUpdateUserKeySuccess = _80.isSuccess, isUpdateUserKeyError = _80.isError, UpdateUserKeyError = _80.error, newModel = _80.data;
+    var _81 = useState(), markdownText = _81[0], setMarkdownText = _81[1];
+    var _82 = useState(false), encryptState = _82[0], setEncryptState = _82[1];
+    var _83 = useState(fieldMetaData ? false : true), showTypeFilter = _83[0], setShowTypeFilter = _83[1];
+    var _84 = 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 = _84[0], setSelectedType = _84[1];
+    var _85 = useState((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldValueType) && { label: fieldMetaData.computedFieldValueType, value: fieldMetaData.computedFieldValueType }), selectedComputedFieldValueType = _85[0], setSelectedComputedFieldValueType = _85[1];
+    var _86 = useState((fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.selectionDynamicProvider) && { label: fieldMetaData.selectionDynamicProvider, value: fieldMetaData.selectionDynamicProvider }), selectionDynamicProvider = _86[0], setSelectionDynamicProvider = _86[1];
     // const [externalIdProvider, setExternalIdProvider] = useState(fieldMetaData?.externalIdProvider && { label: fieldMetaData.externalIdProvider, value: fieldMetaData.externalIdProvider });
-    var _84 = 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 = _84[0], setSelectionStaticValues = _84[1];
-    var _85 = useState([]), filteredComputedFieldValueTypes = _85[0], setFilteredComputedFieldValueTypes = _85[1];
-    var _86 = useState([]), filteredSelectionDynamicProvider = _86[0], setFilteredSelectionDynamicProvider = _86[1];
-    var _87 = useState([]), ormTypeOptions = _87[0], setOrmTypeOptions = _87[1];
-    var _88 = useState(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.ormType), selectedOrmType = _88[0], setSelectedOrmType = _88[1];
-    var _89 = useState(false), askForUserKeyField = _89[0], setAskForUserKeyField = _89[1];
-    var _90 = useState([]), userKeyFieldData = _90[0], setUserKeyFieldData = _90[1];
-    var _91 = useState([]), filteredExternalIdProvider = _91[0], setFilteredExternalIdProvider = _91[1];
-    var _92 = useState([]), filteredSelectionEncryptionType = _92[0], setFilteredSelectionEncryptionType = _92[1];
-    var _93 = useState([]), filteredSelectionDecryptWhen = _93[0], setFilteredSelectionDecryptWhen = _93[1];
+    var _87 = 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 = _87[0], setSelectionStaticValues = _87[1];
+    var _88 = useState([]), filteredComputedFieldValueTypes = _88[0], setFilteredComputedFieldValueTypes = _88[1];
+    var _89 = useState([]), filteredSelectionDynamicProvider = _89[0], setFilteredSelectionDynamicProvider = _89[1];
+    var _90 = useState([]), ormTypeOptions = _90[0], setOrmTypeOptions = _90[1];
+    var _91 = useState(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.ormType), selectedOrmType = _91[0], setSelectedOrmType = _91[1];
+    var _92 = useState(false), askForUserKeyField = _92[0], setAskForUserKeyField = _92[1];
+    var _93 = useState([]), userKeyFieldData = _93[0], setUserKeyFieldData = _93[1];
+    var _94 = useState([]), filteredExternalIdProvider = _94[0], setFilteredExternalIdProvider = _94[1];
+    var _95 = useState([]), filteredSelectionEncryptionType = _95[0], setFilteredSelectionEncryptionType = _95[1];
+    var _96 = useState([]), filteredSelectionDecryptWhen = _96[0], setFilteredSelectionDecryptWhen = _96[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 _94 = useState(false), typeSelected = _94[0], setTypeSelected = _94[1];
+    var _97 = useState(false), typeSelected = _97[0], setTypeSelected = _97[1];
     var searchMediaTypes = function (event) { return __awaiter(void 0, void 0, void 0, function () {
         var query, suggestionData;
         return __generator(this, function (_a) {
@@ -869,7 +870,7 @@ var FieldMetaDataForm = function (_a) {
         { label: "True", value: "true" },
         { label: "False", value: "false" },
     ];
-    var _95 = useState(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.regexPattern), selectedPasswordPolicy = _95[0], setSelectedPasswordPolicy = _95[1];
+    var _98 = useState(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.regexPattern), selectedPasswordPolicy = _98[0], setSelectedPasswordPolicy = _98[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).*$' },
@@ -947,7 +948,7 @@ var FieldMetaDataForm = function (_a) {
         relationCoModelColumnName: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.relationCoModelColumnName : null,
         relationJoinTableName: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.relationJoinTableName : null,
         userKey: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.userKey : null,
-        enableAuditTracking: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.enableAuditTracking : false,
+        enableAuditTracking: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.enableAuditTracking : true,
         isPrimaryKey: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.isPrimaryKey : false,
         isMultiSelect: fieldMetaData ? fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.isMultiSelect : false,
     };
@@ -1143,19 +1144,19 @@ var FieldMetaDataForm = function (_a) {
     }, [formik.values.computedFieldTriggerConfig]);
     return (_jsxs("div", { children: [_jsx(Toast, { ref: toast }), _jsx("div", { children: _jsxs("form", { onSubmit: formik.handleSubmit, children: [_jsx("div", { className: "solid-field-metadata-form-header", children: pathname.includes('create') ?
                                 _jsxs(_Fragment, { children: [_jsx("div", { className: "flex align-items-center gap-3", children: showTypeFilter === false ?
-                                                _jsxs(_Fragment, { children: [_jsx(Button, { text: true, icon: 'pi pi-arrow-left', size: "small", type: "button", "aria-label": "Back", className: 'max-w-2rem bg-primary-reverse text-color', onClick: function () {
+                                                _jsxs(_Fragment, { children: [_jsx(Button, { text: true, icon: 'pi pi-arrow-left', size: "small", type: "button", "aria-label": "Back", className: 'max-w-2rem bg-primary-reverse text-color solid-icon-button', onClick: function () {
                                                                 if (!formik.values.displayName) {
                                                                     setShowTypeFilter(true);
                                                                 }
                                                                 else {
                                                                     setIsBackPopupVisible(true);
                                                                 }
-                                                            } }), _jsx("div", { className: "form-wrapper-title text-base", children: capitalize(modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.displayName) })] })
+                                                            } }), _jsx("div", { className: "form-wrapper-title solid-mobile-text-wrapper text-base", 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("div", { className: "form-wrapper-title text-base", 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); }, className: 'max-w-2rem bg-primary-reverse text-color' }) })] })
+                                                    _jsx("div", { className: "flex text-2xl font-bold align-items-center ml-4", style: { color: '#000' }, children: _jsxs("div", { className: "form-wrapper-title solid-mobile-text-wrapper text-base", 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); }, className: 'max-w-2rem bg-primary-reverse text-color' }) })] })
                                 :
                                     _jsxs(_Fragment, { children: [_jsxs("div", { className: "flex align-items-center gap-3", children: [!(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id) &&
-                                                        _jsx(Button, { text: true, icon: 'pi pi-arrow-left', size: "small", type: "button", "aria-label": "Back", className: 'max-w-2rem bg-primary-reverse text-color', onClick: function () {
+                                                        _jsx(Button, { text: true, icon: 'pi pi-arrow-left', size: "small", type: "button", "aria-label": "Back", className: 'max-w-2rem bg-primary-reverse text-color solid-icon-button', onClick: function () {
                                                                 if (!formik.values.displayName) {
                                                                     setShowTypeFilter(true);
                                                                 }
@@ -1163,12 +1164,12 @@ var FieldMetaDataForm = function (_a) {
                                                                     setIsBackPopupVisible(true);
                                                                 }
                                                             } }), fieldMetaData ?
-                                                        _jsxs("div", { className: "form-wrapper-title text-base", children: ["Edit ", capitalize(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.displayName)] })
+                                                        _jsxs("div", { className: "form-wrapper-title solid-mobile-text-wrapper text-base", children: ["Edit ", capitalize(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.displayName)] })
                                                         :
-                                                            _jsxs("div", { className: "form-wrapper-title text-base", children: ["Add New ", (selectedType === null || selectedType === void 0 ? void 0 : selectedType.label) && !showTypeFilter && capitalize(selectedType.label), " 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", text: true, "aria-label": "Cancel", type: "reset", size: "small", onClick: function () { return setVisiblePopup(false); }, className: 'max-w-2rem bg-primary-reverse text-color' }) })] }) }), showTypeFilter === true ?
+                                                            _jsxs("div", { className: "form-wrapper-title solid-mobile-text-wrapper text-base", children: ["Add New ", (selectedType === null || selectedType === void 0 ? void 0 : selectedType.label) && !showTypeFilter && capitalize(selectedType.label), " 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", text: true, "aria-label": "Cancel", type: "reset", size: "small", onClick: function () { return setVisiblePopup(false); }, className: 'max-w-2rem bg-primary-reverse text-color' }) })] }) }), showTypeFilter === true ?
                             _jsx(FieldSelector, { handleTypeSelect: handleTypeSelect, modelMetaData: modelMetaData })
                             :
-                                _jsx("div", { className: "p-4", style: { maxHeight: '80vh', overflowY: 'auto', overflowX: 'hidden' }, 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: [_jsxs(TabView, { panelContainerClassName: "px-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: "formgrid grid", children: [currentFields.includes("displayName") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-2", children: [_jsx("label", { htmlFor: "displayName", className: "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) {
+                                _jsx("div", { className: "p-4", style: { maxHeight: '80vh', overflowY: 'auto', overflowX: 'hidden' }, 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: [_jsxs(TabView, { panelContainerClassName: "px-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: "formgrid grid", children: [currentFields.includes("displayName") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-2", children: [_jsx("label", { htmlFor: "displayName", className: "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);
@@ -1177,11 +1178,11 @@ var FieldMetaDataForm = function (_a) {
                                                                                     }
                                                                                 }, value: formik.values.displayName, className: classNames("", {
                                                                                     "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") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "name", className: "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("", {
+                                                                                }) }), 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") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3 md:mt-0", children: [_jsx("label", { htmlFor: "name", className: "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-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") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-4", children: [_jsx("label", { htmlFor: "description", className: "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("", {
+                                                                                }) }), 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") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3 md:mt-4", children: [_jsx("label", { htmlFor: "description", className: "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-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: "field col-6 mt-4", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { onChange: function (e) {
+                                                                                }) }), 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: "field col-12 md:col-6 mt-4", children: [_jsxs("div", { className: "flex align-items-center gap-2", 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;
@@ -1201,7 +1202,7 @@ var FieldMetaDataForm = function (_a) {
                                                                                     // type="text"
                                                                                     id: "length", name: "length", onValueChange: formik.handleChange, value: formik.values.length, className: classNames("", {
                                                                                         "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") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "defaultValue", className: "form-field-label", children: "Default Value" }), (selectedType.value === "shortText" || selectedType.value === "longText" || selectedType.value === "richText" || selectedType.value === "json" || selectedType.value === "password" || selectedType.value === "selectionStatic") &&
+                                                                                    }) }), 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") && (_jsxs("div", { className: "field col-12  md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "defaultValue", className: "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-invalid": isFormFieldValid(formik, "defaultValue"),
                                                                                         }) }), (selectedType.value === "float" || selectedType.value === "decimal") &&
@@ -1217,9 +1218,9 @@ var FieldMetaDataForm = function (_a) {
                                                                                     _jsx(Calendar, { id: "defaultValue", name: "defaultValue", value: formik.values.defaultValue ? new Date(formik.values.defaultValue) : null, 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-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") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "mediaTypes", className: "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: "" })] })), currentFields.includes("mediaMaxSizeKb") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "mediaMaxSizeKb", className: "form-field-label", children: "Media Max Size (Mb)" }), _jsx(InputNumber, { id: "mediaMaxSizeKb", name: "mediaMaxSizeKb", onValueChange: formik.handleChange, value: formik.values.mediaMaxSizeKb, className: classNames("", {
+                                                                                        }) }), 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") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "mediaTypes", className: "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: "" })] })), currentFields.includes("mediaMaxSizeKb") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3 md:mt-0", children: [_jsx("label", { htmlFor: "mediaMaxSizeKb", className: "form-field-label", children: "Media Max Size (Mb)" }), _jsx(InputNumber, { id: "mediaMaxSizeKb", name: "mediaMaxSizeKb", onValueChange: formik.handleChange, value: formik.values.mediaMaxSizeKb, className: classNames("", {
                                                                                         "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") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "mediaStorageProviderId", className: "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") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "mediaEmbedded", className: "form-field-label", children: "Media Embedded" }), _jsx(SelectButton, { value: formik.values.mediaEmbedded, 
+                                                                                    }) }), 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") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "mediaStorageProviderId", className: "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") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "mediaEmbedded", className: "form-field-label", children: "Media Embedded" }), _jsx(SelectButton, { value: formik.values.mediaEmbedded, 
                                                                                     // onChange={formik.handleChange}
                                                                                     onChange: function (e) {
                                                                                         formik.setFieldValue("mediaEmbedded", e.value);
@@ -1232,34 +1233,43 @@ var FieldMetaDataForm = function (_a) {
                                                                                         }
                                                                                     }, className: classNames("", {
                                                                                         "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" || formik.values.relationType === "one-to-many") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCascade", className: "form-field-label", children: "Relation Cascade" }), _jsx(Dropdown, { id: "relationCascade", name: "relationCascade", value: formik.values.relationCascade, options: fieldDefaultMetaData.data.cascadeTypes, onChange: function (e) {
+                                                                                    }), 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" || formik.values.relationType === "one-to-many") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCascade", className: "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("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("relationModelModuleName") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2  mt-3", children: [_jsx("label", { htmlFor: "relationModelModuleName", className: "form-field-label", children: "Co-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) {
+                                                                                    }) }), 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("relationModelModuleName") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2  mt-3", children: [_jsx("label", { htmlFor: "relationModelModuleName", className: "form-field-label", children: "Co-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) {
                                                                                         formik.setFieldValue("relationCoModelSingularName", "");
                                                                                         formik.setFieldValue("relationCoModelColumnName", "");
                                                                                         formik.setFieldValue("relationJoinTableName", "");
-                                                                                    } }, "relationModelModuleName"), isFormFieldValid(formik, "relationModelModuleName") && (_jsx(Message, { severity: "error", text: (_5 = (_4 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _4 === void 0 ? void 0 : _4.relationModelModuleName) === null || _5 === void 0 ? void 0 : _5.toString() }))] })), currentFields.includes("relationCoModelSingularName") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCoModelSingularName", className: "form-field-label", children: "Co-Model Name" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "relationCoModelSingularName", fieldNameId: "relationCoModelSingularName", labelKey: "displayName", valueKey: "singularName", searchData: searchrelationCoModelSingularNames, existingData: formik.values.relationCoModelSingularName }, "relationCoModelSingularName"), isFormFieldValid(formik, "relationCoModelSingularName") && (_jsx(Message, { severity: "error", text: (_7 = (_6 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _6 === void 0 ? void 0 : _6.relationCoModelSingularName) === null || _7 === void 0 ? void 0 : _7.toString() }))] })), currentFields.includes("relationCoModelColumnName") && (formik.values.relationType === "many-to-many" || formik.values.relationType === "many-to-one") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCoModelColumnName", className: "form-field-label", children: "Relation Co-Model Column Name" }), _jsx(InputText, { type: "text", id: "relationCoModelColumnName", name: "relationCoModelColumnName", onChange: formik.handleChange, disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, value: formik.values.relationCoModelColumnName, className: classNames("", {
+                                                                                    } }, "relationModelModuleName"), isFormFieldValid(formik, "relationModelModuleName") && (_jsx(Message, { severity: "error", text: (_5 = (_4 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _4 === void 0 ? void 0 : _4.relationModelModuleName) === null || _5 === void 0 ? void 0 : _5.toString() }))] })), currentFields.includes("relationCoModelSingularName") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCoModelSingularName", className: "form-field-label", children: "Co-Model Name" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "relationCoModelSingularName", fieldNameId: "relationCoModelSingularName", labelKey: "displayName", valueKey: "singularName", searchData: searchrelationCoModelSingularNames, existingData: formik.values.relationCoModelSingularName }, "relationCoModelSingularName"), isFormFieldValid(formik, "relationCoModelSingularName") && (_jsx(Message, { severity: "error", text: (_7 = (_6 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _6 === void 0 ? void 0 : _6.relationCoModelSingularName) === null || _7 === void 0 ? void 0 : _7.toString() })), formik.values.relationType === "one-to-many" &&
+                                                                                    _jsx("p", { className: "fieldSubTitle", children: "This is the child model." }), formik.values.relationType === "many-to-one" &&
+                                                                                    _jsx("p", { className: "fieldSubTitle", children: "This is the parent model." })] })), currentFields.includes("relationCoModelColumnName") && (formik.values.relationType === "many-to-many" || formik.values.relationType === "many-to-one") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCoModelColumnName", className: "form-field-label", children: "Relation Co-Model Column Name" }), _jsx(InputText, { type: "text", id: "relationCoModelColumnName", name: "relationCoModelColumnName", onChange: formik.handleChange, disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, value: formik.values.relationCoModelColumnName, className: classNames("", {
                                                                                         "p-invalid": isFormFieldValid(formik, "relationCoModelColumnName"),
-                                                                                    }) }), isFormFieldValid(formik, "relationCoModelColumnName") && (_jsx(Message, { severity: "error", text: (_9 = (_8 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _8 === void 0 ? void 0 : _8.relationCoModelColumnName) === null || _9 === void 0 ? void 0 : _9.toString() })), _jsx("p", { className: "fieldSubTitle", children: "Allows you to control the column name of the foreign key. Eg. when adding a country field to state model, by default foreign key column in the state table will be called country_id, use this field to create a foreign key with a different name. " })] })), askForUserKeyField && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "userKey", className: "form-field-label", children: "Set User Key" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "userKey", fieldNameId: "userKey", labelKey: "displayName", valueKey: "name", searchData: searchUserKeyField, existingData: formik.values.userKey }, "userKey"), _jsx("p", { className: "fieldSubTitle", children: "The co-model you have selected does not have a user key specified. Use the above dropdown to choose from one of the \"unique\" fields in this co-model to be set as its userkey. User keys are required in co-models being used in many-to-one or one-to-many relations as in SolidX when a many-to-one field is rendered it uses an autocomplete dropdown, and the user key value is what is displayed as the label in the dropdown." }), isFormFieldValid(formik, "userKey") && (_jsx(Message, { severity: "error", text: (_11 = (_10 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _10 === void 0 ? void 0 : _10.userKey) === null || _11 === void 0 ? void 0 : _11.toString() }))] })), currentFields.includes("relationFieldFixedFilter") && (_jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationFieldFixedFilter", className: "form-field-label", children: "Relation Field Fixed Filter" }), _jsx(InputTextarea, { "aria-describedby": "Fixed Filter", id: "relationFieldFixedFilter", name: "relationFieldFixedFilter", onChange: formik.handleChange, value: formik.values.relationFieldFixedFilter, rows: 5, cols: 30, className: classNames("", {
+                                                                                    }) }), isFormFieldValid(formik, "relationCoModelColumnName") && (_jsx(Message, { severity: "error", text: (_9 = (_8 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _8 === void 0 ? void 0 : _8.relationCoModelColumnName) === null || _9 === void 0 ? void 0 : _9.toString() })), _jsx("p", { className: "fieldSubTitle", children: "Allows you to control the column name of the foreign key. Eg. when adding a country field to state model, by default foreign key column in the state table will be called country_id, use this field to create a foreign key with a different name. " })] })), askForUserKeyField && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "userKey", className: "form-field-label", children: "Set User Key" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, fieldName: "userKey", fieldNameId: "userKey", labelKey: "displayName", valueKey: "name", searchData: searchUserKeyField, existingData: formik.values.userKey }, "userKey"), _jsx("p", { className: "fieldSubTitle", children: "The co-model you have selected does not have a user key specified. Use the above dropdown to choose from one of the \"unique\" fields in this co-model to be set as its userkey. User keys are required in co-models being used in many-to-one or one-to-many relations as in SolidX when a many-to-one field is rendered it uses an autocomplete dropdown, and the user key value is what is displayed as the label in the dropdown." }), isFormFieldValid(formik, "userKey") && (_jsx(Message, { severity: "error", text: (_11 = (_10 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _10 === void 0 ? void 0 : _10.userKey) === null || _11 === void 0 ? void 0 : _11.toString() }))] })), currentFields.includes("relationFieldFixedFilter") && (_jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationFieldFixedFilter", className: "form-field-label", children: "Relation Field Fixed Filter" }), _jsx(InputTextarea, { "aria-describedby": "Fixed Filter", id: "relationFieldFixedFilter", name: "relationFieldFixedFilter", onChange: formik.handleChange, value: formik.values.relationFieldFixedFilter, rows: 5, cols: 30, className: classNames("", {
                                                                                         "p-invalid": isFormFieldValid(formik, "relationFieldFixedFilter"),
-                                                                                    }) }), isFormFieldValid(formik, "relationFieldFixedFilter") && (_jsx(Message, { severity: "error", text: (_13 = (_12 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _12 === void 0 ? void 0 : _12.relationFieldFixedFilter) === null || _13 === void 0 ? void 0 : _13.toString() })), _jsx("p", { className: "fieldSubTitle", children: "Many to one fields are rendered as autocomplete dropdown on the SolidX ui. Use the fixed filter to load a pre-filtered set of records from the co-model. Please note user input entered in the autocomplete is used to apply a dynamic filter." })] })), currentFields.includes("relationCreateInverse") && (_jsxs("div", { className: "field col-6 flex flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCreateInverse", className: "form-field-label", children: "Relation Create Inverse" }), _jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { inputId: "relationCreateInverse", name: "relationCreateInverse", checked: formik.values.relationCreateInverse, disabled: formik.values.relationType === "one-to-many" ? true : false, onChange: function (e) { return formik.setFieldValue("relationCreateInverse", e.checked); } }), _jsx("label", { htmlFor: "relationCreateInverse", className: "ml-2", children: "Create Inverse" })] }), isFormFieldValid(formik, "relationCreateInverse") && (_jsx(Message, { severity: "error", text: (_15 = (_14 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _14 === void 0 ? void 0 : _14.relationCreateInverse) === null || _15 === void 0 ? void 0 : _15.toString() }))] })), currentFields.includes("relationCoModelFieldName") && formik.values.relationCreateInverse && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCoModelFieldName", className: "form-field-label", children: "Field Name In Parent Model" }), _jsx(InputText, { type: "text", id: "relationCoModelFieldName", name: "relationCoModelFieldName", onChange: formik.handleChange, disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, value: formik.values.relationCoModelFieldName, className: classNames("", {
+                                                                                    }) }), isFormFieldValid(formik, "relationFieldFixedFilter") && (_jsx(Message, { severity: "error", text: (_13 = (_12 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _12 === void 0 ? void 0 : _12.relationFieldFixedFilter) === null || _13 === void 0 ? void 0 : _13.toString() })), _jsx("p", { className: "fieldSubTitle", children: "Many to one fields are rendered as autocomplete dropdown on the SolidX ui. Use the fixed filter to load a pre-filtered set of records from the co-model. Please note user input entered in the autocomplete is used to apply a dynamic filter." })] })), currentFields.includes("relationCreateInverse") && (_jsxs("div", { className: "field col-12 md:col-6 flex flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationCreateInverse", className: "form-field-label", children: "Relation Create Inverse" }), _jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { inputId: "relationCreateInverse", name: "relationCreateInverse", checked: formik.values.relationCreateInverse, disabled: formik.values.relationType === "one-to-many" ? true : false, onChange: function (e) { return formik.setFieldValue("relationCreateInverse", e.checked); } }), _jsx("label", { htmlFor: "relationCreateInverse", className: "ml-2", children: "Create Inverse" })] }), isFormFieldValid(formik, "relationCreateInverse") && (_jsx(Message, { severity: "error", text: (_15 = (_14 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _14 === void 0 ? void 0 : _14.relationCreateInverse) === null || _15 === void 0 ? void 0 : _15.toString() }))] })), currentFields.includes("relationCoModelFieldName") && formik.values.relationCreateInverse && !formik.values.relationCoModelSingularName && (_jsx("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: _jsx(Message, { text: "Please select Co-model" }) })), currentFields.includes("relationCoModelFieldName") && formik.values.relationCreateInverse && formik.values.relationCoModelSingularName && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("label", { htmlFor: "relationCoModelFieldName", className: "form-field-label", children: ["Field Name In ", formik.values.relationCoModelSingularName, " Model"] }), _jsx(InputText, { type: "text", id: "relationCoModelFieldName", name: "relationCoModelFieldName", onChange: formik.handleChange, disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, value: formik.values.relationCoModelFieldName, className: classNames("", {
                                                                                         "p-invalid": isFormFieldValid(formik, "relationCoModelFieldName"),
-                                                                                    }) }), _jsx("p", { className: "fieldSubTitle", children: "This is field name that is created in the parent model. Eg. In case of Country and State ideally a states field can be created in the Country model when setting create inverse true." }), isFormFieldValid(formik, "relationCoModelFieldName") && (_jsx(Message, { severity: "error", text: (_17 = (_16 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _16 === void 0 ? void 0 : _16.relationCoModelFieldName) === null || _17 === void 0 ? void 0 : _17.toString() }))] })), currentFields.includes("relationJoinTableName") && formik.values.relationType === "many-to-many" && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationJoinTableName", className: "form-field-label", children: "Relation Join Table Name" }), _jsx(InputText, { type: "text", id: "relationJoinTableName", name: "relationJoinTableName", onChange: formik.handleChange, disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, value: formik.values.relationJoinTableName, className: classNames("", {
+                                                                                    }) }), formik.values.relationType === "one-to-many" &&
+                                                                                    _jsxs("p", { className: "fieldSubTitle", children: ["This is a field that is created in the child model. In this case a ", _jsx("span", { style: { fontWeight: "700" }, children: (_16 = formik.values.relationCoModelFieldName) !== null && _16 !== void 0 ? _16 : formik.values.relationCoModelSingularName }), " field will be created in the ", formik.values.relationCoModelSingularName, " when setting create inverse true."] }), formik.values.relationType === "many-to-one" &&
+                                                                                    _jsxs("p", { className: "fieldSubTitle", children: ["This is a field that is created in the parent model. In this case a ", _jsx("span", { style: { fontWeight: "700" }, children: (_17 = formik.values.relationCoModelFieldName) !== null && _17 !== void 0 ? _17 : "".concat(formik.values.relationCoModelSingularName, "s") }), " field will be created in the ", formik.values.relationCoModelSingularName, " when setting create inverse true."] }), formik.values.relationType === "many-to-many" &&
+                                                                                    _jsxs("p", { className: "fieldSubTitle", children: ["In this case a ", formik.values.relationCoModelFieldName, " field will be created in the ", _jsx("span", { style: { fontWeight: "700" }, children: (_18 = formik.values.relationCoModelSingularName) !== null && _18 !== void 0 ? _18 : '{{}}' }), " when setting create inverse true."] }), isFormFieldValid(formik, "relationCoModelFieldName") && (_jsx(Message, { severity: "error", text: (_20 = (_19 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _19 === void 0 ? void 0 : _19.relationCoModelFieldName) === null || _20 === void 0 ? void 0 : _20.toString() }))] })), currentFields.includes("relationJoinTableName") && formik.values.relationType === "many-to-many" && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "relationJoinTableName", className: "form-field-label", children: "Relation Join Table Name" }), _jsx(InputText, { type: "text", id: "relationJoinTableName", name: "relationJoinTableName", onChange: formik.handleChange, disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id, value: formik.values.relationJoinTableName, className: classNames("", {
                                                                                         "p-invalid": isFormFieldValid(formik, "relationJoinTableName"),
-                                                                                    }) }), isFormFieldValid(formik, "relationJoinTableName") && (_jsx(Message, { severity: "error", text: (_19 = (_18 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _18 === void 0 ? void 0 : _18.relationJoinTableName) === null || _19 === void 0 ? void 0 : _19.toString() }))] })), currentFields.includes("selectionDynamicProvider") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "selectionDynamicProvider", className: "form-field-label", children: "Selection Dynamic Provider" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, 
+                                                                                    }) }), isFormFieldValid(formik, "relationJoinTableName") && (_jsx(Message, { severity: "error", text: (_22 = (_21 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _21 === void 0 ? void 0 : _21.relationJoinTableName) === null || _22 === void 0 ? void 0 : _22.toString() }))] })), currentFields.includes("selectionDynamicProvider") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "selectionDynamicProvider", className: "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: (_21 = (_20 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _20 === void 0 ? void 0 : _20.selectionDynamicProvider) === null || _21 === void 0 ? void 0 : _21.toString() }))] })), currentFields.includes("selectionValueType") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "selectionValueType", className: "form-field-label", children: "Select Value Type" }), _jsx(Dropdown, { id: "selectionValueType", name: "selectionValueType", value: formik.values.selectionValueType, options: selctionValueTypes, onChange: function (e) {
+                                                                                    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: (_24 = (_23 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _23 === void 0 ? void 0 : _23.selectionDynamicProvider) === null || _24 === void 0 ? void 0 : _24.toString() }))] })), currentFields.includes("selectionValueType") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "selectionValueType", className: "form-field-label", children: "Select 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 Value Type", className: classNames("", {
                                                                                         "p-invalid": isFormFieldValid(formik, "selectionValueType"),
-                                                                                    }) }), isFormFieldValid(formik, "selectionValueType") && (_jsx(Message, { severity: "error", text: (_23 = (_22 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _22 === void 0 ? void 0 : _22.selectionValueType) === null || _23 === void 0 ? void 0 : _23.toString() }))] })), currentFields.includes("selectionStaticValues") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "selectionStaticValues", className: "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: (_25 = (_24 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _24 === void 0 ? void 0 : _24.selectionStaticValues) === null || _25 === void 0 ? void 0 : _25.toString() }))] })), currentFields.includes("computedFieldValueType") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "computedFieldValueType", className: "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: "solid-standard-autocomplete", onChange: function (e) {
+                                                                                    }) }), isFormFieldValid(formik, "selectionValueType") && (_jsx(Message, { severity: "error", text: (_26 = (_25 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _25 === void 0 ? void 0 : _25.selectionValueType) === null || _26 === void 0 ? void 0 : _26.toString() }))] })), currentFields.includes("selectionStaticValues") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "selectionStaticValues", className: "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: (_28 = (_27 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _27 === void 0 ? void 0 : _27.selectionStaticValues) === null || _28 === void 0 ? void 0 : _28.toString() }))] })), currentFields.includes("computedFieldValueType") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "computedFieldValueType", className: "form-field-label", children: "Computed Field Value Type" }), _jsx(AutoComplete, { value: selectedComputedFieldValueType, invalid: isFormFieldValid(formik, "computedFieldValueType"), suggestions: filteredComputedFieldValueTypes, completeMethod: searchComputedFieldValueType, 
+                                                                                    // virtualScrollerOptions={{ itemSize: 38 }}
+                                                                                    virtualScrollerOptions: getVirtualScrollerOptions({
+                                                                                        itemsLength: filteredComputedFieldValueTypes.length,
+                                                                                    }), field: "label", dropdown: true, className: "solid-standard-autocomplete", onChange: function (e) {
                                                                                         setSelectedComputedFieldValueType(e.value);
                                                                                         formik.setFieldValue("computedFieldValueType", e.value.value);
-                                                                                    } }), isFormFieldValid(formik, "computedFieldValueType") && (_jsx(Message, { severity: "error", text: (_27 = (_26 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _26 === void 0 ? void 0 : _26.computedFieldValueType) === null || _27 === void 0 ? void 0 : _27.toString() }))] })), currentFields.includes("computedFieldValueProvider") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "computedFieldValueProvider", className: "form-field-label", children: "Computed Field Provider" }), _jsx(SingleSelectAutoCompleteField, { formik: formik, isFormFieldValid: isFormFieldValid, 
+                                                                                    } }), isFormFieldValid(formik, "computedFieldValueType") && (_jsx(Message, { severity: "error", text: (_30 = (_29 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _29 === void 0 ? void 0 : _29.computedFieldValueType) === null || _30 === void 0 ? void 0 : _30.toString() }))] })), currentFields.includes("computedFieldValueProvider") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "computedFieldValueProvider", className: "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: (_29 = (_28 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _28 === void 0 ? void 0 : _28.computedFieldValueProvider) === null || _29 === void 0 ? void 0 : _29.toString() }))] })), currentFields.includes("computedFieldTriggerConfig") && (_jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-3", children: [(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldTriggerConfig) === null
+                                                                                    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: (_32 = (_31 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _31 === void 0 ? void 0 : _31.computedFieldValueProvider) === null || _32 === void 0 ? void 0 : _32.toString() }))] })), currentFields.includes("computedFieldTriggerConfig") && (_jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-3", children: [(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldTriggerConfig) === null
                                                                                     &&
                                                                                         _jsx("div", { className: "mb-3", children: _jsx(Message, { severity: "error", text: "You seem to be using an old configuration of ComputedFieldProvider. Please change your current computed field provider i.e ".concat(fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.computedFieldValueProvider, " to implement IEntityComputedFieldProvider before continuing.") }) }), _jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx("label", { htmlFor: "computedFieldTriggerConfig", className: "form-field-label", children: "Computed Field Trigger Config" }), _jsx("div", { children: _jsx(Button, { icon: "pi pi-plus", size: "small", onClick: handleAdd, type: "button", className: "ml-2" }) })] }), formik.values.computedFieldTriggerConfig.map(function (row, index) {
                                                                                     var _a;
@@ -1275,23 +1285,23 @@ var FieldMetaDataForm = function (_a) {
                                                                         //         </div>
                                                                         //       </div>
                                                                         //     } */}
-                                                                        _jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-4", children: [_jsx("label", { htmlFor: "selectionDynamicProviderCtxt", className: "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: (_31 = (_30 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _30 === void 0 ? void 0 : _30.selectionDynamicProviderCtxt) === null || _31 === void 0 ? void 0 : _31.toString() }))] })
+                                                                        _jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-4", children: [_jsx("label", { htmlFor: "selectionDynamicProviderCtxt", className: "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: (_34 = (_33 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _33 === void 0 ? void 0 : _33.selectionDynamicProviderCtxt) === null || _34 === void 0 ? void 0 : _34.toString() }))] })
                                                                         // {/* {currentFields.includes("markdown") && ( */}
-                                                                        ), currentFields.includes("computedFieldValueProviderCtxt") && (_jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-4", children: [_jsx("label", { htmlFor: "computedFieldValueProviderCtxt", className: "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: (_33 = (_32 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _32 === void 0 ? void 0 : _32.computedFieldValueProviderCtxt) === null || _33 === void 0 ? void 0 : _33.toString() }))] }))] })), (currentFields.includes("regexPattern") || currentFields.includes("min") || currentFields.includes("max") || currentFields.includes("ormType")) && ormTypeOptions && selectedType.value !== 'relation' &&
+                                                                        ), currentFields.includes("computedFieldValueProviderCtxt") && (_jsxs("div", { className: "field col-12 flex-flex-column gap-2 mt-4", children: [_jsx("label", { htmlFor: "computedFieldValueProviderCtxt", className: "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: (_36 = (_35 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _35 === void 0 ? void 0 : _35.computedFieldValueProviderCtxt) === null || _36 === void 0 ? void 0 : _36.toString() }))] }))] })), (currentFields.includes("regexPattern") || currentFields.includes("min") || currentFields.includes("max") || currentFields.includes("ormType")) && ormTypeOptions && selectedType.value !== 'relation' &&
                                                                     _jsxs(_Fragment, { children: [_jsx("p", { className: "form-wrapper-heading text-base mt-3", children: "Validations" }), _jsxs("div", { className: "formgrid grid", children: [(currentFields.includes("regexPattern") && selectedType.value === "password") &&
-                                                                                        _jsx(_Fragment, { children: _jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "regexPattern", className: "form-field-label", children: "Password Policy" }), _jsx(Dropdown, { value: selectedPasswordPolicy, onChange: function (e) {
+                                                                                        _jsx(_Fragment, { children: _jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "regexPattern", className: "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: "", checkmark: true, highlightOnSelect: false })] }) }), currentFields.includes("regexPattern") && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "regexPattern", className: "form-field-label", children: "Regex Pattern" }), _jsx(InputText, { type: "text", id: "regexPattern", name: "regexPattern", onChange: formik.handleChange, value: formik.values.regexPattern, className: classNames("", {
+                                                                                                        className: "", panelClassName: "password-policy-dropdown-panel", checkmark: true, highlightOnSelect: false })] }) }), currentFields.includes("regexPattern") && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "regexPattern", className: "form-field-label", children: "Regex Pattern" }), _jsx(InputText, { type: "text", id: "regexPattern", name: "regexPattern", onChange: formik.handleChange, value: formik.values.regexPattern, className: classNames("", {
                                                                                                             "p-invalid": isFormFieldValid(formik, "regexPattern"),
-                                                                                                        }) }), isFormFieldValid(formik, "regexPattern") && (_jsx(Message, { severity: "error", text: (_35 = (_34 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _34 === void 0 ? void 0 : _34.regexPattern) === null || _35 === void 0 ? void 0 : _35.toString() }))] }), currentFields.includes("regexPattern") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "regexPatternNotMatchingErrorMsg", className: "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("", {
+                                                                                                        }) }), isFormFieldValid(formik, "regexPattern") && (_jsx(Message, { severity: "error", text: (_38 = (_37 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _37 === void 0 ? void 0 : _37.regexPattern) === null || _38 === void 0 ? void 0 : _38.toString() }))] }), currentFields.includes("regexPattern") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3 mb-3 md:mb-3", children: [_jsx("label", { htmlFor: "regexPatternNotMatchingErrorMsg", className: "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-invalid": isFormFieldValid(formik, "regexPatternNotMatchingErrorMsg"),
-                                                                                                        }) }), isFormFieldValid(formik, "regexPatternNotMatchingErrorMsg") && (_jsx(Message, { severity: "error", text: (_37 = (_36 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _36 === void 0 ? void 0 : _36.regexPatternNotMatchingErrorMsg) === null || _37 === void 0 ? void 0 : _37.toString() }))] }))] })), (currentFields.includes("min") || currentFields.includes("max")) &&
-                                                                                        _jsxs(_Fragment, { children: [currentFields.includes("min") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("label", { htmlFor: "min", className: "form-field-label", children: ["Min ", (selectedType.value !== "int" && selectedType.value !== "decimal") && "(Characters Allowed)"] }), (selectedType.value === "int" ||
+                                                                                                        }) }), isFormFieldValid(formik, "regexPatternNotMatchingErrorMsg") && (_jsx(Message, { severity: "error", text: (_40 = (_39 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _39 === void 0 ? void 0 : _39.regexPatternNotMatchingErrorMsg) === null || _40 === void 0 ? void 0 : _40.toString() }))] }))] })), (currentFields.includes("min") || currentFields.includes("max")) &&
+                                                                                        _jsxs(_Fragment, { children: [currentFields.includes("min") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-2 md:mt-3", children: [_jsxs("label", { htmlFor: "min", className: "form-field-label", children: ["Min ", (selectedType.value !== "int" && selectedType.value !== "decimal") && "(Characters Allowed)"] }), (selectedType.value === "int" ||
                                                                                                             selectedType.value === "decimal" ||
                                                                                                             selectedType.value === "shortText" ||
                                                                                                             selectedType.value === "decimal" ||
@@ -1301,7 +1311,7 @@ var FieldMetaDataForm = function (_a) {
                                                                                                             selectedType.value === "json") &&
                                                                                                             _jsx(InputNumber, { id: "min", name: "min", onValueChange: formik.handleChange, value: formik.values.min, className: classNames("", {
                                                                                                                     "p-invalid": isFormFieldValid(formik, "min"),
-                                                                                                                }), disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id }), isFormFieldValid(formik, "min") && (_jsx(Message, { severity: "error", text: (_39 = (_38 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _38 === void 0 ? void 0 : _38.min) === null || _39 === void 0 ? void 0 : _39.toString() }))] })), currentFields.includes("max") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("label", { htmlFor: "max", className: "form-field-label", children: ["Max ", (selectedType.value !== "int" &&
+                                                                                                                }), disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id }), isFormFieldValid(formik, "min") && (_jsx(Message, { severity: "error", text: (_42 = (_41 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _41 === void 0 ? void 0 : _41.min) === null || _42 === void 0 ? void 0 : _42.toString() }))] })), currentFields.includes("max") && (_jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("label", { htmlFor: "max", className: "form-field-label", children: ["Max ", (selectedType.value !== "int" &&
                                                                                                                     selectedType.value !== "decimal") && "(Characters allowed)"] }), (selectedType.value === "int" ||
                                                                                                             selectedType.value === "decimal" ||
                                                                                                             selectedType.value === "shortText" ||
@@ -1312,33 +1322,33 @@ var FieldMetaDataForm = function (_a) {
                                                                                                             selectedType.value === "json") &&
                                                                                                             _jsx(InputNumber, { id: "max", name: "max", onValueChange: formik.handleChange, value: formik.values.max, className: classNames("", {
                                                                                                                     "p-invalid": isFormFieldValid(formik, "max"),
-                                                                                                                }), disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id }), isFormFieldValid(formik, "max") && (_jsx(Message, { severity: "error", text: (_41 = (_40 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _40 === void 0 ? void 0 : _40.max) === null || _41 === void 0 ? void 0 : _41.toString() }))] }))] }), currentFields.includes("ormType") && (_jsx("div", { className: "md:col-12 sm:col-12", children: ormTypeOptions && ormTypeOptions.length > 1 &&
-                                                                                            _jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "ormType", className: "form-field-label", children: "Type" }), _jsx("div", { className: "ormTypeflex", children: ormTypeOptions && ormTypeOptions.map(function (ormType) {
+                                                                                                                }), disabled: fieldMetaData === null || fieldMetaData === void 0 ? void 0 : fieldMetaData.id }), isFormFieldValid(formik, "max") && (_jsx(Message, { severity: "error", text: (_44 = (_43 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _43 === void 0 ? void 0 : _43.max) === null || _44 === void 0 ? void 0 : _44.toString() }))] }))] }), currentFields.includes("ormType") && (_jsx("div", { className: "col-12", children: ormTypeOptions && ormTypeOptions.length > 1 &&
+                                                                                            _jsxs("div", { className: "field col-12 md:col-6 flex-flex-column gap-2 mt-3", children: [_jsx("label", { htmlFor: "ormType", className: "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: (_43 = (_42 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _42 === void 0 ? void 0 : _42.ormType) === null || _43 === void 0 ? void 0 : _43.toString() }))] }) }))] })] }), (formik.values.relationType !== "many-to-many" && formik.values.relationType !== "one-to-many") && _jsx("p", { className: "form-wrapper-heading text-base mt-3", children: "Settings" }), _jsxs("div", { className: "formgrid grid", children: [currentFields.includes("required") && (formik.values.relationType !== "many-to-many" && formik.values.relationType !== "one-to-many") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "required", onChange: function (e) {
+                                                                                                        }) }), isFormFieldValid(formik, "ormType") && (_jsx(Message, { severity: "error", text: (_46 = (_45 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _45 === void 0 ? void 0 : _45.ormType) === null || _46 === void 0 ? void 0 : _46.toString() }))] }) }))] })] }), (formik.values.relationType !== "many-to-many" && formik.values.relationType !== "one-to-many") && _jsx("p", { className: "form-wrapper-heading text-base mt-3", children: "Settings" }), _jsxs("div", { className: "formgrid grid mt-3 md:mt-0", children: [currentFields.includes("required") && (formik.values.relationType !== "many-to-many" && formik.values.relationType !== "one-to-many") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", 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-field-label ml-2", children: "Required" })] }), _jsx("p", { className: "text-xs mt-2", children: "You won't be able to create an entry if this field is empty" }), isFormFieldValid(formik, "required") && (_jsx(Message, { severity: "error", text: (_45 = (_44 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _44 === void 0 ? void 0 : _44.required) === null || _45 === void 0 ? void 0 : _45.toString() }))] })), currentFields.includes("unique") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "unique", onChange: function (e) {
+                                                                                            }, checked: formik.values.required }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label ml-2", children: "Required" })] }), _jsx("p", { className: "text-xs mt-2", children: "You won't be able to create an entry if this field is empty" }), isFormFieldValid(formik, "required") && (_jsx(Message, { severity: "error", text: (_48 = (_47 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _47 === void 0 ? void 0 : _47.required) === null || _48 === void 0 ? void 0 : _48.toString() }))] })), currentFields.includes("unique") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "unique", onChange: function (e) {
                                                                                                 formik.setFieldValue("unique", e.checked);
                                                                                                 formik.setFieldValue("isUserKey", false);
-                                                                                            }, checked: formik.values.unique }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label ml-2", children: "Unique" })] }), _jsx("p", { className: "text-xs mt-2", 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: (_47 = (_46 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _46 === void 0 ? void 0 : _46.unique) === null || _47 === void 0 ? void 0 : _47.toString() }))] })), currentFields.includes("index") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "index", onChange: function (e) {
+                                                                                            }, checked: formik.values.unique }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label ml-2", children: "Unique" })] }), _jsx("p", { className: "text-xs mt-2", 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: (_50 = (_49 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _49 === void 0 ? void 0 : _49.unique) === null || _50 === void 0 ? void 0 : _50.toString() }))] })), currentFields.includes("index") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", 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-field-label ml-2", children: "Index" })] }), isFormFieldValid(formik, "index") && (_jsx(Message, { severity: "error", text: (_49 = (_48 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _48 === void 0 ? void 0 : _48.index) === null || _49 === void 0 ? void 0 : _49.toString() }))] })), currentFields.includes("private") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "private", onChange: function (e) {
+                                                                                            }, checked: formik.values.index }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label ml-2", children: "Index" })] }), isFormFieldValid(formik, "index") && (_jsx(Message, { severity: "error", text: (_52 = (_51 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _51 === void 0 ? void 0 : _51.index) === null || _52 === void 0 ? void 0 : _52.toString() }))] })), currentFields.includes("private") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", 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-field-label ml-2", children: "Private" })] }), _jsx("p", { className: "text-xs mt-2", children: "This field will not show up in the API response" }), isFormFieldValid(formik, "private") && (_jsx(Message, { severity: "error", text: (_51 = (_50 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _50 === void 0 ? void 0 : _50.private) === null || _51 === void 0 ? void 0 : _51.toString() }))] })), currentFields.includes("encrypt") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { name: "encrypt", onChange: function (e) {
+                                                                                            }, checked: formik.values.private }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label ml-2", children: "Private" })] }), _jsx("p", { className: "text-xs mt-2", children: "This field will not show up in the API response" }), isFormFieldValid(formik, "private") && (_jsx(Message, { severity: "error", text: (_54 = (_53 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _53 === void 0 ? void 0 : _53.private) === null || _54 === void 0 ? void 0 : _54.toString() }))] })), currentFields.includes("encrypt") && selectedType.value !== 'relation' && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", 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-field-label", children: "Encrypt" })] }), isFormFieldValid(formik, "encrypt") && (_jsx(Message, { severity: "error", text: (_53 = (_52 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _52 === void 0 ? void 0 : _52.encrypt) === null || _53 === void 0 ? void 0 : _53.toString() }))] })), currentFields.includes("isMultiSelect") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "isMultiSelect", onChange: function (e) {
+                                                                                            }, checked: formik.values.encrypt }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label", children: "Encrypt" })] }), isFormFieldValid(formik, "encrypt") && (_jsx(Message, { severity: "error", text: (_56 = (_55 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _55 === void 0 ? void 0 : _55.encrypt) === null || _56 === void 0 ? void 0 : _56.toString() }))] })), currentFields.includes("isMultiSelect") && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center", children: [_jsx(Checkbox, { name: "isMultiSelect", onChange: function (e) {
                                                                                                 formik.setFieldValue("isMultiSelect", e.checked);
-                                                                                            }, checked: formik.values.isMultiSelect }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label ml-2", children: "Is MultiSelect" })] }), isFormFieldValid(formik, "isMultiSelect") && (_jsx(Message, { severity: "error", text: (_55 = (_54 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _54 === void 0 ? void 0 : _54.isMultiSelect) === null || _55 === void 0 ? void 0 : _55.toString() }))] })), currentFields.includes("enableAuditTracking") && formik.values.relationType !== "one-to-many" && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { name: "enableAuditTracking", onChange: function (e) {
+                                                                                            }, checked: formik.values.isMultiSelect }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label ml-2", children: "Is MultiSelect" })] }), isFormFieldValid(formik, "isMultiSelect") && (_jsx(Message, { severity: "error", text: (_58 = (_57 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _57 === void 0 ? void 0 : _57.isMultiSelect) === null || _58 === void 0 ? void 0 : _58.toString() }))] })), currentFields.includes("enableAuditTracking") && formik.values.relationType !== "one-to-many" && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { name: "enableAuditTracking", onChange: function (e) {
                                                                                                 formik.setFieldValue("enableAuditTracking", e.checked);
-                                                                                            }, checked: formik.values.enableAuditTracking }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label", children: "Enable Audit Tracking" })] }), _jsx("p", { className: "fieldSubTitle", children: "By selecting this option, you are setting audit trail for this field." }), isFormFieldValid(formik, "enableAuditTracking") && (_jsx(Message, { severity: "error", text: (_57 = (_56 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _56 === void 0 ? void 0 : _56.enableAuditTracking) === null || _57 === void 0 ? void 0 : _57.toString() }))] })), currentFields.includes("isUserKey") && formik.values.unique && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { name: "isUserKey", onChange: function (e) {
+                                                                                            }, checked: formik.values.enableAuditTracking }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label", children: "Enable Audit Tracking" })] }), _jsx("p", { className: "fieldSubTitle", children: "By selecting this option, you are setting audit trail for this field." }), isFormFieldValid(formik, "enableAuditTracking") && (_jsx(Message, { severity: "error", text: (_60 = (_59 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _59 === void 0 ? void 0 : _59.enableAuditTracking) === null || _60 === void 0 ? void 0 : _60.toString() }))] })), currentFields.includes("isUserKey") && formik.values.unique && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { name: "isUserKey", onChange: function (e) {
                                                                                                 formik.setFieldValue("isUserKey", e.checked);
-                                                                                            }, checked: formik.values.isUserKey }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label", children: "Is Userkey" })] }), _jsx("p", { className: "fieldSubTitle", children: "By selecting this option, you are setting this field as the model's user key. Any existing user key configuration will be overwritten" }), isFormFieldValid(formik, "isUserKey") && (_jsx(Message, { severity: "error", text: (_59 = (_58 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _58 === void 0 ? void 0 : _58.isUserKey) === null || _59 === void 0 ? void 0 : _59.toString() }))] })), currentFields.includes("isPrimaryKey") && ((modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.isLegacyTable) || (modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.isLegacyTableWithId)) && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { name: "isPrimaryKey", onChange: function (e) {
+                                                                                            }, checked: formik.values.isUserKey }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label", children: "Is Userkey" })] }), _jsx("p", { className: "fieldSubTitle", children: "By selecting this option, you are setting this field as the model's user key. Any existing user key configuration will be overwritten" }), isFormFieldValid(formik, "isUserKey") && (_jsx(Message, { severity: "error", text: (_62 = (_61 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _61 === void 0 ? void 0 : _61.isUserKey) === null || _62 === void 0 ? void 0 : _62.toString() }))] })), currentFields.includes("isPrimaryKey") && ((modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.isLegacyTable) || (modelMetaData === null || modelMetaData === void 0 ? void 0 : modelMetaData.isLegacyTableWithId)) && (_jsxs("div", { className: "field col-6 flex-flex-column gap-2 mt-3", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsx(Checkbox, { name: "isPrimaryKey", onChange: function (e) {
                                                                                                 formik.setFieldValue("isPrimaryKey", e.checked);
-                                                                                            }, checked: formik.values.isPrimaryKey }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label", children: "Is Primary Key" })] }), _jsx("p", { className: "fieldSubTitle", children: "By selecting this option, you are setting this field as the primary key for this legacy table." }), isFormFieldValid(formik, "isPrimaryKey") && (_jsx(Message, { severity: "error", text: (_61 = (_60 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _60 === void 0 ? void 0 : _60.isPrimaryKey) === null || _61 === void 0 ? void 0 : _61.toString() }))] }))] }), formik.values.encrypt === true && (_jsxs("div", { className: "formgrid grid mt-2", children: [_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "encryptionType", className: "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: (_63 = (_62 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _62 === void 0 ? void 0 : _62.encryptionType) === null || _63 === void 0 ? void 0 : _63.toString() }))] }) }), _jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "decryptWhen", className: "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: (_65 = (_64 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _64 === void 0 ? void 0 : _64.decryptWhen) === null || _65 === void 0 ? void 0 : _65.toString() }))] }) })] }))] })] }), _jsxs("div", { className: "flex gap-3", children: [_jsx("div", { children: _jsx(Button, { label: "Finish", size: "small", onClick: function () { return showError(); }, type: "submit" }) }), _jsx("div", { children: _jsx(Button, { label: "Cancel", size: "small", severity: "secondary", type: "reset", onClick: function () { return setVisiblePopup(false); }, outlined: true }) })] })] }) }) })] }) }), _jsx(Dialog, { visible: isBackPopupVisible, header: "Select Type", headerClassName: "text-center", modal: true, footer: function () { return (_jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { label: "Yes", icon: "pi pi-check", size: "small", type: "reset", severity: "danger", autoFocus: true, onClick: function () {
+                                                                                            }, checked: formik.values.isPrimaryKey }), _jsx("label", { htmlFor: "ingredient1", className: "form-field-label", children: "Is Primary Key" })] }), _jsx("p", { className: "fieldSubTitle", children: "By selecting this option, you are setting this field as the primary key for this legacy table." }), isFormFieldValid(formik, "isPrimaryKey") && (_jsx(Message, { severity: "error", text: (_64 = (_63 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _63 === void 0 ? void 0 : _63.isPrimaryKey) === null || _64 === void 0 ? void 0 : _64.toString() }))] }))] }), formik.values.encrypt === true && (_jsxs("div", { className: "formgrid grid mt-2", children: [_jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "encryptionType", className: "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: (_66 = (_65 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _65 === void 0 ? void 0 : _65.encryptionType) === null || _66 === void 0 ? void 0 : _66.toString() }))] }) }), _jsx("div", { className: "md:col-6 sm:col-12", children: _jsxs("div", { className: "field col-6 flex-flex-column gap-2", children: [_jsx("label", { htmlFor: "decryptWhen", className: "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: (_68 = (_67 = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _67 === void 0 ? void 0 : _67.decryptWhen) === null || _68 === void 0 ? void 0 : _68.toString() }))] }) })] }))] })] }), _jsxs("div", { className: "flex gap-3", children: [_jsx("div", { children: _jsx(Button, { label: "Finish", size: "small", onClick: function () { return showError(); }, type: "submit" }) }), _jsx("div", { children: _jsx(Button, { label: "Cancel", size: "small", severity: "secondary", type: "reset", onClick: function () { return setVisiblePopup(false); }, outlined: true }) })] })] }) }) })] }) }), _jsx(Dialog, { visible: isBackPopupVisible, header: "Select Type", headerClassName: "text-center", modal: true, className: "solid-confirm-dialog", footer: function () { return (_jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { label: "Yes", icon: "pi pi-check", size: "small", type: "reset", severity: "danger", autoFocus: true, onClick: function () {
                                 formik.resetForm();
                                 setIsBackPopupVisible(false);
                                 setShowTypeFilter(true);