Support init fields assignments

src/components/Importer.tsx

@@ -31,25 +31,31 @@ export function Importer<Row extends BaseRow>(
     onClose,
     children: content,
     locale: userLocale,
+    fieldAssignments,
     ...customPapaParseConfig
   } = props;
-
   // helper to combine our displayed content and the user code that provides field definitions
+  const initialFieldsState = useMemo(
+    () => (fieldAssignments ? { fieldAssignments } : null),
+    [fieldAssignments]
+  );
   const [fields, userFieldContentWrapper] = useFieldDefinitions();
 
   const [fileState, setFileState] = useState<FileStepState | null>(null);
   const [fileAccepted, setFileAccepted] = useState<boolean>(false);
 
-  const [fieldsState, setFieldsState] = useState<FieldsStepState | null>(null);
+  const [fieldsState, setFieldsState] = useState<FieldsStepState | null>(
+    initialFieldsState
+  );
   const [fieldsAccepted, setFieldsAccepted] = useState<boolean>(false);
 
   // reset field assignments when file changes
   const activeFile = fileState && fileState.file;
   useEffect(() => {
     if (activeFile) {
-      setFieldsState(null);
+      setFieldsState(initialFieldsState);
     }
-  }, [activeFile]);
+  }, [activeFile, initialFieldsState]);
 
   const externalPreview = useMemo<ImporterFilePreview | null>(() => {
     // generate stable externally-visible data objects
@@ -142,7 +148,7 @@ export function Importer<Row extends BaseRow>(
                   // reset all state
                   setFileState(null);
                   setFileAccepted(false);
-                  setFieldsState(null);
+                  setFieldsState(initialFieldsState);
                   setFieldsAccepted(false);
                 }
               : undefined

src/components/ImporterProps.ts

@@ -1,6 +1,11 @@
 import React from 'react';
 import { ImporterLocale } from '../locale';
-import { CustomizablePapaParseConfig, ParseCallback, BaseRow } from '../parser';
+import {
+  CustomizablePapaParseConfig,
+  ParseCallback,
+  BaseRow,
+  FieldAssignmentMap
+} from '../parser';
 
 // information for displaying a spreadsheet-style column
 export interface ImporterPreviewColumn {
@@ -66,4 +71,5 @@ export type ImporterProps<Row extends BaseRow> = ImporterDataHandlerProps<
   onClose?: (info: ImportInfo) => void;
   children?: ImporterContentRenderProp | React.ReactNode;
   locale?: ImporterLocale;
+  fieldAssignments?: FieldAssignmentMap;
 } & CustomizablePapaParseConfig;

src/components/fields-step/FieldsStep.tsx

@@ -62,6 +62,10 @@ export const FieldsStep: React.FC<{
 
   // make sure there are no extra fields
   useEffect(() => {
+    if (fields.length === 0) {
+      // Defer removal logic until fields have loaded from children components
+      return;
+    }
     const removedFieldNames = Object.keys(fieldAssignments).filter(
       (existingFieldName) =>
         !fields.some((field) => field.name === existingFieldName)