fix: toggle display filter drawer of financial statements.

client/src/components/DataTableCells/InputGroupCell.js

@@ -25,11 +25,7 @@ const InputEditableCell = ({
   return (
     <FormGroup
       intent={error ? Intent.DANGER : null}
-      className={classNames(
-        'form-group--select-list',
-        'form-group--account',
-        Classes.FILL,
-      )}
+      className={classNames(Classes.FILL)}
     >
       <InputGroup
         value={value}

client/src/components/DataTableCells/NumericInputCell.js

@@ -0,0 +1,43 @@
+import React, { useState, useEffect } from 'react';
+import { FormGroup, NumericInput, Intent } from '@blueprintjs/core';
+import classNames from 'classnames';
+import { CLASSES } from 'common/classes';
+
+/**
+ * Numeric input table cell.
+ */
+export default function NumericInputCell({
+  row: { index },
+  column: { id },
+  cell: { value: initialValue },
+  payload,
+}) {
+  const [value, setValue] = useState(initialValue);
+
+  const handleValueChange = (newValue) => {
+    setValue(newValue);
+  };
+  const onBlur = () => {
+    payload.updateData(index, id, value);
+  };
+  useEffect(() => {
+    setValue(initialValue);
+  }, [initialValue]);
+
+  const error = payload.errors?.[index]?.[id];
+
+  return (
+    <FormGroup
+      intent={error ? Intent.DANGER : null}
+      className={classNames(CLASSES.FILL)}
+    >
+      <NumericInput
+        value={value}
+        onValueChange={handleValueChange}
+        onBlur={onBlur}
+        fill={true}
+        buttonPosition={"none"}
+      />
+    </FormGroup>
+  );
+}

client/src/components/DataTableCells/index.js

@@ -5,6 +5,7 @@ import ContactsListFieldCell from './ContactsListFieldCell';
 import ItemsListCell from './ItemsListCell';
 import PercentFieldCell from './PercentFieldCell';
 import { DivFieldCell, EmptyDiv } from './DivFieldCell';
+import NumericInputCell from './NumericInputCell';
 
 export {
   AccountsListFieldCell,
@@ -15,4 +16,5 @@ export {
   PercentFieldCell,
   DivFieldCell,
   EmptyDiv,
+  NumericInputCell
 };