fix: check form data after blur

src/components/label-selector/index.tsx

@@ -9,11 +9,13 @@ interface LabelSelectorProps {
   btnText?: string;
   description?: React.ReactNode;
   onChange?: (labels: Record<string, any>) => void;
+  onBlur?: (e: any, type: string, index: number) => void;
 }
 
 const LabelSelector: React.FC<LabelSelectorProps> = ({
   labels,
   onChange,
+  onBlur,
   label,
   btnText,
   description
@@ -87,6 +89,7 @@ const LabelSelector: React.FC<LabelSelectorProps> = ({
       onChange={handleLabelsChange}
       onLabelListChange={handleLabelListChange}
       onPaste={handleOnPaste}
+      onBlur={onBlur}
     />
   );
 };

src/components/label-selector/inner.tsx

@@ -13,6 +13,7 @@ interface LabelSelectorProps {
   onLabelListChange: (list: { key: string; value: string }[]) => void;
   onChange?: (labels: Record<string, any>) => void;
   onPaste?: (e: any, index: number) => void;
+  onBlur?: (e: any, type: string, index: number) => void;
   description?: React.ReactNode;
 }
 
@@ -22,6 +23,7 @@ const Inner: React.FC<LabelSelectorProps> = ({
   onChange,
   onLabelListChange,
   onPaste,
+  onBlur,
   label,
   btnText,
   description
@@ -82,6 +84,7 @@ const Inner: React.FC<LabelSelectorProps> = ({
               onDelete={() => handleOnDelete(index)}
               onChange={(obj) => handleOnChange(index, obj)}
               onPaste={(e) => onPaste?.(e, index)}
+              onBlur={(e: any, type: string) => onBlur?.(e, type, index)}
             />
           );
         })}

src/components/label-selector/label-item.tsx

@@ -19,6 +19,7 @@ interface LabelItemProps {
   labelList: { key: string; value: string }[];
   onChange?: (params: { key: string; value: string }) => void;
   onPaste?: (e: any) => void;
+  onBlur?: (e: any, type: string) => void;
 }
 const LabelItem: React.FC<LabelItemProps> = ({
   label,
@@ -28,7 +29,8 @@ const LabelItem: React.FC<LabelItemProps> = ({
   valueAddon,
   onChange,
   onDelete,
-  onPaste
+  onPaste,
+  onBlur
 }) => {
   const intl = useIntl();
   const [open, setOpen] = useState(false);
@@ -49,7 +51,7 @@ const LabelItem: React.FC<LabelItemProps> = ({
     });
   };
 
-  const handleKeyOnBlur = (e: any) => {
+  const handleKeyOnBlur = (e: any, type: string) => {
     const val = e.target.value;
     // has duplicate key
     const duplicates = _.filter(
@@ -68,6 +70,7 @@ const LabelItem: React.FC<LabelItemProps> = ({
     } else {
       setOpen(false);
     }
+    onBlur?.(e, type);
   };
 
   return (
@@ -83,7 +86,7 @@ const LabelItem: React.FC<LabelItemProps> = ({
               label={intl.formatMessage({ id: 'common.input.key' })}
               value={label.key}
               onChange={handleOnKeyChange}
-              onBlur={handleKeyOnBlur}
+              onBlur={(e: any) => handleKeyOnBlur(e, 'key')}
               onPaste={onPaste}
             ></SealInput.Input>
           </Tooltip>
@@ -97,6 +100,7 @@ const LabelItem: React.FC<LabelItemProps> = ({
             label={intl.formatMessage({ id: 'common.input.value' })}
             value={label.value}
             onChange={handleOnValueChange}
+            onBlur={(e: any) => onBlur?.(e, 'value')}
           ></SealInput.Input>
         )}
       </div>