@dovetail-v2/refine 0.1.32 → 0.2.0-alpha.1

package/dist/{index-12763c77.js → index-50a21e99.js}

@@ -11,7 +11,7 @@ import { ResourceContext, matchResourceFromRoute, useResource, useDelete, useNav
 import { parse, stringify } from "qs";
 import { useLocation, useHistory, useParams, matchPath, Link, Route, NavLink, Router } from "react-router-dom";
 import { Typo, Tag, Input, Select, AntdOption, Button, Form, Space, TextArea, kitContext, Loading, Table as Table$2, Pagination, Alert, usePopModal, Modal, usePushModal, Fields, Units, Link as Link$1, OverflowTooltip, Tooltip, Dropdown, Menu as Menu$1, Icon as Icon$1, Divider, StatusCapsule, Tabs as Tabs$1, TabsTabPane, Row, Col, Popover, AntdTable, TableForm, getOptions, DonutChart, SegmentControl, Checkbox, useMessage, DropdownMenu, SearchInput, Token, AntdSelectOptGroup, MenuItemGroup, Layout as Layout$1, Time as Time$1, ModalStack, KitStoreProvider, ConfigProvider } from "@cloudtower/eagle";
-import { first, get as get$3, cloneDeep, set as set$1, omit as omit$1, merge, debounce, last, isObject as isObject$4, uniq, keyBy } from "lodash-es";
+import { first, get as get$3, cloneDeep, set as set$1, omit as omit$1, merge, debounce, last, setWith, clone, isObject as isObject$4, uniq, keyBy } from "lodash-es";
 import { EditPen16PrimaryIcon, Download16GradientBlueIcon, TrashBinDelete16Icon, MoreEllipsis324BoldSecondaryIcon, MoreEllipsis324BoldBlueIcon, MoreEllipsis316BoldBlueIcon, PlusAddCreateNew16BoldOntintIcon, ArrowChevronLeft16BoldTertiaryIcon, ArrowChevronLeftSmall16BoldBlueIcon, ViewEye16GradientGrayIcon, EntityFilterIgnoreGradient16GrayIcon, InfoICircleFill16GrayIcon, InfoICircleFill16Gray70Icon, RecoverContinue16GradientBlueIcon, SuspendedPause16GradientBlueIcon, Retry16GradientBlueIcon, FontSize16GrayIcon, FontSize16BlueIcon, LogCollection16GrayIcon, LogCollection16GradientBlueIcon, TrashBinDeletePermanently16GrayIcon, TrashBinDeletePermanently16BlueIcon, Loading24GradientBlueIcon, OpenTerminal16GradientBlueIcon, HierarchyTriangleRight16GrayIcon, HierarchyTriangleRight16BlueIcon, ClipboardCopy16GradientGrayIcon, ClipboardCopy16GradientBlueIcon, Retry16GradientGrayIcon, EditPen16GradientGrayIcon, EditPen16GradientBlueIcon, Showdiff16GradientGrayIcon, Showdiff16GradientBlueIcon, XmarkFailedSeriousWarningFill16RedIcon, ExclamationErrorCircleFill16RedIcon, Pause16GradientBlueIcon, EditPen16BlueIcon } from "@cloudtower/icons-react";
 import yaml$2 from "js-yaml";
 import { paginateData, sortData, dataProvider, liveProvider } from "k8s-api-provider";
@@ -25,301 +25,308 @@ function getDefaultExportFromCjs(x) {
   return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
 }
 var dayjs_min = { exports: {} };
-(function(module, exports) {
-  !function(t2, e2) {
-    module.exports = e2();
-  }(commonjsGlobal, function() {
-    var t2 = 1e3, e2 = 6e4, n2 = 36e5, r2 = "millisecond", i = "second", s2 = "minute", u = "hour", a2 = "day", o = "week", c2 = "month", f = "quarter", h = "year", d = "date", l = "Invalid Date", $ = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, y = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, M = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(t3) {
-      var e3 = ["th", "st", "nd", "rd"], n3 = t3 % 100;
-      return "[" + t3 + (e3[(n3 - 20) % 10] || e3[n3] || e3[0]) + "]";
-    } }, m = function(t3, e3, n3) {
-      var r3 = String(t3);
-      return !r3 || r3.length >= e3 ? t3 : "" + Array(e3 + 1 - r3.length).join(n3) + t3;
-    }, v = { s: m, z: function(t3) {
-      var e3 = -t3.utcOffset(), n3 = Math.abs(e3), r3 = Math.floor(n3 / 60), i2 = n3 % 60;
-      return (e3 <= 0 ? "+" : "-") + m(r3, 2, "0") + ":" + m(i2, 2, "0");
-    }, m: function t3(e3, n3) {
-      if (e3.date() < n3.date())
-        return -t3(n3, e3);
-      var r3 = 12 * (n3.year() - e3.year()) + (n3.month() - e3.month()), i2 = e3.clone().add(r3, c2), s3 = n3 - i2 < 0, u2 = e3.clone().add(r3 + (s3 ? -1 : 1), c2);
-      return +(-(r3 + (n3 - i2) / (s3 ? i2 - u2 : u2 - i2)) || 0);
-    }, a: function(t3) {
-      return t3 < 0 ? Math.ceil(t3) || 0 : Math.floor(t3);
-    }, p: function(t3) {
-      return { M: c2, y: h, w: o, d: a2, D: d, h: u, m: s2, s: i, ms: r2, Q: f }[t3] || String(t3 || "").toLowerCase().replace(/s$/, "");
-    }, u: function(t3) {
-      return void 0 === t3;
-    } }, g = "en", D = {};
-    D[g] = M;
-    var p = "$isDayjsObject", S = function(t3) {
-      return t3 instanceof _ || !(!t3 || !t3[p]);
-    }, w = function t3(e3, n3, r3) {
-      var i2;
-      if (!e3)
-        return g;
-      if ("string" == typeof e3) {
-        var s3 = e3.toLowerCase();
-        D[s3] && (i2 = s3), n3 && (D[s3] = n3, i2 = s3);
-        var u2 = e3.split("-");
-        if (!i2 && u2.length > 1)
-          return t3(u2[0]);
-      } else {
-        var a3 = e3.name;
-        D[a3] = e3, i2 = a3;
-      }
-      return !r3 && i2 && (g = i2), i2 || !r3 && g;
-    }, O = function(t3, e3) {
-      if (S(t3))
-        return t3.clone();
-      var n3 = "object" == typeof e3 ? e3 : {};
-      return n3.date = t3, n3.args = arguments, new _(n3);
-    }, b = v;
-    b.l = w, b.i = S, b.w = function(t3, e3) {
-      return O(t3, { locale: e3.$L, utc: e3.$u, x: e3.$x, $offset: e3.$offset });
-    };
-    var _ = function() {
-      function M2(t3) {
-        this.$L = w(t3.locale, null, true), this.parse(t3), this.$x = this.$x || t3.x || {}, this[p] = true;
-      }
-      var m2 = M2.prototype;
-      return m2.parse = function(t3) {
-        this.$d = function(t4) {
-          var e3 = t4.date, n3 = t4.utc;
-          if (null === e3)
-            return /* @__PURE__ */ new Date(NaN);
-          if (b.u(e3))
-            return /* @__PURE__ */ new Date();
-          if (e3 instanceof Date)
-            return new Date(e3);
-          if ("string" == typeof e3 && !/Z$/i.test(e3)) {
-            var r3 = e3.match($);
-            if (r3) {
-              var i2 = r3[2] - 1 || 0, s3 = (r3[7] || "0").substring(0, 3);
-              return n3 ? new Date(Date.UTC(r3[1], i2, r3[3] || 1, r3[4] || 0, r3[5] || 0, r3[6] || 0, s3)) : new Date(r3[1], i2, r3[3] || 1, r3[4] || 0, r3[5] || 0, r3[6] || 0, s3);
-            }
-          }
-          return new Date(e3);
-        }(t3), this.init();
-      }, m2.init = function() {
-        var t3 = this.$d;
-        this.$y = t3.getFullYear(), this.$M = t3.getMonth(), this.$D = t3.getDate(), this.$W = t3.getDay(), this.$H = t3.getHours(), this.$m = t3.getMinutes(), this.$s = t3.getSeconds(), this.$ms = t3.getMilliseconds();
-      }, m2.$utils = function() {
-        return b;
-      }, m2.isValid = function() {
-        return !(this.$d.toString() === l);
-      }, m2.isSame = function(t3, e3) {
-        var n3 = O(t3);
-        return this.startOf(e3) <= n3 && n3 <= this.endOf(e3);
-      }, m2.isAfter = function(t3, e3) {
-        return O(t3) < this.startOf(e3);
-      }, m2.isBefore = function(t3, e3) {
-        return this.endOf(e3) < O(t3);
-      }, m2.$g = function(t3, e3, n3) {
-        return b.u(t3) ? this[e3] : this.set(n3, t3);
-      }, m2.unix = function() {
-        return Math.floor(this.valueOf() / 1e3);
-      }, m2.valueOf = function() {
-        return this.$d.getTime();
-      }, m2.startOf = function(t3, e3) {
-        var n3 = this, r3 = !!b.u(e3) || e3, f2 = b.p(t3), l2 = function(t4, e4) {
-          var i2 = b.w(n3.$u ? Date.UTC(n3.$y, e4, t4) : new Date(n3.$y, e4, t4), n3);
-          return r3 ? i2 : i2.endOf(a2);
-        }, $2 = function(t4, e4) {
-          return b.w(n3.toDate()[t4].apply(n3.toDate("s"), (r3 ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(e4)), n3);
-        }, y2 = this.$W, M3 = this.$M, m3 = this.$D, v2 = "set" + (this.$u ? "UTC" : "");
-        switch (f2) {
-          case h:
-            return r3 ? l2(1, 0) : l2(31, 11);
-          case c2:
-            return r3 ? l2(1, M3) : l2(0, M3 + 1);
-          case o:
-            var g2 = this.$locale().weekStart || 0, D2 = (y2 < g2 ? y2 + 7 : y2) - g2;
-            return l2(r3 ? m3 - D2 : m3 + (6 - D2), M3);
-          case a2:
-          case d:
-            return $2(v2 + "Hours", 0);
-          case u:
-            return $2(v2 + "Minutes", 1);
-          case s2:
-            return $2(v2 + "Seconds", 2);
-          case i:
-            return $2(v2 + "Milliseconds", 3);
-          default:
-            return this.clone();
-        }
-      }, m2.endOf = function(t3) {
-        return this.startOf(t3, false);
-      }, m2.$set = function(t3, e3) {
-        var n3, o2 = b.p(t3), f2 = "set" + (this.$u ? "UTC" : ""), l2 = (n3 = {}, n3[a2] = f2 + "Date", n3[d] = f2 + "Date", n3[c2] = f2 + "Month", n3[h] = f2 + "FullYear", n3[u] = f2 + "Hours", n3[s2] = f2 + "Minutes", n3[i] = f2 + "Seconds", n3[r2] = f2 + "Milliseconds", n3)[o2], $2 = o2 === a2 ? this.$D + (e3 - this.$W) : e3;
-        if (o2 === c2 || o2 === h) {
-          var y2 = this.clone().set(d, 1);
-          y2.$d[l2]($2), y2.init(), this.$d = y2.set(d, Math.min(this.$D, y2.daysInMonth())).$d;
-        } else
-          l2 && this.$d[l2]($2);
-        return this.init(), this;
-      }, m2.set = function(t3, e3) {
-        return this.clone().$set(t3, e3);
-      }, m2.get = function(t3) {
-        return this[b.p(t3)]();
-      }, m2.add = function(r3, f2) {
-        var d2, l2 = this;
-        r3 = Number(r3);
-        var $2 = b.p(f2), y2 = function(t3) {
-          var e3 = O(l2);
-          return b.w(e3.date(e3.date() + Math.round(t3 * r3)), l2);
-        };
-        if ($2 === c2)
-          return this.set(c2, this.$M + r3);
-        if ($2 === h)
-          return this.set(h, this.$y + r3);
-        if ($2 === a2)
-          return y2(1);
-        if ($2 === o)
-          return y2(7);
-        var M3 = (d2 = {}, d2[s2] = e2, d2[u] = n2, d2[i] = t2, d2)[$2] || 1, m3 = this.$d.getTime() + r3 * M3;
-        return b.w(m3, this);
-      }, m2.subtract = function(t3, e3) {
-        return this.add(-1 * t3, e3);
-      }, m2.format = function(t3) {
-        var e3 = this, n3 = this.$locale();
-        if (!this.isValid())
-          return n3.invalidDate || l;
-        var r3 = t3 || "YYYY-MM-DDTHH:mm:ssZ", i2 = b.z(this), s3 = this.$H, u2 = this.$m, a3 = this.$M, o2 = n3.weekdays, c3 = n3.months, f2 = n3.meridiem, h2 = function(t4, n4, i3, s4) {
-          return t4 && (t4[n4] || t4(e3, r3)) || i3[n4].slice(0, s4);
-        }, d2 = function(t4) {
-          return b.s(s3 % 12 || 12, t4, "0");
-        }, $2 = f2 || function(t4, e4, n4) {
-          var r4 = t4 < 12 ? "AM" : "PM";
-          return n4 ? r4.toLowerCase() : r4;
-        };
-        return r3.replace(y, function(t4, r4) {
-          return r4 || function(t5) {
-            switch (t5) {
-              case "YY":
-                return String(e3.$y).slice(-2);
-              case "YYYY":
-                return b.s(e3.$y, 4, "0");
-              case "M":
-                return a3 + 1;
-              case "MM":
-                return b.s(a3 + 1, 2, "0");
-              case "MMM":
-                return h2(n3.monthsShort, a3, c3, 3);
-              case "MMMM":
-                return h2(c3, a3);
-              case "D":
-                return e3.$D;
-              case "DD":
-                return b.s(e3.$D, 2, "0");
-              case "d":
-                return String(e3.$W);
-              case "dd":
-                return h2(n3.weekdaysMin, e3.$W, o2, 2);
-              case "ddd":
-                return h2(n3.weekdaysShort, e3.$W, o2, 3);
-              case "dddd":
-                return o2[e3.$W];
-              case "H":
-                return String(s3);
-              case "HH":
-                return b.s(s3, 2, "0");
-              case "h":
-                return d2(1);
-              case "hh":
-                return d2(2);
-              case "a":
-                return $2(s3, u2, true);
-              case "A":
-                return $2(s3, u2, false);
-              case "m":
-                return String(u2);
-              case "mm":
-                return b.s(u2, 2, "0");
-              case "s":
-                return String(e3.$s);
-              case "ss":
-                return b.s(e3.$s, 2, "0");
-              case "SSS":
-                return b.s(e3.$ms, 3, "0");
-              case "Z":
-                return i2;
+var hasRequiredDayjs_min;
+function requireDayjs_min() {
+  if (hasRequiredDayjs_min)
+    return dayjs_min.exports;
+  hasRequiredDayjs_min = 1;
+  (function(module, exports) {
+    !function(t2, e2) {
+      module.exports = e2();
+    }(commonjsGlobal, function() {
+      var t2 = 1e3, e2 = 6e4, n2 = 36e5, r2 = "millisecond", i = "second", s2 = "minute", u = "hour", a2 = "day", o = "week", c2 = "month", f = "quarter", h = "year", d = "date", l = "Invalid Date", $ = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, y = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, M = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(t3) {
+        var e3 = ["th", "st", "nd", "rd"], n3 = t3 % 100;
+        return "[" + t3 + (e3[(n3 - 20) % 10] || e3[n3] || e3[0]) + "]";
+      } }, m = function(t3, e3, n3) {
+        var r3 = String(t3);
+        return !r3 || r3.length >= e3 ? t3 : "" + Array(e3 + 1 - r3.length).join(n3) + t3;
+      }, v = { s: m, z: function(t3) {
+        var e3 = -t3.utcOffset(), n3 = Math.abs(e3), r3 = Math.floor(n3 / 60), i2 = n3 % 60;
+        return (e3 <= 0 ? "+" : "-") + m(r3, 2, "0") + ":" + m(i2, 2, "0");
+      }, m: function t3(e3, n3) {
+        if (e3.date() < n3.date())
+          return -t3(n3, e3);
+        var r3 = 12 * (n3.year() - e3.year()) + (n3.month() - e3.month()), i2 = e3.clone().add(r3, c2), s3 = n3 - i2 < 0, u2 = e3.clone().add(r3 + (s3 ? -1 : 1), c2);
+        return +(-(r3 + (n3 - i2) / (s3 ? i2 - u2 : u2 - i2)) || 0);
+      }, a: function(t3) {
+        return t3 < 0 ? Math.ceil(t3) || 0 : Math.floor(t3);
+      }, p: function(t3) {
+        return { M: c2, y: h, w: o, d: a2, D: d, h: u, m: s2, s: i, ms: r2, Q: f }[t3] || String(t3 || "").toLowerCase().replace(/s$/, "");
+      }, u: function(t3) {
+        return void 0 === t3;
+      } }, g = "en", D = {};
+      D[g] = M;
+      var p = "$isDayjsObject", S = function(t3) {
+        return t3 instanceof _ || !(!t3 || !t3[p]);
+      }, w = function t3(e3, n3, r3) {
+        var i2;
+        if (!e3)
+          return g;
+        if ("string" == typeof e3) {
+          var s3 = e3.toLowerCase();
+          D[s3] && (i2 = s3), n3 && (D[s3] = n3, i2 = s3);
+          var u2 = e3.split("-");
+          if (!i2 && u2.length > 1)
+            return t3(u2[0]);
+        } else {
+          var a3 = e3.name;
+          D[a3] = e3, i2 = a3;
+        }
+        return !r3 && i2 && (g = i2), i2 || !r3 && g;
+      }, O = function(t3, e3) {
+        if (S(t3))
+          return t3.clone();
+        var n3 = "object" == typeof e3 ? e3 : {};
+        return n3.date = t3, n3.args = arguments, new _(n3);
+      }, b = v;
+      b.l = w, b.i = S, b.w = function(t3, e3) {
+        return O(t3, { locale: e3.$L, utc: e3.$u, x: e3.$x, $offset: e3.$offset });
+      };
+      var _ = function() {
+        function M2(t3) {
+          this.$L = w(t3.locale, null, true), this.parse(t3), this.$x = this.$x || t3.x || {}, this[p] = true;
+        }
+        var m2 = M2.prototype;
+        return m2.parse = function(t3) {
+          this.$d = function(t4) {
+            var e3 = t4.date, n3 = t4.utc;
+            if (null === e3)
+              return /* @__PURE__ */ new Date(NaN);
+            if (b.u(e3))
+              return /* @__PURE__ */ new Date();
+            if (e3 instanceof Date)
+              return new Date(e3);
+            if ("string" == typeof e3 && !/Z$/i.test(e3)) {
+              var r3 = e3.match($);
+              if (r3) {
+                var i2 = r3[2] - 1 || 0, s3 = (r3[7] || "0").substring(0, 3);
+                return n3 ? new Date(Date.UTC(r3[1], i2, r3[3] || 1, r3[4] || 0, r3[5] || 0, r3[6] || 0, s3)) : new Date(r3[1], i2, r3[3] || 1, r3[4] || 0, r3[5] || 0, r3[6] || 0, s3);
+              }
             }
-            return null;
-          }(t4) || i2.replace(":", "");
-        });
-      }, m2.utcOffset = function() {
-        return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
-      }, m2.diff = function(r3, d2, l2) {
-        var $2, y2 = this, M3 = b.p(d2), m3 = O(r3), v2 = (m3.utcOffset() - this.utcOffset()) * e2, g2 = this - m3, D2 = function() {
-          return b.m(y2, m3);
+            return new Date(e3);
+          }(t3), this.init();
+        }, m2.init = function() {
+          var t3 = this.$d;
+          this.$y = t3.getFullYear(), this.$M = t3.getMonth(), this.$D = t3.getDate(), this.$W = t3.getDay(), this.$H = t3.getHours(), this.$m = t3.getMinutes(), this.$s = t3.getSeconds(), this.$ms = t3.getMilliseconds();
+        }, m2.$utils = function() {
+          return b;
+        }, m2.isValid = function() {
+          return !(this.$d.toString() === l);
+        }, m2.isSame = function(t3, e3) {
+          var n3 = O(t3);
+          return this.startOf(e3) <= n3 && n3 <= this.endOf(e3);
+        }, m2.isAfter = function(t3, e3) {
+          return O(t3) < this.startOf(e3);
+        }, m2.isBefore = function(t3, e3) {
+          return this.endOf(e3) < O(t3);
+        }, m2.$g = function(t3, e3, n3) {
+          return b.u(t3) ? this[e3] : this.set(n3, t3);
+        }, m2.unix = function() {
+          return Math.floor(this.valueOf() / 1e3);
+        }, m2.valueOf = function() {
+          return this.$d.getTime();
+        }, m2.startOf = function(t3, e3) {
+          var n3 = this, r3 = !!b.u(e3) || e3, f2 = b.p(t3), l2 = function(t4, e4) {
+            var i2 = b.w(n3.$u ? Date.UTC(n3.$y, e4, t4) : new Date(n3.$y, e4, t4), n3);
+            return r3 ? i2 : i2.endOf(a2);
+          }, $2 = function(t4, e4) {
+            return b.w(n3.toDate()[t4].apply(n3.toDate("s"), (r3 ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(e4)), n3);
+          }, y2 = this.$W, M3 = this.$M, m3 = this.$D, v2 = "set" + (this.$u ? "UTC" : "");
+          switch (f2) {
+            case h:
+              return r3 ? l2(1, 0) : l2(31, 11);
+            case c2:
+              return r3 ? l2(1, M3) : l2(0, M3 + 1);
+            case o:
+              var g2 = this.$locale().weekStart || 0, D2 = (y2 < g2 ? y2 + 7 : y2) - g2;
+              return l2(r3 ? m3 - D2 : m3 + (6 - D2), M3);
+            case a2:
+            case d:
+              return $2(v2 + "Hours", 0);
+            case u:
+              return $2(v2 + "Minutes", 1);
+            case s2:
+              return $2(v2 + "Seconds", 2);
+            case i:
+              return $2(v2 + "Milliseconds", 3);
+            default:
+              return this.clone();
+          }
+        }, m2.endOf = function(t3) {
+          return this.startOf(t3, false);
+        }, m2.$set = function(t3, e3) {
+          var n3, o2 = b.p(t3), f2 = "set" + (this.$u ? "UTC" : ""), l2 = (n3 = {}, n3[a2] = f2 + "Date", n3[d] = f2 + "Date", n3[c2] = f2 + "Month", n3[h] = f2 + "FullYear", n3[u] = f2 + "Hours", n3[s2] = f2 + "Minutes", n3[i] = f2 + "Seconds", n3[r2] = f2 + "Milliseconds", n3)[o2], $2 = o2 === a2 ? this.$D + (e3 - this.$W) : e3;
+          if (o2 === c2 || o2 === h) {
+            var y2 = this.clone().set(d, 1);
+            y2.$d[l2]($2), y2.init(), this.$d = y2.set(d, Math.min(this.$D, y2.daysInMonth())).$d;
+          } else
+            l2 && this.$d[l2]($2);
+          return this.init(), this;
+        }, m2.set = function(t3, e3) {
+          return this.clone().$set(t3, e3);
+        }, m2.get = function(t3) {
+          return this[b.p(t3)]();
+        }, m2.add = function(r3, f2) {
+          var d2, l2 = this;
+          r3 = Number(r3);
+          var $2 = b.p(f2), y2 = function(t3) {
+            var e3 = O(l2);
+            return b.w(e3.date(e3.date() + Math.round(t3 * r3)), l2);
+          };
+          if ($2 === c2)
+            return this.set(c2, this.$M + r3);
+          if ($2 === h)
+            return this.set(h, this.$y + r3);
+          if ($2 === a2)
+            return y2(1);
+          if ($2 === o)
+            return y2(7);
+          var M3 = (d2 = {}, d2[s2] = e2, d2[u] = n2, d2[i] = t2, d2)[$2] || 1, m3 = this.$d.getTime() + r3 * M3;
+          return b.w(m3, this);
+        }, m2.subtract = function(t3, e3) {
+          return this.add(-1 * t3, e3);
+        }, m2.format = function(t3) {
+          var e3 = this, n3 = this.$locale();
+          if (!this.isValid())
+            return n3.invalidDate || l;
+          var r3 = t3 || "YYYY-MM-DDTHH:mm:ssZ", i2 = b.z(this), s3 = this.$H, u2 = this.$m, a3 = this.$M, o2 = n3.weekdays, c3 = n3.months, f2 = n3.meridiem, h2 = function(t4, n4, i3, s4) {
+            return t4 && (t4[n4] || t4(e3, r3)) || i3[n4].slice(0, s4);
+          }, d2 = function(t4) {
+            return b.s(s3 % 12 || 12, t4, "0");
+          }, $2 = f2 || function(t4, e4, n4) {
+            var r4 = t4 < 12 ? "AM" : "PM";
+            return n4 ? r4.toLowerCase() : r4;
+          };
+          return r3.replace(y, function(t4, r4) {
+            return r4 || function(t5) {
+              switch (t5) {
+                case "YY":
+                  return String(e3.$y).slice(-2);
+                case "YYYY":
+                  return b.s(e3.$y, 4, "0");
+                case "M":
+                  return a3 + 1;
+                case "MM":
+                  return b.s(a3 + 1, 2, "0");
+                case "MMM":
+                  return h2(n3.monthsShort, a3, c3, 3);
+                case "MMMM":
+                  return h2(c3, a3);
+                case "D":
+                  return e3.$D;
+                case "DD":
+                  return b.s(e3.$D, 2, "0");
+                case "d":
+                  return String(e3.$W);
+                case "dd":
+                  return h2(n3.weekdaysMin, e3.$W, o2, 2);
+                case "ddd":
+                  return h2(n3.weekdaysShort, e3.$W, o2, 3);
+                case "dddd":
+                  return o2[e3.$W];
+                case "H":
+                  return String(s3);
+                case "HH":
+                  return b.s(s3, 2, "0");
+                case "h":
+                  return d2(1);
+                case "hh":
+                  return d2(2);
+                case "a":
+                  return $2(s3, u2, true);
+                case "A":
+                  return $2(s3, u2, false);
+                case "m":
+                  return String(u2);
+                case "mm":
+                  return b.s(u2, 2, "0");
+                case "s":
+                  return String(e3.$s);
+                case "ss":
+                  return b.s(e3.$s, 2, "0");
+                case "SSS":
+                  return b.s(e3.$ms, 3, "0");
+                case "Z":
+                  return i2;
+              }
+              return null;
+            }(t4) || i2.replace(":", "");
+          });
+        }, m2.utcOffset = function() {
+          return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
+        }, m2.diff = function(r3, d2, l2) {
+          var $2, y2 = this, M3 = b.p(d2), m3 = O(r3), v2 = (m3.utcOffset() - this.utcOffset()) * e2, g2 = this - m3, D2 = function() {
+            return b.m(y2, m3);
+          };
+          switch (M3) {
+            case h:
+              $2 = D2() / 12;
+              break;
+            case c2:
+              $2 = D2();
+              break;
+            case f:
+              $2 = D2() / 3;
+              break;
+            case o:
+              $2 = (g2 - v2) / 6048e5;
+              break;
+            case a2:
+              $2 = (g2 - v2) / 864e5;
+              break;
+            case u:
+              $2 = g2 / n2;
+              break;
+            case s2:
+              $2 = g2 / e2;
+              break;
+            case i:
+              $2 = g2 / t2;
+              break;
+            default:
+              $2 = g2;
+          }
+          return l2 ? $2 : b.a($2);
+        }, m2.daysInMonth = function() {
+          return this.endOf(c2).$D;
+        }, m2.$locale = function() {
+          return D[this.$L];
+        }, m2.locale = function(t3, e3) {
+          if (!t3)
+            return this.$L;
+          var n3 = this.clone(), r3 = w(t3, e3, true);
+          return r3 && (n3.$L = r3), n3;
+        }, m2.clone = function() {
+          return b.w(this.$d, this);
+        }, m2.toDate = function() {
+          return new Date(this.valueOf());
+        }, m2.toJSON = function() {
+          return this.isValid() ? this.toISOString() : null;
+        }, m2.toISOString = function() {
+          return this.$d.toISOString();
+        }, m2.toString = function() {
+          return this.$d.toUTCString();
+        }, M2;
+      }(), k = _.prototype;
+      return O.prototype = k, [["$ms", r2], ["$s", i], ["$m", s2], ["$H", u], ["$W", a2], ["$M", c2], ["$y", h], ["$D", d]].forEach(function(t3) {
+        k[t3[1]] = function(e3) {
+          return this.$g(e3, t3[0], t3[1]);
         };
-        switch (M3) {
-          case h:
-            $2 = D2() / 12;
-            break;
-          case c2:
-            $2 = D2();
-            break;
-          case f:
-            $2 = D2() / 3;
-            break;
-          case o:
-            $2 = (g2 - v2) / 6048e5;
-            break;
-          case a2:
-            $2 = (g2 - v2) / 864e5;
-            break;
-          case u:
-            $2 = g2 / n2;
-            break;
-          case s2:
-            $2 = g2 / e2;
-            break;
-          case i:
-            $2 = g2 / t2;
-            break;
-          default:
-            $2 = g2;
-        }
-        return l2 ? $2 : b.a($2);
-      }, m2.daysInMonth = function() {
-        return this.endOf(c2).$D;
-      }, m2.$locale = function() {
-        return D[this.$L];
-      }, m2.locale = function(t3, e3) {
-        if (!t3)
-          return this.$L;
-        var n3 = this.clone(), r3 = w(t3, e3, true);
-        return r3 && (n3.$L = r3), n3;
-      }, m2.clone = function() {
-        return b.w(this.$d, this);
-      }, m2.toDate = function() {
-        return new Date(this.valueOf());
-      }, m2.toJSON = function() {
-        return this.isValid() ? this.toISOString() : null;
-      }, m2.toISOString = function() {
-        return this.$d.toISOString();
-      }, m2.toString = function() {
-        return this.$d.toUTCString();
-      }, M2;
-    }(), k = _.prototype;
-    return O.prototype = k, [["$ms", r2], ["$s", i], ["$m", s2], ["$H", u], ["$W", a2], ["$M", c2], ["$y", h], ["$D", d]].forEach(function(t3) {
-      k[t3[1]] = function(e3) {
-        return this.$g(e3, t3[0], t3[1]);
-      };
-    }), O.extend = function(t3, e3) {
-      return t3.$i || (t3(e3, _, O), t3.$i = true), O;
-    }, O.locale = w, O.isDayjs = S, O.unix = function(t3) {
-      return O(1e3 * t3);
-    }, O.en = D[g], O.Ls = D, O.p = {}, O;
-  });
-})(dayjs_min);
-var dayjs_minExports = dayjs_min.exports;
+      }), O.extend = function(t3, e3) {
+        return t3.$i || (t3(e3, _, O), t3.$i = true), O;
+      }, O.locale = w, O.isDayjs = S, O.unix = function(t3) {
+        return O(1e3 * t3);
+      }, O.en = D[g], O.Ls = D, O.p = {}, O;
+    });
+  })(dayjs_min);
+  return dayjs_min.exports;
+}
+var dayjs_minExports = requireDayjs_min();
 const dayjs = /* @__PURE__ */ getDefaultExportFromCjs(dayjs_minExports);
 var zh = { exports: {} };
 (function(module, exports) {
   !function(e2, _) {
-    module.exports = _(dayjs_minExports);
+    module.exports = _(requireDayjs_min());
   }(commonjsGlobal, function(e2) {
     function _(e3) {
       return e3 && "object" == typeof e3 && "default" in e3 ? e3 : { default: e3 };
@@ -621,9 +628,9 @@ function nodesToString(children, i18nOptions) {
     } else if (typeof child === "object") {
       const {
         format: format2,
-        ...clone
+        ...clone2
       } = child;
-      const keys = Object.keys(clone);
+      const keys = Object.keys(clone2);
       if (keys.length === 1) {
         const value2 = format2 ? `${keys[0]}, ${format2}` : keys[0];
         stringNode += `{{${value2}}}`;
@@ -6326,15 +6333,15 @@ lodash.exports;
       function wrapperPlant(value2) {
         var result2, parent2 = this;
         while (parent2 instanceof baseLodash) {
-          var clone2 = wrapperClone(parent2);
-          clone2.__index__ = 0;
-          clone2.__values__ = undefined$1;
+          var clone3 = wrapperClone(parent2);
+          clone3.__index__ = 0;
+          clone3.__values__ = undefined$1;
           if (result2) {
-            previous.__wrapped__ = clone2;
+            previous.__wrapped__ = clone3;
           } else {
-            result2 = clone2;
+            result2 = clone3;
           }
-          var previous = clone2;
+          var previous = clone3;
           parent2 = parent2.__wrapped__;
         }
         previous.__wrapped__ = value2;
@@ -6769,7 +6776,7 @@ lodash.exports;
         var value2 = arguments[0];
         return isArray2(value2) ? value2 : [value2];
       }
-      function clone(value2) {
+      function clone2(value2) {
         return baseClone(value2, CLONE_SYMBOLS_FLAG);
       }
       function cloneWith(value2, customizer) {
@@ -7183,7 +7190,7 @@ lodash.exports;
       function set2(object2, path2, value2) {
         return object2 == null ? object2 : baseSet(object2, path2, value2);
       }
-      function setWith(object2, path2, value2, customizer) {
+      function setWith2(object2, path2, value2, customizer) {
         customizer = typeof customizer == "function" ? customizer : undefined$1;
         return object2 == null ? object2 : baseSet(object2, path2, value2, customizer);
       }
@@ -7844,7 +7851,7 @@ lodash.exports;
       lodash2.reverse = reverse;
       lodash2.sampleSize = sampleSize;
       lodash2.set = set2;
-      lodash2.setWith = setWith;
+      lodash2.setWith = setWith2;
       lodash2.shuffle = shuffle;
       lodash2.slice = slice;
       lodash2.sortBy = sortBy;
@@ -7901,7 +7908,7 @@ lodash.exports;
       lodash2.capitalize = capitalize;
       lodash2.ceil = ceil;
       lodash2.clamp = clamp;
-      lodash2.clone = clone;
+      lodash2.clone = clone2;
       lodash2.cloneDeep = cloneDeep2;
       lodash2.cloneDeepWith = cloneDeepWith;
       lodash2.cloneWith = cloneWith;
@@ -9884,21 +9891,25 @@ class ResourceModel {
 class IngressModel extends ResourceModel {
   constructor(_rawYaml, _globalStore) {
     super(_rawYaml, _globalStore);
-    __publicField(this, "flattenedRules", []);
     this._rawYaml = _rawYaml;
   }
-  async init() {
+  getFullPath(rule2, path2 = "", port2) {
+    if (!rule2.host) {
+      return path2 || "";
+    }
+    const hostValue = rule2.host || "";
+    const protocal = this._rawYaml.spec.tls ? "https://" : "http://";
+    const portText = port2 ? `:${port2}` : "";
+    return `${protocal}${hostValue}${portText}${path2}`;
+  }
+  getFlattenedRules(services) {
     var _a, _b, _c, _d;
-    const services = await this._globalStore.get("services", {
-      resourceBasePath: "/api/v1",
-      kind: "Service"
-    });
     const protocal = !!this._rawYaml.spec.tls ? "https" : "http";
-    const servicePort = (_c = (_b = (_a = services.items.find((s2) => {
+    const servicePort = (_c = (_b = (_a = services.find((s2) => {
       var _a2, _b2;
       return ((_a2 = s2.metadata) == null ? void 0 : _a2.name) === "contour-envoy" && ((_b2 = s2.spec) == null ? void 0 : _b2.type) === "NodePort";
     })) == null ? void 0 : _a.spec) == null ? void 0 : _b.ports) == null ? void 0 : _c.find((p) => p.name === protocal);
-    this.flattenedRules = ((_d = this._rawYaml.spec.rules) == null ? void 0 : _d.reduce((res, rule2) => {
+    return ((_d = this._rawYaml.spec.rules) == null ? void 0 : _d.reduce((res, rule2) => {
       var _a2;
       const paths = (_a2 = rule2.http) == null ? void 0 : _a2.paths.map((p) => {
         var _a3, _b2, _c2, _d2, _e, _f;
@@ -9914,15 +9925,6 @@ class IngressModel extends ResourceModel {
       return [...res, ...paths || []];
     }, [])) || [];
   }
-  getFullPath(rule2, path2 = "", port2) {
-    if (!rule2.host) {
-      return path2 || "";
-    }
-    const hostValue = rule2.host || "";
-    const protocal = this._rawYaml.spec.tls ? "https://" : "http://";
-    const portText = port2 ? `:${port2}` : "";
-    return `${protocal}${hostValue}${portText}${path2}`;
-  }
 }
 class NetworkPolicyModel extends ResourceModel {
   constructor(_rawYaml, _globalStore) {
@@ -11432,11 +11434,21 @@ var RESOURCE_GROUP = /* @__PURE__ */ ((RESOURCE_GROUP2) => {
   RESOURCE_GROUP2["PROJECT"] = "PROJECT";
   return RESOURCE_GROUP2;
 })(RESOURCE_GROUP || {});
+var FormContainerType = /* @__PURE__ */ ((FormContainerType2) => {
+  FormContainerType2["PAGE"] = "PAGE";
+  FormContainerType2["MODAL"] = "MODAL";
+  return FormContainerType2;
+})(FormContainerType || {});
 var FormType = /* @__PURE__ */ ((FormType2) => {
-  FormType2["PAGE"] = "PAGE";
-  FormType2["MODAL"] = "MODAL";
+  FormType2["YAML"] = "YAML";
+  FormType2["FORM"] = "FORM";
   return FormType2;
 })(FormType || {});
+var FormMode = /* @__PURE__ */ ((FormMode2) => {
+  FormMode2["FORM"] = "FORM";
+  FormMode2["YAML"] = "YAML";
+  return FormMode2;
+})(FormMode || {});
 function getInitialValues(config) {
   return config.initValue || {
     apiVersion: config.apiVersion,
@@ -11453,11 +11465,11 @@ function useOpenForm(options) {
   const pushModal = usePushModal();
   const go = useGo();
   return function openForm() {
-    var _a, _b, _c;
+    var _a, _b;
     if (resource == null ? void 0 : resource.name) {
       const config = configs[resource.name];
-      const formType = (_a = config.formConfig) == null ? void 0 : _a.formType;
-      if (formType === void 0 || formType === FormType.MODAL) {
+      const formType = (_a = config.formConfig) == null ? void 0 : _a.formContainerType;
+      if (formType === void 0 || formType === FormContainerType.MODAL) {
         pushModal({
           component: ((_b = config.formConfig) == null ? void 0 : _b.CustomFormModal) || FormModal,
           props: {
@@ -11465,8 +11477,7 @@ function useOpenForm(options) {
             id: options == null ? void 0 : options.id,
             formProps: {
               initialValues: getInitialValues(config)
-            },
-            renderForm: (options == null ? void 0 : options.renderForm) || ((_c = config.formConfig) == null ? void 0 : _c.renderForm)
+            }
           }
         });
       } else if (options == null ? void 0 : options.id) {
@@ -11514,12 +11525,13 @@ function K8sDropdown(props) {
     resource: resource == null ? void 0 : resource.name,
     action: AccessControlAuth.Delete
   });
+  const formType = ((_a = config.formConfig) == null ? void 0 : _a.formType) || FormType.FORM;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(
       Dropdown,
       {
         overlay: /* @__PURE__ */ jsxRuntimeExports.jsxs(Menu$1, { children: [
-          isInShowPage || (canEditData == null ? void 0 : canEditData.can) === false || config.hideEdit ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(Menu$1.Item, { onClick: openForm, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1, { src: EditPen16PrimaryIcon, children: ((_a = config.formConfig) == null ? void 0 : _a.fields) ? t2("dovetail.edit") : t2("dovetail.edit_yaml") }) }),
+          isInShowPage || (canEditData == null ? void 0 : canEditData.can) === false || config.hideEdit ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(Menu$1.Item, { onClick: openForm, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1, { src: EditPen16PrimaryIcon, children: formType === FormType.FORM ? t2("dovetail.edit") : t2("dovetail.edit_yaml") }) }),
           /* @__PURE__ */ jsxRuntimeExports.jsx(
             Menu$1.Item,
             {
@@ -11989,9 +12001,17 @@ const ResourceLink = (props) => {
 };
 const IngressRulesTable = ({ ingress }) => {
   const { t: t2 } = useTranslation();
+  const { data: serviceData } = useList({
+    resource: "services",
+    meta: {
+      kind: "Service",
+      apiVersion: "v1"
+    }
+  });
+  const flattenedRules = useMemo(() => (serviceData == null ? void 0 : serviceData.data) ? ingress.getFlattenedRules(serviceData == null ? void 0 : serviceData.data) : [], [serviceData == null ? void 0 : serviceData.data, ingress]);
   const rows = useMemo(() => {
-    return addId(ingress.flattenedRules || [], "fullPath");
-  }, [ingress.flattenedRules]);
+    return addId(flattenedRules || [], "fullPath");
+  }, [flattenedRules]);
   const component = useContext(ComponentContext);
   const Table2 = component.Table || Table$1;
   const currentSize = 10;
@@ -12377,7 +12397,7 @@ const ShowContent = (props) => {
               marginRight: 8
             },
             onClick: openForm,
-            children: ((_e = config.formConfig) == null ? void 0 : _e.fields) ? t2("dovetail.edit") : t2("dovetail.edit_yaml")
+            children: ((_e = config.formConfig) == null ? void 0 : _e.formType) === FormType.FORM ? t2("dovetail.edit") : t2("dovetail.edit_yaml")
           })
         }) : null, /* @__PURE__ */ jsxRuntimeExports.jsx(Dropdown2, {
           record,
@@ -20588,7 +20608,7 @@ var tinycolor = { exports: {} };
         }
         return formattedString || this.toHexString();
       },
-      clone: function clone() {
+      clone: function clone2() {
         return tinycolor2(this.toString());
       },
       _applyModification: function _applyModification(fn, args) {
@@ -36317,6 +36337,86 @@ function ResourceShow(props) {
     }
   );
 }
+function FormModeSegmentControl({
+  formConfig,
+  mode,
+  onChangeMode
+}) {
+  const { isDisabledChangeMode } = formConfig;
+  return !isDisabledChangeMode ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+    SegmentControl,
+    {
+      style: { fontWeight: "normal" },
+      value: mode,
+      options: [
+        {
+          value: FormMode.FORM,
+          label: i18n.t("dovetail.form")
+        },
+        {
+          value: FormMode.YAML,
+          label: i18n.t("dovetail.yaml")
+        }
+      ],
+      onChange: (val) => {
+        onChangeMode(val);
+      }
+    }
+  ) : null;
+}
+function immutableSet(obj, path2, value2) {
+  return setWith(clone(obj), path2, value2, clone);
+}
+function usePathMap(options) {
+  const { pathMap, transformInitValues, transformApplyValues } = options;
+  return {
+    /**
+     * Transforms initial values by mapping paths from source to target structure
+     * @param values Initial values to transform
+     * @returns Transformed values with updated paths
+     */
+    transformInitValues(values) {
+      const initValues = values._rawYaml || values;
+      let result = initValues;
+      for (const { from, to } of pathMap || []) {
+        result = immutableSet(initValues, to, get$3(initValues, from));
+        const fromPath = [...from];
+        const lastKey = fromPath.pop();
+        if (lastKey) {
+          const obj = get$3(result, fromPath);
+          if (obj && typeof obj === "object") {
+            delete obj[lastKey];
+          }
+        }
+      }
+      return (transformInitValues == null ? void 0 : transformInitValues(result)) || result;
+    },
+    /**
+     * Transforms values back to original structure before applying/saving
+     * @param values Values to transform back
+     * @returns Transformed values in original structure
+     */
+    transformApplyValues(values) {
+      let result = values;
+      for (const { from, to } of pathMap || []) {
+        result = immutableSet(
+          values,
+          from,
+          get$3(result, to)
+        );
+        const toPath = [...to];
+        const lastKey = toPath.pop();
+        if (lastKey) {
+          const obj = get$3(result, toPath);
+          if (obj && typeof obj === "object") {
+            delete obj[lastKey];
+          }
+        }
+      }
+      return (transformApplyValues == null ? void 0 : transformApplyValues(result)) || result;
+    }
+  };
+}
 var isCheckBoxInput = (element) => element.type === "checkbox";
 var isDateObject = (value2) => value2 instanceof Date;
 var isNullOrUndefined = (value2) => value2 == null;
@@ -37894,8 +37994,8 @@ function useForm$1(props = {}) {
   _formControl.current.formState = getProxyFormState(formState, control);
   return _formControl.current;
 }
-function useFieldsConfig(config, resourceId) {
-  var _a, _b, _c, _d;
+function useFieldsConfig(config, formConfig, resourceId) {
+  var _a, _b, _c;
   const action = resourceId ? "edit" : "create";
   const listQuery = useList({
     resource: config == null ? void 0 : config.name,
@@ -37909,40 +38009,91 @@ function useFieldsConfig(config, resourceId) {
     meta: { resourceBasePath: config == null ? void 0 : config.basePath, kind: config == null ? void 0 : config.kind },
     id: resourceId
   });
-  return (_d = (_a = config == null ? void 0 : config.formConfig) == null ? void 0 : _a.fields) == null ? void 0 : _d.call(_a, {
-    record: (_b = showQuery.queryResult.data) == null ? void 0 : _b.data,
-    records: ((_c = listQuery.data) == null ? void 0 : _c.data) || [],
+  return (_c = formConfig == null ? void 0 : formConfig.fields) == null ? void 0 : _c.call(formConfig, {
+    record: (_a = showQuery.queryResult.data) == null ? void 0 : _a.data,
+    records: ((_b = listQuery.data) == null ? void 0 : _b.data) || [],
     action
   });
 }
-const RefineFormContent_7gh3uw = "";
+const RefineFormContent_ahna8x = "";
+function renderCommonFormFiled(props) {
+  const {
+    field,
+    fieldConfig,
+    action
+  } = props;
+  const {
+    value: value2,
+    onChange,
+    onBlur,
+    name: name2
+  } = field;
+  let ele = /* @__PURE__ */ jsxRuntimeExports.jsx(Fields.String, {
+    placeholder: fieldConfig.placeholder,
+    input: {
+      value: value2,
+      onChange,
+      onBlur,
+      name: name2,
+      onFocus: () => null
+    },
+    meta: {}
+  });
+  switch (fieldConfig.type) {
+    case "number":
+      ele = /* @__PURE__ */ jsxRuntimeExports.jsx(Fields.Integer, {
+        className: "c154n7ie",
+        placeholder: fieldConfig.placeholder,
+        input: {
+          value: value2,
+          onChange,
+          onBlur,
+          name: name2,
+          onFocus: () => null
+        },
+        meta: {}
+      });
+  }
+  if (action === "edit" && fieldConfig.disabledWhenEdit) {
+    ele = /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+      children: value2
+    });
+  }
+  return ele;
+}
 const RefineFormContent = (props) => {
   const {
     config,
     formResult,
     resourceId,
-    errorMsgs
+    errorMsgs,
+    formConfig
   } = props;
   const {
     control,
-    getValues
+    getValues,
+    watch,
+    trigger
   } = formResult;
   const action = resourceId ? "edit" : "create";
-  const formFieldsConfig = useFieldsConfig(config, resourceId);
-  const fields = formFieldsConfig == null ? void 0 : formFieldsConfig.map((c2) => {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Controller, {
+  const formValues = watch();
+  const formFieldsConfig = useFieldsConfig(config, formConfig, resourceId);
+  const fields = formFieldsConfig == null ? void 0 : formFieldsConfig.map((fieldConfig) => {
+    var _a;
+    const isDisplay = ((_a = fieldConfig.condition) == null ? void 0 : _a.call(fieldConfig, formValues, get$3(formValues, fieldConfig.path.join(".")))) !== false;
+    return isDisplay ? /* @__PURE__ */ jsxRuntimeExports.jsx(Controller, {
       control,
-      name: c2.path.join("."),
+      name: fieldConfig.path.join("."),
       rules: {
         validate(value2) {
           const formValue = getValues();
-          if (!c2.validators || c2.validators.length === 0)
+          if (!fieldConfig.validators || fieldConfig.validators.length === 0)
             return true;
-          for (const func of c2.validators) {
+          for (const func of fieldConfig.validators) {
             const {
               isValid,
               errorMsg
-            } = func(value2, formValue);
+            } = func(value2, formValue, FormType.FORM);
             if (!isValid)
               return errorMsg;
           }
@@ -37950,79 +38101,42 @@ const RefineFormContent = (props) => {
         }
       },
       render: ({
-        field: {
-          onChange,
-          onBlur,
-          value: value2,
-          name: name2
-        },
+        field,
         fieldState
       }) => {
-        var _a, _b;
-        const formValue = getValues();
-        let ele = /* @__PURE__ */ jsxRuntimeExports.jsx(Fields.String, {
-          placeholder: c2.placeholder,
-          input: {
-            value: value2,
-            onChange,
-            onBlur,
-            name: name2,
-            onFocus: () => null
-          },
-          meta: {}
-        });
-        switch (c2.type) {
-          case "number":
-            ele = /* @__PURE__ */ jsxRuntimeExports.jsx(Fields.Integer, {
-              className: "c154n7ie",
-              placeholder: c2.placeholder,
-              input: {
-                value: value2,
-                onChange,
-                onBlur,
-                name: name2,
-                onFocus: () => null
-              },
-              meta: {}
-            });
-        }
-        if (action === "edit" && c2.disabledWhenEdit) {
-          ele = /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-            children: value2
-          });
-        }
-        if (c2 == null ? void 0 : c2.render) {
-          ele = c2.render(value2, onChange, formValue, onBlur, action, control);
-        }
-        if (c2.helperText) {
-          ele = /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
-            size: 4,
-            direction: "vertical",
-            className: "c1c9j4da",
-            children: [ele, /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: cx_default(Typo.Footnote.f2_regular, "cjxv8cf"),
-              children: c2.helperText
-            })]
-          });
+        var _a2;
+        const renderProps = {
+          field,
+          fieldConfig,
+          action,
+          control,
+          trigger
+        };
+        let ele = null;
+        if (fieldConfig == null ? void 0 : fieldConfig.render) {
+          ele = fieldConfig.render(renderProps);
+        } else {
+          ele = renderCommonFormFiled(renderProps);
         }
         return /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Item, {
-          label: c2.label,
+          label: fieldConfig.label,
           colon: false,
           labelCol: {
-            flex: `0 0 ${((_a = config == null ? void 0 : config.formConfig) == null ? void 0 : _a.labelWidth) || "216px"}`
+            flex: `0 0 ${(formConfig == null ? void 0 : formConfig.labelWidth) || "216px"}`
           },
-          help: (_b = fieldState.error) == null ? void 0 : _b.message,
+          help: (_a2 = fieldState.error) == null ? void 0 : _a2.message,
+          extra: fieldConfig.helperText,
           validateStatus: fieldState.invalid ? "error" : void 0,
-          "data-test-id": c2.key,
+          "data-test-id": fieldConfig.key,
           children: ele
-        }, c2.key);
+        }, fieldConfig.key);
       }
-    }, c2.key);
+    }, fieldConfig.key) : null;
   });
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
     direction: "vertical",
     size: 16,
-    className: "c1xsnuvk",
+    className: "c1c9j4da",
     children: [fields, /* @__PURE__ */ jsxRuntimeExports.jsx(FormErrorAlert, {
       errorMsgs: errorMsgs || [],
       style: {
@@ -38633,7 +38747,7 @@ const useForm = ({
     });
     return () => subscription.unsubscribe();
   }, [watch]);
-  const onValuesChange = (changeValues) => {
+  const onValuesChange = useCallback((changeValues) => {
     var _a;
     if (warnWhenUnsavedChanges) {
       setWarnWhen(true);
@@ -38647,20 +38761,22 @@ const useForm = ({
       return onFinishAutoSave(changeValues);
     }
     return changeValues;
-  };
-  const handleSubmit = (onValid, onInvalid) => async (e2) => {
+  }, [warnWhenUnsavedChanges, refineCoreProps == null ? void 0 : refineCoreProps.autoSave, setWarnWhen, onFinishAutoSave]);
+  const handleSubmit = useCallback((onValid, onInvalid) => async (e2) => {
     setWarnWhen(false);
     return handleSubmitReactHookForm(onValid, onInvalid)(e2);
-  };
-  const saveButtonProps = {
-    disabled: formLoading,
-    onClick: (e2) => {
-      handleSubmit(
-        (v) => onFinish(transformApplyValues ? transformApplyValues(v) : v),
-        () => false
-      )(e2);
-    }
-  };
+  }, [handleSubmitReactHookForm, setWarnWhen]);
+  const saveButtonProps = useMemo(() => {
+    return {
+      disabled: formLoading,
+      onClick: (e2) => {
+        handleSubmit(
+          (v) => onFinish(transformApplyValues ? transformApplyValues(v) : v),
+          () => false
+        )(e2);
+      }
+    };
+  }, [formLoading, handleSubmit, onFinish, transformApplyValues]);
   return {
     ...useHookFormResult,
     handleSubmit,
@@ -38669,8 +38785,12 @@ const useForm = ({
   };
 };
 const useRefineForm = (props) => {
-  var _a, _b, _c;
-  const { config, id, refineProps } = props;
+  const { formConfig, config, id, refineProps } = props;
+  const { transformInitValues, transformApplyValues } = usePathMap({
+    pathMap: formConfig == null ? void 0 : formConfig.pathMap,
+    transformInitValues: formConfig == null ? void 0 : formConfig.transformInitValues,
+    transformApplyValues: formConfig == null ? void 0 : formConfig.transformApplyValues
+  });
   const [responseErrorMsgs, setResponseErrorMsgs] = useState([]);
   const { i18n: i18n2 } = useTranslation();
   const result = useForm({
@@ -38679,14 +38799,14 @@ const useRefineForm = (props) => {
     refineCoreProps: {
       errorNotification: false,
       successNotification: () => {
-        var _a2;
+        var _a;
         const formValue = result.getValues();
         return {
           message: i18n2.t(
             id ? "dovetail.edit_resource_success" : "dovetail.create_success_toast",
             {
               kind: transformResourceKindInSentence(config.displayName || config.kind, i18n2.language),
-              name: (_a2 = formValue.metadata) == null ? void 0 : _a2.name,
+              name: (_a = formValue.metadata) == null ? void 0 : _a.name,
               interpolation: { escapeValue: false }
             }
           ).trim(),
@@ -38701,20 +38821,20 @@ const useRefineForm = (props) => {
       ...refineProps
     },
     defaultValues: config == null ? void 0 : config.initValue,
-    transformApplyValues: (_a = config.formConfig) == null ? void 0 : _a.transformApplyValues,
-    transformInitValues: (_b = config.formConfig) == null ? void 0 : _b.transformInitValues,
-    ...(_c = config.formConfig) == null ? void 0 : _c.useFormProps
+    transformApplyValues,
+    transformInitValues,
+    ...formConfig == null ? void 0 : formConfig.useFormProps
   });
   useEffect(() => {
-    var _a2, _b2;
-    const response = (_a2 = result.refineCore.mutationResult.error) == null ? void 0 : _a2.response;
+    var _a, _b;
+    const response = (_a = result.refineCore.mutationResult.error) == null ? void 0 : _a.response;
     if (response && !(response == null ? void 0 : response.bodyUsed)) {
-      (_b2 = response.json) == null ? void 0 : _b2.call(response).then((body) => {
-        var _a3, _b3;
-        setResponseErrorMsgs([].concat(((_b3 = (_a3 = config.formConfig) == null ? void 0 : _a3.formatError) == null ? void 0 : _b3.call(_a3, body)) || getCommonErrors(body, i18n2)));
+      (_b = response.json) == null ? void 0 : _b.call(response).then((body) => {
+        var _a2;
+        setResponseErrorMsgs([].concat(((_a2 = formConfig == null ? void 0 : formConfig.formatError) == null ? void 0 : _a2.call(formConfig, body)) || getCommonErrors(body, i18n2)));
       });
     }
-  }, [config.formConfig, result, i18n2]);
+  }, [formConfig, result, i18n2]);
   return { formResult: result, responseErrorMsgs };
 };
 const index_2ivb33 = "";
@@ -38725,7 +38845,7 @@ const Separator = () => {
   });
 };
 const MonacoYamlEditor = React__default.lazy(() => Promise.resolve().then(() => MonacoYamlEditor$2));
-const MonacoYamlDiffEditor = React__default.lazy(() => import("./MonacoYamlDiffEditor-286ba95e.js"));
+const MonacoYamlDiffEditor = React__default.lazy(() => import("./MonacoYamlDiffEditor-97cade84.js"));
 const YamlEditorComponent = forwardRef(
   function YamlEditorComponent2(props, ref) {
     const {
@@ -39099,7 +39219,6 @@ const useYamlForm = ({
   var _a;
   const editor = useRef(null);
   const { t: t2 } = useTranslation();
-  const [enableEditor, setEnableEditor] = useState(false);
   const [isYamlValid, setIsYamlValid] = useState(true);
   const [isSchemaValid, setIsSchemaValid] = useState(true);
   const [editorErrors, setEditorErrors] = useState([]);
@@ -39173,36 +39292,9 @@ const useYamlForm = ({
   const finalErrors = useMemo(() => {
     return uniq([...editorErrors, ...rulesErrors]);
   }, [editorErrors, rulesErrors]);
-  const onKeyUp = (event2) => {
-    if (submitOnEnter && event2.key === "Enter") {
-      form2.submit();
-    }
-  };
-  const onValuesChange = (changeValues) => {
-    if (changeValues && warnWhenUnsavedChanges) {
-      setWarnWhen(true);
-    }
-    return changeValues;
-  };
-  const validateYaml = (yamlValue) => {
-    const errorMap = {};
-    if (rules && isYamlValid && isSchemaValid) {
-      const formValue = yaml$2.load(yamlValue || "");
-      rules.forEach((rule2) => {
-        const { path: path2, validators } = rule2;
-        const value2 = get$3(formValue, path2);
-        for (const validator of validators || []) {
-          const { isValid, errorMsg } = validator(value2, formValue);
-          if (!isValid) {
-            errorMap[path2.join(".")] = `${errorMsg}(${path2.join(".")})`;
-            break;
-          }
-        }
-      });
-    }
-    setRulesErrors(uniq(Object.values(errorMap)));
-    return errorMap;
-  };
+  const schemas = useMemo(() => {
+    return schema ? [schema] : [];
+  }, [schema]);
   const saveButtonProps = useMemo(
     () => ({
       loading: formLoading,
@@ -39212,15 +39304,15 @@ const useYamlForm = ({
     }),
     [formLoading, form2]
   );
-  const schemas = useMemo(() => {
-    return schema ? [schema] : [];
-  }, [schema]);
+  const emptySchemas = useMemo(() => {
+    return [];
+  }, []);
   const editorProps = useMemo(() => {
     var _a2;
     return {
       ref: editor,
       defaultValue: schema && (editorOptions == null ? void 0 : editorOptions.isGenerateAnnotations) ? generateYamlBySchema(initialValues || {}, schema) : yaml$2.dump(initialValues),
-      schemas,
+      schemas: schemas || emptySchemas,
       id: ((_a2 = useResourceResult.resource) == null ? void 0 : _a2.name) || "",
       errorMsgs: finalErrors,
       onValidate(yamlValid, schemaValid) {
@@ -39242,6 +39334,7 @@ const useYamlForm = ({
     };
   }, [
     schema,
+    emptySchemas,
     editorOptions == null ? void 0 : editorOptions.isGenerateAnnotations,
     initialValues,
     schemas,
@@ -39250,6 +39343,36 @@ const useYamlForm = ({
     finalErrors,
     fold2
   ]);
+  const onKeyUp = (event2) => {
+    if (submitOnEnter && event2.key === "Enter") {
+      form2.submit();
+    }
+  };
+  const onValuesChange = (changeValues) => {
+    if (changeValues && warnWhenUnsavedChanges) {
+      setWarnWhen(true);
+    }
+    return changeValues;
+  };
+  const validateRules = (yamlValue) => {
+    const errorMap = {};
+    if (rules && isYamlValid && isSchemaValid) {
+      const formValue = yaml$2.load(yamlValue || "");
+      rules.forEach((rule2) => {
+        const { path: path2, validators } = rule2;
+        const value2 = get$3(formValue, path2);
+        for (const validator of validators || []) {
+          const { isValid, errorMsg } = validator(value2, formValue, FormType.YAML);
+          if (!isValid) {
+            errorMap[path2.join(".")] = `${errorMsg}(${path2.join(".")})`;
+            break;
+          }
+        }
+      });
+    }
+    setRulesErrors(uniq(Object.values(errorMap)));
+    return errorMap;
+  };
   return {
     form: formSF.form,
     formProps: {
@@ -39265,7 +39388,7 @@ const useYamlForm = ({
           setRulesErrors([]);
           return;
         }
-        const rulesErrors2 = validateYaml(((_a2 = editor.current) == null ? void 0 : _a2.getEditorValue()) || "");
+        const rulesErrors2 = validateRules(((_a2 = editor.current) == null ? void 0 : _a2.getEditorValue()) || "");
         if (Object.keys(rulesErrors2).length) {
           setRulesErrors(Object.values(rulesErrors2));
           return;
@@ -39291,26 +39414,12 @@ const useYamlForm = ({
     },
     saveButtonProps,
     ...useFormCoreResult,
-    editorProps,
-    enableEditor,
     errorResponseBody,
+    editorProps,
     schemas: schema ? [schema] : [],
     isLoadingSchema,
     loadSchemaError,
-    fetchSchema,
-    switchEditor() {
-      var _a2, _b;
-      if (enableEditor && ((_a2 = editor.current) == null ? void 0 : _a2.getEditorValue())) {
-        const value2 = yaml$2.load((_b = editor.current) == null ? void 0 : _b.getEditorValue());
-        form2 == null ? void 0 : form2.setFieldsValue(value2);
-      }
-      setEnableEditor(!enableEditor);
-    },
-    onFinish: async (values) => {
-      var _a2;
-      const finalValues = enableEditor ? yaml$2.load(((_a2 = editor.current) == null ? void 0 : _a2.getEditorValue()) || "") : values ?? formSF.form.getFieldsValue(true);
-      return await onFinish(finalValues);
-    }
+    fetchSchema
   };
 };
 const YamlForm_1lo4xcc = "";
@@ -39329,6 +39438,7 @@ function YamlForm(props) {
     schemaStrategy = "Optional",
     isShowLayout = true,
     useFormProps,
+    config,
     transformInitValues,
     transformApplyValues,
     onSaveButtonPropsChange,
@@ -39340,8 +39450,6 @@ function YamlForm(props) {
     resource
   } = useResource();
   const action = actionFromProps || actionFromResource;
-  const configs = useContext(ConfigsContext);
-  const config = configs[(resource == null ? void 0 : resource.name) || ""];
   const {
     t: t2,
     i18n: i18n2
@@ -39392,9 +39500,6 @@ function YamlForm(props) {
   const formWrapperProps = isShowLayout ? {
     saveButtonProps
   } : {};
-  const schemas = useMemo(() => {
-    return editorProps.schemas || [];
-  }, [editorProps.schemas]);
   const responseErrors = useMemo(() => errorResponseBody ? getCommonErrors(errorResponseBody, i18n2) : [], [errorResponseBody, i18n2]);
   const onFinish = useCallback(async (store) => {
     var _a, _b;
@@ -39437,7 +39542,6 @@ function YamlForm(props) {
             children: /* @__PURE__ */ jsxRuntimeExports.jsx(YamlEditorComponent, {
               ...editorProps,
               className: EditorStyle,
-              schemas,
               collapsable: false
             })
           }), /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Item, {
@@ -39457,6 +39561,172 @@ function YamlForm(props) {
     })
   });
 }
+function RefineFormContainer({
+  id,
+  config,
+  customYamlFormProps,
+  formConfig,
+  isYamlMode,
+  onSuccess,
+  onError,
+  onSaveButtonPropsChange
+}) {
+  const action = id ? "edit" : "create";
+  const fieldsConfig = useFieldsConfig(config, formConfig, id);
+  const refineFormResult = useRefineForm({
+    config,
+    id,
+    refineProps: {
+      onMutationSuccess: () => {
+        onSuccess == null ? void 0 : onSuccess();
+      },
+      onMutationError() {
+        onError == null ? void 0 : onError();
+      },
+      redirect: false,
+      ...formConfig == null ? void 0 : formConfig.refineCoreProps
+    },
+    formConfig
+  });
+  const {
+    transformApplyValues
+  } = usePathMap({
+    pathMap: formConfig == null ? void 0 : formConfig.pathMap,
+    transformInitValues: formConfig == null ? void 0 : formConfig.transformInitValues,
+    transformApplyValues: (formConfig == null ? void 0 : formConfig.transformApplyValues) || ((v) => v)
+  });
+  const yamlFormProps = useMemo(() => {
+    if (isYamlMode) {
+      return {
+        ...customYamlFormProps,
+        config,
+        transformInitValues: void 0,
+        transformApplyValues: void 0,
+        initialValuesForCreate: transformApplyValues(
+          refineFormResult.formResult.getValues()
+        ),
+        initialValuesForEdit: transformApplyValues(refineFormResult.formResult.getValues()),
+        id,
+        action,
+        isShowLayout: false,
+        useFormProps: {
+          redirect: false
+        },
+        rules: fieldsConfig == null ? void 0 : fieldsConfig.map((config2) => ({
+          path: config2.path,
+          validators: config2.validators
+        })),
+        onSaveButtonPropsChange,
+        onErrorsChange(errors) {
+          if (errors.length) {
+            onError == null ? void 0 : onError();
+          }
+        },
+        onFinish: onSuccess
+      };
+    }
+    return {
+      config
+    };
+  }, [
+    action,
+    isYamlMode,
+    customYamlFormProps,
+    fieldsConfig,
+    config,
+    id,
+    refineFormResult,
+    transformApplyValues,
+    onSaveButtonPropsChange,
+    onSuccess,
+    onError
+  ]);
+  useEffect(() => {
+    if (!isYamlMode) {
+      onSaveButtonPropsChange == null ? void 0 : onSaveButtonPropsChange(refineFormResult.formResult.saveButtonProps);
+    }
+  }, [isYamlMode, refineFormResult.formResult.saveButtonProps, onSaveButtonPropsChange]);
+  if (isYamlMode) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(YamlForm, { ...yamlFormProps });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+    !(formConfig == null ? void 0 : formConfig.isDisabledChangeMode) ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+      Alert,
+      {
+        type: "warning",
+        message: i18n.t("dovetail.change_form_mode_alert"),
+        style: { marginBottom: "16px" }
+      }
+    ) : void 0,
+    (formConfig == null ? void 0 : formConfig.renderForm) ? formConfig == null ? void 0 : formConfig.renderForm() : /* @__PURE__ */ jsxRuntimeExports.jsx(
+      RefineFormContent,
+      {
+        formResult: refineFormResult.formResult,
+        config,
+        formConfig,
+        errorMsgs: refineFormResult.responseErrorMsgs,
+        resourceId: id
+      }
+    )
+  ] });
+}
+function YamlFormContainer({
+  id,
+  customYamlFormProps,
+  config,
+  formConfig,
+  onSuccess,
+  onError,
+  onSaveButtonPropsChange
+}) {
+  const action = id ? "edit" : "create";
+  const {
+    transformInitValues,
+    transformApplyValues
+  } = usePathMap({
+    pathMap: formConfig == null ? void 0 : formConfig.pathMap,
+    transformInitValues: formConfig == null ? void 0 : formConfig.transformInitValues,
+    transformApplyValues: (formConfig == null ? void 0 : formConfig.transformApplyValues) || ((v) => v)
+  });
+  const yamlFormProps = useMemo(
+    () => {
+      return {
+        ...customYamlFormProps,
+        config,
+        transformInitValues,
+        transformApplyValues,
+        initialValuesForCreate: (customYamlFormProps == null ? void 0 : customYamlFormProps.initialValuesForCreate) || config.initValue,
+        initialValuesForEdit: void 0,
+        id,
+        action,
+        isShowLayout: false,
+        useFormProps: {
+          redirect: false
+        },
+        rules: void 0,
+        onSaveButtonPropsChange,
+        onErrorsChange(errors) {
+          if (errors.length) {
+            onError == null ? void 0 : onError();
+          }
+        },
+        onFinish: onSuccess
+      };
+    },
+    [
+      id,
+      action,
+      customYamlFormProps,
+      config,
+      transformInitValues,
+      transformApplyValues,
+      onSuccess,
+      onError,
+      onSaveButtonPropsChange
+    ]
+  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(YamlForm, { ...yamlFormProps });
+}
 const FormModal_64brhp = "";
 const FormDescStyle = "f1nltbcu";
 const ErrorStyle = "e1qgcca6";
@@ -39490,11 +39760,11 @@ function ConfirmModal({
   });
 }
 function FormModal(props) {
-  var _a, _b, _c, _d, _e, _f;
+  var _a, _b, _c;
   const {
     resource: resourceFromProps,
     id,
-    renderForm
+    yamlFormProps: customYamlFormProps
   } = props;
   const {
     i18n: i18n2
@@ -39503,74 +39773,17 @@ function FormModal(props) {
     resource
   } = useResource();
   const configs = useContext(ConfigsContext);
-  const [yamlSaveButtonProps, setYamlSaveButtonProps] = useState({});
+  const [saveButtonProps, setSaveButtonProps] = useState({});
   const [isError, setIsError] = useState(false);
-  const [mode, setMode] = useState(
-    "form"
-    /* Form */
-  );
-  const isYamlMode = mode === "yaml";
+  const [mode, setMode] = useState(FormMode.FORM);
+  const isYamlMode = mode === FormMode.YAML;
   const popModal = usePopModal();
   const pushModal = usePushModal();
   const config = configs[resourceFromProps || (resource == null ? void 0 : resource.name) || ""];
-  const isDisabledChangeMode = (_a = config.formConfig) == null ? void 0 : _a.isDisabledChangeMode;
+  const isDisabledChangeMode = config.formConfig && "isDisabledChangeMode" in config.formConfig && config.formConfig.isDisabledChangeMode;
   const okText = i18n2.t(id ? "dovetail.save" : "dovetail.create");
   const action = id ? "edit" : "create";
-  const fieldsConfig = useFieldsConfig(config, id);
-  const refineFormResult = useRefineForm({
-    config,
-    id,
-    refineProps: {
-      onMutationSuccess: () => {
-        popModal();
-      },
-      redirect: false,
-      ...(_b = config.formConfig) == null ? void 0 : _b.refineCoreProps
-    }
-  });
-  const yamlFormProps = useMemo(() => {
-    var _a2, _b2, _c2;
-    const transformApplyValues = ((_a2 = config.formConfig) == null ? void 0 : _a2.transformApplyValues) || ((v) => v);
-    return {
-      ...props.formProps,
-      transformInitValues: isYamlMode ? void 0 : (_b2 = config.formConfig) == null ? void 0 : _b2.transformInitValues,
-      transformApplyValues: isYamlMode ? void 0 : transformApplyValues,
-      initialValuesForCreate: isYamlMode ? transformApplyValues(refineFormResult.formResult.getValues()) : ((_c2 = props.formProps) == null ? void 0 : _c2.initialValuesForCreate) || (config == null ? void 0 : config.initValue),
-      initialValuesForEdit: isYamlMode ? transformApplyValues(refineFormResult.formResult.getValues()) : void 0,
-      id,
-      action,
-      isShowLayout: false,
-      useFormProps: {
-        redirect: false
-      },
-      rules: isYamlMode ? fieldsConfig == null ? void 0 : fieldsConfig.map((config2) => ({
-        path: config2.path,
-        validators: config2.validators
-      })) : void 0,
-      onSaveButtonPropsChange: setYamlSaveButtonProps,
-      onErrorsChange(errors) {
-        setIsError(!!errors.length);
-      },
-      onFinish: popModal
-    };
-  }, [props.formProps, (_c = config.formConfig) == null ? void 0 : _c.transformInitValues, (_d = config.formConfig) == null ? void 0 : _d.transformApplyValues, config == null ? void 0 : config.initValue, id, action, refineFormResult.formResult, isYamlMode, fieldsConfig, popModal]);
-  const isYamlForm = !((_e = config.formConfig) == null ? void 0 : _e.fields);
-  const formEle = (() => {
-    if (renderForm) {
-      return renderForm(yamlFormProps);
-    }
-    if (isYamlForm || isYamlMode)
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(YamlForm, {
-        ...yamlFormProps
-      });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(RefineFormContent, {
-      formResult: refineFormResult.formResult,
-      config,
-      errorMsgs: refineFormResult.responseErrorMsgs,
-      resourceId: id
-    });
-  })();
-  const saveButtonProps = isYamlForm || isYamlMode ? yamlSaveButtonProps : refineFormResult.formResult.saveButtonProps;
+  const isYamlForm = ((_a = config.formConfig) == null ? void 0 : _a.formType) === FormType.YAML;
   const onCancel = useCallback(() => {
     popModal();
   }, [popModal]);
@@ -39580,15 +39793,12 @@ function FormModal(props) {
     (_a2 = saveButtonProps.onClick) == null ? void 0 : _a2.call(saveButtonProps, e2);
   }, [saveButtonProps]);
   const onChangeMode = useCallback((value2) => {
-    if (value2 === "form") {
+    if (value2 === FormMode.FORM) {
       pushModal({
         component: ConfirmModal,
         props: {
           onOk: () => {
-            setMode(
-              "form"
-              /* Form */
-            );
+            setMode(FormMode.FORM);
           }
         }
       });
@@ -39596,17 +39806,18 @@ function FormModal(props) {
       setMode(value2);
     }
   }, [pushModal]);
-  const errorText = (() => {
-    if (!!refineFormResult.responseErrorMsgs.length || isError) {
+  const errorText = useMemo(() => {
+    if (isError) {
       return i18n2.t(id ? "dovetail.save_failed" : "dovetail.create_failed");
     }
-  })();
+    return "";
+  }, [isError, id, i18n2]);
   const title = useMemo(() => {
-    var _a2, _b2, _c2, _d2;
+    var _a2, _b2, _c2, _d;
     if (typeof ((_a2 = config.formConfig) == null ? void 0 : _a2.formTitle) === "string")
       return (_b2 = config.formConfig) == null ? void 0 : _b2.formTitle;
     if (typeof ((_c2 = config.formConfig) == null ? void 0 : _c2.formTitle) === "function") {
-      return (_d2 = config.formConfig) == null ? void 0 : _d2.formTitle(action);
+      return (_d = config.formConfig) == null ? void 0 : _d.formTitle(action);
     }
     const label2 = config.displayName || (config == null ? void 0 : config.kind);
     return i18n2.t(id ? "dovetail.edit_resource" : "dovetail.create_resource", {
@@ -39614,14 +39825,41 @@ function FormModal(props) {
     });
   }, [action, config.formConfig, config.displayName, config == null ? void 0 : config.kind, i18n2, id]);
   const desc = useMemo(() => {
-    var _a2, _b2, _c2, _d2;
+    var _a2, _b2, _c2, _d;
     if (typeof ((_a2 = config.formConfig) == null ? void 0 : _a2.formDesc) === "string")
       return (_b2 = config.formConfig) == null ? void 0 : _b2.formDesc;
     if (typeof ((_c2 = config.formConfig) == null ? void 0 : _c2.formDesc) === "function") {
-      return (_d2 = config.formConfig) == null ? void 0 : _d2.formDesc(action);
+      return (_d = config.formConfig) == null ? void 0 : _d.formDesc(action);
     }
     return "";
   }, [action, config.formConfig]);
+  const formEle = useMemo(() => {
+    var _a2;
+    const commonFormProps = {
+      id,
+      config,
+      customYamlFormProps,
+      onSaveButtonPropsChange: setSaveButtonProps,
+      onError: () => {
+        setIsError(true);
+      },
+      onSuccess: () => {
+        setIsError(false);
+        popModal();
+      }
+    };
+    if (config.formConfig && (((_a2 = config.formConfig) == null ? void 0 : _a2.formType) === FormType.FORM || "fields" in config.formConfig)) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(RefineFormContainer, {
+        ...commonFormProps,
+        isYamlMode,
+        formConfig: config.formConfig
+      });
+    }
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(YamlFormContainer, {
+      ...commonFormProps,
+      formConfig: config.formConfig
+    });
+  }, [id, customYamlFormProps, config, isYamlMode, popModal, setSaveButtonProps]);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Modal, {
     className: cx_default(FullscreenModalStyle),
     style: {
@@ -39632,21 +39870,10 @@ function FormModal(props) {
       className: TitleWrapperStyle,
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
         children: title
-      }), !(isYamlForm || isDisabledChangeMode) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentControl, {
-        style: {
-          fontWeight: "normal"
-        },
-        value: mode,
-        options: [{
-          value: "form",
-          label: i18n2.t("dovetail.form")
-        }, {
-          value: "yaml",
-          label: i18n2.t("dovetail.yaml")
-        }],
-        onChange: (val) => {
-          onChangeMode(val);
-        }
+      }), ((_b = config.formConfig) == null ? void 0 : _b.formType) === FormType.FORM ? /* @__PURE__ */ jsxRuntimeExports.jsx(FormModeSegmentControl, {
+        formConfig: config.formConfig,
+        mode,
+        onChangeMode
       }) : null]
     }),
     error: errorText ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
@@ -39655,7 +39882,7 @@ function FormModal(props) {
     }) : "",
     okButtonProps: {
       ...saveButtonProps,
-      children: (_f = config.formConfig) == null ? void 0 : _f.saveButtonText,
+      children: (_c = config.formConfig) == null ? void 0 : _c.saveButtonText,
       onClick: onOk
     },
     closeIcon: /* @__PURE__ */ jsxRuntimeExports.jsx(CloseCircleFilled$1, {}),
@@ -39666,12 +39893,6 @@ function FormModal(props) {
     children: [desc ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
       className: FormDescStyle,
       children: desc
-    }) : void 0, !isYamlForm && mode === "form" && !isDisabledChangeMode ? /* @__PURE__ */ jsxRuntimeExports.jsx(Alert, {
-      type: "warning",
-      message: i18n2.t("dovetail.change_form_mode_alert"),
-      style: {
-        marginBottom: "16px"
-      }
     }) : void 0, formEle]
   });
 }
@@ -39726,10 +39947,11 @@ function ResourceForm(props) {
     return {
       initialValues: getInitialValues(config),
       transformInitValues: (_a2 = config.formConfig) == null ? void 0 : _a2.transformInitValues,
-      transformApplyValues: (_b = config.formConfig) == null ? void 0 : _b.transformApplyValues
+      transformApplyValues: (_b = config.formConfig) == null ? void 0 : _b.transformApplyValues,
+      config
     };
   }, [config]);
-  if ((_a = config.formConfig) == null ? void 0 : _a.fields) {
+  if (((_a = config.formConfig) == null ? void 0 : _a.formType) === FormType.FORM) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(RefineFormPage, { config });
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsx(YamlForm, { ...formProps });
@@ -39742,7 +39964,7 @@ function ResourceCRUD(props) {
       /* @__PURE__ */ jsxRuntimeExports.jsx(Route, { path: `${urlPrefix}/${config.name}`, exact: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ResourceList, { config }) }),
       !config.noShow ? /* @__PURE__ */ jsxRuntimeExports.jsx(Route, { path: `${urlPrefix}/${config.name}/show`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ResourceShow, { config }) }) : null,
       // the modals would render in ModalStack
-      ((_a = config.formConfig) == null ? void 0 : _a.formType) === FormType.PAGE ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+      ((_a = config.formConfig) == null ? void 0 : _a.formContainerType) === FormContainerType.PAGE ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(Route, { path: `${urlPrefix}/${config.name}/create`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ResourceForm, { config }) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(Route, { path: `${urlPrefix}/${config.name}/edit`, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ResourceForm, { config }) })
       ] }) : null
@@ -40229,7 +40451,15 @@ function ResourceSelect(props) {
   );
 }
 const IngressRulesComponent = ({ ingress }) => {
-  const result = ingress.flattenedRules.map((r2) => {
+  const { data: serviceData } = useList({
+    resource: "services",
+    meta: {
+      kind: "Service",
+      apiVersion: "v1"
+    }
+  });
+  const flattenedRules = (serviceData == null ? void 0 : serviceData.data) ? ingress.getFlattenedRules(serviceData == null ? void 0 : serviceData.data) : [];
+  const result = flattenedRules.map((r2) => {
     const divider = " > ";
     return /* @__PURE__ */ jsxRuntimeExports.jsx(
       OverflowTooltip,
@@ -41319,7 +41549,7 @@ export {
   CronjobJobsTable as ay,
   KeyValue as az,
   useSchema as b,
-  PodLog as b$,
+  TextTags as b$,
   PodSelectorField as b0,
   PortsTableField as b1,
   DurationField as b2,
@@ -41348,15 +41578,15 @@ export {
   useNamespacesFilter as bP,
   NamespacesFilter as bQ,
   FormModal as bR,
-  RefineFormContent as bS,
-  RefineFormPage as bT,
-  SchemaStrategy as bU,
-  YamlForm as bV,
-  useRefineForm as bW,
-  ServiceInClusterAccessComponent as bX,
-  ServiceOutClusterAccessComponent as bY,
-  Tags as bZ,
-  TextTags as b_,
+  renderCommonFormFiled as bS,
+  RefineFormContent as bT,
+  RefineFormPage as bU,
+  SchemaStrategy as bV,
+  YamlForm as bW,
+  useRefineForm as bX,
+  ServiceInClusterAccessComponent as bY,
+  ServiceOutClusterAccessComponent as bZ,
+  Tags as b_,
   PVVolumeModeField as ba,
   PVAccessModeField as bb,
   PVCPodsField as bc,
@@ -41384,83 +41614,86 @@ export {
   NetworkPolicyIngressRulesGroup as by,
   NetworkPolicyEgressRulesGroup as bz,
   useDeleteModal as c,
-  StorageClassModel as c$,
-  NetworkPolicyRulesViewer as c0,
-  PVVolumeModeDisplay as c1,
-  Tabs as c2,
-  ResourceSelect as c3,
-  SocketStatus as c4,
-  Shell as c5,
-  PodShellModal as c6,
-  PodShell as c7,
-  ResourceTable as c8,
-  ErrorWrapper as c9,
-  PV_INIT_VALUE as cA,
-  PVC_INIT_VALUE as cB,
-  ResourceState as cC,
-  AccessControlAuth as cD,
-  Dovetail as cE,
-  RESOURCE_GROUP as cF,
-  FormType as cG,
-  ComponentContext as cH,
-  GlobalStoreContext as cI,
-  ConfigsContext as cJ,
-  IngressModel as cK,
-  NetworkPolicyModel as cL,
-  JobModel as cM,
-  WorkloadModel as cN,
-  WorkloadBaseModel as cO,
-  PodModel as cP,
-  PodMetricsModel as cQ,
-  ResourceModel as cR,
-  CronJobModel as cS,
-  EventModel as cT,
-  DeploymentModel as cU,
-  DaemonSetModel as cV,
-  StatefulSetModel as cW,
-  ServiceTypeEnum as cX,
-  ServiceModel as cY,
-  NodeRole as cZ,
-  NodeModel as c_,
-  ErrorContentType as ca,
-  BASE_INIT_VALUE as cb,
-  DEPLOYMENT_INIT_VALUE as cc,
-  CRONJOB_INIT_VALUE as cd,
-  DAEMONSET_INIT_VALUE as ce,
-  JOB_INIT_VALUE as cf,
-  STATEFULSET_INIT_VALUE as cg,
-  POD_INIT_VALUE as ch,
-  SERVICE_CLUSTER_IP_INIT_VALUE as ci,
-  SERVICE_NODE_PORT_INIT_VALUE as cj,
-  SERVICE_LOAD_BALANCER_INIT_VALUE as ck,
-  SERVICE_EXTERNAL_NAME_INIT_VALUE as cl,
-  SERVICE_HEADLESS_INIT_VALUE as cm,
-  INGRESS_INIT_VALUE as cn,
-  NETWORK_POLICY_INIT_VALUE as co,
-  CONFIG_MAP_INIT_VALUE as cp,
-  SERVER_INSTANCE_INIT_VALUE as cq,
-  REDEPLOY_TIMESTAMP_KEY as cr,
-  SECRET_OPAQUE_INIT_VALUE as cs,
-  SECRET_IMAGE_REPO_INIT_VALUE as ct,
-  SECRET_BASIC_AUTH_INIT_VALUE as cu,
-  SECRET_SSH_AUTH_INIT_VALUE as cv,
-  SECRET_TLS_INIT_VALUE as cw,
-  SECRET_CUSTOM_INIT_VALUE as cx,
-  NODE_INIT_VALUE as cy,
-  STORAGE_CLASS_INIT_VALUE as cz,
+  ServiceModel as c$,
+  PodLog as c0,
+  NetworkPolicyRulesViewer as c1,
+  PVVolumeModeDisplay as c2,
+  Tabs as c3,
+  ResourceSelect as c4,
+  SocketStatus as c5,
+  Shell as c6,
+  PodShellModal as c7,
+  PodShell as c8,
+  ResourceTable as c9,
+  STORAGE_CLASS_INIT_VALUE as cA,
+  PV_INIT_VALUE as cB,
+  PVC_INIT_VALUE as cC,
+  ResourceState as cD,
+  AccessControlAuth as cE,
+  Dovetail as cF,
+  RESOURCE_GROUP as cG,
+  FormContainerType as cH,
+  FormType as cI,
+  FormMode as cJ,
+  ComponentContext as cK,
+  GlobalStoreContext as cL,
+  ConfigsContext as cM,
+  IngressModel as cN,
+  NetworkPolicyModel as cO,
+  JobModel as cP,
+  WorkloadModel as cQ,
+  WorkloadBaseModel as cR,
+  PodModel as cS,
+  PodMetricsModel as cT,
+  ResourceModel as cU,
+  CronJobModel as cV,
+  EventModel as cW,
+  DeploymentModel as cX,
+  DaemonSetModel as cY,
+  StatefulSetModel as cZ,
+  ServiceTypeEnum as c_,
+  ErrorWrapper as ca,
+  ErrorContentType as cb,
+  BASE_INIT_VALUE as cc,
+  DEPLOYMENT_INIT_VALUE as cd,
+  CRONJOB_INIT_VALUE as ce,
+  DAEMONSET_INIT_VALUE as cf,
+  JOB_INIT_VALUE as cg,
+  STATEFULSET_INIT_VALUE as ch,
+  POD_INIT_VALUE as ci,
+  SERVICE_CLUSTER_IP_INIT_VALUE as cj,
+  SERVICE_NODE_PORT_INIT_VALUE as ck,
+  SERVICE_LOAD_BALANCER_INIT_VALUE as cl,
+  SERVICE_EXTERNAL_NAME_INIT_VALUE as cm,
+  SERVICE_HEADLESS_INIT_VALUE as cn,
+  INGRESS_INIT_VALUE as co,
+  NETWORK_POLICY_INIT_VALUE as cp,
+  CONFIG_MAP_INIT_VALUE as cq,
+  SERVER_INSTANCE_INIT_VALUE as cr,
+  REDEPLOY_TIMESTAMP_KEY as cs,
+  SECRET_OPAQUE_INIT_VALUE as ct,
+  SECRET_IMAGE_REPO_INIT_VALUE as cu,
+  SECRET_BASIC_AUTH_INIT_VALUE as cv,
+  SECRET_SSH_AUTH_INIT_VALUE as cw,
+  SECRET_TLS_INIT_VALUE as cx,
+  SECRET_CUSTOM_INIT_VALUE as cy,
+  NODE_INIT_VALUE as cz,
   dovetailRefineI18n as d,
-  PersistentVolumeModel as d0,
-  PersistentVolumeClaimModel as d1,
-  ProviderPlugins as d2,
-  ModelPlugin as d3,
-  modelPlugin as d4,
-  RelationPlugin as d5,
-  relationPlugin as d6,
-  generateValueFromSchema as d7,
-  generateSchemaTypeValue as d8,
-  resolveRef as d9,
-  getApiVersion as da,
-  pruneBeforeEdit as db,
+  NodeRole as d0,
+  NodeModel as d1,
+  StorageClassModel as d2,
+  PersistentVolumeModel as d3,
+  PersistentVolumeClaimModel as d4,
+  ProviderPlugins as d5,
+  ModelPlugin as d6,
+  modelPlugin as d7,
+  RelationPlugin as d8,
+  relationPlugin as d9,
+  generateValueFromSchema as da,
+  generateSchemaTypeValue as db,
+  resolveRef as dc,
+  getApiVersion as dd,
+  pruneBeforeEdit as de,
   useFailedModal as e,
   NameSpaceColumnRenderer as f,
   WorkloadRestartsColumnRenderer as g,