diff options
author | bobzel <zzzman@gmail.com> | 2020-08-04 15:51:10 -0400 |
---|---|---|
committer | bobzel <zzzman@gmail.com> | 2020-08-04 15:51:10 -0400 |
commit | 7d296bf47dd373c5cb74eecda149ba1aa608acbc (patch) | |
tree | 9c0c0f92d295a4a6b517762aa10ad90f2cb9a375 /src/client/views/nodes/LabelBox.tsx | |
parent | 982f66c87ed30ee179d6ec5ada10a4ccaab0522e (diff) |
clean up labelBox
Diffstat (limited to 'src/client/views/nodes/LabelBox.tsx')
-rw-r--r-- | src/client/views/nodes/LabelBox.tsx | 10 |
1 files changed, 7 insertions, 3 deletions
diff --git a/src/client/views/nodes/LabelBox.tsx b/src/client/views/nodes/LabelBox.tsx index ccdd088d3..826ccd340 100644 --- a/src/client/views/nodes/LabelBox.tsx +++ b/src/client/views/nodes/LabelBox.tsx @@ -57,7 +57,8 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps, LabelDocument } } - @observable backColor = "unset"; + @observable _mouseOver = false; + @computed get backColor() { return this.clicked || this._mouseOver ? StrCast(this.layoutDoc.hovercolor) : "unset"; } @observable clicked = false; // (!missingParams || !missingParams.length ? "" : "(" + missingParams.map(m => m + ":").join(" ") + ")") @@ -66,8 +67,11 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps, LabelDocument const missingParams = params?.filter(p => !this.paramsDoc[p]); params?.map(p => DocListCast(this.paramsDoc[p])); // bcz: really hacky form of prefetching ... return ( - <div className="labelBox-outerDiv" onClick={() => runInAction(() => { this.clicked = !this.clicked; this.clicked ? this.backColor = StrCast(this.layoutDoc.hovercolor) : this.backColor = "unset" })} onMouseLeave={() => runInAction(() => { !this.clicked ? this.backColor = "unset" : null })} - onMouseOver={() => runInAction(() => { this.backColor = StrCast(this.layoutDoc.hovercolor); })} ref={this.createDropTarget} onContextMenu={this.specificContextMenu} + <div className="labelBox-outerDiv" + onClick={action(() => this.clicked = !this.clicked)} + onMouseLeave={action(() => this._mouseOver = false)} + onMouseOver={action(() => this._mouseOver = true)} + ref={this.createDropTarget} onContextMenu={this.specificContextMenu} style={{ boxShadow: this.layoutDoc.opacity ? StrCast(this.layoutDoc.boxShadow) : "" }}> <div className="labelBox-mainButton" style={{ background: StrCast(this.layoutDoc.backgroundColor), |