aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/EditableView.tsx
diff options
context:
space:
mode:
authorNathan-SR <144961007+Nathan-SR@users.noreply.github.com>2024-05-05 18:28:35 -0400
committerNathan-SR <144961007+Nathan-SR@users.noreply.github.com>2024-05-05 18:28:35 -0400
commit86f55d8aa12268fe847eaa344e8efbab5d293f34 (patch)
tree6bbc5c6fb6825ef969ed0342e4851667b81577cc /src/client/views/EditableView.tsx
parent2a9db784a6e3492a8f7d8ce9a745b4f1a0494241 (diff)
parent139600ab7e8a82a31744cd3798247236cd5616fc (diff)
Merge branch 'nathan-starter' of https://github.com/brown-dash/Dash-Web into nathan-starter
Diffstat (limited to 'src/client/views/EditableView.tsx')
-rw-r--r--src/client/views/EditableView.tsx23
1 files changed, 15 insertions, 8 deletions
diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index 85e893e19..684b948af 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -1,3 +1,5 @@
+/* eslint-disable jsx-a11y/no-static-element-interactions */
+/* eslint-disable jsx-a11y/click-events-have-key-events */
import { action, IReactionDisposer, makeObservable, observable, reaction, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
@@ -70,7 +72,7 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
constructor(props: EditableProps) {
super(props);
makeObservable(this);
- this._editing = this._props.editing ? true : false;
+ this._editing = !!this._props.editing;
}
componentDidMount(): void {
@@ -166,7 +168,7 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
this._props.menuCallback(e.currentTarget.getBoundingClientRect().x, e.currentTarget.getBoundingClientRect().y);
break;
}
-
+ // eslint-disable-next-line no-fallthrough
default:
if (this._props.textCallback?.(e.key)) {
e.stopPropagation();
@@ -186,7 +188,6 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
this._editing = true;
this._props.isEditingCallback?.(true);
}
- // e.stopPropagation();
}
};
@@ -223,6 +224,7 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
renderEditor() {
return this._props.autosuggestProps ? (
<Autosuggest
+ // eslint-disable-next-line react/jsx-props-no-spreading
{...this._props.autosuggestProps.autosuggestProps}
inputProps={{
className: 'editableView-input',
@@ -241,12 +243,13 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
) : this._props.oneLine !== false && this._props.GetValue()?.toString().indexOf('\n') === -1 ? (
<input
className="editableView-input"
- ref={r => (this._inputref = r)}
+ ref={r => { this._inputref = r; }} // prettier-ignore
style={{ display: this._props.display, overflow: 'auto', fontSize: this._props.fontSize, minWidth: 20, background: this._props.background }}
placeholder={this._props.placeholder}
onBlur={e => this.finalizeEdit(e.currentTarget.value, false, true, false)}
defaultValue={this._props.GetValue()}
- autoFocus={true}
+ // eslint-disable-next-line jsx-a11y/no-autofocus
+ autoFocus
onChange={this.onChange}
onKeyDown={this.onKeyDown}
onPointerDown={this.stopPropagation}
@@ -256,12 +259,13 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
) : (
<textarea
className="editableView-input"
- ref={r => (this._inputref = r)}
+ ref={r => { this._inputref = r; }} // prettier-ignore
style={{ display: this._props.display, overflow: 'auto', fontSize: this._props.fontSize, minHeight: `min(100%, ${(this._props.GetValue()?.split('\n').length || 1) * 15})`, minWidth: 20, background: this._props.background }}
placeholder={this._props.placeholder}
onBlur={e => this.finalizeEdit(e.currentTarget.value, false, true, false)}
defaultValue={this._props.GetValue()}
- autoFocus={true}
+ // eslint-disable-next-line jsx-a11y/no-autofocus
+ autoFocus
onChange={this.onChange}
onKeyDown={this.onKeyDown}
onPointerDown={this.stopPropagation}
@@ -304,7 +308,10 @@ export class EditableView extends ObservableReactComponent<EditableProps> {
fontStyle: this._props.fontStyle,
fontSize: this._props.fontSize,
}}>
- {this._props.fieldContents ? <FieldView {...this._props.fieldContents} /> : this.props.contents ? this._props.contents?.valueOf() : ''}
+ {
+ // eslint-disable-next-line react/jsx-props-no-spreading
+ this._props.fieldContents ? <FieldView {...this._props.fieldContents} /> : this.props.contents ? this._props.contents?.valueOf() : ''
+ }
</span>
</div>
);