You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
149 lines
5.1 KiB
149 lines
5.1 KiB
4 years ago
|
import { RX_ENCODED_COMMA, RX_ENCODE_REVERSE, RX_PLUS, RX_QUERY_START } from '../constants/regex';
|
||
|
import { isTag } from './dom';
|
||
|
import { isArray, isNull, isPlainObject, isString, isUndefined } from './inspect';
|
||
|
import { keys } from './object';
|
||
|
import { toString } from './string';
|
||
|
var ANCHOR_TAG = 'a'; // Method to replace reserved chars
|
||
|
|
||
|
var encodeReserveReplacer = function encodeReserveReplacer(c) {
|
||
|
return '%' + c.charCodeAt(0).toString(16);
|
||
|
}; // Fixed encodeURIComponent which is more conformant to RFC3986:
|
||
|
// - escapes [!'()*]
|
||
|
// - preserve commas
|
||
|
|
||
|
|
||
|
var encode = function encode(str) {
|
||
|
return encodeURIComponent(toString(str)).replace(RX_ENCODE_REVERSE, encodeReserveReplacer).replace(RX_ENCODED_COMMA, ',');
|
||
|
};
|
||
|
|
||
|
var decode = decodeURIComponent; // Stringifies an object of query parameters
|
||
|
// See: https://github.com/vuejs/vue-router/blob/dev/src/util/query.js
|
||
|
|
||
|
export var stringifyQueryObj = function stringifyQueryObj(obj) {
|
||
|
if (!isPlainObject(obj)) {
|
||
|
return '';
|
||
|
}
|
||
|
|
||
|
var query = keys(obj).map(function (key) {
|
||
|
var val = obj[key];
|
||
|
|
||
|
if (isUndefined(val)) {
|
||
|
return '';
|
||
|
} else if (isNull(val)) {
|
||
|
return encode(key);
|
||
|
} else if (isArray(val)) {
|
||
|
return val.reduce(function (results, val2) {
|
||
|
if (isNull(val2)) {
|
||
|
results.push(encode(key));
|
||
|
} else if (!isUndefined(val2)) {
|
||
|
// Faster than string interpolation
|
||
|
results.push(encode(key) + '=' + encode(val2));
|
||
|
}
|
||
|
|
||
|
return results;
|
||
|
}, []).join('&');
|
||
|
} // Faster than string interpolation
|
||
|
|
||
|
|
||
|
return encode(key) + '=' + encode(val);
|
||
|
})
|
||
|
/* must check for length, as we only want to filter empty strings, not things that look falsey! */
|
||
|
.filter(function (x) {
|
||
|
return x.length > 0;
|
||
|
}).join('&');
|
||
|
return query ? "?".concat(query) : '';
|
||
|
};
|
||
|
export var parseQuery = function parseQuery(query) {
|
||
|
var parsed = {};
|
||
|
query = toString(query).trim().replace(RX_QUERY_START, '');
|
||
|
|
||
|
if (!query) {
|
||
|
return parsed;
|
||
|
}
|
||
|
|
||
|
query.split('&').forEach(function (param) {
|
||
|
var parts = param.replace(RX_PLUS, ' ').split('=');
|
||
|
var key = decode(parts.shift());
|
||
|
var val = parts.length > 0 ? decode(parts.join('=')) : null;
|
||
|
|
||
|
if (isUndefined(parsed[key])) {
|
||
|
parsed[key] = val;
|
||
|
} else if (isArray(parsed[key])) {
|
||
|
parsed[key].push(val);
|
||
|
} else {
|
||
|
parsed[key] = [parsed[key], val];
|
||
|
}
|
||
|
});
|
||
|
return parsed;
|
||
|
};
|
||
|
export var isLink = function isLink(props) {
|
||
|
return !!(props.href || props.to);
|
||
|
};
|
||
|
export var isRouterLink = function isRouterLink(tag) {
|
||
|
return !!(tag && !isTag(tag, 'a'));
|
||
|
};
|
||
|
export var computeTag = function computeTag(_ref, thisOrParent) {
|
||
|
var to = _ref.to,
|
||
|
disabled = _ref.disabled,
|
||
|
routerComponentName = _ref.routerComponentName;
|
||
|
var hasRouter = !!thisOrParent.$router;
|
||
|
|
||
|
if (!hasRouter || hasRouter && (disabled || !to)) {
|
||
|
return ANCHOR_TAG;
|
||
|
} // TODO:
|
||
|
// Check registered components for existence of user supplied router link component name
|
||
|
// We would need to check PascalCase, kebab-case, and camelCase versions of name:
|
||
|
// const name = routerComponentName
|
||
|
// const names = [name, PascalCase(name), KebabCase(name), CamelCase(name)]
|
||
|
// exists = names.some(name => !!thisOrParent.$options.components[name])
|
||
|
// And may want to cache the result for performance or we just let the render fail
|
||
|
// if the component is not registered
|
||
|
|
||
|
|
||
|
return routerComponentName || (thisOrParent.$nuxt ? 'nuxt-link' : 'router-link');
|
||
|
};
|
||
|
export var computeRel = function computeRel() {
|
||
|
var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
||
|
target = _ref2.target,
|
||
|
rel = _ref2.rel;
|
||
|
|
||
|
return target === '_blank' && isNull(rel) ? 'noopener' : rel || null;
|
||
|
};
|
||
|
export var computeHref = function computeHref() {
|
||
|
var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
||
|
href = _ref3.href,
|
||
|
to = _ref3.to;
|
||
|
|
||
|
var tag = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ANCHOR_TAG;
|
||
|
var fallback = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '#';
|
||
|
var toFallback = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '/';
|
||
|
|
||
|
// Return `href` when explicitly provided
|
||
|
if (href) {
|
||
|
return href;
|
||
|
} // We've checked for `$router` in `computeTag()`, so `isRouterLink()` indicates a live router
|
||
|
// When deferring to Vue Router's `<router-link>`, don't use the `href` attribute at all
|
||
|
// We return `null`, and then remove `href` from the attributes passed to `<router-link>`
|
||
|
|
||
|
|
||
|
if (isRouterLink(tag)) {
|
||
|
return null;
|
||
|
} // Fallback to `to` prop (if `to` is a string)
|
||
|
|
||
|
|
||
|
if (isString(to)) {
|
||
|
return to || toFallback;
|
||
|
} // Fallback to `to.path' + `to.query` + `to.hash` prop (if `to` is an object)
|
||
|
|
||
|
|
||
|
if (isPlainObject(to) && (to.path || to.query || to.hash)) {
|
||
|
var path = toString(to.path);
|
||
|
var query = stringifyQueryObj(to.query);
|
||
|
var hash = toString(to.hash);
|
||
|
hash = !hash || hash.charAt(0) === '#' ? hash : "#".concat(hash);
|
||
|
return "".concat(path).concat(query).concat(hash) || toFallback;
|
||
|
} // If nothing is provided return the fallback
|
||
|
|
||
|
|
||
|
return fallback;
|
||
|
};
|