@bigbinary/neeto-fields-frontend 1.0.5 → 1.0.6

package/dist/index.cjs.js

@@ -18,6 +18,7 @@ var Header = require('@bigbinary/neeto-molecules/Header');
 var MenuBar = require('@bigbinary/neeto-molecules/MenuBar');
 var PageLoader = require('@bigbinary/neeto-molecules/PageLoader');
 var SubHeader = require('@bigbinary/neeto-molecules/SubHeader');
+var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
 var reactRouterDom = require('react-router-dom');
 var TableWrapper = require('@bigbinary/neeto-molecules/TableWrapper');
 var reactDom = require('react-dom');
@@ -3748,8 +3749,8 @@ function transformOptions(options) {
   return options;
 }
 
-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$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; }
 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() {}
@@ -3809,9 +3810,9 @@ var I18n = function (_EventEmitter) {
         }
       }
       var defOpts = get();
-      this.options = _objectSpread$8(_objectSpread$8(_objectSpread$8({}, defOpts), this.options), transformOptions(options));
+      this.options = _objectSpread$b(_objectSpread$b(_objectSpread$b({}, defOpts), this.options), transformOptions(options));
       if (this.options.compatibilityAPI !== 'v1') {
-        this.options.interpolation = _objectSpread$8(_objectSpread$8({}, defOpts.interpolation), this.options.interpolation);
+        this.options.interpolation = _objectSpread$b(_objectSpread$b({}, defOpts.interpolation), this.options.interpolation);
       }
       if (options.keySeparator !== undefined) {
         this.options.userDefinedKeySeparator = options.keySeparator;
@@ -4089,7 +4090,7 @@ var I18n = function (_EventEmitter) {
           }
           options = _this5.options.overloadTranslationOptionHandler([key, opts].concat(rest));
         } else {
-          options = _objectSpread$8({}, opts);
+          options = _objectSpread$b({}, opts);
         }
         options.lng = options.lng || fixedT.lng;
         options.lngs = options.lngs || fixedT.lngs;
@@ -4216,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$8(_objectSpread$8(_objectSpread$8({}, this.options), options), {
+      var mergedOptions = _objectSpread$b(_objectSpread$b(_objectSpread$b({}, this.options), options), {
         isClone: true
       });
       var clone = new I18n(mergedOptions);
@@ -4227,7 +4228,7 @@ var I18n = function (_EventEmitter) {
       membersToCopy.forEach(function (m) {
         clone[m] = _this8[m];
       });
-      clone.services = _objectSpread$8({}, this.services);
+      clone.services = _objectSpread$b({}, this.services);
       clone.services.utils = {
         hasLoadedNamespace: clone.hasLoadedNamespace.bind(clone)
       };
@@ -4666,9 +4667,9 @@ function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 }
 
-function ownKeys$7(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$a(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$7(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$7(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$a(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 var defaultOptions$1 = {
   bindI18n: 'languageChanged',
   bindI18nStore: '',
@@ -4682,7 +4683,7 @@ var i18nInstance;
 var I18nContext = React__default["default"].createContext();
 function setDefaults() {
   var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  defaultOptions$1 = _objectSpread$7(_objectSpread$7({}, defaultOptions$1), options);
+  defaultOptions$1 = _objectSpread$a(_objectSpread$a({}, defaultOptions$1), options);
 }
 function getDefaults() {
   return defaultOptions$1;
@@ -4838,9 +4839,9 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
-function ownKeys$6(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$9(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$6(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$6(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$9(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$9(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$9(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;
@@ -4868,7 +4869,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$6(_objectSpread$6(_objectSpread$6({}, getDefaults()), i18n.options.react), props);
+  var i18nOptions = _objectSpread$9(_objectSpread$9(_objectSpread$9({}, getDefaults()), i18n.options.react), props);
 
   var useSuspense = i18nOptions.useSuspense,
       keyPrefix = i18nOptions.keyPrefix;
@@ -4992,6 +4993,7 @@ var fields = {
 		dateRange: "Date range",
 		timeRange: "Time range",
 		textArea: "Text area",
+		textarea: "Textarea",
 		decimal: "Decimal",
 		integer: "Integer",
 		regex: "Regex",
@@ -5014,9 +5016,9 @@ var validations = {
 	fieldOptionIsRequired: "Field option is required",
 	kindIsRequired: "Kind is required",
 	notAValidNumber: "Entered number is not valid",
-	notAValidInteger: "Entered number is not valid",
+	notAValidInteger: "Entered number is not a valid integer",
 	notAValid: "Entered number is not valid",
-	thisIsRequired: "This is s required field",
+	thisIsRequired: "This is a required field",
 	minOneItem: "Select at least one item"
 };
 var tooltips = {
@@ -5072,6 +5074,7 @@ var KINDS = {
   time: "time",
   dateRange: "date_range",
   timeRange: "time_range",
+  textarea: "textarea",
   textArea: "text_area",
   person: "person",
   checkbox: "checkbox",
@@ -5090,6 +5093,7 @@ var DISPLAY_KINDS = {
   time: t("fields.kinds.time"),
   date_range: t("fields.kinds.dateRange"),
   time_range: t("fields.kinds.timeRange"),
+  textarea: t("fields.kinds.textarea"),
   text_area: t("fields.kinds.textArea"),
   person: t("fields.kinds.person"),
   checkbox: t("fields.kinds.checkbox"),
@@ -5123,6 +5127,18 @@ function _extends() {
   return _extends.apply(this, arguments);
 }
 
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
+
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
+
 var NEETO_FIELDS_URL = "/neeto_fields_engine/api/v1";
 var FIELDS_URL = "".concat(NEETO_FIELDS_URL, "/fields");
 var FIELD_VALUES_URL = "".concat(NEETO_FIELDS_URL, "/field_values");
@@ -5189,49 +5205,71 @@ var QUERY_KEYS = {
   FIELD_VALUES: "field_values",
   CONFIGS: "configurations"
 };
+var DEFAULT_STALE_TIME = 3600000; // 1 hour
 
+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,
     ownerId = _ref.ownerId,
-    state = _ref.state;
-  return reactQuery.useQuery([FIELDS, resourceType, ownerId, state], function () {
+    state = _ref.state,
+    _ref$prefixQueryKeys = _ref.prefixQueryKeys,
+    prefixQueryKeys = _ref$prefixQueryKeys === void 0 ? [] : _ref$prefixQueryKeys;
+  return reactQuery.useQuery([FIELDS].concat(_toConsumableArray(prefixQueryKeys), [resourceType, ownerId, state]), function () {
     return fieldsApi.fetch({
       resourceType: resourceType,
       ownerId: ownerId,
       state: state
     });
-  }, options);
+  }, _objectSpread$8({
+    staleTime: DEFAULT_STALE_TIME
+  }, options));
 };
-var useCreateField = function useCreateField() {
+var useCreateField = function useCreateField(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(fieldsApi.create, {
+  return reactQuery.useMutation(fieldsApi.create, _objectSpread$8(_objectSpread$8({}, options), {}, {
     onSuccess: function onSuccess() {
+      var _options$onSuccess;
       queryClient.invalidateQueries(FIELDS);
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      options === null || options === void 0 ? void 0 : (_options$onSuccess = options.onSuccess) === null || _options$onSuccess === void 0 ? void 0 : _options$onSuccess.call.apply(_options$onSuccess, [options].concat(args));
     }
-  });
+  }));
 };
-var useShowField = function useShowField(fieldId) {
+var useShowField = function useShowField(fieldId, options) {
   var queryKey = [FIELDS, fieldId];
   return reactQuery.useQuery(queryKey, function () {
     return fieldsApi.show(fieldId);
-  });
+  }, options);
 };
-var useUpdateField = function useUpdateField() {
+var useUpdateField = function useUpdateField(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(fieldsApi.update, {
+  return reactQuery.useMutation(fieldsApi.update, _objectSpread$8(_objectSpread$8({}, options), {}, {
     onSuccess: function onSuccess() {
+      var _options$onSuccess2;
       queryClient.invalidateQueries(FIELDS);
+      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+        args[_key2] = arguments[_key2];
+      }
+      options === null || options === void 0 ? void 0 : (_options$onSuccess2 = options.onSuccess) === null || _options$onSuccess2 === void 0 ? void 0 : _options$onSuccess2.call.apply(_options$onSuccess2, [options].concat(args));
     }
-  });
+  }));
 };
-var useDestroyField = function useDestroyField() {
+var useDestroyField = function useDestroyField(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(fieldsApi.destroy, {
+  return reactQuery.useMutation(fieldsApi.destroy, _objectSpread$8(_objectSpread$8({}, options), {}, {
     onSuccess: function onSuccess() {
+      var _options$onSuccess3;
       queryClient.invalidateQueries(FIELDS);
+      for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+        args[_key3] = arguments[_key3];
+      }
+      options === null || options === void 0 ? void 0 : (_options$onSuccess3 = options.onSuccess) === null || _options$onSuccess3 === void 0 ? void 0 : _options$onSuccess3.call.apply(_options$onSuccess3, [options].concat(args));
     }
-  });
+  }));
 };
 var useReorderFields = function useReorderFields() {
   var queryClient = reactQuery.useQueryClient();
@@ -5242,11 +5280,11 @@ var useReorderFields = function useReorderFields() {
   });
 };
 
-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$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$5(_objectSpread$5({}, option), {}, {
+    return _objectSpread$7(_objectSpread$7({}, option), {}, {
       displayOrder: index
     });
   });
@@ -5258,7 +5296,9 @@ var buildPayload = function buildPayload(_ref) {
     _ref$ownerId = _ref.ownerId,
     ownerId = _ref$ownerId === void 0 ? "" : _ref$ownerId;
   var kind = formValues.kind.value;
-  return _objectSpread$5(_objectSpread$5({}, ramda.omit(["createdAt", "id", "ownerId", "ownerType", "updatedAt"], formValues)), {}, {
+  var name = formValues.name.trim();
+  return _objectSpread$7(_objectSpread$7({}, ramda.omit(["createdAt", "id", "ownerId", "ownerType", "updatedAt"], formValues)), {}, {
+    name: name,
     kind: kind,
     resourceType: ramda.isEmpty(resourceType) ? undefined : resourceType,
     ownerId: ramda.isEmpty(ownerId) ? undefined : ownerId,
@@ -5284,7 +5324,7 @@ var getPermittedKinds = function getPermittedKinds(_ref2) {
   return permittedKinds;
 };
 var generateValidationSchema = function generateValidationSchema(additionalValidations) {
-  return yup__namespace.object().shape(_objectSpread$5(_objectSpread$5({}, BASIC_FIELD_FORM_VALIDATIONS), additionalValidations));
+  return yup__namespace.object().shape(_objectSpread$7(_objectSpread$7({}, BASIC_FIELD_FORM_VALIDATIONS), additionalValidations));
 };
 
 var regexValidationSchema = yup__namespace.object().shape({
@@ -5346,6 +5386,11 @@ var FIELD_KINDS = {
     label: t("fields.kinds.textArea"),
     group: 1
   },
+  textarea: {
+    value: "textarea",
+    label: t("fields.kinds.textarea"),
+    group: 1
+  },
   person: {
     value: "person",
     label: t("fields.kinds.person"),
@@ -5489,6 +5534,8 @@ var FieldForm = function FieldForm(_ref) {
     kindSelectOptions = _ref$kindSelectOption === void 0 ? [] : _ref$kindSelectOption,
     _ref$isSystem = _ref.isSystem,
     isSystem = _ref$isSystem === void 0 ? false : _ref$isSystem,
+    _ref$hideRequiredSwit = _ref.hideRequiredSwitch,
+    hideRequiredSwitch = _ref$hideRequiredSwit === void 0 ? false : _ref$hideRequiredSwit,
     children = _ref.children;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
@@ -5518,7 +5565,7 @@ var FieldForm = function FieldForm(_ref) {
     name: "kind",
     options: kindSelectOptions,
     onChange: handleKindChange
-  }), isAdditionalDataNeeded(chosenKind) && /*#__PURE__*/React__default["default"].createElement(AdditionalInputs, null), /*#__PURE__*/React__default["default"].createElement(neetoui.Label, {
+  }), isAdditionalDataNeeded(chosenKind) && /*#__PURE__*/React__default["default"].createElement(AdditionalInputs, null), !hideRequiredSwitch && /*#__PURE__*/React__default["default"].createElement(neetoui.Label, {
     className: "flex items-center gap-2"
   }, /*#__PURE__*/React__default["default"].createElement(formik$1.Switch, {
     name: "isRequired"
@@ -5529,9 +5576,9 @@ var FieldForm = function FieldForm(_ref) {
   }, t("labels.isRequired"))), children));
 };
 
-var _excluded$2 = ["resourceType", "allowedKinds", "additionalValidations", "initialValues", "onClose"];
-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 _excluded$3 = ["resourceType", "allowedKinds", "additionalValidations", "initialValues", "onClose"];
+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>} */
 
@@ -5541,7 +5588,7 @@ var Add = function Add(_ref) {
     additionalValidations = _ref.additionalValidations,
     initialValues = _ref.initialValues,
     onClose = _ref.onClose,
-    props = _objectWithoutProperties(_ref, _excluded$2);
+    props = _objectWithoutProperties(_ref, _excluded$3);
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useCreateField = useCreateField(),
@@ -5561,7 +5608,7 @@ var Add = function Add(_ref) {
     style: "h2"
   }, t("titles.addField"))), /*#__PURE__*/React__default["default"].createElement(formik$1.Form, {
     formikProps: {
-      initialValues: _objectSpread$4(_objectSpread$4({}, initialValues), INITIAL_FIELDS),
+      initialValues: _objectSpread$6(_objectSpread$6({}, initialValues), INITIAL_FIELDS),
       validationSchema: generateValidationSchema(additionalValidations),
       onSubmit: handleSubmit
     }
@@ -5588,9 +5635,9 @@ var Add = function Add(_ref) {
   }));
 };
 
-var _excluded$1 = ["fieldId", "allowedKinds", "additionalValidations", "initialValues", "onClose"];
-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 _excluded$2 = ["fieldId", "allowedKinds", "additionalValidations", "initialValues", "onClose"];
+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>} */
 
@@ -5602,7 +5649,7 @@ var Edit = function Edit(_ref) {
     _ref$initialValues = _ref.initialValues,
     initialValues = _ref$initialValues === void 0 ? {} : _ref$initialValues,
     onClose = _ref.onClose,
-    props = _objectWithoutProperties(_ref, _excluded$1);
+    props = _objectWithoutProperties(_ref, _excluded$2);
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useShowField = useShowField(fieldId),
@@ -5628,7 +5675,7 @@ var Edit = function Edit(_ref) {
     style: "h2"
   }, t("titles.editField"))), /*#__PURE__*/React__default["default"].createElement(formik$1.Form, {
     formikProps: {
-      initialValues: _objectSpread$3(_objectSpread$3({}, 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
@@ -5659,7 +5706,7 @@ var Edit = function Edit(_ref) {
   }));
 };
 
-var _excluded = ["isOpen", "selectedField"];
+var _excluded$1 = ["isOpen", "selectedField"];
 
 /** @type {React.FC<import("types").FieldsPaneProps>} */
 
@@ -5667,7 +5714,7 @@ var FieldsPane = function FieldsPane(_ref) {
   var isOpen = _ref.isOpen,
     _ref$selectedField = _ref.selectedField,
     selectedField = _ref$selectedField === void 0 ? {} : _ref$selectedField,
-    props = _objectWithoutProperties(_ref, _excluded);
+    props = _objectWithoutProperties(_ref, _excluded$1);
   return /*#__PURE__*/React__default["default"].createElement(neetoui.Pane, {
     isOpen: isOpen,
     onClose: props.onClose
@@ -5684,6 +5731,7 @@ var AddField = function AddField(_ref) {
     allowedKinds = _ref$allowedKinds === void 0 ? ALL_KINDS : _ref$allowedKinds,
     additionalValidations = _ref.additionalValidations,
     initialValues = _ref.initialValues,
+    hideRequiredSwitch = _ref.hideRequiredSwitch,
     children = _ref.children;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -5699,6 +5747,7 @@ var AddField = function AddField(_ref) {
   }), /*#__PURE__*/React__default["default"].createElement(FieldsPane, {
     additionalValidations: additionalValidations,
     allowedKinds: allowedKinds,
+    hideRequiredSwitch: hideRequiredSwitch,
     initialValues: initialValues,
     isOpen: isOpen,
     resourceType: resourceType,
@@ -5708,18 +5757,6 @@ var AddField = function AddField(_ref) {
   }, children));
 };
 
-function _arrayWithoutHoles(arr) {
-  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
-}
-
-function _nonIterableSpread() {
-  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-
-function _toConsumableArray(arr) {
-  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
-}
-
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
   try {
     var info = gen[key](arg);
@@ -6132,7 +6169,7 @@ var buildFieldValidationSchema = function buildFieldValidationSchema(_ref) {
       }
     case KINDS.integer:
       {
-        var _schema2 = yup__namespace.number().integer().nullable().typeError(t("validations.notAValidInteger"));
+        var _schema2 = yup__namespace.number().nullable().integer().typeError(t("validations.notAValidInteger"));
         return isRequired ? _schema2.required(t("validations.thisIsRequired")) : _schema2;
       }
     case KINDS.date:
@@ -6217,37 +6254,50 @@ var dateTimeToString = function dateTimeToString(dateTime) {
   return dayjs(dateTime).toString();
 };
 
-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; }
+var _excluded = ["name", "id", "kind", "data", "individualSubmit", "formRef", "formRefs", "disabled", "isRequiredColumnName"];
+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 useFormikFields = function useFormikFields(_ref) {
   var name = _ref.name,
     fieldId = _ref.id,
-    isRequired = _ref.isRequired,
     kind = _ref.kind,
     fieldData = _ref.data,
-    individualSubmit = _ref.individualSubmit;
-  var _useFormikContext = formik.useFormikContext(),
-    setFieldValue = _useFormikContext.setFieldValue,
-    submitForm = _useFormikContext.submitForm,
-    dirty = _useFormikContext.dirty;
+    individualSubmit = _ref.individualSubmit,
+    formRef = _ref.formRef,
+    formRefs = _ref.formRefs,
+    disabled = _ref.disabled,
+    _ref$isRequiredColumn = _ref.isRequiredColumnName,
+    isRequiredColumnName = _ref$isRequiredColumn === void 0 ? "isRequired" : _ref$isRequiredColumn,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var formikContext = formik.useFormikContext();
+  var setFieldValue = formikContext.setFieldValue,
+    submitForm = formikContext.submitForm,
+    dirty = formikContext.dirty,
+    isSubmitting = formikContext.isSubmitting;
   var fieldPath = "".concat(name, "-").concat(fieldId);
   var fieldName = kind === KINDS.multiOption ? "values" : "value";
   var fieldValuePath = "".concat(fieldPath, ".data.").concat(fieldName);
+  if (ramda.isNil(formRef) && ramda.isNotNil(formRefs)) {
+    formRefs.current[fieldValuePath] = formikContext;
+  } else if (ramda.isNil(formRefs) && ramda.isNotNil(formRef)) {
+    formRef.current = formikContext;
+  }
   var _useField = formik.useField({
       name: fieldValuePath,
       validate: function validate(fieldValue) {
         return validateField({
           fieldValue: fieldValue,
           fieldName: name,
-          isRequired: isRequired,
+          isRequired: props[isRequiredColumnName],
           kind: kind,
           fieldData: fieldData
         });
       }
     }),
-    _useField2 = _slicedToArray(_useField, 2),
+    _useField2 = _slicedToArray(_useField, 3),
     formikFieldProps = _useField2[0],
-    meta = _useField2[1];
+    meta = _useField2[1],
+    helpers = _useField2[2];
   var handleSubmit = function handleSubmit(value) {
     ramda.isNotNil(value) && setFieldValue(fieldValuePath, value);
     individualSubmit && submitForm();
@@ -6261,15 +6311,19 @@ var useFormikFields = function useFormikFields(_ref) {
     return value;
   };
   var isDropdown = ["single_option", "multi_option"].includes(kind);
+  if (isSubmitting && !meta.touched) {
+    helpers.setTouched(true);
+  }
   return {
     handleSubmit: handleSubmit,
-    fieldProps: _objectSpread$2(_objectSpread$2({}, formikFieldProps), {}, {
-      required: isRequired,
-      error: meta.error,
+    fieldProps: _objectSpread$4(_objectSpread$4({}, formikFieldProps), {}, {
+      required: props[isRequiredColumnName],
+      error: meta.touched && meta.error,
       options: isDropdown && buildOptionsToLabelAndValue(fieldData),
       value: getValueForField(formikFieldProps.value),
       dirty: dirty,
-      label: !individualSubmit && name
+      label: !individualSubmit && pure.capitalize(name),
+      disabled: disabled
     })
   };
 };
@@ -6420,12 +6474,14 @@ var TextArea = function TextArea(props) {
   }));
 };
 
-function ownKeys$1(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$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(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 standardComponents = {
   text: Text,
   regex: Text,
+  textarea: TextArea,
   text_area: TextArea,
+  // TODO: Remove text-area after integration in all hosts.
   number: Number$1,
   monetary: Number$1,
   integer: Number$1,
@@ -6444,11 +6500,22 @@ var renderFieldInput = function renderFieldInput(_ref) {
     _ref$customComponents = _ref.customComponents,
     customComponents = _ref$customComponents === void 0 ? {} : _ref$customComponents,
     _ref$individualSubmit = _ref.individualSubmit,
-    individualSubmit = _ref$individualSubmit === void 0 ? false : _ref$individualSubmit;
+    individualSubmit = _ref$individualSubmit === void 0 ? false : _ref$individualSubmit,
+    _ref$formRefs = _ref.formRefs,
+    formRefs = _ref$formRefs === void 0 ? null : _ref$formRefs,
+    _ref$formRef = _ref.formRef,
+    formRef = _ref$formRef === void 0 ? null : _ref$formRef,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    isRequiredColumnName = _ref.isRequiredColumnName;
   var Component = customComponents[field.kind] || standardComponents[field.kind];
   if (Component) {
-    return /*#__PURE__*/React__default["default"].createElement(Component, _extends({
-      individualSubmit: individualSubmit
+    return /*#__PURE__*/React__default["default"].createElement(Component, _objectSpread$3({
+      disabled: disabled,
+      formRef: formRef,
+      formRefs: formRefs,
+      individualSubmit: individualSubmit,
+      isRequiredColumnName: isRequiredColumnName
     }, field));
   }
   return /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
@@ -6475,7 +6542,7 @@ var transformValues = function transformValues(_ref2) {
     delete allFieldValues["".concat(name, "-").concat(id)];
   });
   var cleanedFieldValues = ramda.pipe(removeItemsWithNullData, removeNoiseFromValues)(neetoFieldValues);
-  return _objectSpread$1(_objectSpread$1({}, allFieldValues), {}, {
+  return _objectSpread$3(_objectSpread$3({}, allFieldValues), {}, {
     fieldValuesAttributes: cleanedFieldValues
   });
 };
@@ -6515,11 +6582,17 @@ var neetoFieldsUtils = {
 var FieldInputs = function FieldInputs(_ref) {
   var _ref$customComponents = _ref.customComponents,
     customComponents = _ref$customComponents === void 0 ? {} : _ref$customComponents,
-    fields = _ref.fields;
+    fields = _ref.fields,
+    formRef = _ref.formRef,
+    disabled = _ref.disabled,
+    isRequiredColumnName = _ref.isRequiredColumnName;
   return getNonSystemFields(fields).map(function (field) {
     return renderFieldInput({
       field: field,
-      customComponents: customComponents
+      customComponents: customComponents,
+      formRef: formRef,
+      isRequiredColumnName: isRequiredColumnName,
+      disabled: disabled
     });
   });
 };
@@ -6575,7 +6648,7 @@ var renderMenuBarItems = function renderMenuBarItems(_ref2) {
   var items = _ref2.items,
     isOwnerBased = _ref2.isOwnerBased,
     selectedMenu = _ref2.selectedMenu,
-    setSelectedMenu = _ref2.setSelectedMenu;
+    handleBlockClick = _ref2.handleBlockClick;
   if (isOwnerBased) {
     return items.map(function (item) {
       return /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].Item, {
@@ -6585,13 +6658,13 @@ var renderMenuBarItems = function renderMenuBarItems(_ref2) {
         }),
         key: item.id,
         label: pure.capitalize(item.name),
-        onClick: function onClick() {
-          return setSelectedMenu(item.id);
-        }
+        onClick: handleBlockClick({
+          resource: item.id
+        })
       });
     });
   }
-  return items.map(function (item) {
+  return items.length > 1 && items.map(function (item) {
     return /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].Item, {
       active: selectedMenu === item,
       description: t("messages.manageFieldFor", {
@@ -6599,18 +6672,18 @@ var renderMenuBarItems = function renderMenuBarItems(_ref2) {
       }),
       key: item,
       label: pure.capitalize(item),
-      onClick: function onClick() {
-        return setSelectedMenu(item);
-      }
+      onClick: handleBlockClick({
+        resource: item
+      })
     });
   });
 };
 var renderMenuBarFilters = function renderMenuBarFilters(_ref3) {
   var selectedState = _ref3.selectedState,
-    setSelectedState = _ref3.setSelectedState,
     fieldStatesTaxonomy = _ref3.fieldStatesTaxonomy,
     activeFieldsCount = _ref3.activeFieldsCount,
-    inactiveFieldsCount = _ref3.inactiveFieldsCount;
+    inactiveFieldsCount = _ref3.inactiveFieldsCount,
+    handleBlockClick = _ref3.handleBlockClick;
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].SubTitle, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
     style: "h5",
     textTransform: "uppercase",
@@ -6619,16 +6692,16 @@ var renderMenuBarFilters = function renderMenuBarFilters(_ref3) {
     active: selectedState === FIELD_STATES.active,
     count: activeFieldsCount,
     label: fieldStatesTaxonomy.active,
-    onClick: function onClick() {
-      return setSelectedState(FIELD_STATES.active);
-    }
+    onClick: handleBlockClick({
+      state: FIELD_STATES.active
+    })
   }), /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].Block, {
     active: selectedState === FIELD_STATES.inactive,
     count: inactiveFieldsCount,
     label: fieldStatesTaxonomy.inactive,
-    onClick: function onClick() {
-      return setSelectedState(FIELD_STATES.inactive);
-    }
+    onClick: handleBlockClick({
+      state: FIELD_STATES.inactive
+    })
   }));
 };
 var getDashBoardTitle = function getDashBoardTitle(_ref4) {
@@ -6650,10 +6723,16 @@ var configsApi = {
   fetchConfigs: fetchConfigs
 };
 
-var useFetchConfigs = function useFetchConfigs() {
-  return reactQuery.useQuery([QUERY_KEYS.CONFIGS], configsApi.fetchConfigs);
+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; }
+var useFetchConfigs = function useFetchConfigs(options) {
+  return reactQuery.useQuery([QUERY_KEYS.CONFIGS], configsApi.fetchConfigs, _objectSpread$2({
+    staleTime: DEFAULT_STALE_TIME
+  }, options));
 };
 
+function ownKeys$1(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$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var useFieldsDashboard = function useFieldsDashboard(_ref) {
   var buildColumnData = _ref.buildColumnData,
     showOwnersInMenu = _ref.showOwnersInMenu;
@@ -6673,21 +6752,13 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     _useState8 = _slicedToArray(_useState7, 2),
     isReorderPaneOpen = _useState8[0],
     setIsReorderPaneOpen = _useState8[1];
+  var _useState9 = React.useState({}),
+    _useState10 = _slicedToArray(_useState9, 2),
+    selectedField = _useState10[0],
+    setSelectedField = _useState10[1];
   var _getQueryParams = utils.getQueryParams(),
     resource = _getQueryParams.resource,
     state = _getQueryParams.state;
-  var _useState9 = React.useState(resource || ""),
-    _useState10 = _slicedToArray(_useState9, 2),
-    selectedMenu = _useState10[0],
-    setSelectedMenu = _useState10[1];
-  var _useState11 = React.useState({}),
-    _useState12 = _slicedToArray(_useState11, 2),
-    selectedField = _useState12[0],
-    setSelectedField = _useState12[1];
-  var _useState13 = React.useState(state || FIELD_STATES.active),
-    _useState14 = _slicedToArray(_useState13, 2),
-    selectedState = _useState14[0],
-    setSelectedState = _useState14[1];
   var history = reactRouterDom.useHistory();
   var _useFetchConfigs = useFetchConfigs(),
     _useFetchConfigs$data = _useFetchConfigs.data,
@@ -6697,12 +6768,13 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     _useFetchConfigs$data4 = _useFetchConfigs$data2.resourceTypes,
     resourceTypes = _useFetchConfigs$data4 === void 0 ? [] : _useFetchConfigs$data4,
     isConfigsLoading = _useFetchConfigs.isLoading;
-  var _useFetchFields = useFetchFields({
-      resourceType: !showOwnersInMenu ? selectedMenu : undefined,
-      ownerId: showOwnersInMenu ? selectedMenu : undefined,
-      state: selectedState
-    }, {
-      enabled: !!selectedMenu
+  var fieldParams = {
+    resourceType: !showOwnersInMenu ? resource : undefined,
+    ownerId: showOwnersInMenu ? resource : undefined,
+    state: state || FIELD_STATES.active
+  };
+  var _useFetchFields = useFetchFields(fieldParams, {
+      enabled: !!resource
     }),
     _useFetchFields$data = _useFetchFields.data,
     _useFetchFields$data2 = _useFetchFields$data === void 0 ? {} : _useFetchFields$data,
@@ -6752,23 +6824,34 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     onDeleteClick: handleDeleteButtonClick,
     defaultColumns: defaultColumns
   });
+  var handleBlockClick = function handleBlockClick(params) {
+    return reactUtils.handleMetaClick(history, utils.buildUrl("", _objectSpread$1({
+      resource: resource,
+      state: state
+    }, params)));
+  };
+  var handleURLWithDefaultValues = function handleURLWithDefaultValues() {
+    var queryParams = {
+      resource: resource,
+      state: state
+    };
+    if (!isConfigsLoading && ramda.isNil(resource)) {
+      var _owners$;
+      queryParams.resource = showOwnersInMenu ? (_owners$ = owners[0]) === null || _owners$ === void 0 ? void 0 : _owners$.id : resourceTypes[0];
+    }
+    if (!isConfigsLoading && ramda.isNil(state)) {
+      queryParams.state = FIELD_STATES.active;
+    }
+    if (!isConfigsLoading && ramda.any(ramda.isNil)([resource, state])) {
+      history.replace(utils.buildUrl("", queryParams));
+    }
+  };
   var menuItems = showOwnersInMenu ? owners : resourceTypes;
   var isScreenLoading = isFieldsLoading || isConfigsLoading;
   var showCountSubheader = count > 0;
   React.useEffect(function () {
-    if (resource) {
-      setSelectedMenu(resource);
-    } else {
-      var _owners$;
-      showOwnersInMenu ? setSelectedMenu((_owners$ = owners[0]) === null || _owners$ === void 0 ? void 0 : _owners$.id) : setSelectedMenu(resourceTypes[0]);
-    }
-  }, [isConfigsLoading, resource]);
-  React.useEffect(function () {
-    history.push(utils.buildUrl("", {
-      resource: selectedMenu,
-      state: selectedState
-    }));
-  }, [selectedMenu, selectedState]);
+    handleURLWithDefaultValues();
+  }, [isConfigsLoading]);
   return {
     isPaneOpen: isPaneOpen,
     setIsPaneOpen: setIsPaneOpen,
@@ -6785,10 +6868,8 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     menuItems: menuItems,
     columnData: columnData,
     selectedField: selectedField,
-    selectedState: selectedState,
-    setSelectedState: setSelectedState,
-    selectedMenu: selectedMenu,
-    setSelectedMenu: setSelectedMenu,
+    selectedState: state,
+    selectedMenu: resource,
     isFieldsFetching: isFieldsFetching,
     isFieldsLoading: isFieldsLoading,
     isDeleting: isDeleting,
@@ -6798,7 +6879,8 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     handleDelete: handleDelete,
     handleAlertClose: handleAlertClose,
     handleClosePane: handleClosePane,
-    handleReorderPaneClose: handleReorderPaneClose
+    handleReorderPaneClose: handleReorderPaneClose,
+    handleBlockClick: handleBlockClick
   };
 };
 
@@ -11224,9 +11306,7 @@ var FieldsDashboard = function FieldsDashboard(_ref) {
     columnData = _useFieldsDashboard.columnData,
     selectedField = _useFieldsDashboard.selectedField,
     selectedState = _useFieldsDashboard.selectedState,
-    setSelectedState = _useFieldsDashboard.setSelectedState,
     selectedMenu = _useFieldsDashboard.selectedMenu,
-    setSelectedMenu = _useFieldsDashboard.setSelectedMenu,
     isFieldsFetching = _useFieldsDashboard.isFieldsFetching,
     isFieldsLoading = _useFieldsDashboard.isFieldsLoading,
     isDeleting = _useFieldsDashboard.isDeleting,
@@ -11236,10 +11316,9 @@ var FieldsDashboard = function FieldsDashboard(_ref) {
     handleDelete = _useFieldsDashboard.handleDelete,
     handleAlertClose = _useFieldsDashboard.handleAlertClose,
     handleClosePane = _useFieldsDashboard.handleClosePane,
-    handleReorderPaneClose = _useFieldsDashboard.handleReorderPaneClose;
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "flex flex-grow"
-  }, /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"], {
+    handleReorderPaneClose = _useFieldsDashboard.handleReorderPaneClose,
+    handleBlockClick = _useFieldsDashboard.handleBlockClick;
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"], {
     showMenu: isMenuBarOpen,
     title: t("titles.field", SINGULAR)
   }, isConfigsLoading ? /*#__PURE__*/React__default["default"].createElement("div", {
@@ -11248,13 +11327,13 @@ var FieldsDashboard = function FieldsDashboard(_ref) {
     isOwnerBased: showOwnersInMenu,
     items: menuItems,
     selectedMenu: selectedMenu,
-    setSelectedMenu: setSelectedMenu
+    handleBlockClick: handleBlockClick
   }), showStateFilter && renderMenuBarFilters({
     selectedState: selectedState,
-    setSelectedState: setSelectedState,
     fieldStatesTaxonomy: fieldStatesTaxonomy,
     activeFieldsCount: activeFieldsCount,
-    inactiveFieldsCount: inactiveFieldsCount
+    inactiveFieldsCount: inactiveFieldsCount,
+    handleBlockClick: handleBlockClick
   })), isScreenLoading ? /*#__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"], {
@@ -11280,6 +11359,7 @@ var FieldsDashboard = function FieldsDashboard(_ref) {
     }), /*#__PURE__*/React__default["default"].createElement(FieldsPane, {
       additionalValidations: paneProps === null || paneProps === void 0 ? void 0 : paneProps.validations,
       allowedKinds: allowedKinds,
+      hideRequiredSwitch: paneProps === null || paneProps === void 0 ? void 0 : paneProps.hideRequiredSwitch,
       initialValues: paneProps === null || paneProps === void 0 ? void 0 : paneProps.initialValues,
       isOpen: isPaneOpen,
       resourceType: showOwnersInMenu ? resourceType : selectedMenu,
@@ -11372,7 +11452,10 @@ var FieldValueInput = function FieldValueInput(_ref) {
     resource = _ref.resource,
     resourceId = _ref.resourceId,
     queryKeysToBeInvalidatedOnSuccess = _ref.queryKeysToBeInvalidatedOnSuccess,
-    customComponents = _ref.customComponents;
+    customComponents = _ref.customComponents,
+    formRefs = _ref.formRefs,
+    disabled = _ref.disabled,
+    isRequiredColumnName = _ref.isRequiredColumnName;
   var queryClient = reactQuery.useQueryClient();
   var queryOptions = {
     onSuccess: function onSuccess() {
@@ -11408,7 +11491,10 @@ var FieldValueInput = function FieldValueInput(_ref) {
   }, renderFieldInput({
     field: field,
     customComponents: customComponents,
-    individualSubmit: true
+    individualSubmit: true,
+    formRefs: formRefs,
+    disabled: disabled,
+    isRequiredColumnName: isRequiredColumnName
   })));
 };
 
@@ -11426,10 +11512,15 @@ var FieldValuesContainer = function FieldValuesContainer(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     _ref$showBorder = _ref.showBorder,
-    showBorder = _ref$showBorder === void 0 ? true : _ref$showBorder;
+    showBorder = _ref$showBorder === void 0 ? true : _ref$showBorder,
+    formRefs = _ref.formRefs,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    isRequiredColumnName = _ref.isRequiredColumnName;
   var _useFetchFields = useFetchFields({
       resourceType: ramda.isEmpty(resourceType) ? undefined : resourceType,
-      ownerId: ramda.isEmpty(ownerId) ? undefined : ownerId
+      ownerId: ramda.isEmpty(ownerId) ? undefined : ownerId,
+      state: "active"
     }),
     _useFetchFields$data = _useFetchFields.data,
     _useFetchFields$data2 = _useFetchFields$data === void 0 ? {} : _useFetchFields$data,
@@ -11438,7 +11529,7 @@ var FieldValuesContainer = function FieldValuesContainer(_ref) {
     isFieldsLoading = _useFetchFields.isLoading;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classnames__default["default"]("space-y-3", {
-      "neeto-ui-border-gray-300 m-3 rounded-lg border bg-white px-4 py-2": showBorder
+      "neeto-ui-border-gray-300 rounded-lg border bg-white px-4 py-2": showBorder
     }, className)
   }, isFieldsLoading ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: "flex items-center justify-center"
@@ -11447,14 +11538,17 @@ var FieldValuesContainer = function FieldValuesContainer(_ref) {
       key: field.id
     }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
       style: "h5"
-    }, field.name.toUpperCase()), /*#__PURE__*/React__default["default"].createElement(FieldValueInput, {
+    }, pure.capitalize(field.name)), /*#__PURE__*/React__default["default"].createElement(FieldValueInput, {
       customComponents: customComponents,
       field: field,
       fieldValues: fieldValues,
       ownerId: ownerId,
       resource: resourceType,
       resourceId: resourceId,
-      queryKeysToBeInvalidatedOnSuccess: queryKeysToBeInvalidatedOnSuccess
+      queryKeysToBeInvalidatedOnSuccess: queryKeysToBeInvalidatedOnSuccess,
+      formRefs: formRefs,
+      disabled: disabled,
+      isRequiredColumnName: isRequiredColumnName
     }));
   }));
 };
@@ -11464,5 +11558,9 @@ exports.FieldInputs = FieldInputs;
 exports.FieldValuesContainer = FieldValuesContainer;
 exports.FieldsDashboard = FieldsDashboard;
 exports.neetoFieldsUtils = neetoFieldsUtils;
+exports.useCreateField = useCreateField;
+exports.useDestroyField = useDestroyField;
 exports.useFetchFields = useFetchFields;
+exports.useShowField = useShowField;
+exports.useUpdateField = useUpdateField;
 //# sourceMappingURL=index.cjs.js.map