feat(columnDescription): show description textarea in right panel

app/client/ui/FieldConfig.ts

@@ -18,6 +18,7 @@ import {sanitizeIdent} from 'app/common/gutil';
 import {bundleChanges, Computed, dom, DomContents, DomElementArg, fromKo, MultiHolder,
         Observable, styled} from 'grainjs';
 import * as ko from 'knockout';
+import { textarea } from './inputs';
 
 const t = makeT('FieldConfig');
 
@@ -88,6 +89,22 @@ export function buildNameConfig(
   ];
 }
 
+export function buildDescriptionConfig(
+  owner: MultiHolder,
+  origColumn: ColumnRec,
+  cursor: ko.Computed<CursorPos>,
+) {
+  const editedDescription = Observable.create(owner, '');
+
+  return [
+    cssLabel(t("DESCRIPTION")),
+    cssRow(
+      cssTextArea(editedDescription, {})
+    ),
+
+  ];
+}
+
 type SaveHandler = (column: ColumnRec, formula: string) => Promise<void>;
 type BuildEditor = (
   cellElem: Element,
@@ -494,3 +511,19 @@ const cssInput = styled(textInput, `
     color: ${theme.inputDisabledFg};
   }
 `);
+
+const cssTextArea = styled(textarea, `
+  color: ${theme.inputFg};
+  background-color: ${theme.mainPanelBg};
+  border: 1px solid ${theme.inputBorder};
+  width: 100%;
+
+  &::placeholder {
+    color: ${theme.inputPlaceholderFg};
+  }
+
+  &[readonly] {
+    background-color: ${theme.inputDisabledBg};
+    color: ${theme.inputDisabledFg};
+  }
+`);

app/client/ui/RightPanel.ts

@@ -43,6 +43,7 @@ import {bundleChanges, Computed, Disposable, dom, domComputed, DomContents,
         DomElementArg, DomElementMethod, IDomComponent} from 'grainjs';
 import {MultiHolder, Observable, styled, subscribe} from 'grainjs';
 import * as ko from 'knockout';
+import { buildDescriptionConfig } from './FieldConfig';
 
 const t = makeT('RightPanel');
 
@@ -235,6 +236,9 @@ export class RightPanel extends Disposable {
           cssSection(
             dom.create(buildNameConfig, origColumn, cursor, isMultiSelect),
           ),
+          cssSection(
+            dom.create(buildDescriptionConfig, origColumn, cursor, isMultiSelect),
+          ),
           cssSeparator(),
           cssSection(
             dom.create(buildFormulaConfig,