talkr
Version:
Talkr is the lightest i18n provider for React applications. It supports Typescript, provides autocompletion, has 0 dependencies, and is very easy to use.
118 lines (109 loc) • 3.21 kB
JavaScript
;
var React = require('react');
function _interopNamespace(e) {
if (e && e.__esModule) return e;
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () { return e[k]; }
});
}
});
}
n.default = e;
return Object.freeze(n);
}
var React__namespace = /*#__PURE__*/_interopNamespace(React);
// src/index.tsx
// src/initLocale.ts
var getBrowserLanguage = (defaultLanguage) => {
if (typeof navigator !== "undefined") {
return navigator.language.split("-")[0];
}
return defaultLanguage;
};
var initLocale = (defaultLanguage, detectBrowserLanguage = false) => {
if (detectBrowserLanguage) return getBrowserLanguage(defaultLanguage);
return defaultLanguage;
};
// src/tr.tsx
var getPlural = (count, locale) => {
if (typeof Intl == "object" && typeof Intl.PluralRules == "function") {
return new Intl.PluralRules(locale).select(count);
}
return count === 0 ? "zero" : count === 1 ? "one" : "other";
};
var getList = (list, locale, options) => {
if (typeof Intl == "object" && typeof Intl.ListFormat == "function") {
const formatter = new Intl.ListFormat(locale, {
style: options?.listStyle || "narrow",
type: options?.listType || "conjunction"
});
return formatter.format(list);
}
return list.join(", ");
};
function tr({ locale, languages, defaultLanguage }, key, params) {
const currentLocale = !languages[locale] ? defaultLanguage : locale;
let result = languages[currentLocale];
let currentKey = key;
if (params && Object.keys(params).includes("count")) {
const plural = getPlural(params.count, currentLocale);
currentKey += params.count === 0 ? ".zero" : plural === "other" ? ".many" : `.${plural}`;
}
if (params?.gender) {
currentKey += params.gender === "m" ? ".male" : ".female";
}
currentKey.split(".").forEach((k) => {
if (!result[k]) return;
return result = result[k];
});
if (Array.isArray(result)) {
return getList(result, locale, params);
}
if (typeof result === "string") {
return params ? result.split("__").map((word) => params[word] || word).join("") : result;
}
console.warn(`Talkr: Missing translation for ${key}`);
return "";
}
// src/index.tsx
var TalkrContext = React.createContext({
locale: "",
setLocale: () => null,
languages: {},
defaultLanguage: ""
});
function Talkr({
children,
languages,
defaultLanguage,
detectBrowserLanguage
}) {
const [locale, setLocale] = React.useState(
initLocale(defaultLanguage, detectBrowserLanguage)
);
return /* @__PURE__ */ React__namespace.createElement(
TalkrContext.Provider,
{
value: { locale, setLocale, languages, defaultLanguage }
},
children
);
}
function useT() {
const { setLocale, ...props } = React.useContext(TalkrContext);
return {
...props,
setLocale,
T: (key, params) => tr(props, key, params)
};
}
exports.Talkr = Talkr;
exports.TalkrContext = TalkrContext;
exports.tr = tr;
exports.useT = useT;