aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/LabelBox.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2020-08-05 17:15:02 -0400
committerbobzel <zzzman@gmail.com>2020-08-05 17:15:02 -0400
commitd254d35d8d1fc10e9ca7ef5b9db06cd138b2d102 (patch)
treef006424685a8971cc430a1eb9afb4483465a5d64 /src/client/views/nodes/LabelBox.tsx
parenta9fbb81375d3e97b808d2cb90e68c9716ee916b7 (diff)
parent201da4ecf5c91595dc1c7fb51e360bb75af613f8 (diff)
Merge branch 'schema_search'
Diffstat (limited to 'src/client/views/nodes/LabelBox.tsx')
-rw-r--r--src/client/views/nodes/LabelBox.tsx14
1 files changed, 12 insertions, 2 deletions
diff --git a/src/client/views/nodes/LabelBox.tsx b/src/client/views/nodes/LabelBox.tsx
index 05ba6628c..826ccd340 100644
--- a/src/client/views/nodes/LabelBox.tsx
+++ b/src/client/views/nodes/LabelBox.tsx
@@ -1,4 +1,4 @@
-import { action } from 'mobx';
+import { action, computed, observable, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
import { Doc, DocListCast } from '../../../fields/Doc';
@@ -56,16 +56,26 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps, LabelDocument
e.stopPropagation();
}
}
+
+ @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(" ") + ")")
render() {
const params = Cast(this.paramsDoc["onClick-paramFieldKeys"], listSpec("string"), []);
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" 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),
+ backgroundColor: this.backColor,
color: StrCast(this.layoutDoc.color, "inherit"),
fontSize: StrCast(this.layoutDoc._fontSize) || "inherit",
fontFamily: StrCast(this.layoutDoc._fontFamily) || "inherit",