diff options
Diffstat (limited to 'packages/website/ts/components/ui')
7 files changed, 56 insertions, 56 deletions
diff --git a/packages/website/ts/components/ui/badge.tsx b/packages/website/ts/components/ui/badge.tsx index cf4396047..fae51860e 100644 --- a/packages/website/ts/components/ui/badge.tsx +++ b/packages/website/ts/components/ui/badge.tsx @@ -42,14 +42,14 @@ export class Badge extends React.Component<BadgeProps, BadgeState> { <div className="p1 center" style={badgeStyle} - onMouseOver={this.setHoverState.bind(this, true)} - onMouseOut={this.setHoverState.bind(this, false)} + onMouseOver={this._setHoverState.bind(this, true)} + onMouseOut={this._setHoverState.bind(this, false)} > {this.props.title} </div> ); } - private setHoverState(isHovering: boolean) { + private _setHoverState(isHovering: boolean) { this.setState({ isHovering, }); diff --git a/packages/website/ts/components/ui/copy_icon.tsx b/packages/website/ts/components/ui/copy_icon.tsx index 3c50430df..754f5d456 100644 --- a/packages/website/ts/components/ui/copy_icon.tsx +++ b/packages/website/ts/components/ui/copy_icon.tsx @@ -15,8 +15,8 @@ interface CopyIconState { } export class CopyIcon extends React.Component<CopyIconProps, CopyIconState> { - private copyTooltipTimeoutId: number; - private copyable: HTMLInputElement; + private _copyTooltipTimeoutId: number; + private _copyable: HTMLInputElement; constructor(props: CopyIconProps) { super(props); this.state = { @@ -25,25 +25,25 @@ export class CopyIcon extends React.Component<CopyIconProps, CopyIconState> { } public componentDidUpdate() { // Remove tooltip if hover away - if (!this.state.isHovering && this.copyTooltipTimeoutId) { - clearInterval(this.copyTooltipTimeoutId); - this.hideTooltip(); + if (!this.state.isHovering && this._copyTooltipTimeoutId) { + clearInterval(this._copyTooltipTimeoutId); + this._hideTooltip(); } } public render() { return ( <div className="inline-block"> - <CopyToClipboard text={this.props.data} onCopy={this.onCopy.bind(this)}> + <CopyToClipboard text={this.props.data} onCopy={this._onCopy.bind(this)}> <div className="inline flex" style={{cursor: 'pointer', color: colors.amber600}} - ref={this.setRefToProperty.bind(this)} + ref={this._setRefToProperty.bind(this)} data-tip={true} data-for="copy" data-event="click" data-iscapture={true} // This let's the click event continue to propogate - onMouseOver={this.setHoverState.bind(this, true)} - onMouseOut={this.setHoverState.bind(this, false)} + onMouseOver={this._setHoverState.bind(this, true)} + onMouseOut={this._setHoverState.bind(this, false)} > <div> <i style={{fontSize: 15}} className="zmdi zmdi-copy" /> @@ -57,25 +57,25 @@ export class CopyIcon extends React.Component<CopyIconProps, CopyIconState> { </div> ); } - private setRefToProperty(el: HTMLInputElement) { - this.copyable = el; + private _setRefToProperty(el: HTMLInputElement) { + this._copyable = el; } - private setHoverState(isHovering: boolean) { + private _setHoverState(isHovering: boolean) { this.setState({ isHovering, }); } - private onCopy() { - if (this.copyTooltipTimeoutId) { - clearInterval(this.copyTooltipTimeoutId); + private _onCopy() { + if (this._copyTooltipTimeoutId) { + clearInterval(this._copyTooltipTimeoutId); } const tooltipLifespanMs = 1000; - this.copyTooltipTimeoutId = window.setTimeout(() => { - this.hideTooltip(); + this._copyTooltipTimeoutId = window.setTimeout(() => { + this._hideTooltip(); }, tooltipLifespanMs); } - private hideTooltip() { - ReactTooltip.hide(ReactDOM.findDOMNode(this.copyable)); + private _hideTooltip() { + ReactTooltip.hide(ReactDOM.findDOMNode(this._copyable)); } } diff --git a/packages/website/ts/components/ui/drop_down_menu_item.tsx b/packages/website/ts/components/ui/drop_down_menu_item.tsx index 55347cb98..ee26e004e 100644 --- a/packages/website/ts/components/ui/drop_down_menu_item.tsx +++ b/packages/website/ts/components/ui/drop_down_menu_item.tsx @@ -28,8 +28,8 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro menuItemStyle: DEFAULT_STYLE, isNightVersion: false, }; - private isHovering: boolean; - private popoverCloseCheckIntervalId: number; + private _isHovering: boolean; + private _popoverCloseCheckIntervalId: number; constructor(props: DropDownMenuItemProps) { super(props); this.state = { @@ -37,20 +37,20 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro }; } public componentDidMount() { - this.popoverCloseCheckIntervalId = window.setInterval(() => { - this.checkIfShouldClosePopover(); + this._popoverCloseCheckIntervalId = window.setInterval(() => { + this._checkIfShouldClosePopover(); }, CHECK_CLOSE_POPOVER_INTERVAL_MS); } public componentWillUnmount() { - window.clearInterval(this.popoverCloseCheckIntervalId); + window.clearInterval(this._popoverCloseCheckIntervalId); } public render() { const colorStyle = this.props.isNightVersion ? 'white' : this.props.style.color; return ( <div style={{...this.props.style, color: colorStyle}} - onMouseEnter={this.onHover.bind(this)} - onMouseLeave={this.onHoverOff.bind(this)} + onMouseEnter={this._onHover.bind(this)} + onMouseLeave={this._onHoverOff.bind(this)} > <div className="flex relative"> <div style={{paddingRight: 10}}> @@ -65,12 +65,12 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro anchorEl={this.state.anchorEl} anchorOrigin={{horizontal: 'middle', vertical: 'bottom'}} targetOrigin={{horizontal: 'middle', vertical: 'top'}} - onRequestClose={this.closePopover.bind(this)} + onRequestClose={this._closePopover.bind(this)} useLayerForClickAway={false} > <div - onMouseEnter={this.onHover.bind(this)} - onMouseLeave={this.onHoverOff.bind(this)} + onMouseEnter={this._onHover.bind(this)} + onMouseLeave={this._onHoverOff.bind(this)} > <Menu style={{color: colors.grey}}> {this.props.subMenuItems} @@ -80,11 +80,11 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro </div> ); } - private onHover(event: React.FormEvent<HTMLInputElement>) { - this.isHovering = true; - this.checkIfShouldOpenPopover(event); + private _onHover(event: React.FormEvent<HTMLInputElement>) { + this._isHovering = true; + this._checkIfShouldOpenPopover(event); } - private checkIfShouldOpenPopover(event: React.FormEvent<HTMLInputElement>) { + private _checkIfShouldOpenPopover(event: React.FormEvent<HTMLInputElement>) { if (this.state.isDropDownOpen) { return; // noop } @@ -94,16 +94,16 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro anchorEl: event.currentTarget, }); } - private onHoverOff(event: React.FormEvent<HTMLInputElement>) { - this.isHovering = false; + private _onHoverOff(event: React.FormEvent<HTMLInputElement>) { + this._isHovering = false; } - private checkIfShouldClosePopover() { - if (!this.state.isDropDownOpen || this.isHovering) { + private _checkIfShouldClosePopover() { + if (!this.state.isDropDownOpen || this._isHovering) { return; // noop } - this.closePopover(); + this._closePopover(); } - private closePopover() { + private _closePopover() { this.setState({ isDropDownOpen: false, }); diff --git a/packages/website/ts/components/ui/flash_message.tsx b/packages/website/ts/components/ui/flash_message.tsx index ab4edbbb0..c0c00463e 100644 --- a/packages/website/ts/components/ui/flash_message.tsx +++ b/packages/website/ts/components/ui/flash_message.tsx @@ -26,7 +26,7 @@ export class FlashMessage extends React.Component<FlashMessageProps, FlashMessag open={true} message={this.props.flashMessage} autoHideDuration={this.props.showDurationMs} - onRequestClose={this.onClose.bind(this)} + onRequestClose={this._onClose.bind(this)} bodyStyle={this.props.bodyStyle} /> ); @@ -34,7 +34,7 @@ export class FlashMessage extends React.Component<FlashMessageProps, FlashMessag return null; } } - private onClose() { + private _onClose() { this.props.dispatcher.hideFlashMessage(); } } diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx index 08e8bc9ce..852975ef6 100644 --- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx +++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx @@ -35,8 +35,8 @@ export class LifeCycleRaisedButton extends backgroundColor: colors.white, labelColor: colors.darkGrey, }; - private buttonTimeoutId: number; - private didUnmount: boolean; + private _buttonTimeoutId: number; + private _didUnmount: boolean; constructor(props: LifeCycleRaisedButtonProps) { super(props); this.state = { @@ -44,8 +44,8 @@ export class LifeCycleRaisedButton extends }; } public componentWillUnmount() { - clearTimeout(this.buttonTimeoutId); - this.didUnmount = true; + clearTimeout(this._buttonTimeoutId); + this._didUnmount = true; } public render() { if (this.props.isHidden) { @@ -83,14 +83,14 @@ export class LifeCycleRaisedButton extends buttonState: ButtonState.LOADING, }); const didSucceed = await this.props.onClickAsyncFn(); - if (this.didUnmount) { + if (this._didUnmount) { return; // noop since unmount called before async callback returned. } if (didSucceed) { this.setState({ buttonState: ButtonState.COMPLETE, }); - this.buttonTimeoutId = window.setTimeout(() => { + this._buttonTimeoutId = window.setTimeout(() => { this.setState({ buttonState: ButtonState.READY, }); diff --git a/packages/website/ts/components/ui/menu_item.tsx b/packages/website/ts/components/ui/menu_item.tsx index c7ce7439f..3ec993476 100644 --- a/packages/website/ts/components/ui/menu_item.tsx +++ b/packages/website/ts/components/ui/menu_item.tsx @@ -35,15 +35,15 @@ export class MenuItem extends React.Component<MenuItemProps, MenuItemState> { onClick={this.props.onClick.bind(this)} className={`mx-auto ${this.props.className}`} style={menuItemStyles} - onMouseEnter={this.onToggleHover.bind(this, true)} - onMouseLeave={this.onToggleHover.bind(this, false)} + onMouseEnter={this._onToggleHover.bind(this, true)} + onMouseLeave={this._onToggleHover.bind(this, false)} > {this.props.children} </div> </Link> ); } - private onToggleHover(isHovering: boolean) { + private _onToggleHover(isHovering: boolean) { this.setState({ isHovering, }); diff --git a/packages/website/ts/components/ui/swap_icon.tsx b/packages/website/ts/components/ui/swap_icon.tsx index 124e7018c..2adefbda3 100644 --- a/packages/website/ts/components/ui/swap_icon.tsx +++ b/packages/website/ts/components/ui/swap_icon.tsx @@ -27,8 +27,8 @@ export class SwapIcon extends React.Component<SwapIconProps, SwapIconState> { className="mx-auto pt4" style={{cursor: 'pointer', height: 50, width: 37.5}} onClick={this.props.swapTokensFn} - onMouseEnter={this.onToggleHover.bind(this, true)} - onMouseLeave={this.onToggleHover.bind(this, false)} + onMouseEnter={this._onToggleHover.bind(this, true)} + onMouseLeave={this._onToggleHover.bind(this, false)} > <i style={swapStyles} @@ -37,7 +37,7 @@ export class SwapIcon extends React.Component<SwapIconProps, SwapIconState> { </div> ); } - private onToggleHover(isHovering: boolean) { + private _onToggleHover(isHovering: boolean) { this.setState({ isHovering, }); |