@map-colonies/react-components 3.10.2 → 3.10.3

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.10.3](https://github.com/MapColonies/shared-components/compare/@map-colonies/react-components@3.10.2...@map-colonies/react-components@3.10.3) (2022-02-22)
+
+
+### Bug Fixes
+
+* auto complete input bug ([cdb9220](https://github.com/MapColonies/shared-components/commit/cdb9220177e81087b90eacdf05a5f80b04e2ed67))
+* autocomplete prettier ([eff39e8](https://github.com/MapColonies/shared-components/commit/eff39e8e469d6d9ca831be3718204ad58e77d850))
+
+
+
+
+
 ## [3.10.2](https://github.com/MapColonies/shared-components/compare/@map-colonies/react-components@3.10.1...@map-colonies/react-components@3.10.2) (2022-02-20)
 
 

package/dist/autocomplete/autocomplete.d.ts

@@ -3,10 +3,10 @@ import './autocomplete.css';
 export interface IAutocompleteProps {
     Component: React.ReactElement;
     ComponentProps: Record<string, unknown>;
-    defaultValue: string;
+    defaultValue: string | undefined;
     disabled: boolean;
     maxOptions: number;
-    onBlur: () => void;
+    onBlur: (evt: any) => void;
     onChange: (val: string) => void;
     onKeyDown: (evt: any) => void;
     onRequestOptions: (val: string) => void;

package/dist/autocomplete/autocomplete.js

@@ -59,9 +59,10 @@ var KEY_TAB = 9;
 var OPTION_LIST_Y_OFFSET = 10;
 var OPTION_LIST_MIN_WIDTH = 100;
 var Autocomplete = function (props) {
-    var _a = react_1.useState(props.defaultValue), recentValue = _a[0], setRecentValue = _a[1];
-    var _b = react_1.useState(false), enableSpaceRemovers = _b[0], setEnableSpaceRemovers = _b[1];
-    var _c = react_1.useState({
+    var _a;
+    var _b = react_1.useState((_a = props.defaultValue) !== null && _a !== void 0 ? _a : ''), recentValue = _b[0], setRecentValue = _b[1];
+    var _c = react_1.useState(false), enableSpaceRemovers = _c[0], setEnableSpaceRemovers = _c[1];
+    var _d = react_1.useState({
         helperVisible: false,
         left: 0,
         right: 0,
@@ -74,7 +75,7 @@ var Autocomplete = function (props) {
         value: '',
         caret: 0,
         width: 'unset',
-    }), state = _c[0], setState = _c[1];
+    }), state = _d[0], setState = _d[1];
     var refInput = react_1.useRef(null);
     react_1.useEffect(function () {
         window.addEventListener('resize', handleResize);
@@ -87,6 +88,14 @@ var Autocomplete = function (props) {
             }
         };
     }, []);
+    react_1.useEffect(function () {
+        if (typeof props.value !== 'undefined') {
+            setRecentValue(props.value);
+        }
+        if (typeof props.defaultValue !== 'undefined') {
+            setRecentValue(props.defaultValue);
+        }
+    }, [props.value, props.defaultValue]);
     react_1.useEffect(function () {
         var options = props.options;
         var caret = state.caret;
@@ -421,32 +430,21 @@ var Autocomplete = function (props) {
         return (react_1.default.createElement("ul", { className: "react-autocomplete-input", style: __assign(__assign({}, horizontalPosition), { top: top + offsetY, width: width }) }, helperOptions));
     };
     var Component = props.Component, ComponentProps = props.ComponentProps, defaultValue = props.defaultValue, disabled = props.disabled, onBlur = props.onBlur, value = props.value, rest = __rest(props, ["Component", "ComponentProps", "defaultValue", "disabled", "onBlur", "value"]);
-    var stateValue = recentValue; //state.value;
     var propagated = Object.assign({}, rest);
     Object.keys(props).forEach(function (k) {
         delete propagated[k];
     });
-    var val = '';
-    if (stateValue) {
-        val = stateValue;
-    }
-    else if (defaultValue) {
-        val = defaultValue;
-    }
-    else if (value !== undefined) {
-        val = value;
-    }
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.cloneElement(Component, __assign(__assign({ disabled: disabled, onBlur: onBlur, onChange: handleChange, onKeyDown: handleKeyDown, ref: refInput, value: val }, propagated), ComponentProps)),
+        react_1.default.cloneElement(Component, __assign(__assign({ disabled: disabled, onBlur: onBlur, onChange: handleChange, onKeyDown: handleKeyDown, ref: refInput, value: recentValue }, propagated), ComponentProps)),
         renderAutocompleteList()));
 };
 var defaultProps = {
     Component: react_1.default.createElement("textarea", null),
     ComponentProps: {},
-    defaultValue: '',
+    defaultValue: undefined,
     disabled: false,
     maxOptions: 6,
-    onBlur: function () { },
+    onBlur: function (evt) { },
     onChange: function (val) { },
     onKeyDown: function (evt) { },
     onRequestOptions: function (val) { },

package/dist/file-picker/file-picker.d.ts

@@ -273,4 +273,4 @@ export interface FilePickerProps extends Partial<FileBrowserProps> {
     readOnlyMode?: boolean;
     locale?: SupportedLocales;
 }
-export declare const FilePicker: React.FC<FilePickerProps>;
+export declare const FilePicker: React.MemoExoticComponent<React.ForwardRefExoticComponent<FilePickerProps & React.RefAttributes<FileBrowserHandle>>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@map-colonies/react-components",
-  "version": "3.10.2",
+  "version": "3.10.3",
   "module": "dist/index.js",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -93,7 +93,7 @@
     "jest-enzyme": "^7.1.2",
     "react-test-renderer": "^16.13.1"
   },
-  "gitHead": "0b46e28cd15388a779c576920493e2f748cdc2ef",
+  "gitHead": "adb44b72ca2bf29dfd89a9fbb480df59e00d274f",
   "jest": {
     "coverageReporters": [
       "text",

package/src/lib/autocomplete/autocomplete.tsx

@@ -24,10 +24,10 @@ const OPTION_LIST_MIN_WIDTH = 100;
 export interface IAutocompleteProps {
   Component: React.ReactElement;
   ComponentProps: Record<string, unknown>;
-  defaultValue: string;
+  defaultValue: string | undefined;
   disabled: boolean;
   maxOptions: number;
-  onBlur: () => void;
+  onBlur: (evt: any) => void;
   onChange: (val: string) => void;
   onKeyDown: (evt: any) => void;
   onRequestOptions: (val: string) => void;
@@ -50,7 +50,7 @@ export interface IAutocompleteProps {
 }
 
 const Autocomplete: React.FC<IAutocompleteProps> = (props) => {
-  const [recentValue, setRecentValue] = useState(props.defaultValue);
+  const [recentValue, setRecentValue] = useState(props.defaultValue ?? '');
   const [enableSpaceRemovers, setEnableSpaceRemovers] = useState(false);
 
   const [state, setState] = useState({
@@ -80,6 +80,16 @@ const Autocomplete: React.FC<IAutocompleteProps> = (props) => {
     };
   }, []);
 
+  useEffect(() => {
+    if (typeof props.value !== 'undefined') {
+      setRecentValue(props.value);
+    }
+
+    if (typeof props.defaultValue !== 'undefined') {
+      setRecentValue(props.defaultValue);
+    }
+  }, [props.value, props.defaultValue]);
+
   useEffect(() => {
     const { options } = props;
     const { caret } = state;
@@ -599,23 +609,11 @@ const Autocomplete: React.FC<IAutocompleteProps> = (props) => {
     ...rest
   } = props;
 
-  const stateValue = recentValue; //state.value;
-
   const propagated: any = Object.assign({}, rest);
   Object.keys(props).forEach((k) => {
     delete (propagated as Record<string, unknown>)[k];
   });
 
-  let val = '';
-
-  if (stateValue) {
-    val = stateValue;
-  } else if (defaultValue) {
-    val = defaultValue;
-  } else if (value !== undefined) {
-    val = value;
-  }
-
   return (
     <>
       {React.cloneElement(Component, {
@@ -624,7 +622,7 @@ const Autocomplete: React.FC<IAutocompleteProps> = (props) => {
         onChange: handleChange,
         onKeyDown: handleKeyDown,
         ref: refInput,
-        value: val,
+        value: recentValue,
         ...propagated,
         ...ComponentProps,
       })}
@@ -636,10 +634,10 @@ const Autocomplete: React.FC<IAutocompleteProps> = (props) => {
 const defaultProps: IAutocompleteProps = {
   Component: <textarea />,
   ComponentProps: {},
-  defaultValue: '',
+  defaultValue: undefined,
   disabled: false,
   maxOptions: 6,
-  onBlur: () => {},
+  onBlur: (evt: any) => {},
   onChange: (val: string) => {},
   onKeyDown: (evt: any) => {},
   onRequestOptions: (val: string) => {},

package/src/lib/file-picker/file-picker.tsx

@@ -62,7 +62,7 @@ export interface FilePickerProps extends Partial<FileBrowserProps> {
   locale?: SupportedLocales;
 }
 
-export const FilePicker: React.FC<FilePickerProps> = React.memo(
+export const FilePicker = React.memo(
   React.forwardRef<FileBrowserHandle, FilePickerProps>(
     (
       {