1 files changed, 44 insertions, 36 deletions
diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
index 9ffdd812f..81a2d8e64 100644
--- a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
@@ -17,7 +17,7 @@ import { DocCast } from '../../../../fields/Types';
 import { computedFn } from 'mobx-utils';
 import { CollectionSchemaView } from './CollectionSchemaView';
 import { undoable } from '../../../util/UndoManager';
-import { IconButton, Size } from 'browndash-components';
+import { IconButton, Size } from '@dash/components';
 
 export enum SchemaFieldType {
     Header,
@@ -122,45 +122,53 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
     @computed get editableView() {
         const { color, fieldProps, pointerEvents } = this.renderProps(this._props);
 
-        return <div className='schema-column-edit-wrapper' onPointerUp={() => {
-            SchemaColumnHeader.isDefaultField(this.fieldKey) && this.openKeyDropdown();
-            this._props.schemaView.deselectAllCells();
-        }}
-        style={{
-            color,
-            width: '100%',
-            pointerEvents,
-        }}>
-            <EditableView
-                ref={r => {this._inputRef = r; this._props.autoFocus && r?.setIsFocused(true)}}
-                oneLine={true}
-                allowCRs={false}
-                contents={''}
-                onClick={this.openKeyDropdown}
-                fieldContents={fieldProps}
-                editing={undefined}  
-                placeholder={'Add key'}
-                updateAlt={this.updateAlt} // alternate title to display
-                updateSearch={this.updateKeyDropdown}
-                inputString={true}
-                inputStringPlaceholder={'Add key'}
-                GetValue={() => {
-                    if (SchemaColumnHeader.isDefaultField(this.fieldKey)) return '';
-                    else if (this._altTitle) return this._altTitle;
-                    else return this.fieldKey;
+        return (
+            <div
+                className="schema-column-edit-wrapper"
+                onPointerUp={() => {
+                    SchemaColumnHeader.isDefaultField(this.fieldKey) && this.openKeyDropdown();
+                    this._props.schemaView.deselectAllCells();
                 }}
-                SetValue={undoable((value: string, shiftKey?: boolean, enterKey?: boolean) => {
-                    if (enterKey) {
-                        // if shift & enter, set value of each cell in column
-                        this.setColumnValues(value, '');
-                        this._altTitle = undefined;
+                style={{
+                    color,
+                    width: '100%',
+                    pointerEvents,
+                }}>
+                <EditableView
+                    ref={r => {
+                        this._inputRef = r;
+                        this._props.autoFocus && r?.setIsFocused(true);
+                    }}
+                    oneLine={true}
+                    allowCRs={false}
+                    contents={''}
+                    onClick={this.openKeyDropdown}
+                    fieldContents={fieldProps}
+                    editing={undefined}
+                    placeholder={'Add key'}
+                    updateAlt={this.updateAlt} // alternate title to display
+                    updateSearch={this.updateKeyDropdown}
+                    inputString={true}
+                    inputStringPlaceholder={'Add key'}
+                    GetValue={() => {
+                        if (SchemaColumnHeader.isDefaultField(this.fieldKey)) return '';
+                        else if (this._altTitle) return this._altTitle;
+                        else return this.fieldKey;
+                    }}
+                    SetValue={undoable((value: string, shiftKey?: boolean, enterKey?: boolean) => {
+                        if (enterKey) {
+                            // if shift & enter, set value of each cell in column
+                            this.setColumnValues(value, '');
+                            this._altTitle = undefined;
+                            this._props.finishEdit?.();
+                            return true;
+                        }
                         this._props.finishEdit?.();
                         return true;
-                    }
-                    this._props.finishEdit?.();
-                    return true;
-                }, 'edit column header')}/>
+                    }, 'edit column header')}
+                />
             </div>
+        );
     }
 
     public static isDefaultField = (key: string) => {