kdu-router 3.0.7 → 3.1.7

package/src/util/resolve-components.js

@@ -0,0 +1,108 @@
+/* @flow */
+
+import { _Kdu } from '../install'
+import { warn, isError } from './warn'
+
+export function resolveAsyncComponents (matched: Array<RouteRecord>): Function {
+  return (to, from, next) => {
+    let hasAsync = false
+    let pending = 0
+    let error = null
+
+    flatMapComponents(matched, (def, _, match, key) => {
+      // if it's a function and doesn't have cid attached,
+      // assume it's an async component resolve function.
+      // we are not using Kdu's default async resolving mechanism because
+      // we want to halt the navigation until the incoming component has been
+      // resolved.
+      if (typeof def === 'function' && def.cid === undefined) {
+        hasAsync = true
+        pending++
+
+        const resolve = once(resolvedDef => {
+          if (isESModule(resolvedDef)) {
+            resolvedDef = resolvedDef.default
+          }
+          // save resolved on async factory in case it's used elsewhere
+          def.resolved = typeof resolvedDef === 'function'
+            ? resolvedDef
+            : _Kdu.extend(resolvedDef)
+          match.components[key] = resolvedDef
+          pending--
+          if (pending <= 0) {
+            next()
+          }
+        })
+
+        const reject = once(reason => {
+          const msg = `Failed to resolve async component ${key}: ${reason}`
+          process.env.NODE_ENV !== 'production' && warn(false, msg)
+          if (!error) {
+            error = isError(reason)
+              ? reason
+              : new Error(msg)
+            next(error)
+          }
+        })
+
+        let res
+        try {
+          res = def(resolve, reject)
+        } catch (e) {
+          reject(e)
+        }
+        if (res) {
+          if (typeof res.then === 'function') {
+            res.then(resolve, reject)
+          } else {
+            // new syntax in Kdu 2.3
+            const comp = res.component
+            if (comp && typeof comp.then === 'function') {
+              comp.then(resolve, reject)
+            }
+          }
+        }
+      }
+    })
+
+    if (!hasAsync) next()
+  }
+}
+
+export function flatMapComponents (
+  matched: Array<RouteRecord>,
+  fn: Function
+): Array<?Function> {
+  return flatten(matched.map(m => {
+    return Object.keys(m.components).map(key => fn(
+      m.components[key],
+      m.instances[key],
+      m, key
+    ))
+  }))
+}
+
+export function flatten (arr: Array<any>): Array<any> {
+  return Array.prototype.concat.apply([], arr)
+}
+
+const hasSymbol =
+  typeof Symbol === 'function' &&
+  typeof Symbol.toStringTag === 'symbol'
+
+function isESModule (obj) {
+  return obj.__esModule || (hasSymbol && obj[Symbol.toStringTag] === 'Module')
+}
+
+// in Webpack 2, require.ensure now also returns a Promise
+// so the resolve/reject functions may get called an extra time
+// if the user uses an arrow function shorthand that happens to
+// return that Promise.
+function once (fn) {
+  let called = false
+  return function (...args) {
+    if (called) return
+    called = true
+    return fn.apply(this, args)
+  }
+}

package/src/util/route.js

@@ -0,0 +1,132 @@
+/* @flow */
+
+import type KduRouter from '../index'
+import { stringifyQuery } from './query'
+
+const trailingSlashRE = /\/?$/
+
+export function createRoute (
+  record: ?RouteRecord,
+  location: Location,
+  redirectedFrom?: ?Location,
+  router?: KduRouter
+): Route {
+  const stringifyQuery = router && router.options.stringifyQuery
+
+  let query: any = location.query || {}
+  try {
+    query = clone(query)
+  } catch (e) {}
+
+  const route: Route = {
+    name: location.name || (record && record.name),
+    meta: (record && record.meta) || {},
+    path: location.path || '/',
+    hash: location.hash || '',
+    query,
+    params: location.params || {},
+    fullPath: getFullPath(location, stringifyQuery),
+    matched: record ? formatMatch(record) : []
+  }
+  if (redirectedFrom) {
+    route.redirectedFrom = getFullPath(redirectedFrom, stringifyQuery)
+  }
+  return Object.freeze(route)
+}
+
+function clone (value) {
+  if (Array.isArray(value)) {
+    return value.map(clone)
+  } else if (value && typeof value === 'object') {
+    const res = {}
+    for (const key in value) {
+      res[key] = clone(value[key])
+    }
+    return res
+  } else {
+    return value
+  }
+}
+
+// the starting route that represents the initial state
+export const START = createRoute(null, {
+  path: '/'
+})
+
+function formatMatch (record: ?RouteRecord): Array<RouteRecord> {
+  const res = []
+  while (record) {
+    res.unshift(record)
+    record = record.parent
+  }
+  return res
+}
+
+function getFullPath (
+  { path, query = {}, hash = '' },
+  _stringifyQuery
+): string {
+  const stringify = _stringifyQuery || stringifyQuery
+  return (path || '/') + stringify(query) + hash
+}
+
+export function isSameRoute (a: Route, b: ?Route): boolean {
+  if (b === START) {
+    return a === b
+  } else if (!b) {
+    return false
+  } else if (a.path && b.path) {
+    return (
+      a.path.replace(trailingSlashRE, '') === b.path.replace(trailingSlashRE, '') &&
+      a.hash === b.hash &&
+      isObjectEqual(a.query, b.query)
+    )
+  } else if (a.name && b.name) {
+    return (
+      a.name === b.name &&
+      a.hash === b.hash &&
+      isObjectEqual(a.query, b.query) &&
+      isObjectEqual(a.params, b.params)
+    )
+  } else {
+    return false
+  }
+}
+
+function isObjectEqual (a = {}, b = {}): boolean {
+  // handle null value #1566
+  if (!a || !b) return a === b
+  const aKeys = Object.keys(a)
+  const bKeys = Object.keys(b)
+  if (aKeys.length !== bKeys.length) {
+    return false
+  }
+  return aKeys.every(key => {
+    const aVal = a[key]
+    const bVal = b[key]
+    // check nested equality
+    if (typeof aVal === 'object' && typeof bVal === 'object') {
+      return isObjectEqual(aVal, bVal)
+    }
+    return String(aVal) === String(bVal)
+  })
+}
+
+export function isIncludedRoute (current: Route, target: Route): boolean {
+  return (
+    current.path.replace(trailingSlashRE, '/').indexOf(
+      target.path.replace(trailingSlashRE, '/')
+    ) === 0 &&
+    (!target.hash || current.hash === target.hash) &&
+    queryIncludes(current.query, target.query)
+  )
+}
+
+function queryIncludes (current: Dictionary<string>, target: Dictionary<string>): boolean {
+  for (const key in target) {
+    if (!(key in current)) {
+      return false
+    }
+  }
+  return true
+}

package/src/util/scroll.js

@@ -0,0 +1,156 @@
+/* @flow */
+
+import type Router from '../index'
+import { assert } from './warn'
+import { getStateKey, setStateKey } from './state-key'
+import { extend } from './misc'
+
+const positionStore = Object.create(null)
+
+export function setupScroll () {
+  // Fix for #1585 for Firefox
+  // Fix for #2195 Add optional third attribute to workaround a bug in safari https://bugs.webkit.org/show_bug.cgi?id=182678
+  // Fix for #2774 Support for apps loaded from Windows file shares not mapped to network drives: replaced location.origin with
+  // window.location.protocol + '//' + window.location.host
+  // location.host contains the port and location.hostname doesn't
+  const protocolAndPath = window.location.protocol + '//' + window.location.host
+  const absolutePath = window.location.href.replace(protocolAndPath, '')
+  // preserve existing history state as it could be overriden by the user
+  const stateCopy = extend({}, window.history.state)
+  stateCopy.key = getStateKey()
+  window.history.replaceState(stateCopy, '', absolutePath)
+  window.addEventListener('popstate', e => {
+    saveScrollPosition()
+    if (e.state && e.state.key) {
+      setStateKey(e.state.key)
+    }
+  })
+}
+
+export function handleScroll (
+  router: Router,
+  to: Route,
+  from: Route,
+  isPop: boolean
+) {
+  if (!router.app) {
+    return
+  }
+
+  const behavior = router.options.scrollBehavior
+  if (!behavior) {
+    return
+  }
+
+  if (process.env.NODE_ENV !== 'production') {
+    assert(typeof behavior === 'function', `scrollBehavior must be a function`)
+  }
+
+  // wait until re-render finishes before scrolling
+  router.app.$nextTick(() => {
+    const position = getScrollPosition()
+    const shouldScroll = behavior.call(
+      router,
+      to,
+      from,
+      isPop ? position : null
+    )
+
+    if (!shouldScroll) {
+      return
+    }
+
+    if (typeof shouldScroll.then === 'function') {
+      shouldScroll
+        .then(shouldScroll => {
+          scrollToPosition((shouldScroll: any), position)
+        })
+        .catch(err => {
+          if (process.env.NODE_ENV !== 'production') {
+            assert(false, err.toString())
+          }
+        })
+    } else {
+      scrollToPosition(shouldScroll, position)
+    }
+  })
+}
+
+export function saveScrollPosition () {
+  const key = getStateKey()
+  if (key) {
+    positionStore[key] = {
+      x: window.pageXOffset,
+      y: window.pageYOffset
+    }
+  }
+}
+
+function getScrollPosition (): ?Object {
+  const key = getStateKey()
+  if (key) {
+    return positionStore[key]
+  }
+}
+
+function getElementPosition (el: Element, offset: Object): Object {
+  const docEl: any = document.documentElement
+  const docRect = docEl.getBoundingClientRect()
+  const elRect = el.getBoundingClientRect()
+  return {
+    x: elRect.left - docRect.left - offset.x,
+    y: elRect.top - docRect.top - offset.y
+  }
+}
+
+function isValidPosition (obj: Object): boolean {
+  return isNumber(obj.x) || isNumber(obj.y)
+}
+
+function normalizePosition (obj: Object): Object {
+  return {
+    x: isNumber(obj.x) ? obj.x : window.pageXOffset,
+    y: isNumber(obj.y) ? obj.y : window.pageYOffset
+  }
+}
+
+function normalizeOffset (obj: Object): Object {
+  return {
+    x: isNumber(obj.x) ? obj.x : 0,
+    y: isNumber(obj.y) ? obj.y : 0
+  }
+}
+
+function isNumber (v: any): boolean {
+  return typeof v === 'number'
+}
+
+const hashStartsWithNumberRE = /^#\d/
+
+function scrollToPosition (shouldScroll, position) {
+  const isObject = typeof shouldScroll === 'object'
+  if (isObject && typeof shouldScroll.selector === 'string') {
+    // getElementById would still fail if the selector contains a more complicated query like #main[data-attr]
+    // but at the same time, it doesn't make much sense to select an element with an id and an extra selector
+    const el = hashStartsWithNumberRE.test(shouldScroll.selector) // $flow-disable-line
+      ? document.getElementById(shouldScroll.selector.slice(1)) // $flow-disable-line
+      : document.querySelector(shouldScroll.selector)
+
+    if (el) {
+      let offset =
+        shouldScroll.offset && typeof shouldScroll.offset === 'object'
+          ? shouldScroll.offset
+          : {}
+      offset = normalizeOffset(offset)
+      position = getElementPosition(el, offset)
+    } else if (isValidPosition(shouldScroll)) {
+      position = normalizePosition(shouldScroll)
+    }
+  } else if (isObject && isValidPosition(shouldScroll)) {
+    position = normalizePosition(shouldScroll)
+  }
+
+  if (position) {
+    window.scrollTo(position.x, position.y)
+  }
+}

package/src/util/state-key.js

@@ -0,0 +1,22 @@
+/* @flow */
+import { inBrowser } from './dom'
+
+// use User Timing api (if present) for more accurate key precision
+const Time =
+  inBrowser && window.performance && window.performance.now
+    ? window.performance
+    : Date
+
+export function genStateKey (): string {
+  return Time.now().toFixed(3)
+}
+
+let _key: string = genStateKey()
+
+export function getStateKey () {
+  return _key
+}
+
+export function setStateKey (key: string) {
+  return (_key = key)
+}

package/src/util/warn.js

@@ -0,0 +1,25 @@
+/* @flow */
+
+export function assert (condition: any, message: string) {
+  if (!condition) {
+    throw new Error(`[kdu-router] ${message}`)
+  }
+}
+
+export function warn (condition: any, message: string) {
+  if (process.env.NODE_ENV !== 'production' && !condition) {
+    typeof console !== 'undefined' && console.warn(`[kdu-router] ${message}`)
+  }
+}
+
+export function isError (err: any): boolean {
+  return Object.prototype.toString.call(err).indexOf('Error') > -1
+}
+
+export function isExtendedError (constructor: Function, err: any): boolean {
+  return (
+    err instanceof constructor ||
+    // _name is to support IE9 too
+    (err && (err.name === constructor.name || err._name === constructor._name))
+  )
+}

package/types/index.d.ts

@@ -1,7 +1,7 @@
-import "./kdu";
-import { KduRouter } from "./router";
+import './kdu'
+import { KduRouter } from './router'
 
-export default KduRouter;
+export default KduRouter
 
 export {
   RouterMode,
@@ -13,4 +13,4 @@ export {
   Location,
   Route,
   NavigationGuard
-} from "./router";
+} from './router'

package/types/kdu.d.ts

@@ -2,21 +2,21 @@
  * Augment the typings of Kdu.js
  */
 
-import Kdu from "kdu";
-import KduRouter, { Route, RawLocation, NavigationGuard } from "./index";
+import Kdu from 'kdu'
+import KduRouter, { Route, RawLocation, NavigationGuard } from './index'
 
-declare module "kdu/types/kdu" {
+declare module 'kdu/types/kdu' {
   interface Kdu {
-    $router: KduRouter;
-    $route: Route;
+    $router: KduRouter
+    $route: Route
   }
 }
 
-declare module "kdu/types/options" {
+declare module 'kdu/types/options' {
   interface ComponentOptions<V extends Kdu> {
-    router?: KduRouter;
-    beforeRouteEnter?: NavigationGuard<V>;
-    beforeRouteLeave?: NavigationGuard<V>;
-    beforeRouteUpdate?: NavigationGuard<V>;
+    router?: KduRouter
+    beforeRouteEnter?: NavigationGuard<V>
+    beforeRouteLeave?: NavigationGuard<V>
+    beforeRouteUpdate?: NavigationGuard<V>
   }
 }