@dovetail-v2/refine 0.3.14 → 0.3.16-alpha.0

package/dist/components/Form/YamlForm.d.ts

@@ -23,6 +23,7 @@ export interface YamlFormProps<Model extends ResourceModel = ResourceModel> {
     rules?: YamlFormRule[];
     transformInitValues?: (values: Record<string, unknown>) => Record<string, unknown>;
     transformApplyValues?: (values: Unstructured) => Unstructured;
+    beforeSubmit?: (values: Unstructured, setErrors: (errors: string[]) => void) => Promise<Unstructured>;
     onSaveButtonPropsChange?: (saveButtonProps: {
         disabled?: boolean;
         onClick: () => void;

package/dist/components/Form/useReactHookForm.d.ts

@@ -9,6 +9,7 @@ export type UseFormReturnType<TQueryFnData extends BaseRecord = BaseRecord, TErr
         disabled: boolean;
         onClick: (e: React.BaseSyntheticEvent) => void;
     };
+    beforeSubmitErrors: string[];
 };
 export type UseFormProps<TQueryFnData extends BaseRecord = BaseRecord, TError extends HttpError = HttpError, TVariables extends FieldValues = FieldValues, TContext extends object = object, TData extends BaseRecord = TQueryFnData, TResponse extends BaseRecord = TData, TResponseError extends HttpError = TError> = {
     /**
@@ -29,5 +30,7 @@ export type UseFormProps<TQueryFnData extends BaseRecord = BaseRecord, TError ex
     disableServerSideValidation?: boolean;
     transformApplyValues?: (values: TVariables) => TVariables;
     transformInitValues?: (values: Record<string, unknown>) => DefaultValues<TVariables>;
+    beforeSubmit?: (values: TVariables, setErrors: (errors: string[]) => void) => Promise<TVariables>;
+    onBeforeSubmitError?: (errors: string[]) => void;
 } & UseHookFormProps<TVariables, TContext>;
-export declare const useForm: <TQueryFnData extends BaseRecord = BaseRecord, TError extends HttpError = HttpError, TVariables extends FieldValues = FieldValues, TContext extends object = object, TData extends BaseRecord = TQueryFnData, TResponse extends BaseRecord = TData, TResponseError extends HttpError = TError>({ refineCoreProps, warnWhenUnsavedChanges: warnWhenUnsavedChangesProp, disableServerSideValidation: disableServerSideValidationProp, transformApplyValues, transformInitValues, ...rest }?: UseFormProps<TQueryFnData, TError, TVariables, TContext, TData, TResponse, TResponseError>) => UseFormReturnType<TQueryFnData, TError, TVariables, TContext, TData, TResponse, TResponseError>;
+export declare const useForm: <TQueryFnData extends BaseRecord = BaseRecord, TError extends HttpError = HttpError, TVariables extends FieldValues = FieldValues, TContext extends object = object, TData extends BaseRecord = TQueryFnData, TResponse extends BaseRecord = TData, TResponseError extends HttpError = TError>({ refineCoreProps, warnWhenUnsavedChanges: warnWhenUnsavedChangesProp, disableServerSideValidation: disableServerSideValidationProp, transformApplyValues, transformInitValues, beforeSubmit, onBeforeSubmitError, ...rest }?: UseFormProps<TQueryFnData, TError, TVariables, TContext, TData, TResponse, TResponseError>) => UseFormReturnType<TQueryFnData, TError, TVariables, TContext, TData, TResponse, TResponseError>;

package/dist/components/Form/useRefineForm.d.ts

@@ -2,6 +2,7 @@ import { CommonFormConfig, RefineFormConfig, ResourceConfig } from '../../types'
 import { UseFormProps } from './useReactHookForm';
 interface UseRefineFormOptions {
     initialValues?: Record<string, unknown>;
+    onBeforeSubmitError?: (errors: string[]) => void;
 }
 export declare const useRefineForm: (props: {
     formConfig?: RefineFormConfig & CommonFormConfig;
@@ -14,5 +15,6 @@ export declare const useRefineForm: (props: {
         [x: string]: any;
     }, {}, import("@refinedev/core").BaseRecord, import("@refinedev/core").BaseRecord, import("@refinedev/core").HttpError>;
     responseErrorMsgs: string[];
+    beforeSubmitErrors: string[];
 };
 export {};

package/dist/components/Form/useYamlForm.d.ts

@@ -27,6 +27,8 @@ export type UseFormProps<TQueryFnData extends BaseRecord = BaseRecord, TError ex
     initialValuesForEdit?: Record<string, unknown>;
     transformInitValues?: (values: Record<string, unknown>) => Record<string, unknown>;
     transformApplyValues?: (values: Unstructured) => Unstructured;
+    beforeSubmit?: (values: Unstructured, setErrors: (errors: string[]) => void) => Promise<Unstructured>;
+    onBeforeSubmitError?: (errors: string[]) => void;
     rules?: YamlFormRule[];
 };
 export type UseFormReturnType<TQueryFnData extends BaseRecord = BaseRecord, TError extends HttpError = HttpError, TVariables extends object = object, TData extends BaseRecord = TQueryFnData, TResponse extends BaseRecord = TData, TResponseError extends HttpError = TError> = UseFormReturnTypeCore<TQueryFnData, TError, TVariables, TData, TResponse, TResponseError> & {
@@ -43,6 +45,7 @@ export type UseFormReturnType<TQueryFnData extends BaseRecord = BaseRecord, TErr
     loadSchemaError: Error | null;
     fetchSchema: () => void;
     errorResponseBody?: Record<string, unknown> | null;
+    beforeSubmitErrors: string[];
 };
 declare const useYamlForm: <TQueryFnData extends Unstructured = Unstructured & {
     id: string;
@@ -50,5 +53,5 @@ declare const useYamlForm: <TQueryFnData extends Unstructured = Unstructured & {
     [prop: string]: unknown;
 } = {
     [prop: string]: unknown;
-}, TData extends Unstructured = TQueryFnData, TResponse extends BaseRecord = TData, TResponseError extends HttpError = TError>({ action: actionFromProps, resource, onMutationSuccess: onMutationSuccessProp, onMutationError, submitOnEnter, warnWhenUnsavedChanges: warnWhenUnsavedChangesProp, redirect, successNotification, errorNotification, meta, metaData, queryMeta, mutationMeta, liveMode, liveParams, mutationMode, dataProviderName, onLiveEvent, invalidates, undoableTimeout, queryOptions, createMutationOptions, updateMutationOptions, id: idFromProps, overtimeOptions, editorOptions, initialValuesForCreate, initialValuesForEdit, transformInitValues, transformApplyValues, rules, }?: UseFormProps<TQueryFnData, TError, TVariables, TData, TResponse, TResponseError>) => UseFormReturnType<TQueryFnData, TError, TVariables, TData, TResponse, TResponseError>;
+}, TData extends Unstructured = TQueryFnData, TResponse extends BaseRecord = TData, TResponseError extends HttpError = TError>({ action: actionFromProps, resource, onMutationSuccess: onMutationSuccessProp, onMutationError, submitOnEnter, warnWhenUnsavedChanges: warnWhenUnsavedChangesProp, redirect, successNotification, errorNotification, meta, metaData, queryMeta, mutationMeta, liveMode, liveParams, mutationMode, dataProviderName, onLiveEvent, invalidates, undoableTimeout, queryOptions, createMutationOptions, updateMutationOptions, id: idFromProps, overtimeOptions, editorOptions, initialValuesForCreate, initialValuesForEdit, transformInitValues, transformApplyValues, beforeSubmit, onBeforeSubmitError, rules, }?: UseFormProps<TQueryFnData, TError, TVariables, TData, TResponse, TResponseError>) => UseFormReturnType<TQueryFnData, TError, TVariables, TData, TResponse, TResponseError>;
 export default useYamlForm;

package/dist/refine.cjs

@@ -10729,7 +10729,12 @@ function validateLabelValue(value2, i18n2, isOptional) {
   if (isOptional && value2 === "") {
     return { isValid: true };
   } else if (value2 === "") {
-    return { isValid: false, errorMessage: i18n2.t("dovetail.required_field", { label: i18n2.t("dovetail.value") }) };
+    return {
+      isValid: false,
+      errorMessage: i18n2.t("dovetail.required_field", {
+        label: i18n2.t("dovetail.value")
+      })
+    };
   }
   if (value2.length > 63) {
     return { isValid: false };
@@ -10766,7 +10771,7 @@ function validatePort(port2, options) {
   return { isValid: true };
 }
 function validateNodePort(nodePort, allNodePorts, i18n2) {
-  if (!nodePort) {
+  if (nodePort === "") {
     return {
       isValid: false,
       errorMessage: i18n2.t("dovetail.required_field", {
@@ -11846,7 +11851,7 @@ function _KeyValueTableForm(props, ref) {
       },
       disableBatchFilling: true,
       hideEmptyTable: true
-    }), isHideLabelFormatPopover ? null : /* @__PURE__ */ common.jsxRuntimeExports.jsx(LabelFormatPopover, {
+    }), isHideLabelFormatPopover || _value.length === 0 ? null : /* @__PURE__ */ common.jsxRuntimeExports.jsx(LabelFormatPopover, {
       noValueValidation
     })]
   });
@@ -15490,6 +15495,8 @@ const useForm = ({
   disableServerSideValidation: disableServerSideValidationProp = false,
   transformApplyValues,
   transformInitValues,
+  beforeSubmit,
+  onBeforeSubmitError,
   ...rest
 } = {}) => {
   const { options } = core.useRefineContext();
@@ -15502,6 +15509,8 @@ const useForm = ({
     defaultValues: transformInitValues && typeof rest.defaultValues === "object" ? transformInitValues(rest.defaultValues) : rest.defaultValues
   });
   const [transformedInitValues, setTransformedInitValues] = React.useState(useHookFormResult.getValues());
+  const [beforeSubmitErrors, setBeforeSubmitErrors] = React.useState([]);
+  const [isBeforeSubmitLoading, setIsBeforeSubmitLoading] = React.useState(false);
   const {
     watch,
     setValue,
@@ -15605,20 +15614,55 @@ const useForm = ({
   const saveButtonProps = React.useMemo(() => {
     return {
       disabled: formLoading,
-      onClick: (e2) => {
+      loading: formLoading || isBeforeSubmitLoading,
+      onClick: async (e2) => {
+        setBeforeSubmitErrors([]);
         handleSubmit(
-          (v) => onFinish(transformApplyValues ? transformApplyValues(v) : v),
+          async (v) => {
+            let finalValues = transformApplyValues ? transformApplyValues(v) : v;
+            if (beforeSubmit) {
+              try {
+                setIsBeforeSubmitLoading(true);
+                let hasErrors = false;
+                const result = await beforeSubmit(finalValues, (errors) => {
+                  if (errors && errors.length > 0) {
+                    setBeforeSubmitErrors(errors);
+                    onBeforeSubmitError == null ? void 0 : onBeforeSubmitError(errors);
+                    hasErrors = true;
+                  }
+                });
+                if (hasErrors) {
+                  return;
+                }
+                if (result !== void 0) {
+                  finalValues = result;
+                }
+              } finally {
+                setIsBeforeSubmitLoading(false);
+              }
+            }
+            return onFinish(finalValues);
+          },
           () => false
         )(e2);
       }
     };
-  }, [formLoading, handleSubmit, onFinish, transformApplyValues]);
+  }, [
+    formLoading,
+    isBeforeSubmitLoading,
+    handleSubmit,
+    onFinish,
+    transformApplyValues,
+    beforeSubmit,
+    onBeforeSubmitError
+  ]);
   return {
     ...useHookFormResult,
     transformedInitValues,
     handleSubmit,
     refineCore: useFormCoreResult,
-    saveButtonProps
+    saveButtonProps,
+    beforeSubmitErrors
   };
 };
 const useRefineForm = (props) => {
@@ -15660,6 +15704,8 @@ const useRefineForm = (props) => {
     defaultValues: (options == null ? void 0 : options.initialValues) || (config == null ? void 0 : config.initValue),
     transformApplyValues,
     transformInitValues,
+    beforeSubmit: formConfig == null ? void 0 : formConfig.beforeSubmit,
+    onBeforeSubmitError: options == null ? void 0 : options.onBeforeSubmitError,
     ...formConfig == null ? void 0 : formConfig.useFormProps
   });
   React.useEffect(() => {
@@ -15672,7 +15718,7 @@ const useRefineForm = (props) => {
       });
     }
   }, [formConfig, result, i18n2]);
-  return { formResult: result, responseErrorMsgs };
+  return { formResult: result, responseErrorMsgs, beforeSubmitErrors: result.beforeSubmitErrors };
 };
 const index_2ivb33 = "";
 const Style = "s1bsn3us";
@@ -16091,6 +16137,8 @@ const useYamlForm = ({
   initialValuesForEdit,
   transformInitValues,
   transformApplyValues,
+  beforeSubmit,
+  onBeforeSubmitError,
   rules
 } = {}) => {
   var _a;
@@ -16100,6 +16148,8 @@ const useYamlForm = ({
   const [isSchemaValid, setIsSchemaValid] = React.useState(true);
   const [editorErrors, setEditorErrors] = React.useState([]);
   const [rulesErrors, setRulesErrors] = React.useState([]);
+  const [isBeforeSubmitLoading, setIsBeforeSubmitLoading] = React.useState(false);
+  const [beforeSubmitErrors, setBeforeSubmitErrors] = React.useState([]);
   const [errorResponseBody, setErrorResponseBody] = React.useState(null);
   const useResourceResult = core.useResource();
   const globalStore = useGlobalStore();
@@ -16175,12 +16225,12 @@ const useYamlForm = ({
   }, [schema]);
   const saveButtonProps = React.useMemo(
     () => ({
-      loading: formLoading,
+      loading: formLoading || isBeforeSubmitLoading,
       onClick: () => {
         form2.submit();
       }
     }),
-    [formLoading, form2]
+    [formLoading, form2, isBeforeSubmitLoading]
   );
   const emptySchemas = React.useMemo(() => {
     return [];
@@ -16257,6 +16307,7 @@ const useYamlForm = ({
       ...formSF.formProps,
       onFinish: async (values) => {
         var _a2, _b;
+        setBeforeSubmitErrors([]);
         const errors = [
           !isYamlValid ? t2("dovetail.yaml_format_wrong") : "",
           !isSchemaValid ? t2("dovetail.yaml_value_wrong") : ""
@@ -16273,7 +16324,28 @@ const useYamlForm = ({
         }
         try {
           const objectValues = editor.current ? yaml$2.load(((_b = editor.current) == null ? void 0 : _b.getEditorValue()) || "") : values;
-          const finalValues = (transformApplyValues == null ? void 0 : transformApplyValues(objectValues)) || objectValues;
+          let finalValues = (transformApplyValues == null ? void 0 : transformApplyValues(objectValues)) || objectValues;
+          if (beforeSubmit) {
+            try {
+              let hasErrors = false;
+              setIsBeforeSubmitLoading(true);
+              const result = await beforeSubmit(finalValues, (errors2) => {
+                if (errors2 && errors2.length > 0) {
+                  setBeforeSubmitErrors(errors2);
+                  onBeforeSubmitError == null ? void 0 : onBeforeSubmitError(errors2);
+                  hasErrors = true;
+                }
+              });
+              if (hasErrors) {
+                return;
+              }
+              if (result !== void 0) {
+                finalValues = result;
+              }
+            } finally {
+              setIsBeforeSubmitLoading(false);
+            }
+          }
           return onFinish(finalValues);
         } catch (error) {
           if (error instanceof Error) {
@@ -16293,6 +16365,7 @@ const useYamlForm = ({
     saveButtonProps,
     ...useFormCoreResult,
     errorResponseBody,
+    beforeSubmitErrors,
     editorProps,
     schemas: schema ? [schema] : [],
     isLoadingSchema,
@@ -16320,6 +16393,7 @@ function YamlForm(props) {
     config,
     transformInitValues,
     transformApplyValues,
+    beforeSubmit,
     onSaveButtonPropsChange,
     onErrorsChange,
     rules
@@ -16340,6 +16414,7 @@ function YamlForm(props) {
     saveButtonProps,
     editorProps,
     errorResponseBody,
+    beforeSubmitErrors,
     mutationResult,
     isLoadingSchema,
     queryResult,
@@ -16356,6 +16431,7 @@ function YamlForm(props) {
     initialValuesForCreate: props.initialValuesForCreate ?? BASE_INIT_VALUE,
     initialValuesForEdit: props.initialValuesForEdit,
     rules,
+    beforeSubmit,
     successNotification(data2) {
       var _a;
       const displayName = config.displayName || ((_a = resource == null ? void 0 : resource.meta) == null ? void 0 : _a.kind);
@@ -16383,6 +16459,18 @@ function YamlForm(props) {
     saveButtonProps
   } : {};
   const responseErrors = React.useMemo(() => errorResponseBody ? getCommonErrors(errorResponseBody, i18n2) : [], [errorResponseBody, i18n2]);
+  const finalErrors = React.useMemo(() => {
+    if (beforeSubmitErrors.length) {
+      return beforeSubmitErrors;
+    }
+    if (mutationResult.error) {
+      if (responseErrors.length) {
+        return responseErrors;
+      }
+      return [mutationResult.error.message];
+    }
+    return [];
+  }, [responseErrors, beforeSubmitErrors, mutationResult.error]);
   const onFinish = React.useCallback(async (store) => {
     var _a, _b;
     try {
@@ -16402,8 +16490,8 @@ function YamlForm(props) {
     onSaveButtonPropsChange == null ? void 0 : onSaveButtonPropsChange(saveButtonProps);
   }, [saveButtonProps, onSaveButtonPropsChange]);
   React.useEffect(() => {
-    onErrorsChange == null ? void 0 : onErrorsChange(responseErrors);
-  }, [responseErrors, onErrorsChange]);
+    onErrorsChange == null ? void 0 : onErrorsChange(finalErrors);
+  }, [finalErrors, onErrorsChange]);
   return /* @__PURE__ */ common.jsxRuntimeExports.jsx(FormWrapper, {
     ...formWrapperProps,
     children: /* @__PURE__ */ common.jsxRuntimeExports.jsx(eagle.Form, {
@@ -16427,8 +16515,8 @@ function YamlForm(props) {
               collapsable: false
             })
           }), /* @__PURE__ */ common.jsxRuntimeExports.jsx(eagle.Form.Item, {
-            children: mutationResult.error && /* @__PURE__ */ common.jsxRuntimeExports.jsx(FormErrorAlert, {
-              errorMsgs: errorResponseBody ? responseErrors : [mutationResult.error.message],
+            children: finalErrors.length > 0 && /* @__PURE__ */ common.jsxRuntimeExports.jsx(FormErrorAlert, {
+              errorMsgs: finalErrors,
               style: {
                 marginBottom: 16
               },
@@ -16474,7 +16562,14 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
       ...formConfig == null ? void 0 : formConfig.refineCoreProps
     },
     formConfig,
-    options
+    options: {
+      ...options,
+      onBeforeSubmitError: (errors) => {
+        if (errors.length) {
+          onError == null ? void 0 : onError();
+        }
+      }
+    }
   });
   const fieldsConfig = useFieldsConfig(
     config,
@@ -16516,6 +16611,7 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
           validators: "validators" in config2 ? config2.validators : void 0
         })),
         onSaveButtonPropsChange,
+        beforeSubmit: formConfig == null ? void 0 : formConfig.beforeSubmit,
         onErrorsChange(errors) {
           if (errors.length) {
             onError == null ? void 0 : onError();
@@ -16535,6 +16631,7 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
     config,
     id,
     refineFormResult,
+    formConfig == null ? void 0 : formConfig.beforeSubmit,
     transformApplyValues,
     onSaveButtonPropsChange,
     onSuccess,
@@ -16576,7 +16673,10 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
         config,
         step,
         formConfig,
-        errorMsgs: refineFormResult.responseErrorMsgs,
+        errorMsgs: [
+          ...refineFormResult.responseErrorMsgs,
+          ...refineFormResult.beforeSubmitErrors
+        ],
         resourceId: id,
         transformedInitValues: refineFormResult.formResult.transformedInitValues,
         customOptions: options == null ? void 0 : options.customOptions
@@ -16606,6 +16706,7 @@ function YamlFormContainer({
       config,
       transformInitValues,
       transformApplyValues,
+      beforeSubmit: formConfig == null ? void 0 : formConfig.beforeSubmit,
       initialValuesForCreate: (customYamlFormProps == null ? void 0 : customYamlFormProps.initialValuesForCreate) || getInitialValues(config),
       initialValuesForEdit: void 0,
       id,
@@ -16628,6 +16729,7 @@ function YamlFormContainer({
     action,
     customYamlFormProps,
     config,
+    formConfig == null ? void 0 : formConfig.beforeSubmit,
     transformInitValues,
     transformApplyValues,
     onSuccess,
@@ -17846,7 +17948,7 @@ const MatchLabelSelector = React.forwardRef(function MatchLabelSelector2(props,
         }
       ),
       onChange,
-      isValueOptional: false,
+      isValueOptional: true,
       minSize: 1,
       disabledChagneDefaultValues
     }
@@ -18685,7 +18787,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
       },
       {
         key: "name",
-        title: i18n2.t("dovetail.port_name"),
+        title: `${i18n2.t("dovetail.name")} ${i18n2.t("dovetail.optional_with_bracket")}`,
         type: "input",
         validator: ({ value: portName, rowIndex }) => {
           const { errorMessage } = validateRfc1123Name({
@@ -18713,7 +18815,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
           );
         },
         validator: ({ value: value22 }) => {
-          const { isValid, errorMessage } = validatePort(value22 || "", {
+          const { isValid, errorMessage } = validatePort(value22 ?? "", {
             isOptional: false,
             i18n: i18n2,
             emptyText: i18n2.t("dovetail.required_field", {
@@ -18739,7 +18841,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
           );
         },
         validator: ({ value: value22 }) => {
-          const { isValid, errorMessage } = validatePort(value22 || "", {
+          const { isValid, errorMessage } = validatePort(value22 ?? "", {
             isOptional: false,
             i18n: i18n2,
             emptyText: i18n2.t("dovetail.required_field", {
@@ -18776,7 +18878,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
               }
             ).map((row) => row.nodePort.value)
           ];
-          const { isValid, errorMessage } = value22.mode === "auto" ? { isValid: true, errorMessage: void 0 } : validateNodePort(value22.value, allNodePorts, i18n2);
+          const { isValid, errorMessage } = value22.mode === "auto" ? { isValid: true, errorMessage: void 0 } : validateNodePort(value22.value ?? "", allNodePorts, i18n2);
           if (!isValid)
             return errorMessage;
         }
@@ -19377,13 +19479,7 @@ const DataKeysColumnRenderer = (i18n2) => {
 const PortMappingColumnRenderer = (i18n2) => {
   return {
     key: "displayPortMapping",
-    title: /* @__PURE__ */ common.jsxRuntimeExports.jsx(eagle.Tooltip, {
-      title: i18n2.t("dovetail.port_mapping_title_tooltip"),
-      children: /* @__PURE__ */ common.jsxRuntimeExports.jsx("span", {
-        className: DashedTitleStyle,
-        children: i18n2.t("dovetail.port_mapping")
-      })
-    }),
+    title: i18n2.t("dovetail.port_mapping"),
     display: true,
     dataIndex: ["displayPortMapping"],
     width: 300,
@@ -19951,6 +20047,7 @@ exports.DataTab = DataTab;
 exports.DeleteButton = DeleteButton;
 exports.DeleteManyButton = DeleteManyButton;
 exports.DeploymentModel = DeploymentModel;
+exports.DnsSubdomainRegExp = DnsSubdomainRegExp;
 exports.Dovetail = Dovetail;
 exports.DrawerShow = DrawerShow;
 exports.DurationColumnRenderer = DurationColumnRenderer;
@@ -20112,6 +20209,8 @@ exports.ResourceTableField = ResourceTableField;
 exports.ResourceTableGroup = ResourceTableGroup;
 exports.ResourceUsageBar = ResourceUsageBar;
 exports.RestartsColumnRenderer = RestartsColumnRenderer;
+exports.Rfc1035NameRegExp = Rfc1035NameRegExp;
+exports.Rfc1123NameRegExp = Rfc1123NameRegExp;
 exports.SCAllowExpandColumnRenderer = SCAllowExpandColumnRenderer;
 exports.SCReclaimPolicyColumnRenderer = SCReclaimPolicyColumnRenderer;
 exports.SCReclaimPolicyField = SCReclaimPolicyField;

package/dist/refine.js

@@ -10710,7 +10710,12 @@ function validateLabelValue(value2, i18n2, isOptional) {
   if (isOptional && value2 === "") {
     return { isValid: true };
   } else if (value2 === "") {
-    return { isValid: false, errorMessage: i18n2.t("dovetail.required_field", { label: i18n2.t("dovetail.value") }) };
+    return {
+      isValid: false,
+      errorMessage: i18n2.t("dovetail.required_field", {
+        label: i18n2.t("dovetail.value")
+      })
+    };
   }
   if (value2.length > 63) {
     return { isValid: false };
@@ -10747,7 +10752,7 @@ function validatePort(port2, options) {
   return { isValid: true };
 }
 function validateNodePort(nodePort, allNodePorts, i18n2) {
-  if (!nodePort) {
+  if (nodePort === "") {
     return {
       isValid: false,
       errorMessage: i18n2.t("dovetail.required_field", {
@@ -11827,7 +11832,7 @@ function _KeyValueTableForm(props, ref) {
       },
       disableBatchFilling: true,
       hideEmptyTable: true
-    }), isHideLabelFormatPopover ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(LabelFormatPopover, {
+    }), isHideLabelFormatPopover || _value.length === 0 ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(LabelFormatPopover, {
       noValueValidation
     })]
   });
@@ -15471,6 +15476,8 @@ const useForm = ({
   disableServerSideValidation: disableServerSideValidationProp = false,
   transformApplyValues,
   transformInitValues,
+  beforeSubmit,
+  onBeforeSubmitError,
   ...rest
 } = {}) => {
   const { options } = useRefineContext();
@@ -15483,6 +15490,8 @@ const useForm = ({
     defaultValues: transformInitValues && typeof rest.defaultValues === "object" ? transformInitValues(rest.defaultValues) : rest.defaultValues
   });
   const [transformedInitValues, setTransformedInitValues] = useState(useHookFormResult.getValues());
+  const [beforeSubmitErrors, setBeforeSubmitErrors] = useState([]);
+  const [isBeforeSubmitLoading, setIsBeforeSubmitLoading] = useState(false);
   const {
     watch,
     setValue,
@@ -15586,20 +15595,55 @@ const useForm = ({
   const saveButtonProps = useMemo(() => {
     return {
       disabled: formLoading,
-      onClick: (e2) => {
+      loading: formLoading || isBeforeSubmitLoading,
+      onClick: async (e2) => {
+        setBeforeSubmitErrors([]);
         handleSubmit(
-          (v) => onFinish(transformApplyValues ? transformApplyValues(v) : v),
+          async (v) => {
+            let finalValues = transformApplyValues ? transformApplyValues(v) : v;
+            if (beforeSubmit) {
+              try {
+                setIsBeforeSubmitLoading(true);
+                let hasErrors = false;
+                const result = await beforeSubmit(finalValues, (errors) => {
+                  if (errors && errors.length > 0) {
+                    setBeforeSubmitErrors(errors);
+                    onBeforeSubmitError == null ? void 0 : onBeforeSubmitError(errors);
+                    hasErrors = true;
+                  }
+                });
+                if (hasErrors) {
+                  return;
+                }
+                if (result !== void 0) {
+                  finalValues = result;
+                }
+              } finally {
+                setIsBeforeSubmitLoading(false);
+              }
+            }
+            return onFinish(finalValues);
+          },
           () => false
         )(e2);
       }
     };
-  }, [formLoading, handleSubmit, onFinish, transformApplyValues]);
+  }, [
+    formLoading,
+    isBeforeSubmitLoading,
+    handleSubmit,
+    onFinish,
+    transformApplyValues,
+    beforeSubmit,
+    onBeforeSubmitError
+  ]);
   return {
     ...useHookFormResult,
     transformedInitValues,
     handleSubmit,
     refineCore: useFormCoreResult,
-    saveButtonProps
+    saveButtonProps,
+    beforeSubmitErrors
   };
 };
 const useRefineForm = (props) => {
@@ -15641,6 +15685,8 @@ const useRefineForm = (props) => {
     defaultValues: (options == null ? void 0 : options.initialValues) || (config == null ? void 0 : config.initValue),
     transformApplyValues,
     transformInitValues,
+    beforeSubmit: formConfig == null ? void 0 : formConfig.beforeSubmit,
+    onBeforeSubmitError: options == null ? void 0 : options.onBeforeSubmitError,
     ...formConfig == null ? void 0 : formConfig.useFormProps
   });
   useEffect(() => {
@@ -15653,7 +15699,7 @@ const useRefineForm = (props) => {
       });
     }
   }, [formConfig, result, i18n2]);
-  return { formResult: result, responseErrorMsgs };
+  return { formResult: result, responseErrorMsgs, beforeSubmitErrors: result.beforeSubmitErrors };
 };
 const index_2ivb33 = "";
 const Style = "s1bsn3us";
@@ -16072,6 +16118,8 @@ const useYamlForm = ({
   initialValuesForEdit,
   transformInitValues,
   transformApplyValues,
+  beforeSubmit,
+  onBeforeSubmitError,
   rules
 } = {}) => {
   var _a;
@@ -16081,6 +16129,8 @@ const useYamlForm = ({
   const [isSchemaValid, setIsSchemaValid] = useState(true);
   const [editorErrors, setEditorErrors] = useState([]);
   const [rulesErrors, setRulesErrors] = useState([]);
+  const [isBeforeSubmitLoading, setIsBeforeSubmitLoading] = useState(false);
+  const [beforeSubmitErrors, setBeforeSubmitErrors] = useState([]);
   const [errorResponseBody, setErrorResponseBody] = useState(null);
   const useResourceResult = useResource();
   const globalStore = useGlobalStore();
@@ -16156,12 +16206,12 @@ const useYamlForm = ({
   }, [schema]);
   const saveButtonProps = useMemo(
     () => ({
-      loading: formLoading,
+      loading: formLoading || isBeforeSubmitLoading,
       onClick: () => {
         form2.submit();
       }
     }),
-    [formLoading, form2]
+    [formLoading, form2, isBeforeSubmitLoading]
   );
   const emptySchemas = useMemo(() => {
     return [];
@@ -16238,6 +16288,7 @@ const useYamlForm = ({
       ...formSF.formProps,
       onFinish: async (values) => {
         var _a2, _b;
+        setBeforeSubmitErrors([]);
         const errors = [
           !isYamlValid ? t2("dovetail.yaml_format_wrong") : "",
           !isSchemaValid ? t2("dovetail.yaml_value_wrong") : ""
@@ -16254,7 +16305,28 @@ const useYamlForm = ({
         }
         try {
           const objectValues = editor.current ? yaml$2.load(((_b = editor.current) == null ? void 0 : _b.getEditorValue()) || "") : values;
-          const finalValues = (transformApplyValues == null ? void 0 : transformApplyValues(objectValues)) || objectValues;
+          let finalValues = (transformApplyValues == null ? void 0 : transformApplyValues(objectValues)) || objectValues;
+          if (beforeSubmit) {
+            try {
+              let hasErrors = false;
+              setIsBeforeSubmitLoading(true);
+              const result = await beforeSubmit(finalValues, (errors2) => {
+                if (errors2 && errors2.length > 0) {
+                  setBeforeSubmitErrors(errors2);
+                  onBeforeSubmitError == null ? void 0 : onBeforeSubmitError(errors2);
+                  hasErrors = true;
+                }
+              });
+              if (hasErrors) {
+                return;
+              }
+              if (result !== void 0) {
+                finalValues = result;
+              }
+            } finally {
+              setIsBeforeSubmitLoading(false);
+            }
+          }
           return onFinish(finalValues);
         } catch (error) {
           if (error instanceof Error) {
@@ -16274,6 +16346,7 @@ const useYamlForm = ({
     saveButtonProps,
     ...useFormCoreResult,
     errorResponseBody,
+    beforeSubmitErrors,
     editorProps,
     schemas: schema ? [schema] : [],
     isLoadingSchema,
@@ -16301,6 +16374,7 @@ function YamlForm(props) {
     config,
     transformInitValues,
     transformApplyValues,
+    beforeSubmit,
     onSaveButtonPropsChange,
     onErrorsChange,
     rules
@@ -16321,6 +16395,7 @@ function YamlForm(props) {
     saveButtonProps,
     editorProps,
     errorResponseBody,
+    beforeSubmitErrors,
     mutationResult,
     isLoadingSchema,
     queryResult,
@@ -16337,6 +16412,7 @@ function YamlForm(props) {
     initialValuesForCreate: props.initialValuesForCreate ?? BASE_INIT_VALUE,
     initialValuesForEdit: props.initialValuesForEdit,
     rules,
+    beforeSubmit,
     successNotification(data2) {
       var _a;
       const displayName = config.displayName || ((_a = resource == null ? void 0 : resource.meta) == null ? void 0 : _a.kind);
@@ -16364,6 +16440,18 @@ function YamlForm(props) {
     saveButtonProps
   } : {};
   const responseErrors = useMemo(() => errorResponseBody ? getCommonErrors(errorResponseBody, i18n2) : [], [errorResponseBody, i18n2]);
+  const finalErrors = useMemo(() => {
+    if (beforeSubmitErrors.length) {
+      return beforeSubmitErrors;
+    }
+    if (mutationResult.error) {
+      if (responseErrors.length) {
+        return responseErrors;
+      }
+      return [mutationResult.error.message];
+    }
+    return [];
+  }, [responseErrors, beforeSubmitErrors, mutationResult.error]);
   const onFinish = useCallback(async (store) => {
     var _a, _b;
     try {
@@ -16383,8 +16471,8 @@ function YamlForm(props) {
     onSaveButtonPropsChange == null ? void 0 : onSaveButtonPropsChange(saveButtonProps);
   }, [saveButtonProps, onSaveButtonPropsChange]);
   useEffect(() => {
-    onErrorsChange == null ? void 0 : onErrorsChange(responseErrors);
-  }, [responseErrors, onErrorsChange]);
+    onErrorsChange == null ? void 0 : onErrorsChange(finalErrors);
+  }, [finalErrors, onErrorsChange]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(FormWrapper, {
     ...formWrapperProps,
     children: /* @__PURE__ */ jsxRuntimeExports.jsx(Form, {
@@ -16408,8 +16496,8 @@ function YamlForm(props) {
               collapsable: false
             })
           }), /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Item, {
-            children: mutationResult.error && /* @__PURE__ */ jsxRuntimeExports.jsx(FormErrorAlert, {
-              errorMsgs: errorResponseBody ? responseErrors : [mutationResult.error.message],
+            children: finalErrors.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(FormErrorAlert, {
+              errorMsgs: finalErrors,
               style: {
                 marginBottom: 16
               },
@@ -16455,7 +16543,14 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
       ...formConfig == null ? void 0 : formConfig.refineCoreProps
     },
     formConfig,
-    options
+    options: {
+      ...options,
+      onBeforeSubmitError: (errors) => {
+        if (errors.length) {
+          onError == null ? void 0 : onError();
+        }
+      }
+    }
   });
   const fieldsConfig = useFieldsConfig(
     config,
@@ -16497,6 +16592,7 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
           validators: "validators" in config2 ? config2.validators : void 0
         })),
         onSaveButtonPropsChange,
+        beforeSubmit: formConfig == null ? void 0 : formConfig.beforeSubmit,
         onErrorsChange(errors) {
           if (errors.length) {
             onError == null ? void 0 : onError();
@@ -16516,6 +16612,7 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
     config,
     id,
     refineFormResult,
+    formConfig == null ? void 0 : formConfig.beforeSubmit,
     transformApplyValues,
     onSaveButtonPropsChange,
     onSuccess,
@@ -16557,7 +16654,10 @@ const RefineFormContainer = React.forwardRef(function RefineFormContainer2({
         config,
         step,
         formConfig,
-        errorMsgs: refineFormResult.responseErrorMsgs,
+        errorMsgs: [
+          ...refineFormResult.responseErrorMsgs,
+          ...refineFormResult.beforeSubmitErrors
+        ],
         resourceId: id,
         transformedInitValues: refineFormResult.formResult.transformedInitValues,
         customOptions: options == null ? void 0 : options.customOptions
@@ -16587,6 +16687,7 @@ function YamlFormContainer({
       config,
       transformInitValues,
       transformApplyValues,
+      beforeSubmit: formConfig == null ? void 0 : formConfig.beforeSubmit,
       initialValuesForCreate: (customYamlFormProps == null ? void 0 : customYamlFormProps.initialValuesForCreate) || getInitialValues(config),
       initialValuesForEdit: void 0,
       id,
@@ -16609,6 +16710,7 @@ function YamlFormContainer({
     action,
     customYamlFormProps,
     config,
+    formConfig == null ? void 0 : formConfig.beforeSubmit,
     transformInitValues,
     transformApplyValues,
     onSuccess,
@@ -17827,7 +17929,7 @@ const MatchLabelSelector = React.forwardRef(function MatchLabelSelector2(props,
         }
       ),
       onChange,
-      isValueOptional: false,
+      isValueOptional: true,
       minSize: 1,
       disabledChagneDefaultValues
     }
@@ -18666,7 +18768,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
       },
       {
         key: "name",
-        title: i18n2.t("dovetail.port_name"),
+        title: `${i18n2.t("dovetail.name")} ${i18n2.t("dovetail.optional_with_bracket")}`,
         type: "input",
         validator: ({ value: portName, rowIndex }) => {
           const { errorMessage } = validateRfc1123Name({
@@ -18694,7 +18796,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
           );
         },
         validator: ({ value: value22 }) => {
-          const { isValid, errorMessage } = validatePort(value22 || "", {
+          const { isValid, errorMessage } = validatePort(value22 ?? "", {
             isOptional: false,
             i18n: i18n2,
             emptyText: i18n2.t("dovetail.required_field", {
@@ -18720,7 +18822,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
           );
         },
         validator: ({ value: value22 }) => {
-          const { isValid, errorMessage } = validatePort(value22 || "", {
+          const { isValid, errorMessage } = validatePort(value22 ?? "", {
             isOptional: false,
             i18n: i18n2,
             emptyText: i18n2.t("dovetail.required_field", {
@@ -18757,7 +18859,7 @@ const PortsConfigForm = React.forwardRef(function PortsConfigForm2({ value: valu
               }
             ).map((row) => row.nodePort.value)
           ];
-          const { isValid, errorMessage } = value22.mode === "auto" ? { isValid: true, errorMessage: void 0 } : validateNodePort(value22.value, allNodePorts, i18n2);
+          const { isValid, errorMessage } = value22.mode === "auto" ? { isValid: true, errorMessage: void 0 } : validateNodePort(value22.value ?? "", allNodePorts, i18n2);
           if (!isValid)
             return errorMessage;
         }
@@ -19358,13 +19460,7 @@ const DataKeysColumnRenderer = (i18n2) => {
 const PortMappingColumnRenderer = (i18n2) => {
   return {
     key: "displayPortMapping",
-    title: /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, {
-      title: i18n2.t("dovetail.port_mapping_title_tooltip"),
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-        className: DashedTitleStyle,
-        children: i18n2.t("dovetail.port_mapping")
-      })
-    }),
+    title: i18n2.t("dovetail.port_mapping"),
     display: true,
     dataIndex: ["displayPortMapping"],
     width: 300,
@@ -19933,6 +20029,7 @@ export {
   DeleteButton,
   DeleteManyButton,
   DeploymentModel,
+  DnsSubdomainRegExp,
   Dovetail,
   DrawerShow,
   DurationColumnRenderer,
@@ -20094,6 +20191,8 @@ export {
   ResourceTableGroup,
   ResourceUsageBar,
   RestartsColumnRenderer,
+  Rfc1035NameRegExp,
+  Rfc1123NameRegExp,
   SCAllowExpandColumnRenderer,
   SCReclaimPolicyColumnRenderer,
   SCReclaimPolicyField,

package/dist/types/resource.d.ts

@@ -111,6 +111,13 @@ export type CommonFormConfig<Model extends ResourceModel = ResourceModel> = {
      * @returns YAML格式的数据
      */
     transformApplyValues?: (values: Record<string, unknown>) => Model['_rawYaml'];
+    /**
+     * 提交前回调函数
+     * @param values 表单值
+     * @param setErrors 设置错误信息的函数，如果调用此函数并传入错误信息，将阻止提交
+     * @returns 可选的处理后的值，如果返回值存在，将使用返回值替代原始值进行提交
+     */
+    beforeSubmit?: (values: Record<string, unknown>, setErrors: (errors: string[]) => void) => Promise<Model['_rawYaml']>;
     /** 表单容器类型：页面形式或模态框形式
      * PAGE 或者 MODAL
     */

package/dist/utils/validation.d.ts

@@ -1,4 +1,7 @@
 import { i18n as I18n } from 'i18next';
+export declare const Rfc1123NameRegExp: RegExp;
+export declare const Rfc1035NameRegExp: RegExp;
+export declare const DnsSubdomainRegExp: RegExp;
 interface ValidateResourceNameOptions {
     v: string;
     allNames: string[];
@@ -58,7 +61,7 @@ export declare function validatePort(port: string | number, options: {
     isValid: boolean;
     errorMessage?: string;
 };
-export declare function validateNodePort(nodePort: number | null, allNodePorts: number[], i18n: I18n): {
+export declare function validateNodePort(nodePort: number | string | null, allNodePorts: number[], i18n: I18n): {
     isValid: boolean;
     errorMessage?: string;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dovetail-v2/refine",
-  "version": "0.3.14",
+  "version": "0.3.16-alpha.0",
   "type": "module",
   "files": [
     "dist",