Commit dfeb9225 by Wee

style: fit strict TS

parent 2f1c62b4
import * as warning from 'warning' /* tslint:disable:no-redundant-jsdoc */
// This project was originally written in JavaScript, since there's some Js doc remained.
import * as invariant from 'invariant' import * as invariant from 'invariant'
import * as React from 'react'
import * as PropTypes from 'prop-types' import * as PropTypes from 'prop-types'
import * as React from 'react'
import * as ReactDOM from 'react-dom' import * as ReactDOM from 'react-dom'
import { matchPath, Route, RouteProps } from 'react-router'
import { isValidElementType } from 'react-is' import { isValidElementType } from 'react-is'
import { matchPath, RouteProps, Router } from 'react-router'
import * as warning from 'warning'
const isEmptyChildren = children => React.Children.count(children) === 0 const isEmptyChildren = children => React.Children.count(children) === 0
...@@ -33,7 +36,7 @@ const debugLog = (message: any) => { ...@@ -33,7 +36,7 @@ const debugLog = (message: any) => {
* The public API for matching a single path and rendering. * The public API for matching a single path and rendering.
*/ */
class LiveRoute extends React.Component<IProps, any> { class LiveRoute extends React.Component<IProps, any> {
static propTypes = { public static propTypes = {
computedMatch: PropTypes.object, // private, from <Switch> computedMatch: PropTypes.object, // private, from <Switch>
path: PropTypes.string, path: PropTypes.string,
exact: PropTypes.bool, exact: PropTypes.bool,
...@@ -53,11 +56,11 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -53,11 +56,11 @@ class LiveRoute extends React.Component<IProps, any> {
name: PropTypes.string // for LiveRoute debug name: PropTypes.string // for LiveRoute debug
} }
static defaultProps = { public static defaultProps = {
alwaysLive: false alwaysLive: false
} }
static contextTypes = { public static contextTypes = {
router: PropTypes.shape({ router: PropTypes.shape({
history: PropTypes.object.isRequired, history: PropTypes.object.isRequired,
route: PropTypes.object.isRequired, route: PropTypes.object.isRequired,
...@@ -65,14 +68,20 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -65,14 +68,20 @@ class LiveRoute extends React.Component<IProps, any> {
}) })
} }
static childContextTypes = { public static childContextTypes = {
router: PropTypes.object.isRequired router: PropTypes.object.isRequired
} }
_latestMatchedRouter: any public _latestMatchedRouter: any
routeDom: CacheDom = null public routeDom: CacheDom = null
public liveState: LiveState = LiveState.NORMAL_RENDER_ON_INIT
public scrollPosBackup: { left: number; top: number } | null = null
public previousDisplayStyle: string | null = null
public state = {
match: this.computeMatch(this.props as any, this.context.router)
}
getChildContext() { public getChildContext() {
return { return {
router: { router: {
...this.context.router, ...this.context.router,
...@@ -84,15 +93,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -84,15 +93,7 @@ class LiveRoute extends React.Component<IProps, any> {
} }
} }
state = { public componentWillMount() {
match: this.computeMatch(this.props as any, this.context.router)
}
liveState: LiveState = LiveState.NORMAL_RENDER_ON_INIT
scrollPosBackup: { left: number; top: number } | null = null
previousDisplayStyle: string | null = null
componentWillMount() {
warning( warning(
!(this.props.component && this.props.render), !(this.props.component && this.props.render),
'You should not use <Route component> and <Route render> in the same route; <Route render> will be ignored' 'You should not use <Route component> and <Route render> in the same route; <Route render> will be ignored'
...@@ -109,7 +110,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -109,7 +110,7 @@ class LiveRoute extends React.Component<IProps, any> {
) )
} }
componentDidMount() { public componentDidMount() {
// backup router and get DOM when mounting // backup router and get DOM when mounting
if (this.doesRouteEnableLive() && this.state.match) { if (this.doesRouteEnableLive() && this.state.match) {
this._latestMatchedRouter = this.context.router this._latestMatchedRouter = this.context.router
...@@ -117,7 +118,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -117,7 +118,7 @@ class LiveRoute extends React.Component<IProps, any> {
} }
} }
componentWillReceiveProps(nextProps, nextContext) { public componentWillReceiveProps(nextProps, nextContext) {
warning( warning(
!(nextProps.location && !this.props.location), !(nextProps.location && !this.props.location),
'<Route> elements should not change from uncontrolled to controlled (or vice versa). You initially used no "location" prop and then provided one on a subsequent render.' '<Route> elements should not change from uncontrolled to controlled (or vice versa). You initially used no "location" prop and then provided one on a subsequent render.'
...@@ -142,7 +143,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -142,7 +143,7 @@ class LiveRoute extends React.Component<IProps, any> {
} }
// get route of DOM // get route of DOM
componentDidUpdate(prevProps, prevState) { public componentDidUpdate(prevProps, prevState) {
if (!this.doesRouteEnableLive()) { if (!this.doesRouteEnableLive()) {
return return
} }
...@@ -162,11 +163,11 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -162,11 +163,11 @@ class LiveRoute extends React.Component<IProps, any> {
} }
// clear on unmounting // clear on unmounting
componentWillUnmount() { public componentWillUnmount() {
this.clearScroll() this.clearScroll()
} }
doesRouteEnableLive() { public doesRouteEnableLive() {
return this.props.livePath || this.props.alwaysLive return this.props.livePath || this.props.alwaysLive
} }
...@@ -183,7 +184,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -183,7 +184,7 @@ class LiveRoute extends React.Component<IProps, any> {
* @memberof Route * @memberof Route
* Back up current router every time it is rendered normally, backing up to the next livePath rendering * Back up current router every time it is rendered normally, backing up to the next livePath rendering
*/ */
computeMatchWithLive(props, nextProps, nextContext, match) { public computeMatchWithLive(props, nextProps, nextContext, match) {
debugLog(`>>> name: ${this.props.name} <<<`) debugLog(`>>> name: ${this.props.name} <<<`)
// compute if livePath match // compute if livePath match
const { livePath, alwaysLive } = nextProps const { livePath, alwaysLive } = nextProps
...@@ -224,7 +225,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -224,7 +225,7 @@ class LiveRoute extends React.Component<IProps, any> {
this.clearDomData() this.clearDomData()
} }
computePathsMatch({ computedMatch, location, paths, strict, exact, sensitive }, router) { public computePathsMatch({ computedMatch, location, paths, strict, exact, sensitive }, router) {
invariant(router, 'You should not use <Route> or withRouter() outside a <Router>') invariant(router, 'You should not use <Route> or withRouter() outside a <Router>')
const { route } = router const { route } = router
const pathname = (location || route.location).pathname const pathname = (location || route.location).pathname
...@@ -247,7 +248,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -247,7 +248,7 @@ class LiveRoute extends React.Component<IProps, any> {
} }
} }
computeMatch({ computedMatch, location, path, strict, exact, sensitive }, router) { public computeMatch({ computedMatch, location, path, strict, exact, sensitive }, router) {
// DO NOT use the computedMatch from Switch! // DO NOT use the computedMatch from Switch!
// react-live-route: ignore match from <Switch>, actually LiveRoute should not be wrapped by <Switch>. // react-live-route: ignore match from <Switch>, actually LiveRoute should not be wrapped by <Switch>.
// if (computedMatch) return computedMatch // <Switch> already computed the match for us // if (computedMatch) return computedMatch // <Switch> already computed the match for us
...@@ -260,13 +261,13 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -260,13 +261,13 @@ class LiveRoute extends React.Component<IProps, any> {
} }
// get DOM of Route // get DOM of Route
getRouteDom() { public getRouteDom() {
let routeDom = ReactDOM.findDOMNode(this) let routeDom = ReactDOM.findDOMNode(this)
this.routeDom = routeDom as CacheDom this.routeDom = routeDom as CacheDom
} }
// backup scroll and hide DOM // backup scroll and hide DOM
hideRoute() { public hideRoute() {
if (this.routeDom && this.routeDom.style.display !== 'none') { if (this.routeDom && this.routeDom.style.display !== 'none') {
debugLog('--- hide route ---') debugLog('--- hide route ---')
this.previousDisplayStyle = this.routeDom.style.display this.previousDisplayStyle = this.routeDom.style.display
...@@ -275,14 +276,14 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -275,14 +276,14 @@ class LiveRoute extends React.Component<IProps, any> {
} }
// reveal DOM display // reveal DOM display
showRoute() { public showRoute() {
if (this.routeDom && this.previousDisplayStyle !== null) { if (this.routeDom && this.previousDisplayStyle !== null) {
this.routeDom.style.display = this.previousDisplayStyle this.routeDom.style.display = this.previousDisplayStyle
} }
} }
// save scroll position before hide DOM // save scroll position before hide DOM
saveScrollPosition() { public saveScrollPosition() {
if (this.routeDom && this.scrollPosBackup === null) { if (this.routeDom && this.scrollPosBackup === null) {
const scrollTop = document.documentElement.scrollTop || document.body.scrollTop const scrollTop = document.documentElement.scrollTop || document.body.scrollTop
const scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft const scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft
...@@ -292,7 +293,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -292,7 +293,7 @@ class LiveRoute extends React.Component<IProps, any> {
} }
// restore the scroll position before hide // restore the scroll position before hide
restoreScrollPosition() { public restoreScrollPosition() {
const scroll = this.scrollPosBackup const scroll = this.scrollPosBackup
debugLog(scroll) debugLog(scroll)
if (scroll && this.routeDom) { if (scroll && this.routeDom) {
...@@ -301,7 +302,7 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -301,7 +302,7 @@ class LiveRoute extends React.Component<IProps, any> {
} }
// clear scroll position // clear scroll position
clearDomData() { public clearDomData() {
if (this.doesRouteEnableLive()) { if (this.doesRouteEnableLive()) {
this.routeDom = null this.routeDom = null
this.previousDisplayStyle = null this.previousDisplayStyle = null
...@@ -309,20 +310,20 @@ class LiveRoute extends React.Component<IProps, any> { ...@@ -309,20 +310,20 @@ class LiveRoute extends React.Component<IProps, any> {
} }
// clear scroll position // clear scroll position
clearScroll() { public clearScroll() {
if (this.doesRouteEnableLive()) { if (this.doesRouteEnableLive()) {
this.scrollPosBackup = null this.scrollPosBackup = null
} }
} }
// normally render or unmount Route // normally render or unmount Route
renderRoute(component, render, props, match) { public renderRoute(component, render, props, match) {
debugLog(match) debugLog(match)
if (component) return match ? React.createElement(component, props) : null if (component) return match ? React.createElement(component, props) : null
if (render) return match ? render(props) : null if (render) return match ? render(props) : null
} }
render() { public render() {
const { match } = this.state const { match } = this.state
const { children, component, render: propRender, livePath, alwaysLive, onHide } = this.props const { children, component, render: propRender, livePath, alwaysLive, onHide } = this.props
const { history, route, staticContext } = this.context.router const { history, route, staticContext } = this.context.router
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment