feat: DH-14538: Export InputEditor and added options (#1398)

- Exporting InputEditor from @deephaven/iris-grid
- Added optional properties `className` and `placeholder`

resolves #1397

Supporting DH-14538

Author: bmingles

packages/iris-grid/src/sidebar/CustomColumnInput.tsx

@@ -111,6 +111,7 @@ function CustomColumnInput({
             <InputEditor
               editorSettings={{ language: 'deephavenDb' }}
               editorIndex={inputIndex}
+              placeholder="Column Formula"
               value={formula}
               onContentChanged={handleFormulaEditorContentChanged}
               onTab={onTabInEditor}

packages/iris-grid/src/sidebar/InputEditor.tsx

@@ -4,6 +4,8 @@ import classNames from 'classnames';
 import './InputEditor.scss';
 
 interface InputEditorProps {
+  className?: string;
+  placeholder?: string;
   value: string;
   onContentChanged: (value?: string) => void;
   editorSettings: Partial<monaco.editor.IStandaloneEditorConstructionOptions>;
@@ -20,10 +22,7 @@ interface InputEditorState {
  * A monaco editor that looks like an general input
  */
 
-export default class InputEditor extends Component<
-  InputEditorProps,
-  InputEditorState
-> {
+export class InputEditor extends Component<InputEditorProps, InputEditorState> {
   static defaultProps = {
     value: '',
     onContentChanged: (): void => undefined,
@@ -156,14 +155,18 @@ export default class InputEditor extends Component<
   }
 
   render(): ReactElement {
-    const { value, invalid } = this.props;
+    const { className, invalid, placeholder = '', value } = this.props;
     const { isEditorFocused, isEditorEmpty } = this.state;
     return (
       <div
-        className={classNames('input-editor-wrapper', {
-          focused: isEditorFocused,
-          invalid,
-        })}
+        className={classNames(
+          'input-editor-wrapper',
+          {
+            focused: isEditorFocused,
+            invalid,
+          },
+          className
+        )}
         role="presentation"
         onClick={this.handleContainerClick}
       >
@@ -174,10 +177,12 @@ export default class InputEditor extends Component<
           }}
           data-testid="custom-column-formula"
         />
-        {isEditorEmpty && !value && (
-          <div className="editor-placeholder text-muted">Column Formula</div>
+        {isEditorEmpty && !value && placeholder.length > 0 && (
+          <div className="editor-placeholder text-muted">{placeholder}</div>
         )}
       </div>
     );
   }
 }
+
+export default InputEditor;

packages/iris-grid/src/sidebar/index.ts

@@ -31,4 +31,5 @@ export type { FormattingRule as SidebarFormattingRule };
 export * from './aggregations';
 export * from './RollupRows';
 export * from './ChartBuilder';
+export * from './InputEditor';
 export * from './icons';