@bigbinary/neeto-fields-frontend 1.1.5 → 1.1.7

package/README.md

@@ -346,10 +346,8 @@ specific resource.
 11. `isRequiredColumnName`: The name of column which holds the value which
     suggests if a field value is a `required` one or not. Default is
     `isRequired` column.
-12. `fieldContainerClassName`: Class names for styling the `div` containing the
+12. `fieldClassName`: Class names for styling the `div` containing the
     input field.
-13. `fieldClassName`: Class names for styling the field.
-14. `labelClassName`: Class names for styling the label for fields.
 15. `onMutationSuccess`: The callback function which is triggered on the success
     of mutation functions( create, update & delete).
 

package/dist/index.cjs.js

@@ -3749,8 +3749,8 @@ function transformOptions(options) {
   return options;
 }
 
-function ownKeys$e(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$e(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$e(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$f(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$f(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$f(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$f(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 function noop$1() {}
@@ -3810,9 +3810,9 @@ var I18n = function (_EventEmitter) {
         }
       }
       var defOpts = get();
-      this.options = _objectSpread$e(_objectSpread$e(_objectSpread$e({}, defOpts), this.options), transformOptions(options));
+      this.options = _objectSpread$f(_objectSpread$f(_objectSpread$f({}, defOpts), this.options), transformOptions(options));
       if (this.options.compatibilityAPI !== 'v1') {
-        this.options.interpolation = _objectSpread$e(_objectSpread$e({}, defOpts.interpolation), this.options.interpolation);
+        this.options.interpolation = _objectSpread$f(_objectSpread$f({}, defOpts.interpolation), this.options.interpolation);
       }
       if (options.keySeparator !== undefined) {
         this.options.userDefinedKeySeparator = options.keySeparator;
@@ -4090,7 +4090,7 @@ var I18n = function (_EventEmitter) {
           }
           options = _this5.options.overloadTranslationOptionHandler([key, opts].concat(rest));
         } else {
-          options = _objectSpread$e({}, opts);
+          options = _objectSpread$f({}, opts);
         }
         options.lng = options.lng || fixedT.lng;
         options.lngs = options.lngs || fixedT.lngs;
@@ -4217,7 +4217,7 @@ var I18n = function (_EventEmitter) {
       var _this8 = this;
       var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop$1;
-      var mergedOptions = _objectSpread$e(_objectSpread$e(_objectSpread$e({}, this.options), options), {
+      var mergedOptions = _objectSpread$f(_objectSpread$f(_objectSpread$f({}, this.options), options), {
         isClone: true
       });
       var clone = new I18n(mergedOptions);
@@ -4228,7 +4228,7 @@ var I18n = function (_EventEmitter) {
       membersToCopy.forEach(function (m) {
         clone[m] = _this8[m];
       });
-      clone.services = _objectSpread$e({}, this.services);
+      clone.services = _objectSpread$f({}, this.services);
       clone.services.utils = {
         hasLoadedNamespace: clone.hasLoadedNamespace.bind(clone)
       };
@@ -4737,9 +4737,9 @@ function cape(m) {
   return unes[m];
 }
 
-function ownKeys$d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$e(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$d(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$d(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$e(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$e(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 var defaultOptions$1 = {
   bindI18n: 'languageChanged',
   bindI18nStore: '',
@@ -4753,7 +4753,7 @@ var i18nInstance;
 var I18nContext = React__default["default"].createContext();
 function setDefaults() {
   var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  defaultOptions$1 = _objectSpread$d(_objectSpread$d({}, defaultOptions$1), options);
+  defaultOptions$1 = _objectSpread$e(_objectSpread$e({}, defaultOptions$1), options);
 }
 function getDefaults() {
   return defaultOptions$1;
@@ -4880,9 +4880,9 @@ function hasLoadedNamespace(ns, i18n) {
 var _excluded$4 = ["format"],
     _excluded2 = ["children", "count", "parent", "i18nKey", "context", "tOptions", "values", "defaults", "components", "ns", "i18n", "t", "shouldUnescape"];
 
-function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$c(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$c(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$d(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$d(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 function hasChildren(node, checkLength) {
   if (!node) return false;
@@ -4908,7 +4908,7 @@ function getAsArray(data) {
 }
 
 function mergeProps(source, target) {
-  var newTarget = _objectSpread$c({}, target);
+  var newTarget = _objectSpread$d({}, target);
 
   newTarget.props = Object.assign(source.props, target.props);
   return newTarget;
@@ -4978,7 +4978,7 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts, s
   getData(children);
   var ast = c.parse("<0>".concat(targetString, "</0>"));
 
-  var opts = _objectSpread$c(_objectSpread$c({}, data), combinedTOpts);
+  var opts = _objectSpread$d(_objectSpread$d({}, data), combinedTOpts);
 
   function renderInner(child, node, rootReactNode) {
     var childs = getChildren(child);
@@ -4988,7 +4988,7 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts, s
 
   function pushTranslatedJSX(child, inner, mem, i, isVoid) {
     if (child.dummy) child.children = inner;
-    mem.push(React__default["default"].cloneElement(child, _objectSpread$c(_objectSpread$c({}, child.props), {}, {
+    mem.push(React__default["default"].cloneElement(child, _objectSpread$d(_objectSpread$d({}, child.props), {}, {
       key: i
     }), isVoid ? undefined : inner));
   }
@@ -5020,7 +5020,7 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts, s
           } else if (isEmptyTransWithHTML) {
           var _inner = mapAST(reactNodes, node.children, rootReactNode);
 
-          mem.push(React__default["default"].cloneElement(child, _objectSpread$c(_objectSpread$c({}, child.props), {}, {
+          mem.push(React__default["default"].cloneElement(child, _objectSpread$d(_objectSpread$d({}, child.props), {}, {
             key: i
           }), _inner));
         } else if (Number.isNaN(parseFloat(node.name))) {
@@ -5051,11 +5051,11 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts, s
           var content = node.children[0] ? translationContent : null;
           if (content) mem.push(content);
         } else if (node.children.length === 1 && translationContent) {
-          mem.push(React__default["default"].cloneElement(child, _objectSpread$c(_objectSpread$c({}, child.props), {}, {
+          mem.push(React__default["default"].cloneElement(child, _objectSpread$d(_objectSpread$d({}, child.props), {}, {
             key: i
           }), translationContent));
         } else {
-          mem.push(React__default["default"].cloneElement(child, _objectSpread$c(_objectSpread$c({}, child.props), {}, {
+          mem.push(React__default["default"].cloneElement(child, _objectSpread$d(_objectSpread$d({}, child.props), {}, {
             key: i
           })));
         }
@@ -5118,7 +5118,7 @@ function Trans(_ref) {
 
   if (context) tOptions.context = context;
 
-  var reactI18nextOptions = _objectSpread$c(_objectSpread$c({}, getDefaults()), i18n.options && i18n.options.react);
+  var reactI18nextOptions = _objectSpread$d(_objectSpread$d({}, getDefaults()), i18n.options && i18n.options.react);
 
   var namespaces = ns || t.ns || defaultNSFromContext || i18n.options && i18n.options.defaultNS;
   namespaces = typeof namespaces === 'string' ? [namespaces] : namespaces || ['translation'];
@@ -5126,13 +5126,13 @@ function Trans(_ref) {
   var hashTransKey = reactI18nextOptions.hashTransKey;
   var key = i18nKey || (hashTransKey ? hashTransKey(defaultValue) : defaultValue);
   var interpolationOverride = values ? tOptions.interpolation : {
-    interpolation: _objectSpread$c(_objectSpread$c({}, tOptions.interpolation), {}, {
+    interpolation: _objectSpread$d(_objectSpread$d({}, tOptions.interpolation), {}, {
       prefix: '#$?',
       suffix: '?$#'
     })
   };
 
-  var combinedTOpts = _objectSpread$c(_objectSpread$c(_objectSpread$c(_objectSpread$c({}, tOptions), {}, {
+  var combinedTOpts = _objectSpread$d(_objectSpread$d(_objectSpread$d(_objectSpread$d({}, tOptions), {}, {
     count: count
   }, values), interpolationOverride), {}, {
     defaultValue: defaultValue,
@@ -5177,9 +5177,9 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
-function ownKeys$b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$b(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$b(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$c(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$c(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 function useTranslation(ns) {
   var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var i18nFromProps = props.i18n;
@@ -5207,7 +5207,7 @@ function useTranslation(ns) {
 
   if (i18n.options.react && i18n.options.react.wait !== undefined) warnOnce('It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.');
 
-  var i18nOptions = _objectSpread$b(_objectSpread$b(_objectSpread$b({}, getDefaults()), i18n.options.react), props);
+  var i18nOptions = _objectSpread$c(_objectSpread$c(_objectSpread$c({}, getDefaults()), i18n.options.react), props);
 
   var useSuspense = i18nOptions.useSuspense,
       keyPrefix = i18nOptions.keyPrefix;
@@ -5357,6 +5357,7 @@ var validations = {
 	atLeastFieldOptionIsRequired: "At least one field option is required",
 	fieldOptionIsRequired: "Field option is required",
 	kindIsRequired: "Kind is required",
+	invalidRegexPattern: "Invalid regex pattern",
 	notAValidNumber: "Entered number is not valid",
 	notAValidInteger: "Entered number is not a valid integer",
 	notAValid: "Entered number is not valid",
@@ -5962,11 +5963,15 @@ var buildFieldValidationSchema = function buildFieldValidationSchema(_ref3) {
     isRequired: isRequired
   });
 };
-var cleanedRegex = function cleanedRegex(expression) {
-  if (expression.startsWith("/") && expression.endsWith("/")) {
-    return expression.slice(1, -1);
+var cleanedRegex = function cleanedRegex(regexCondition) {
+  var patternMatchingExp = /[igmsyu]*$/;
+  var conditionFlags = regexCondition.match(patternMatchingExp)[0];
+  var conditionWithoutFlags = regexCondition.replace(patternMatchingExp, "");
+  var sanitizedFlags = _toConsumableArray(new Set(conditionFlags)).join("");
+  if (conditionWithoutFlags.startsWith("/") && conditionWithoutFlags.endsWith("/")) {
+    conditionWithoutFlags = conditionWithoutFlags.slice(1, -1);
   }
-  return expression;
+  return RegExp(conditionWithoutFlags, sanitizedFlags);
 };
 var buildOptionsToLabelAndValue = function buildOptionsToLabelAndValue() {
   var optionObjects = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
@@ -6017,8 +6022,8 @@ var dateTimeToString = function dateTimeToString(dateTime) {
 };
 
 var _excluded$3 = ["name", "id", "kind", "data", "individualSubmit", "formRef", "formRefs", "disabled", "isRequiredColumnName"];
-function ownKeys$a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$a(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$b(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var useFormikFields = function useFormikFields(_ref) {
   var name = _ref.name,
     fieldId = _ref.id,
@@ -6081,12 +6086,12 @@ var useFormikFields = function useFormikFields(_ref) {
   return {
     dirty: dirty,
     handleSubmit: handleSubmit,
-    fieldProps: _objectSpread$a(_objectSpread$a({}, formikFieldProps), {}, {
+    fieldProps: _objectSpread$b(_objectSpread$b({}, formikFieldProps), {}, {
       required: props[isRequiredColumnName],
       error: individualSubmit ? meta.error : meta.touched && meta.error,
       options: isDropdown ? buildOptionsToLabelAndValue(fieldData) : undefined,
       value: getValueForField(formikFieldProps.value),
-      label: !individualSubmit && pure.capitalize(name),
+      label: pure.capitalize(name),
       disabled: disabled
     })
   };
@@ -6096,7 +6101,7 @@ var Checkbox = function Checkbox(props) {
   var _useFormikFields = useFormikFields(props),
     handleSubmit = _useFormikFields.handleSubmit,
     fieldProps = _useFormikFields.fieldProps;
-  return /*#__PURE__*/React__default["default"].createElement(neetoui.Switch, _extends({}, fieldProps, {
+  return /*#__PURE__*/React__default["default"].createElement(neetoui.Checkbox, _extends({}, fieldProps, {
     checked: fieldProps.value,
     onChange: function onChange(_ref) {
       var checked = _ref.target.checked;
@@ -6245,8 +6250,8 @@ var TextArea = function TextArea(props) {
   }));
 };
 
-function ownKeys$9(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$9(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$9(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$9(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$a(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var standardComponents = {
   text: Text,
   regex: Text,
@@ -6297,7 +6302,7 @@ var transformValues = function transformValues(_ref2) {
     delete allFieldValues[fieldPath];
   });
   var cleanedFieldValues = ramda.pipe(removeItemsWithNullData, removeNoiseFromValues)(neetoFieldValues);
-  return _objectSpread$9(_objectSpread$9({}, allFieldValues), {}, {
+  return _objectSpread$a(_objectSpread$a({}, allFieldValues), {}, {
     fieldValuesAttributes: cleanedFieldValues
   });
 };
@@ -6360,8 +6365,8 @@ var neetoFieldsUtils = {
   transformValues: transformValues
 };
 
-function ownKeys$8(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$8(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$8(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$8(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$9(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$9(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$9(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$9(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FieldInputs = function FieldInputs(_ref) {
   var _ref$customComponents = _ref.customComponents,
     customComponents = _ref$customComponents === void 0 ? {} : _ref$customComponents,
@@ -6379,7 +6384,7 @@ var FieldInputs = function FieldInputs(_ref) {
     if (Field) {
       return /*#__PURE__*/React__default["default"].createElement(Field, _extends({
         key: field.id
-      }, _objectSpread$8(_objectSpread$8({}, field), {}, {
+      }, _objectSpread$9(_objectSpread$9({}, field), {}, {
         formRef: formRef,
         disabled: disabled,
         isRequiredColumnName: isRequiredColumnName
@@ -6485,8 +6490,8 @@ var QUERY_KEYS = {
 };
 var DEFAULT_STALE_TIME = 3600000; // 1 hour
 
-function ownKeys$7(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$7(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$7(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$8(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$8(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$8(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$8(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FIELDS = QUERY_KEYS.FIELDS;
 var useFetchFields = function useFetchFields(_ref, options) {
   var resourceType = _ref.resourceType,
@@ -6502,13 +6507,13 @@ var useFetchFields = function useFetchFields(_ref, options) {
       state: state,
       searchTerm: searchTerm
     });
-  }, _objectSpread$7({
+  }, _objectSpread$8({
     staleTime: DEFAULT_STALE_TIME
   }, options));
 };
 var useCreateField = function useCreateField(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(fieldsApi.create, _objectSpread$7(_objectSpread$7({}, options), {}, {
+  return reactQuery.useMutation(fieldsApi.create, _objectSpread$8(_objectSpread$8({}, options), {}, {
     onSuccess: function onSuccess() {
       var _options$onSuccess;
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -6532,7 +6537,7 @@ var useShowField = function useShowField(_ref2, options) {
 };
 var useUpdateField = function useUpdateField(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(fieldsApi.update, _objectSpread$7(_objectSpread$7({}, options), {}, {
+  return reactQuery.useMutation(fieldsApi.update, _objectSpread$8(_objectSpread$8({}, options), {}, {
     onSuccess: function onSuccess() {
       var _options$onSuccess2;
       for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
@@ -6545,7 +6550,7 @@ var useUpdateField = function useUpdateField(options) {
 };
 var useDestroyField = function useDestroyField(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(fieldsApi.destroy, _objectSpread$7(_objectSpread$7({}, options), {}, {
+  return reactQuery.useMutation(fieldsApi.destroy, _objectSpread$8(_objectSpread$8({}, options), {}, {
     onSuccess: function onSuccess() {
       var _options$onSuccess3;
       for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
@@ -6565,11 +6570,11 @@ var useReorderFields = function useReorderFields() {
   });
 };
 
-function ownKeys$6(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$7(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$7(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$7(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var arrangeOptionsDisplayOrder = function arrangeOptionsDisplayOrder(options) {
   return options.map(function (option, index) {
-    return _objectSpread$6(_objectSpread$6({}, option), {}, {
+    return _objectSpread$7(_objectSpread$7({}, option), {}, {
       displayOrder: index
     });
   });
@@ -6584,7 +6589,7 @@ var buildPayload = function buildPayload(_ref) {
   var name = formValues.name.trim();
   return {
     ownerId: ramda.isEmpty(ownerId) ? undefined : ownerId,
-    field: _objectSpread$6(_objectSpread$6({}, ramda.omit(["createdAt", "id", "ownerId", "ownerType", "updatedAt"], formValues)), {}, {
+    field: _objectSpread$7(_objectSpread$7({}, ramda.omit(["createdAt", "id", "ownerId", "ownerType", "updatedAt"], formValues)), {}, {
       kind: kind,
       name: name,
       resourceType: ramda.isEmpty(resourceType) ? undefined : resourceType,
@@ -6611,7 +6616,7 @@ var getPermittedKinds = function getPermittedKinds(_ref2) {
   return permittedKinds;
 };
 var generateValidationSchema = function generateValidationSchema(additionalValidations) {
-  return yup__namespace.object().shape(_objectSpread$6(_objectSpread$6({}, BASIC_FIELD_FORM_VALIDATIONS), additionalValidations));
+  return yup__namespace.object().shape(_objectSpread$7(_objectSpread$7({}, BASIC_FIELD_FORM_VALIDATIONS), additionalValidations));
 };
 var renderFormFooter = function renderFormFooter(_ref3) {
   var onClose = _ref3.onClose,
@@ -6635,7 +6640,7 @@ var renderFormFooter = function renderFormFooter(_ref3) {
 };
 
 var regexValidationSchema = yup__namespace.object().shape({
-  condition: yup__namespace.string().required(t$1("validations.regexConditionIsRequired")),
+  condition: yup__namespace.string().required(t$1("validations.regexConditionIsRequired")).matches(/^\/.*\/[igmsyu]*$/, t$1("validations.invalidRegexPattern")),
   helpMessage: yup__namespace.string().required(t$1("validations.regexHelpMessageIsRequired"))
 });
 var dropDownOptionsValidationSchema = yup__namespace.array().of(yup__namespace.object().shape({
@@ -6888,8 +6893,8 @@ var FieldForm = function FieldForm(_ref) {
 };
 
 var _excluded$2 = ["resourceType", "allowedKinds", "ownerId", "additionalValidations", "initialValues", "onClose", "onMutationSuccess"];
-function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$6(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 /** @type {React.FC<import("types").AddProps>} */
 
@@ -6926,7 +6931,7 @@ var Add = function Add(_ref) {
     style: "h2"
   }, t("titles.addField"))), /*#__PURE__*/React__default["default"].createElement(formik$1.Form, {
     formikProps: {
-      initialValues: _objectSpread$5(_objectSpread$5({}, initialValues), INITIAL_FIELDS),
+      initialValues: _objectSpread$6(_objectSpread$6({}, initialValues), INITIAL_FIELDS),
       validationSchema: generateValidationSchema(additionalValidations),
       onSubmit: handleSubmit
     }
@@ -6945,8 +6950,8 @@ var Add = function Add(_ref) {
 };
 
 var _excluded$1 = ["fieldId", "allowedKinds", "ownerId", "additionalValidations", "initialValues", "onClose", "onMutationSuccess"];
-function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 /** @type {React.FC<import("types").EditProps>} */
 
@@ -6999,7 +7004,7 @@ var Edit = function Edit(_ref) {
     style: "h2"
   }, t("titles.editField"))), isLoading ? /*#__PURE__*/React__default["default"].createElement(PageLoader__default["default"], null) : /*#__PURE__*/React__default["default"].createElement(formik$1.Form, {
     formikProps: {
-      initialValues: _objectSpread$4(_objectSpread$4({}, initialValues), ramda.assoc("kind", FIELD_KINDS[field.kind], field)),
+      initialValues: _objectSpread$5(_objectSpread$5({}, initialValues), ramda.assoc("kind", FIELD_KINDS[field.kind], field)),
       validationSchema: generateValidationSchema(additionalValidations),
       enableReinitialize: true,
       onSubmit: handleSubmit
@@ -7217,16 +7222,16 @@ var configsApi = {
   fetchConfigs: fetchConfigs
 };
 
-function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var useFetchConfigs = function useFetchConfigs(options) {
-  return reactQuery.useQuery([QUERY_KEYS.CONFIGS], configsApi.fetchConfigs, _objectSpread$3({
+  return reactQuery.useQuery([QUERY_KEYS.CONFIGS], configsApi.fetchConfigs, _objectSpread$4({
     staleTime: DEFAULT_STALE_TIME
   }, options));
 };
 
-function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var useFieldsDashboard = function useFieldsDashboard(_ref) {
   var buildColumnData = _ref.buildColumnData,
     isOwnerBased = _ref.isOwnerBased,
@@ -7296,7 +7301,7 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     inactiveFieldsCount = _useFetchFields$data2.inactiveFieldsCount,
     isFieldsLoading = _useFetchFields.isLoading,
     isFieldsFetching = _useFetchFields.isFetching;
-  var _useFetchFields2 = useFetchFields(_objectSpread$2(_objectSpread$2({}, fieldParams), {}, {
+  var _useFetchFields2 = useFetchFields(_objectSpread$3(_objectSpread$3({}, fieldParams), {}, {
       state: FIELD_STATES.active,
       searchTerm: ""
     }), {
@@ -7349,7 +7354,7 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     defaultColumns: defaultColumns
   });
   var handleBlockClick = function handleBlockClick(params) {
-    return reactUtils.handleMetaClick(history, utils.buildUrl("", _objectSpread$2({
+    return reactUtils.handleMetaClick(history, utils.buildUrl("", _objectSpread$3({
       resource: resource,
       state: state
     }, params)));
@@ -7378,7 +7383,8 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
       return setSearchTerm(e.target.value);
     },
     value: searchTerm,
-    placeholder: t("placeholders.searchFields")
+    placeholder: t("placeholders.searchFields"),
+    className: "w-44"
   };
   var isSingleResource = menuItems.length === 1;
   var isMenuBarNeeded = showStateFilter || !isSingleResource;
@@ -7402,7 +7408,7 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
       inactiveFieldsCount: inactiveFieldsCount,
       handleBlockClick: handleBlockClick
     });
-  }, [activeFieldsCount, inactiveFieldsCount]);
+  }, [activeFieldsCount, inactiveFieldsCount, state]);
   var menuBarItems = React.useMemo(function () {
     return renderMenuBarItems({
       isOwnerBased: isOwnerBased,
@@ -11842,6 +11848,9 @@ var ReorderPane = function ReorderPane(_ref) {
   })));
 };
 
+function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 /** @type {React.FC<import("types").FieldsDashboardProps>} */
 
 var FieldsDashboard = function FieldsDashboard(_ref) {
@@ -11919,14 +11928,16 @@ var FieldsDashboard = function FieldsDashboard(_ref) {
     className: "flex items-center justify-center"
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Spinner, null)) : menuBarItems, showStateFilter && menuBarFilters), isScreenLoading && ramda.isEmpty(fields) ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: "flex w-full flex-grow items-center justify-center"
-  }, /*#__PURE__*/React__default["default"].createElement(PageLoader__default["default"], null)) : /*#__PURE__*/React__default["default"].createElement(Container__default["default"], null, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], _extends({
+  }, /*#__PURE__*/React__default["default"].createElement(PageLoader__default["default"], null)) : /*#__PURE__*/React__default["default"].createElement(Container__default["default"], null, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], _extends({}, _objectSpread$2(_objectSpread$2({
     breadcrumbs: breadcrumbs
   }, isMenuBarNeeded && {
     menuBarToggle: function menuBarToggle() {
       return setIsMenuBarOpen(ramda.not);
     }
-  }, {
-    actionBlock: /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
+  }), {}, {
+    searchProps: searchProps
+  }), {
+    actionBlock: /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
       "data-cy": "neeto-fields-reorder-button",
       label: t("labels.reorder"),
       style: "secondary",
@@ -11937,14 +11948,13 @@ var FieldsDashboard = function FieldsDashboard(_ref) {
       onClick: function onClick() {
         return setIsReorderPaneOpen(true);
       }
-    }), /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
+    })), /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
       "data-cy": "neeto-fields-add-button",
       label: t("labels.addField"),
       onClick: function onClick() {
         return setIsPaneOpen(true);
       }
-    })),
-    searchProps: searchProps,
+    }))),
     title: /*#__PURE__*/React__default["default"].createElement(TitleWithHelpLink, {
       helpUrl: helpDocUrl,
       title: headerDisplayTitle
@@ -11956,23 +11966,22 @@ var FieldsDashboard = function FieldsDashboard(_ref) {
       style: "h4"
     }, "".concat(count, " "), t("titles.field", count > 1 ? PLURAL : SINGULAR).toLocaleLowerCase())
   }), /*#__PURE__*/React__default["default"].createElement(FieldsTable, {
-    columnData: columnData,
-    helpDocUrl: helpDocUrl,
     isLoading: isFieldsFetching || isFieldsLoading,
     rowData: ramda.isEmpty(rowData) ? fields : rowData,
-    setIsPaneOpen: setIsPaneOpen,
     totalCount: count,
+    columnData: columnData,
+    helpDocUrl: helpDocUrl,
+    setIsPaneOpen: setIsPaneOpen,
     title: title
   }), /*#__PURE__*/React__default["default"].createElement(FieldsPane, {
     additionalValidations: paneProps === null || paneProps === void 0 ? void 0 : paneProps.validations,
     allowedKinds: allowedKinds,
+    selectedField: selectedField,
     hideRequiredSwitch: paneProps === null || paneProps === void 0 ? void 0 : paneProps.hideRequiredSwitch,
     initialValues: paneProps === null || paneProps === void 0 ? void 0 : paneProps.initialValues,
     isOpen: isPaneOpen,
     ownerId: isOwnerBased ? selectedMenu : "",
-    resourceType: isOwnerBased ? resourceType : selectedMenu //Currently we support only one resource type when fields are classified based on owners
-    ,
-    selectedField: selectedField,
+    resourceType: isOwnerBased ? resourceType : selectedMenu,
     onClose: handleClosePane,
     onMutationSuccess: paneProps === null || paneProps === void 0 ? void 0 : paneProps.onMutationSuccess
   }, paneProps === null || paneProps === void 0 ? void 0 : paneProps.children)), /*#__PURE__*/React__default["default"].createElement(ReorderPane, {
@@ -12109,9 +12118,7 @@ var FieldValuesContainer = function FieldValuesContainer(_ref) {
     _ref$disabled = _ref.disabled,
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     isRequiredColumnName = _ref.isRequiredColumnName,
-    fieldContainerClassName = _ref.fieldContainerClassName,
     fieldClassName = _ref.fieldClassName,
-    labelClassName = _ref.labelClassName,
     _ref$onMutationSucces = _ref.onMutationSuccess,
     onMutationSuccess = _ref$onMutationSucces === void 0 ? pure.noop : _ref$onMutationSucces;
   var _useTranslation = useTranslation(),
@@ -12159,7 +12166,7 @@ var FieldValuesContainer = function FieldValuesContainer(_ref) {
   };
   var fields = propFields || fetchedFields;
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: classnames__default["default"]("space-y-3", {
+    className: classnames__default["default"]("space-y-3 py-3", {
       "neeto-ui-border-gray-300 rounded-lg border bg-white px-4 py-2": showBorder
     }, className)
   }, isFieldsLoading ? /*#__PURE__*/React__default["default"].createElement("div", {
@@ -12171,12 +12178,9 @@ var FieldValuesContainer = function FieldValuesContainer(_ref) {
     });
     if (Field) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: classnames__default["default"](fieldContainerClassName, "space-y-1"),
+        className: classnames__default["default"](fieldClassName, "space-y-1"),
         key: field.id
-      }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-        className: labelClassName,
-        style: "h5"
-      }, pure.capitalize(field.name)), /*#__PURE__*/React__default["default"].createElement(FieldValueInputWrapper, {
+      }, /*#__PURE__*/React__default["default"].createElement(FieldValueInputWrapper, {
         className: fieldClassName,
         onSubmit: function onSubmit(values) {
           return handleSubmit(field, values);