1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
import React = require('react');
import { observer } from 'mobx-react';
import { Doc, Field } from '../../../../fields/Doc';
import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnZero } from '../../../../Utils';
import { Transform } from '../../../util/Transform';
import { EditableView } from '../../EditableView';
import { FieldView, FieldViewProps } from '../../nodes/FieldView';
import { KeyValueBox } from '../../nodes/KeyValueBox';
import { DefaultStyleProvider } from '../../StyleProvider';
import { CollectionSchemaView } from './CollectionSchemaView';
import './CollectionSchemaView.scss';
export interface SchemaTableCellProps {
Document: Doc;
fieldKey: string;
columnWidth: number;
isRowActive: () => boolean | undefined;
setColumnValues: (field: string, value: string) => boolean;
}
@observer
export class SchemaTableCell extends React.Component<SchemaTableCellProps> {
render() {
const props: FieldViewProps = {
Document: this.props.Document,
docFilters: returnEmptyFilter,
docRangeFilters: returnEmptyFilter,
searchFilterDocs: returnEmptyDoclist,
styleProvider: DefaultStyleProvider,
docViewPath: returnEmptyDoclist,
fieldKey: this.props.fieldKey,
rootSelected: returnFalse,
isSelected: returnFalse,
setHeight: returnFalse,
select: emptyFunction,
dropAction: 'alias',
bringToFront: emptyFunction,
renderDepth: 1,
isContentActive: returnFalse,
whenChildContentsActiveChanged: emptyFunction,
ScreenToLocalTransform: Transform.Identity,
focus: emptyFunction,
PanelWidth: () => this.props.columnWidth,
PanelHeight: () => CollectionSchemaView._rowHeight,
addDocTab: returnFalse,
pinToPres: returnZero,
};
return (
<div className="schema-table-cell" style={{ width: this.props.columnWidth }}>
<div className="schemacell-edit-wrapper" style={this.props.isRowActive() ? { cursor: 'text', pointerEvents: 'auto' } : { cursor: 'default', pointerEvents: 'none' }}>
<EditableView
contents={<FieldView {...props} />}
GetValue={() => Field.toKeyValueString(this.props.Document, this.props.fieldKey)}
SetValue={(value: string, shiftDown?: boolean, enterKey?: boolean) => {
if (shiftDown && enterKey) {
this.props.setColumnValues(this.props.fieldKey, value);
}
return KeyValueBox.SetField(this.props.Document, this.props.fieldKey, value);
}}
editing={this.props.isRowActive() ? undefined : false}
/>
</div>
</div>
);
}
}
|