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.
275 lines
12 KiB
275 lines
12 KiB
3 years ago
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
||
|
|
import _typeof from "@babel/runtime/helpers/typeof";
|
||
|
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
||
|
|
var _excluded = ["format"],
|
||
|
|
_excluded2 = ["children", "count", "parent", "i18nKey", "context", "tOptions", "values", "defaults", "components", "ns", "i18n", "t", "shouldUnescape"];
|
||
|
|
|
||
|
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
||
|
|
|
||
|
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
||
|
|
|
||
|
|
import { useContext, isValidElement, cloneElement, createElement } from 'react';
|
||
|
|
import HTML from 'html-parse-stringify';
|
||
|
|
import { getI18n, I18nContext, getDefaults } from './context';
|
||
|
|
import { warn, warnOnce } from './utils';
|
||
|
|
|
||
|
|
function hasChildren(node, checkLength) {
|
||
|
|
if (!node) return false;
|
||
|
|
var base = node.props ? node.props.children : node.children;
|
||
|
|
if (checkLength) return base.length > 0;
|
||
|
|
return !!base;
|
||
|
|
}
|
||
|
|
|
||
|
|
function getChildren(node) {
|
||
|
|
if (!node) return [];
|
||
|
|
return node.props ? node.props.children : node.children;
|
||
|
|
}
|
||
|
|
|
||
|
|
function hasValidReactChildren(children) {
|
||
|
|
if (Object.prototype.toString.call(children) !== '[object Array]') return false;
|
||
|
|
return children.every(function (child) {
|
||
|
|
return isValidElement(child);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function getAsArray(data) {
|
||
|
|
return Array.isArray(data) ? data : [data];
|
||
|
|
}
|
||
|
|
|
||
|
|
function mergeProps(source, target) {
|
||
|
|
var newTarget = _objectSpread({}, target);
|
||
|
|
|
||
|
|
newTarget.props = Object.assign(source.props, target.props);
|
||
|
|
return newTarget;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function nodesToString(children, i18nOptions) {
|
||
|
|
if (!children) return '';
|
||
|
|
var stringNode = '';
|
||
|
|
var childrenArray = getAsArray(children);
|
||
|
|
var keepArray = i18nOptions.transSupportBasicHtmlNodes && i18nOptions.transKeepBasicHtmlNodesFor ? i18nOptions.transKeepBasicHtmlNodesFor : [];
|
||
|
|
childrenArray.forEach(function (child, childIndex) {
|
||
|
|
if (typeof child === 'string') {
|
||
|
|
stringNode += "".concat(child);
|
||
|
|
} else if (isValidElement(child)) {
|
||
|
|
var childPropsCount = Object.keys(child.props).length;
|
||
|
|
var shouldKeepChild = keepArray.indexOf(child.type) > -1;
|
||
|
|
var childChildren = child.props.children;
|
||
|
|
|
||
|
|
if (!childChildren && shouldKeepChild && childPropsCount === 0) {
|
||
|
|
stringNode += "<".concat(child.type, "/>");
|
||
|
|
} else if (!childChildren && (!shouldKeepChild || childPropsCount !== 0)) {
|
||
|
|
stringNode += "<".concat(childIndex, "></").concat(childIndex, ">");
|
||
|
|
} else if (child.props.i18nIsDynamicList) {
|
||
|
|
stringNode += "<".concat(childIndex, "></").concat(childIndex, ">");
|
||
|
|
} else if (shouldKeepChild && childPropsCount === 1 && typeof childChildren === 'string') {
|
||
|
|
stringNode += "<".concat(child.type, ">").concat(childChildren, "</").concat(child.type, ">");
|
||
|
|
} else {
|
||
|
|
var content = nodesToString(childChildren, i18nOptions);
|
||
|
|
stringNode += "<".concat(childIndex, ">").concat(content, "</").concat(childIndex, ">");
|
||
|
|
}
|
||
|
|
} else if (child === null) {
|
||
|
|
warn("Trans: the passed in value is invalid - seems you passed in a null child.");
|
||
|
|
} else if (_typeof(child) === 'object') {
|
||
|
|
var format = child.format,
|
||
|
|
clone = _objectWithoutProperties(child, _excluded);
|
||
|
|
|
||
|
|
var keys = Object.keys(clone);
|
||
|
|
|
||
|
|
if (keys.length === 1) {
|
||
|
|
var value = format ? "".concat(keys[0], ", ").concat(format) : keys[0];
|
||
|
|
stringNode += "{{".concat(value, "}}");
|
||
|
|
} else {
|
||
|
|
warn("react-i18next: the passed in object contained more than one variable - the object should look like {{ value, format }} where format is optional.", child);
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
warn("Trans: the passed in value is invalid - seems you passed in a variable like {number} - please pass in variables for interpolation as full objects like {{number}}.", child);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
return stringNode;
|
||
|
|
}
|
||
|
|
|
||
|
|
function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts, shouldUnescape) {
|
||
|
|
if (targetString === '') return [];
|
||
|
|
var keepArray = i18nOptions.transKeepBasicHtmlNodesFor || [];
|
||
|
|
var emptyChildrenButNeedsHandling = targetString && new RegExp(keepArray.join('|')).test(targetString);
|
||
|
|
if (!children && !emptyChildrenButNeedsHandling) return [targetString];
|
||
|
|
var data = {};
|
||
|
|
|
||
|
|
function getData(childs) {
|
||
|
|
var childrenArray = getAsArray(childs);
|
||
|
|
childrenArray.forEach(function (child) {
|
||
|
|
if (typeof child === 'string') return;
|
||
|
|
if (hasChildren(child)) getData(getChildren(child));else if (_typeof(child) === 'object' && !isValidElement(child)) Object.assign(data, child);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
getData(children);
|
||
|
|
var ast = HTML.parse("<0>".concat(targetString, "</0>"));
|
||
|
|
|
||
|
|
var opts = _objectSpread(_objectSpread({}, data), combinedTOpts);
|
||
|
|
|
||
|
|
function renderInner(child, node, rootReactNode) {
|
||
|
|
var childs = getChildren(child);
|
||
|
|
var mappedChildren = mapAST(childs, node.children, rootReactNode);
|
||
|
|
return hasValidReactChildren(childs) && mappedChildren.length === 0 ? childs : mappedChildren;
|
||
|
|
}
|
||
|
|
|
||
|
|
function pushTranslatedJSX(child, inner, mem, i, isVoid) {
|
||
|
|
if (child.dummy) child.children = inner;
|
||
|
|
mem.push(cloneElement(child, _objectSpread(_objectSpread({}, child.props), {}, {
|
||
|
|
key: i
|
||
|
|
}), isVoid ? undefined : inner));
|
||
|
|
}
|
||
|
|
|
||
|
|
function mapAST(reactNode, astNode, rootReactNode) {
|
||
|
|
var reactNodes = getAsArray(reactNode);
|
||
|
|
var astNodes = getAsArray(astNode);
|
||
|
|
return astNodes.reduce(function (mem, node, i) {
|
||
|
|
var translationContent = node.children && node.children[0] && node.children[0].content && i18n.services.interpolator.interpolate(node.children[0].content, opts, i18n.language);
|
||
|
|
|
||
|
|
if (node.type === 'tag') {
|
||
|
|
var tmp = reactNodes[parseInt(node.name, 10)];
|
||
|
|
if (!tmp && rootReactNode.length === 1 && rootReactNode[0][node.name]) tmp = rootReactNode[0][node.name];
|
||
|
|
if (!tmp) tmp = {};
|
||
|
|
var child = Object.keys(node.attrs).length !== 0 ? mergeProps({
|
||
|
|
props: node.attrs
|
||
|
|
}, tmp) : tmp;
|
||
|
|
var isElement = isValidElement(child);
|
||
|
|
var isValidTranslationWithChildren = isElement && hasChildren(node, true) && !node.voidElement;
|
||
|
|
var isEmptyTransWithHTML = emptyChildrenButNeedsHandling && _typeof(child) === 'object' && child.dummy && !isElement;
|
||
|
|
var isKnownComponent = _typeof(children) === 'object' && children !== null && Object.hasOwnProperty.call(children, node.name);
|
||
|
|
|
||
|
|
if (typeof child === 'string') {
|
||
|
|
var value = i18n.services.interpolator.interpolate(child, opts, i18n.language);
|
||
|
|
mem.push(value);
|
||
|
|
} else if (hasChildren(child) || isValidTranslationWithChildren) {
|
||
|
|
var inner = renderInner(child, node, rootReactNode);
|
||
|
|
pushTranslatedJSX(child, inner, mem, i);
|
||
|
|
} else if (isEmptyTransWithHTML) {
|
||
|
|
var _inner = mapAST(reactNodes, node.children, rootReactNode);
|
||
|
|
|
||
|
|
mem.push(cloneElement(child, _objectSpread(_objectSpread({}, child.props), {}, {
|
||
|
|
key: i
|
||
|
|
}), _inner));
|
||
|
|
} else if (Number.isNaN(parseFloat(node.name))) {
|
||
|
|
if (isKnownComponent) {
|
||
|
|
var _inner2 = renderInner(child, node, rootReactNode);
|
||
|
|
|
||
|
|
pushTranslatedJSX(child, _inner2, mem, i, node.voidElement);
|
||
|
|
} else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {
|
||
|
|
if (node.voidElement) {
|
||
|
|
mem.push(createElement(node.name, {
|
||
|
|
key: "".concat(node.name, "-").concat(i)
|
||
|
|
}));
|
||
|
|
} else {
|
||
|
|
var _inner3 = mapAST(reactNodes, node.children, rootReactNode);
|
||
|
|
|
||
|
|
mem.push(createElement(node.name, {
|
||
|
|
key: "".concat(node.name, "-").concat(i)
|
||
|
|
}, _inner3));
|
||
|
|
}
|
||
|
|
} else if (node.voidElement) {
|
||
|
|
mem.push("<".concat(node.name, " />"));
|
||
|
|
} else {
|
||
|
|
var _inner4 = mapAST(reactNodes, node.children, rootReactNode);
|
||
|
|
|
||
|
|
mem.push("<".concat(node.name, ">").concat(_inner4, "</").concat(node.name, ">"));
|
||
|
|
}
|
||
|
|
} else if (_typeof(child) === 'object' && !isElement) {
|
||
|
|
var content = node.children[0] ? translationContent : null;
|
||
|
|
if (content) mem.push(content);
|
||
|
|
} else if (node.children.length === 1 && translationContent) {
|
||
|
|
mem.push(cloneElement(child, _objectSpread(_objectSpread({}, child.props), {}, {
|
||
|
|
key: i
|
||
|
|
}), translationContent));
|
||
|
|
} else {
|
||
|
|
mem.push(cloneElement(child, _objectSpread(_objectSpread({}, child.props), {}, {
|
||
|
|
key: i
|
||
|
|
})));
|
||
|
|
}
|
||
|
|
} else if (node.type === 'text') {
|
||
|
|
var wrapTextNodes = i18nOptions.transWrapTextNodes;
|
||
|
|
|
||
|
|
var _content = shouldUnescape ? i18nOptions.unescape(i18n.services.interpolator.interpolate(node.content, opts, i18n.language)) : i18n.services.interpolator.interpolate(node.content, opts, i18n.language);
|
||
|
|
|
||
|
|
if (wrapTextNodes) {
|
||
|
|
mem.push(createElement(wrapTextNodes, {
|
||
|
|
key: "".concat(node.name, "-").concat(i)
|
||
|
|
}, _content));
|
||
|
|
} else {
|
||
|
|
mem.push(_content);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
return mem;
|
||
|
|
}, []);
|
||
|
|
}
|
||
|
|
|
||
|
|
var result = mapAST([{
|
||
|
|
dummy: true,
|
||
|
|
children: children || []
|
||
|
|
}], ast, getAsArray(children || []));
|
||
|
|
return getChildren(result[0]);
|
||
|
|
}
|
||
|
|
|
||
|
|
export function Trans(_ref) {
|
||
|
|
var children = _ref.children,
|
||
|
|
count = _ref.count,
|
||
|
|
parent = _ref.parent,
|
||
|
|
i18nKey = _ref.i18nKey,
|
||
|
|
context = _ref.context,
|
||
|
|
_ref$tOptions = _ref.tOptions,
|
||
|
|
tOptions = _ref$tOptions === void 0 ? {} : _ref$tOptions,
|
||
|
|
values = _ref.values,
|
||
|
|
defaults = _ref.defaults,
|
||
|
|
components = _ref.components,
|
||
|
|
ns = _ref.ns,
|
||
|
|
i18nFromProps = _ref.i18n,
|
||
|
|
tFromProps = _ref.t,
|
||
|
|
shouldUnescape = _ref.shouldUnescape,
|
||
|
|
additionalProps = _objectWithoutProperties(_ref, _excluded2);
|
||
|
|
|
||
|
|
var _ref2 = useContext(I18nContext) || {},
|
||
|
|
i18nFromContext = _ref2.i18n,
|
||
|
|
defaultNSFromContext = _ref2.defaultNS;
|
||
|
|
|
||
|
|
var i18n = i18nFromProps || i18nFromContext || getI18n();
|
||
|
|
|
||
|
|
if (!i18n) {
|
||
|
|
warnOnce('You will need to pass in an i18next instance by using i18nextReactModule');
|
||
|
|
return children;
|
||
|
|
}
|
||
|
|
|
||
|
|
var t = tFromProps || i18n.t.bind(i18n) || function (k) {
|
||
|
|
return k;
|
||
|
|
};
|
||
|
|
|
||
|
|
if (context) tOptions.context = context;
|
||
|
|
|
||
|
|
var reactI18nextOptions = _objectSpread(_objectSpread({}, getDefaults()), i18n.options && i18n.options.react);
|
||
|
|
|
||
|
|
var namespaces = ns || t.ns || defaultNSFromContext || i18n.options && i18n.options.defaultNS;
|
||
|
|
namespaces = typeof namespaces === 'string' ? [namespaces] : namespaces || ['translation'];
|
||
|
|
var defaultValue = defaults || nodesToString(children, reactI18nextOptions) || reactI18nextOptions.transEmptyNodeValue || i18nKey;
|
||
|
|
var hashTransKey = reactI18nextOptions.hashTransKey;
|
||
|
|
var key = i18nKey || (hashTransKey ? hashTransKey(defaultValue) : defaultValue);
|
||
|
|
var interpolationOverride = values ? tOptions.interpolation : {
|
||
|
|
interpolation: _objectSpread(_objectSpread({}, tOptions.interpolation), {}, {
|
||
|
|
prefix: '#$?',
|
||
|
|
suffix: '?$#'
|
||
|
|
})
|
||
|
|
};
|
||
|
|
|
||
|
|
var combinedTOpts = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, tOptions), {}, {
|
||
|
|
count: count
|
||
|
|
}, values), interpolationOverride), {}, {
|
||
|
|
defaultValue: defaultValue,
|
||
|
|
ns: namespaces
|
||
|
|
});
|
||
|
|
|
||
|
|
var translation = key ? t(key, combinedTOpts) : defaultValue;
|
||
|
|
var content = renderNodes(components || children, translation, i18n, reactI18nextOptions, combinedTOpts, shouldUnescape);
|
||
|
|
var useAsParent = parent !== undefined ? parent : reactI18nextOptions.defaultTransParent;
|
||
|
|
return useAsParent ? createElement(useAsParent, additionalProps, content) : content;
|
||
|
|
}
|