@bigbinary/neeto-fields-frontend 1.4.0-beta1 → 2.0.0

package/dist/index.cjs.js

@@ -16,7 +16,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var DatePicker = require('@bigbinary/neetoui/DatePicker');
 var TimePicker = require('@bigbinary/neetoui/TimePicker');
 var general = require('@bigbinary/neeto-commons-frontend/utils/general');
-var neetoIcons = require('@bigbinary/neeto-icons');
+var Check = require('@bigbinary/neeto-icons/Check');
 var Label = require('@bigbinary/neetoui/Label');
 var Spinner = require('@bigbinary/neetoui/Spinner');
 var Select = require('@bigbinary/neetoui/formik/Select');
@@ -36,6 +36,7 @@ var ActionBlock$1 = require('@bigbinary/neetoui/formik/ActionBlock');
 var uuid = require('uuid');
 var Input$1 = require('@bigbinary/neetoui/formik/Input');
 var Switch = require('@bigbinary/neetoui/formik/Switch');
+var Delete = require('@bigbinary/neeto-icons/Delete');
 var Button = require('@bigbinary/neetoui/Button');
 var neetoFiltersFrontend = require('@bigbinary/neeto-filters-frontend');
 var reactRouterDom = require('react-router-dom');
@@ -49,8 +50,8 @@ var Table = require('@bigbinary/neetoui/Table');
 var NeetoUIHeader = require('@bigbinary/neeto-molecules/Header');
 var HelpPopover = require('@bigbinary/neeto-molecules/HelpPopover');
 var reactDom = require('react-dom');
-var NeetoUISubHeader = require('@bigbinary/neeto-molecules/SubHeader');
 var classnames = require('classnames');
+var NeetoUISubHeader = require('@bigbinary/neeto-molecules/SubHeader');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -79,6 +80,7 @@ var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
 var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
 var DatePicker__default = /*#__PURE__*/_interopDefaultLegacy(DatePicker);
 var TimePicker__default = /*#__PURE__*/_interopDefaultLegacy(TimePicker);
+var Check__default = /*#__PURE__*/_interopDefaultLegacy(Check);
 var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
 var Spinner__default = /*#__PURE__*/_interopDefaultLegacy(Spinner);
 var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
@@ -93,6 +95,7 @@ var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
 var ActionBlock__default = /*#__PURE__*/_interopDefaultLegacy(ActionBlock$1);
 var Input__default$1 = /*#__PURE__*/_interopDefaultLegacy(Input$1);
 var Switch__default = /*#__PURE__*/_interopDefaultLegacy(Switch);
+var Delete__default = /*#__PURE__*/_interopDefaultLegacy(Delete);
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
 var MenuBar__default = /*#__PURE__*/_interopDefaultLegacy(MenuBar);
 var MoreDropdown__default = /*#__PURE__*/_interopDefaultLegacy(MoreDropdown);
@@ -103,8 +106,8 @@ var NoData__default = /*#__PURE__*/_interopDefaultLegacy(NoData);
 var Table__default = /*#__PURE__*/_interopDefaultLegacy(Table);
 var NeetoUIHeader__default = /*#__PURE__*/_interopDefaultLegacy(NeetoUIHeader);
 var HelpPopover__default = /*#__PURE__*/_interopDefaultLegacy(HelpPopover);
-var NeetoUISubHeader__default = /*#__PURE__*/_interopDefaultLegacy(NeetoUISubHeader);
 var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
+var NeetoUISubHeader__default = /*#__PURE__*/_interopDefaultLegacy(NeetoUISubHeader);
 
 function _typeof$1(o) {
   "@babel/helpers - typeof";
@@ -859,9 +862,9 @@ var getComponentDisplayName = function getComponentDisplayName(Component) {
   return Component.displayName || Component.name || "Component";
 };
 
-var _excluded$7 = ["name", "id", "kind", "data", "individualSubmit", "formRef", "formRefs", "disabled", "isRequiredColumnName", "isInline", "onBlur", "hasMetadataWrapper"];
-function ownKeys$t(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$t(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$t(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$t(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$8 = ["name", "id", "kind", "data", "individualSubmit", "formRef", "formRefs", "disabled", "isRequiredColumnName", "isInline", "onBlur", "hasMetadataWrapper"];
+function ownKeys$u(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$u(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$u(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$u(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useFormikFields = function useFormikFields(_ref) {
   var name = _ref.name,
     fieldId = _ref.id,
@@ -879,7 +882,7 @@ var useFormikFields = function useFormikFields(_ref) {
     handleBlur = _ref$onBlur === void 0 ? neetoCist.noop : _ref$onBlur,
     _ref$hasMetadataWrapp = _ref.hasMetadataWrapper,
     hasMetadataWrapper = _ref$hasMetadataWrapp === void 0 ? false : _ref$hasMetadataWrapp,
-    props = _objectWithoutProperties(_ref, _excluded$7);
+    props = _objectWithoutProperties(_ref, _excluded$8);
   var formikContext = formik.useFormikContext();
   var submitForm = formikContext.submitForm,
     dirty = formikContext.dirty,
@@ -971,7 +974,7 @@ var useFormikFields = function useFormikFields(_ref) {
   return {
     dirty: dirty,
     handleSubmit: handleSubmit,
-    fieldProps: _objectSpread$t(_objectSpread$t({}, formikFieldProps), {}, {
+    fieldProps: _objectSpread$u(_objectSpread$u({}, formikFieldProps), {}, {
       id: fieldId,
       error: individualSubmit ? meta.error : meta.touched && meta.error,
       value: getValueForField(formikFieldProps.value),
@@ -990,14 +993,14 @@ var useFormikFields = function useFormikFields(_ref) {
   };
 };
 
-function ownKeys$s(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$s(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$s(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$s(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$t(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$t(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$t(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$t(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Checkbox = function Checkbox(props) {
   var _useFormikFields = useFormikFields(props),
     handleSubmit = _useFormikFields.handleSubmit,
     fieldProps = _useFormikFields.fieldProps;
   var submissionStatus = props.submissionStatus;
-  return /*#__PURE__*/jsxRuntime.jsx(NeetoUICheckbox__default["default"], _objectSpread$s(_objectSpread$s({}, fieldProps), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(NeetoUICheckbox__default["default"], _objectSpread$t(_objectSpread$t({}, fieldProps), {}, {
     checked: fieldProps.value,
     disabled: submissionStatus === SUBMIT_FIELD_STATUS.SUBMITTING,
     onChange: function onChange(_ref) {
@@ -1007,8 +1010,8 @@ var Checkbox = function Checkbox(props) {
   }));
 };
 
-function ownKeys$r(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$r(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$r(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$r(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$s(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$s(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$s(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$s(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var MetadataBlock = function MetadataBlock(_ref) {
   var labelProps = _ref.labelProps,
     label = _ref.label,
@@ -1020,7 +1023,7 @@ var MetadataBlock = function MetadataBlock(_ref) {
     className: "w-full space-y-2",
     children: [!isInline && /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex items-center gap-2",
-      children: [/*#__PURE__*/jsxRuntime.jsx(Label__default["default"], _objectSpread$r(_objectSpread$r({
+      children: [/*#__PURE__*/jsxRuntime.jsx(Label__default["default"], _objectSpread$s(_objectSpread$s({
         "data-cy": "".concat(general.hyphenize(label), "-label"),
         htmlFor: fieldId
       }, labelProps), {}, {
@@ -1029,7 +1032,7 @@ var MetadataBlock = function MetadataBlock(_ref) {
         className: "inline-flex h-6 items-center",
         children: [submissionStatus === SUBMIT_FIELD_STATUS.SUBMITTING && /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {
           className: "neeto-fields-nano__metadata-card__spinner"
-        }), submissionStatus === SUBMIT_FIELD_STATUS.SUCCESS && /*#__PURE__*/jsxRuntime.jsx(neetoIcons.Check, {
+        }), submissionStatus === SUBMIT_FIELD_STATUS.SUCCESS && /*#__PURE__*/jsxRuntime.jsx(Check__default["default"], {
           className: "neeto-ui-text-success-500",
           size: 20
         })]
@@ -1038,8 +1041,8 @@ var MetadataBlock = function MetadataBlock(_ref) {
   });
 };
 
-function ownKeys$q(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$q(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$q(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$q(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$r(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$r(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$r(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$r(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var WithMetadataBlock = function WithMetadataBlock(Component) {
   var withMetadataBlockWrapper = function withMetadataBlockWrapper(props) {
     var submissionStatus = props.submissionStatus,
@@ -1059,7 +1062,7 @@ var WithMetadataBlock = function WithMetadataBlock(Component) {
       label: label,
       labelProps: labelProps,
       submissionStatus: submissionStatus,
-      children: /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread$q(_objectSpread$q({}, props), {}, {
+      children: /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread$r(_objectSpread$r({}, props), {}, {
         hasMetadataWrapper: true
       }))
     });
@@ -1068,9 +1071,9 @@ var WithMetadataBlock = function WithMetadataBlock(Component) {
   return withMetadataBlockWrapper;
 };
 
-var _excluded$6 = ["onBlur"];
-function ownKeys$p(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$p(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$p(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$p(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$7 = ["onBlur"];
+function ownKeys$q(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$q(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$q(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$q(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DateOrTime = function DateOrTime(props) {
   var isInline = props.isInline;
   var _useState = React.useState(isInline),
@@ -1082,7 +1085,7 @@ var DateOrTime = function DateOrTime(props) {
     handleSubmit = _useFormikFields.handleSubmit,
     _useFormikFields$fiel = _useFormikFields.fieldProps,
     onBlur = _useFormikFields$fiel.onBlur,
-    fieldProps = _objectWithoutProperties(_useFormikFields$fiel, _excluded$6),
+    fieldProps = _objectWithoutProperties(_useFormikFields$fiel, _excluded$7),
     helpers = _useFormikFields.helpers;
   var handleChange = function handleChange(dateTime) {
     value.current = dateTimeToString(dateTime);
@@ -1123,7 +1126,7 @@ var DateOrTime = function DateOrTime(props) {
     };
   }();
   if (props.kind === KINDS.time) {
-    return /*#__PURE__*/jsxRuntime.jsx(TimePicker__default["default"], _objectSpread$p(_objectSpread$p({}, _objectSpread$p(_objectSpread$p({}, fieldProps), {}, {
+    return /*#__PURE__*/jsxRuntime.jsx(TimePicker__default["default"], _objectSpread$q(_objectSpread$q({}, _objectSpread$q(_objectSpread$q({}, fieldProps), {}, {
       onOpenChange: onOpenChange
     })), {}, {
       use12Hours: true,
@@ -1132,17 +1135,17 @@ var DateOrTime = function DateOrTime(props) {
       onChange: handleChange
     }));
   } else if (props.kind === KINDS.date) {
-    return /*#__PURE__*/jsxRuntime.jsx(DatePicker__default["default"], _objectSpread$p(_objectSpread$p({}, _objectSpread$p(_objectSpread$p({}, fieldProps), {}, {
+    return /*#__PURE__*/jsxRuntime.jsx(DatePicker__default["default"], _objectSpread$q(_objectSpread$q({}, _objectSpread$q(_objectSpread$q({}, fieldProps), {}, {
       onOpenChange: onOpenChange
     })), {}, {
       open: isOpen,
       onChange: handleChange
     }));
   }
-  return /*#__PURE__*/jsxRuntime.jsx(DatePicker__default["default"], _objectSpread$p(_objectSpread$p({
+  return /*#__PURE__*/jsxRuntime.jsx(DatePicker__default["default"], _objectSpread$q(_objectSpread$q({
     showTime: true,
     timeFormat: "h:mm A"
-  }, _objectSpread$p(_objectSpread$p({}, fieldProps), {}, {
+  }, _objectSpread$q(_objectSpread$q({}, fieldProps), {}, {
     onOpenChange: onOpenChange
   })), {}, {
     open: isOpen,
@@ -1151,13 +1154,13 @@ var DateOrTime = function DateOrTime(props) {
 };
 var DateOrTimeInput = WithMetadataBlock(DateOrTime);
 
-function ownKeys$o(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$o(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$o(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$o(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$p(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$p(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$p(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$p(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var MultiOption = function MultiOption(props) {
   var _useFormikFields = useFormikFields(props),
     handleSubmit = _useFormikFields.handleSubmit,
     fieldProps = _useFormikFields.fieldProps;
-  return /*#__PURE__*/jsxRuntime.jsx(Select__default["default"], _objectSpread$o(_objectSpread$o({
+  return /*#__PURE__*/jsxRuntime.jsx(Select__default["default"], _objectSpread$p(_objectSpread$p({
     isMulti: true,
     isSearchable: true,
     strategy: "fixed"
@@ -1169,14 +1172,14 @@ var MultiOption = function MultiOption(props) {
 };
 var MultiOptionInput = WithMetadataBlock(MultiOption);
 
-function ownKeys$n(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$n(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$n(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$n(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$o(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$o(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$o(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$o(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Number$1 = function Number(props) {
   var _useFormikFields = useFormikFields(props),
     handleSubmit = _useFormikFields.handleSubmit,
     fieldProps = _useFormikFields.fieldProps,
     dirty = _useFormikFields.dirty;
-  return /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], _objectSpread$n(_objectSpread$n({}, fieldProps), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], _objectSpread$o(_objectSpread$o({}, fieldProps), {}, {
     type: "number",
     onBlur: function onBlur() {
       return dirty && handleSubmit();
@@ -1185,14 +1188,14 @@ var Number$1 = function Number(props) {
 };
 var NumberInput = WithMetadataBlock(Number$1);
 
-var _excluded$5 = ["onBlur"];
-function ownKeys$m(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$m(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$m(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$m(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$6 = ["onBlur"];
+function ownKeys$n(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$n(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$n(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$n(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var withOnClickOutsideWrapper = function withOnClickOutsideWrapper(Component) {
   var WithOnClickOutsideWrapper = function WithOnClickOutsideWrapper(_ref) {
     var _ref$onBlur = _ref.onBlur,
       onBlur = _ref$onBlur === void 0 ? neetoCist.noop : _ref$onBlur,
-      props = _objectWithoutProperties(_ref, _excluded$5);
+      props = _objectWithoutProperties(_ref, _excluded$6);
     var ref = React.useRef(null);
     var isInline = onBlur !== neetoCist.noop;
     reactUtils.useOnClickOutside(ref, onBlur, {
@@ -1200,10 +1203,10 @@ var withOnClickOutsideWrapper = function withOnClickOutsideWrapper(Component) {
     });
     return isInline ? /*#__PURE__*/jsxRuntime.jsx("div", {
       ref: ref,
-      children: /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread$m(_objectSpread$m({}, props), {}, {
+      children: /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread$n(_objectSpread$n({}, props), {}, {
         type: "range"
       }))
-    }) : /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread$m(_objectSpread$m({}, props), {}, {
+    }) : /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread$n(_objectSpread$n({}, props), {}, {
       type: "range"
     }));
   };
@@ -1227,13 +1230,13 @@ var RangePicker = function RangePicker(props) {
     }
   };
   if (props.kind === KINDS.dateRange) {
-    return /*#__PURE__*/jsxRuntime.jsx(DateRangePicker, _objectSpread$m(_objectSpread$m({}, fieldProps), {}, {
+    return /*#__PURE__*/jsxRuntime.jsx(DateRangePicker, _objectSpread$n(_objectSpread$n({}, fieldProps), {}, {
       onChange: handleChange
     }));
   }
 
   //time_range
-  return /*#__PURE__*/jsxRuntime.jsx(TimeRangePicker, _objectSpread$m(_objectSpread$m({}, fieldProps), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(TimeRangePicker, _objectSpread$n(_objectSpread$n({}, fieldProps), {}, {
     use12Hours: true,
     format: "h:mm A",
     onChange: handleChange
@@ -1241,13 +1244,13 @@ var RangePicker = function RangePicker(props) {
 };
 var RangePickerInput = WithMetadataBlock(RangePicker);
 
-function ownKeys$l(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$l(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$l(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$m(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$m(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$m(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$m(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SingleOption = function SingleOption(props) {
   var _useFormikFields = useFormikFields(props),
     handleSubmit = _useFormikFields.handleSubmit,
     fieldProps = _useFormikFields.fieldProps;
-  return /*#__PURE__*/jsxRuntime.jsx(Select__default$1["default"], _objectSpread$l(_objectSpread$l({
+  return /*#__PURE__*/jsxRuntime.jsx(Select__default$1["default"], _objectSpread$m(_objectSpread$m({
     isClearable: true,
     isSearchable: true,
     strategy: "fixed"
@@ -1259,8 +1262,8 @@ var SingleOption = function SingleOption(props) {
 };
 var SingleOptionInput = WithMetadataBlock(SingleOption);
 
-function ownKeys$k(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$k(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$l(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$l(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$l(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Text = function Text(props) {
   var _useFormikFields = useFormikFields(props),
     handleSubmit = _useFormikFields.handleSubmit,
@@ -1275,7 +1278,7 @@ var Text = function Text(props) {
     var end = element.value.length;
     element.setSelectionRange(end, end);
   };
-  return /*#__PURE__*/jsxRuntime.jsx(Textarea__default["default"], _objectSpread$k(_objectSpread$k({}, fieldProps), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(Textarea__default["default"], _objectSpread$l(_objectSpread$l({}, fieldProps), {}, {
     className: "neeto-fields-nano-adaptive-input",
     rows: 1,
     size: "small",
@@ -1294,14 +1297,14 @@ var Text = function Text(props) {
 };
 var TextInput = WithMetadataBlock(Text);
 
-function ownKeys$j(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$j(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$k(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$k(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TextArea = function TextArea(props) {
   var _useFormikFields = useFormikFields(props),
     handleSubmit = _useFormikFields.handleSubmit,
     fieldProps = _useFormikFields.fieldProps,
     dirty = _useFormikFields.dirty;
-  return /*#__PURE__*/jsxRuntime.jsx(Textarea__default["default"], _objectSpread$j(_objectSpread$j({}, fieldProps), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(Textarea__default["default"], _objectSpread$k(_objectSpread$k({}, fieldProps), {}, {
     onBlur: function onBlur() {
       return dirty && handleSubmit();
     }
@@ -1309,8 +1312,8 @@ var TextArea = function TextArea(props) {
 };
 var TextAreaInput = WithMetadataBlock(TextArea);
 
-function ownKeys$i(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$i(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$j(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$j(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var standardComponents = {
   text: TextInput,
   regex: TextInput,
@@ -1361,7 +1364,7 @@ var transformValues = function transformValues(_ref2) {
     delete allFieldValues[fieldPath];
   });
   var cleanedFieldValues = ramda.pipe(removeItemsWithNullData, removeNoiseFromValues)(neetoFieldValues);
-  return _objectSpread$i(_objectSpread$i({}, allFieldValues), {}, {
+  return _objectSpread$j(_objectSpread$j({}, allFieldValues), {}, {
     fieldValuesAttributes: cleanedFieldValues
   });
 };
@@ -1424,8 +1427,8 @@ var neetoFieldsUtils = {
   transformValues: transformValues
 };
 
-function ownKeys$h(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$i(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$i(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FieldInputs = reactUtils.withT(function (_ref) {
   var t = _ref.t,
     _ref$customComponents = _ref.customComponents,
@@ -1440,7 +1443,7 @@ var FieldInputs = reactUtils.withT(function (_ref) {
       customComponents: customComponents
     });
     if (Field) {
-      return /*#__PURE__*/jsxRuntime.jsx(Field, _objectSpread$h({}, _objectSpread$h(_objectSpread$h({}, field), {}, {
+      return /*#__PURE__*/jsxRuntime.jsx(Field, _objectSpread$i({}, _objectSpread$i(_objectSpread$i({}, field), {}, {
         disabled: disabled,
         formRef: formRef,
         isRequiredColumnName: isRequiredColumnName
@@ -1453,8 +1456,8 @@ var FieldInputs = reactUtils.withT(function (_ref) {
   });
 });
 
-function ownKeys$g(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$h(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var fieldUrl = function fieldUrl(fieldId) {
   return utils.buildUrl(FIELD_URL, {
     fieldId: fieldId
@@ -1473,7 +1476,7 @@ var fetch$1 = function fetch(_ref) {
     _ref$pageProps = _ref.pageProps,
     pageProps = _ref$pageProps === void 0 ? {} : _ref$pageProps;
   return axios__default["default"].get(FIELDS_URL, {
-    params: _objectSpread$g({
+    params: _objectSpread$h({
       resourceType: resourceType,
       ownerId: ownerId,
       state: state,
@@ -1537,16 +1540,16 @@ var QUERY_KEYS = {
 };
 var DEFAULT_STALE_TIME = 3600000; // 1 hour
 
-var _excluded$4 = ["prefixQueryKeys"];
-function ownKeys$f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$5 = ["prefixQueryKeys"];
+function ownKeys$g(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FIELDS = QUERY_KEYS.FIELDS,
   DEPENDENCIES = QUERY_KEYS.DEPENDENCIES;
 var useFetchFields = function useFetchFields(_ref, options) {
   var _ref$prefixQueryKeys = _ref.prefixQueryKeys,
     prefixQueryKeys = _ref$prefixQueryKeys === void 0 ? [] : _ref$prefixQueryKeys,
-    params = _objectWithoutProperties(_ref, _excluded$4);
-  return reactQuery.useQuery(_objectSpread$f({
+    params = _objectWithoutProperties(_ref, _excluded$5);
+  return reactQuery.useQuery(_objectSpread$g({
     queryKey: [FIELDS].concat(_toConsumableArray(prefixQueryKeys), [params]),
     queryFn: function queryFn() {
       return fieldsApi.fetch(params);
@@ -1555,14 +1558,14 @@ var useFetchFields = function useFetchFields(_ref, options) {
   }, options));
 };
 var useCreateField = function useCreateField(options) {
-  return reactUtils.useMutationWithInvalidation(fieldsApi.create, _objectSpread$f({
-    keysToInvalidate: [FIELDS]
+  return reactUtils.useMutationWithInvalidation(fieldsApi.create, _objectSpread$g({
+    keysToInvalidate: [[FIELDS]]
   }, options));
 };
 var useShowField = function useShowField(_ref2, options) {
   var fieldId = _ref2.fieldId,
     ownerId = _ref2.ownerId;
-  return reactQuery.useQuery(_objectSpread$f({
+  return reactQuery.useQuery(_objectSpread$g({
     queryKey: [FIELDS, fieldId],
     queryFn: function queryFn() {
       return fieldsApi.show({
@@ -1575,7 +1578,7 @@ var useShowField = function useShowField(_ref2, options) {
 var useFetchDependencies = function useFetchDependencies(_ref3, options) {
   var fieldId = _ref3.fieldId,
     ownerId = _ref3.ownerId;
-  return reactQuery.useQuery(_objectSpread$f({
+  return reactQuery.useQuery(_objectSpread$g({
     queryKey: [DEPENDENCIES, fieldId],
     queryFn: function queryFn() {
       return fieldsApi.dependencies({
@@ -1586,26 +1589,26 @@ var useFetchDependencies = function useFetchDependencies(_ref3, options) {
   }, options));
 };
 var useUpdateField = function useUpdateField(options) {
-  return reactUtils.useMutationWithInvalidation(fieldsApi.update, _objectSpread$f({
-    keysToInvalidate: [FIELDS]
+  return reactUtils.useMutationWithInvalidation(fieldsApi.update, _objectSpread$g({
+    keysToInvalidate: [[FIELDS]]
   }, options));
 };
 var useDestroyField = function useDestroyField(options) {
-  return reactUtils.useMutationWithInvalidation(fieldsApi.destroy, _objectSpread$f({
-    keysToInvalidate: [FIELDS]
+  return reactUtils.useMutationWithInvalidation(fieldsApi.destroy, _objectSpread$g({
+    keysToInvalidate: [[FIELDS]]
   }, options));
 };
 var useReorderFields = function useReorderFields() {
   return reactUtils.useMutationWithInvalidation(fieldsApi.reorder, {
-    keysToInvalidate: [FIELDS]
+    keysToInvalidate: [[FIELDS]]
   });
 };
 
-function ownKeys$e(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var arrangeOptionsDisplayOrder = function arrangeOptionsDisplayOrder(options) {
   return options.map(function (option, index) {
-    return _objectSpread$e(_objectSpread$e({}, option), {}, {
+    return _objectSpread$f(_objectSpread$f({}, option), {}, {
       displayOrder: index
     });
   });
@@ -1620,7 +1623,7 @@ var buildPayload = function buildPayload(_ref) {
   var name = formValues.name.trim();
   return {
     ownerId: ramda.isEmpty(ownerId) ? undefined : ownerId,
-    field: _objectSpread$e(_objectSpread$e({}, ramda.omit(["createdAt", "id", "ownerId", "ownerType", "updatedAt"], formValues)), {}, {
+    field: _objectSpread$f(_objectSpread$f({}, ramda.omit(["createdAt", "id", "ownerId", "ownerType", "updatedAt"], formValues)), {}, {
       kind: kind,
       name: name,
       resourceType: ramda.isEmpty(resourceType) ? undefined : resourceType,
@@ -1646,7 +1649,7 @@ var getPermittedKinds = function getPermittedKinds(_ref2) {
   }, ramda.values(filteredKinds));
 };
 var generateValidationSchema = function generateValidationSchema(additionalValidations) {
-  return yup__namespace.object().shape(_objectSpread$e(_objectSpread$e({}, BASIC_FIELD_FORM_VALIDATIONS), additionalValidations));
+  return yup__namespace.object().shape(_objectSpread$f(_objectSpread$f({}, BASIC_FIELD_FORM_VALIDATIONS), additionalValidations));
 };
 var renderFormFooter = function renderFormFooter(_ref3) {
   var onClose = _ref3.onClose,
@@ -1856,11 +1859,13 @@ var AdditionalInputs = function AdditionalInputs() {
                 className: "w-full",
                 children: /*#__PURE__*/jsxRuntime.jsx(Input__default$1["default"], {
                   autoFocus: true,
+                  "data-cy": "neeto-fields-dropdown-option-".concat(index),
                   disabled: isSystem,
                   name: "data.".concat(index, ".label"),
                   placeholder: t("neetoFields.placeholders.enterAnOption"),
                   suffix: options.length > 1 && /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
-                    icon: neetoIcons.Delete,
+                    "data-cy": "neeto-fields-dropdown-option-delete-".concat(index),
+                    icon: Delete__default["default"],
                     style: "text",
                     onClick: function onClick() {
                       return removeOption(arrayHelpers, index);
@@ -1966,9 +1971,9 @@ var FieldForm = function FieldForm(_ref) {
   });
 };
 
-var _excluded$3 = ["resourceType", "allowedKinds", "ownerId", "additionalValidations", "initialValues", "onClose", "onMutationSuccess"];
-function ownKeys$d(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$4 = ["resourceType", "allowedKinds", "ownerId", "additionalValidations", "initialValues", "onClose", "onMutationSuccess"];
+function ownKeys$e(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Add = function Add(_ref) {
   var resourceType = _ref.resourceType,
     _ref$allowedKinds = _ref.allowedKinds,
@@ -1978,7 +1983,7 @@ var Add = function Add(_ref) {
     initialValues = _ref.initialValues,
     onClose = _ref.onClose,
     onMutationSuccess = _ref.onMutationSuccess,
-    props = _objectWithoutProperties(_ref, _excluded$3);
+    props = _objectWithoutProperties(_ref, _excluded$4);
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var _useCreateField = useCreateField({
@@ -2006,14 +2011,14 @@ var Add = function Add(_ref) {
       })
     }), /*#__PURE__*/jsxRuntime.jsx(Form__default["default"], {
       formikProps: {
-        initialValues: _objectSpread$d(_objectSpread$d({}, initialValues), INITIAL_FIELDS),
+        initialValues: _objectSpread$e(_objectSpread$e({}, initialValues), INITIAL_FIELDS),
         validationSchema: generateValidationSchema(additionalValidations),
         onSubmit: handleSubmit
       },
       children: function children(_ref2) {
         var kind = _ref2.values.kind;
         return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(FieldForm, _objectSpread$d({
+          children: [/*#__PURE__*/jsxRuntime.jsx(FieldForm, _objectSpread$e({
             chosenKind: kind.value,
             kindSelectOptions: filteredKinds
           }, props)), renderFormFooter({
@@ -2026,9 +2031,9 @@ var Add = function Add(_ref) {
   });
 };
 
-var _excluded$2 = ["fieldId", "allowedKinds", "ownerId", "additionalValidations", "initialValues", "onClose", "onMutationSuccess"];
-function ownKeys$c(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$c(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$3 = ["fieldId", "allowedKinds", "ownerId", "additionalValidations", "initialValues", "onClose", "onMutationSuccess"];
+function ownKeys$d(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Edit = function Edit(_ref) {
   var fieldId = _ref.fieldId,
     _ref$allowedKinds = _ref.allowedKinds,
@@ -2040,7 +2045,7 @@ var Edit = function Edit(_ref) {
     initialValues = _ref$initialValues === void 0 ? {} : _ref$initialValues,
     onClose = _ref.onClose,
     onMutationSuccess = _ref.onMutationSuccess,
-    props = _objectWithoutProperties(_ref, _excluded$2);
+    props = _objectWithoutProperties(_ref, _excluded$3);
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var _useShowField = useShowField({
@@ -2082,7 +2087,7 @@ var Edit = function Edit(_ref) {
       })
     }), isLoading ? /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {}) : /*#__PURE__*/jsxRuntime.jsx(Form__default["default"], {
       formikProps: {
-        initialValues: _objectSpread$c(_objectSpread$c({}, initialValues), ramda.assoc("kind", FIELD_KINDS[field.kind], field)),
+        initialValues: _objectSpread$d(_objectSpread$d({}, initialValues), ramda.assoc("kind", FIELD_KINDS[field.kind], field)),
         validationSchema: generateValidationSchema(additionalValidations),
         enableReinitialize: true,
         onSubmit: handleSubmit
@@ -2094,7 +2099,7 @@ var Edit = function Edit(_ref) {
           selectedKind: kind
         });
         return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(FieldForm, _objectSpread$c({
+          children: [/*#__PURE__*/jsxRuntime.jsx(FieldForm, _objectSpread$d({
             chosenKind: kind === null || kind === void 0 ? void 0 : kind.value,
             isSystem: field.isSystem,
             kindSelectOptions: permittedKinds
@@ -2108,24 +2113,24 @@ var Edit = function Edit(_ref) {
   });
 };
 
-var _excluded$1 = ["isOpen", "selectedField"];
-function ownKeys$b(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$2 = ["isOpen", "selectedField"];
+function ownKeys$c(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$c(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FieldsPane = function FieldsPane(_ref) {
   var isOpen = _ref.isOpen,
     _ref$selectedField = _ref.selectedField,
     selectedField = _ref$selectedField === void 0 ? {} : _ref$selectedField,
-    props = _objectWithoutProperties(_ref, _excluded$1);
+    props = _objectWithoutProperties(_ref, _excluded$2);
   var initialFocusField = React.useRef(null);
   return /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"], {
     isOpen: isOpen,
     initialFocusRef: initialFocusField,
     onClose: props.onClose,
-    children: ramda.isEmpty(selectedField) ? /*#__PURE__*/jsxRuntime.jsx(Add, _objectSpread$b({}, _objectSpread$b(_objectSpread$b({}, props), {}, {
+    children: ramda.isEmpty(selectedField) ? /*#__PURE__*/jsxRuntime.jsx(Add, _objectSpread$c({}, _objectSpread$c(_objectSpread$c({}, props), {}, {
       initialFocusField: initialFocusField
-    }))) : /*#__PURE__*/jsxRuntime.jsx(Edit, _objectSpread$b({
+    }))) : /*#__PURE__*/jsxRuntime.jsx(Edit, _objectSpread$c({
       fieldId: selectedField === null || selectedField === void 0 ? void 0 : selectedField.id
-    }, _objectSpread$b(_objectSpread$b({}, props), {}, {
+    }, _objectSpread$c(_objectSpread$c({}, props), {}, {
       initialFocusField: initialFocusField
     })))
   });
@@ -2849,18 +2854,18 @@ var configsApi = {
   fetchConfigs: fetchConfigs
 };
 
-function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$b(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useFetchConfigs = function useFetchConfigs(options) {
-  return reactQuery.useQuery(_objectSpread$a({
+  return reactQuery.useQuery(_objectSpread$b({
     queryKey: [QUERY_KEYS.CONFIGS],
     queryFn: configsApi.fetchConfigs,
     staleTime: DEFAULT_STALE_TIME
   }, options));
 };
 
-function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useFieldsDashboard = function useFieldsDashboard(_ref) {
   var buildColumnData = _ref.buildColumnData,
     isOwnerBased = _ref.isOwnerBased,
@@ -2927,7 +2932,7 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
   };
   var _useFetchFields = useFetchFields(fieldParams, {
       enabled: !!resource,
-      keepPreviousData: true
+      placeholderData: reactQuery.keepPreviousData
     }),
     _useFetchFields$data = _useFetchFields.data,
     _useFetchFields$data2 = _useFetchFields$data === void 0 ? {} : _useFetchFields$data,
@@ -2983,7 +2988,7 @@ var useFieldsDashboard = function useFieldsDashboard(_ref) {
     defaultColumns: defaultColumns
   });
   var handleBlockClick = function handleBlockClick(params) {
-    return reactUtils.handleMetaClick(history, utils.buildUrl("", _objectSpread$9({
+    return reactUtils.handleMetaClick(history, utils.buildUrl("", _objectSpread$a({
       resource: resource,
       state: state
     }, params)));
@@ -3126,8 +3131,8 @@ var DeleteAlert = function DeleteAlert(_ref) {
   });
 };
 
-function ownKeys$8(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FieldsTable = function FieldsTable(_ref) {
   var totalCount = _ref.totalCount,
     isFetched = _ref.isFetched,
@@ -3166,7 +3171,7 @@ var FieldsTable = function FieldsTable(_ref) {
   return /*#__PURE__*/jsxRuntime.jsx(TableWrapper__default["default"], {
     children: showNoDataScreen ? /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "flex h-full w-full items-center justify-center",
-      children: /*#__PURE__*/jsxRuntime.jsx(NoData__default["default"], _objectSpread$8({
+      children: /*#__PURE__*/jsxRuntime.jsx(NoData__default["default"], _objectSpread$9({
         title: showStateFilter ? t("neetoFields.messages.noFieldsWithState", {
           title: title,
           state: state
@@ -3183,7 +3188,7 @@ var FieldsTable = function FieldsTable(_ref) {
       currentPageNumber: page,
       defaultPageSize: pageSize,
       handlePageChange: function handlePageChange(page) {
-        return setPageProps(_objectSpread$8(_objectSpread$8({}, pageProps), {}, {
+        return setPageProps(_objectSpread$9(_objectSpread$9({}, pageProps), {}, {
           page: page
         }));
       },
@@ -3218,9 +3223,9 @@ var ActionBlock = function ActionBlock(_ref) {
   });
 };
 
-var _excluded = ["searchInputProps", "breadcrumbs", "title", "helpDocUrl", "helpDescription", "size"];
-function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1 = ["searchInputProps", "breadcrumbs", "title", "helpDocUrl", "helpDescription", "size"];
+function ownKeys$8(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Header = reactUtils.withT(function (_ref) {
   var searchInputProps = _ref.searchInputProps,
     breadcrumbs = _ref.breadcrumbs,
@@ -3228,14 +3233,14 @@ var Header = reactUtils.withT(function (_ref) {
     helpDocUrl = _ref.helpDocUrl,
     helpDescription = _ref.helpDescription,
     size = _ref.size,
-    actionBlockProps = _objectWithoutProperties(_ref, _excluded);
+    actionBlockProps = _objectWithoutProperties(_ref, _excluded$1);
   return /*#__PURE__*/jsxRuntime.jsx(NeetoUIHeader__default["default"], {
     breadcrumbs: breadcrumbs,
     size: size,
-    actionBlock: /*#__PURE__*/jsxRuntime.jsx(ActionBlock, _objectSpread$7({}, actionBlockProps)),
+    actionBlock: /*#__PURE__*/jsxRuntime.jsx(ActionBlock, _objectSpread$8({}, actionBlockProps)),
     searchProps: searchInputProps,
     title: /*#__PURE__*/jsxRuntime.jsxs("span", {
-      children: [title, (helpDocUrl || helpDescription) && /*#__PURE__*/jsxRuntime.jsx(HelpPopover__default["default"], _objectSpread$7(_objectSpread$7(_objectSpread$7({
+      children: [title, (helpDocUrl || helpDescription) && /*#__PURE__*/jsxRuntime.jsx(HelpPopover__default["default"], _objectSpread$8(_objectSpread$8(_objectSpread$8({
         className: "ml-2 self-center"
       }, helpDocUrl && {
         title: title
@@ -7494,15 +7499,31 @@ function normalizeLocalDisabled(localDisabled, globalDisabled) {
 
 [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];
 
+var _excluded = ["size"];
+function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DragIcon = function DragIcon(_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 16 : _ref$size,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/jsxRuntime.jsx("svg", _objectSpread$7(_objectSpread$7({
+    fill: "currentColor",
+    height: size,
+    viewBox: "0 -960 960 960",
+    width: size,
+    xmlns: "http://www.w3.org/2000/svg"
+  }, otherProps), {}, {
+    children: /*#__PURE__*/jsxRuntime.jsx("path", {
+      d: "M360-160q-33 0-56.5-23.5T280-240q0-33 23.5-56.5T360-320q33 0 56.5 23.5T440-240q0 33-23.5 56.5T360-160zm240 0q-33 0-56.5-23.5T520-240q0-33 23.5-56.5T600-320q33 0 56.5 23.5T680-240q0 33-23.5 56.5T600-160zM360-400q-33 0-56.5-23.5T280-480q0-33 23.5-56.5T360-560q33 0 56.5 23.5T440-480q0 33-23.5 56.5T360-400zm240 0q-33 0-56.5-23.5T520-480q0-33 23.5-56.5T600-560q33 0 56.5 23.5T680-480q0 33-23.5 56.5T600-400zM360-640q-33 0-56.5-23.5T280-720q0-33 23.5-56.5T360-800q33 0 56.5 23.5T440-720q0 33-23.5 56.5T360-640zm240 0q-33 0-56.5-23.5T520-720q0-33 23.5-56.5T600-800q33 0 56.5 23.5T680-720q0 33-23.5 56.5T600-640z"
+    })
+  }));
+};
+
 function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FieldBlock = function FieldBlock(_ref) {
   var field = _ref.field,
-    index = _ref.index,
-    fields = _ref.fields;
-  var systemFieldsCount = neetoCist.countBy({
-    isSystem: true
-  }, fields);
+    index = _ref.index;
   var _useSortable = useSortable({
       id: field.id,
       data: {
@@ -7512,7 +7533,8 @@ var FieldBlock = function FieldBlock(_ref) {
     attributes = _useSortable.attributes,
     listeners = _useSortable.listeners,
     setNodeRef = _useSortable.setNodeRef,
-    transform = _useSortable.transform;
+    transform = _useSortable.transform,
+    isDragging = _useSortable.isDragging;
   var style = {
     transform: CSS.Transform.toString(transform)
   };
@@ -7521,17 +7543,19 @@ var FieldBlock = function FieldBlock(_ref) {
   }, _objectSpread$6(_objectSpread$6({
     style: style
   }, attributes), listeners)), {}, {
-    className: "neeto-ui-text-gray-800 mb-3 flex w-full items-center space-x-4 font-medium",
+    className: "neeto-ui-text-gray-800 group mb-3 flex w-full items-center gap-x-0.5 font-medium",
     "data-cy": "reorder-field-block",
     children: [/*#__PURE__*/jsxRuntime.jsx("div", {
-      className: "neeto-ui-bg-gray-100 neeto-ui-text-gray-700 neeto-ui-rounded-sm flex h-6 w-6 flex-shrink-0 items-center justify-center p-1",
-      children: index - systemFieldsCount + 1
-    }), /*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "neeto-ui-border-gray-400 neeto-ui-bg-white neeto-ui-rounded neeto-ui-shadow-xs flex flex-grow items-center space-x-4 border border-solid p-3",
-      children: [/*#__PURE__*/jsxRuntime.jsx(neetoIcons.Reorder, {}), /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: classnames__default["default"]("cursor-grab", {
+        "cursor-grabbing": isDragging
+      }),
+      children: /*#__PURE__*/jsxRuntime.jsx(DragIcon, {})
+    }), /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "neeto-ui-border-gray-400 neeto-ui-bg-white neeto-ui-rounded neeto-ui-shadow-xs flex flex-grow items-center border border-solid p-3 transition-all duration-300 ease-in-out group-hover:bg-gray-200",
+      children: /*#__PURE__*/jsxRuntime.jsx("div", {
         "data-cy": "reorder-field-block-name",
         children: field.name
-      })]
+      })
     })]
   }));
 };
@@ -7623,7 +7647,6 @@ var ReorderPane = function ReorderPane(_ref) {
               if (field.isSystem) return null;
               return /*#__PURE__*/React.createElement(FieldBlock$1, {
                 field: field,
-                fields: fields,
                 index: index,
                 key: index
               });
@@ -7850,17 +7873,17 @@ function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymb
 function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useCreateFieldValue = function useCreateFieldValue(options) {
   return reactUtils.useMutationWithInvalidation(fieldValuesApi.create, _objectSpread$4({
-    keysToInvalidate: [QUERY_KEYS.FIELD_VALUES]
+    keysToInvalidate: [[QUERY_KEYS.FIELD_VALUES]]
   }, options));
 };
 var useUpdateFieldValue = function useUpdateFieldValue(options) {
   return reactUtils.useMutationWithInvalidation(fieldValuesApi.update, _objectSpread$4({
-    keysToInvalidate: [QUERY_KEYS.FIELD_VALUES]
+    keysToInvalidate: [[QUERY_KEYS.FIELD_VALUES]]
   }, options));
 };
 var useDeleteFieldValue = function useDeleteFieldValue(options) {
   return reactUtils.useMutationWithInvalidation(fieldValuesApi.destroy, _objectSpread$4({
-    keysToInvalidate: [QUERY_KEYS.FIELD_VALUES]
+    keysToInvalidate: [[QUERY_KEYS.FIELD_VALUES]]
   }, options));
 };