@git-temporal/git-temporal-react
Version:
<!-- START doctoc generated TOC please keep comment here to allow auto update --> <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
61 lines (60 loc) • 2.1 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const styles_1 = require("app/styles");
const initialState = {
isHovering: false,
};
const containerStyle = {
_extends: ['normalText'],
padding: 5,
border: '1px solid transparent',
};
const hoverContainerStyle = {
_extends: [containerStyle, 'selectable'],
};
const disabledContainerStyle = {
_extends: [containerStyle, 'disabledText'],
};
const selectedContainerStyle = {
_extends: [containerStyle, 'selected'],
};
const DOUBLE_CLICK_DELAY_MS = 500;
class Selectable extends react_1.default.Component {
constructor() {
super(...arguments);
this.state = initialState;
this.onClick = evt => {
const now = Date.now();
if (this.lastClick &&
now - this.lastClick <= DOUBLE_CLICK_DELAY_MS &&
this.props.onDoubleClick) {
this.props.onDoubleClick(evt, this.props.value);
}
else {
this.props.onClick(evt, this.props.value);
}
this.lastClick = now;
};
this.onMouseOver = () => {
this.setState({ isHovering: true });
};
this.onMouseLeave = () => {
this.setState({ isHovering: false });
};
}
render() {
const outerStyle = this.props.disabled
? disabledContainerStyle
: this.props.selected
? selectedContainerStyle
: this.state.isHovering
? hoverContainerStyle
: containerStyle;
return (react_1.default.createElement("div", { style: styles_1.style(outerStyle, this.props.style), onClick: this.onClick, onMouseOver: this.onMouseOver, onMouseLeave: this.onMouseLeave, "data-testid": this.props.testId }, this.props.children));
}
}
exports.Selectable = Selectable;