Refactor file imports and update version; add DefaultVal demo component

output.json

@@ -878,6 +878,11 @@
           "source": "ove",
           "target": "shared-demo",
           "type": "static"
+        },
+        {
+          "source": "ove",
+          "target": "file-utils",
+          "type": "static"
         }
       ],
       "ui": [

packages/file-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/file-utils",
-  "version": "0.3.16",
+  "version": "0.3.17",
   "type": "module",
   "dependencies": {
     "bluebird": "^3.7.2",

packages/file-utils/src/file-utils.js

@@ -74,8 +74,7 @@ export const extractZipFiles = async allFiles => {
 
 const defaultCsvParserOptions = {
   header: true,
-  skipEmptyLines: "greedy",
-  trimHeaders: true
+  skipEmptyLines: "greedy"
 };
 export const setupCsvParserOptions = (parserOptions = {}) => {
   const {
@@ -123,6 +122,17 @@ export const setupCsvParserOptions = (parserOptions = {}) => {
       return transHeader;
     };
   }
+  // tnw: the papaparse trimHeaders option was removed so we need to trim headers manually
+  const transformToAlwaysRun = header => header.trim();
+  if (parserOptions.transformHeader) {
+    const existingTransformHeader = parserOptions.transformHeader;
+    papaParseOpts.transformHeader = header => {
+      const trimmedHeader = transformToAlwaysRun(header);
+      return existingTransformHeader(trimmedHeader);
+    };
+  } else {
+    papaParseOpts.transformHeader = transformToAlwaysRun;
+  }
 
   return papaParseOpts;
 };

packages/ove/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ove",
-  "version": "0.7.8",
+  "version": "0.7.9",
   "main": "./src/index.js",
   "type": "module",
   "exports": {

packages/ove/src/AutoAnnotate.js

@@ -12,7 +12,7 @@ import {
   parseCsvFile,
   validateCSVRequiredHeaders,
   validateCSVRow
-} from "./fileUtils";
+} from "@teselagen/file-utils";
 import downloadjs from "downloadjs";
 import {
   autoAnnotate,

packages/ui/demo/src/examples/DefaultVal.js

@@ -0,0 +1,37 @@
+import React from "react";
+import { withProps } from "recompose";
+
+import { InputField } from "../../../src";
+import { compose } from "redux";
+import { reduxForm } from "redux-form";
+
+export default compose(
+  withProps(() => {
+    return {
+      initialValues: {
+        defaultVal: "Default Value From Initial"
+      }
+    };
+  }),
+  reduxForm({
+    form: "defaultValForm"
+  })
+)(function DefaultVal() {
+  return (
+    <div style={{}}>
+      {/* default val demo for InputField  */}
+      <InputField
+        label="Default Value"
+        name="defaultVal"
+        defaultValue="Default Value"
+        placeholder="Enter text here"
+      />
+      <InputField
+        label="Default Value 2"
+        name="defaultVal2"
+        defaultValue="Default Value from defaultValue prop"
+        placeholder="Enter text here"
+      />
+    </div>
+  );
+});

packages/ui/demo/src/index.js

@@ -21,6 +21,7 @@ import TimelineDemo from "./examples/TimelineDemo";
 import UploaderDemo from "./examples/UploaderDemo";
 import IntentTextDemo from "./examples/IntentText";
 import ScrollToTopDemo from "./examples/ScrollToTop";
+import DefaultValDemo from "./examples/DefaultVal";
 
 import showAppSpinnerDemo from "./examples/showAppSpinnerDemo";
 import EditableCellTable from "./examples/EditableCellTable";
@@ -256,6 +257,9 @@ const demos = {
   ScrollToTop: {
     demo: ScrollToTopDemo
   },
+  DefaultVal: {
+    demo: DefaultValDemo
+  },
   PromptUnsavedChanges: {
     demo: PromptUnsavedChanges
   }

packages/ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ui",
-  "version": "0.7.11",
+  "version": "0.7.12",
   "main": "./src/index.js",
   "type": "module",
   "exports": {

packages/ui/src/FormComponents/index.js

@@ -7,6 +7,7 @@ import React, {
   useContext,
   useEffect,
   useMemo,
+  useRef,
   useState
 } from "react";
 import { Field, change } from "redux-form";
@@ -136,7 +137,7 @@ const AbstractInput = ({
   disabled,
   fileLimit,
   inlineLabel,
-  input: { name },
+  input: { name, value },
   intent,
   isLabelTooltip,
   isLoadingDefaultValue,
@@ -161,18 +162,29 @@ const AbstractInput = ({
   tooltipProps
 }) => {
   const dispatch = useDispatch();
+  const initalValuePassed = useRef(value);
   const onDefaultValChanged = useStableReference(_onDefaultValChanged);
   const onFieldSubmit = useStableReference(_onFieldSubmit);
-
+  const doesNotHaveInitialValue =
+    !isLoadingDefaultValue && !initalValuePassed.current;
   // This only takes care that the default Value is changed when it is changed in the parent component
   useEffect(() => {
-    if (defaultValue !== undefined) {
+    //if the input already has an initial value being passed to it, we don't want to override it with the default value
+    if (defaultValue !== undefined && doesNotHaveInitialValue) {
       dispatch(change(form, name, defaultValue));
       onDefaultValChanged.current &&
         onDefaultValChanged.current(defaultValue, name, form);
       onFieldSubmit.current && onFieldSubmit.current(defaultValue);
     }
-  }, [defaultValue, dispatch, form, name, onDefaultValChanged, onFieldSubmit]);
+  }, [
+    defaultValue,
+    dispatch,
+    form,
+    name,
+    onDefaultValChanged,
+    onFieldSubmit,
+    doesNotHaveInitialValue
+  ]);
 
   // if our custom field level validation is happening then we don't want to show the error visually
   const showError =