@chayns-components/translation 5.0.0-beta.1131 → 5.0.0-beta.1136

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/lib/cjs/components/AdaptiveTranslation.js +7 -3
  2. package/lib/cjs/components/AdaptiveTranslation.js.map +1 -1
  3. package/lib/cjs/components/TranslationOptionsProvider.js +26 -0
  4. package/lib/cjs/components/TranslationOptionsProvider.js.map +1 -0
  5. package/lib/cjs/constants/translationOptionsContext.js +14 -0
  6. package/lib/cjs/constants/translationOptionsContext.js.map +1 -0
  7. package/lib/cjs/hooks/useAdaptiveTranslation.js +4 -7
  8. package/lib/cjs/hooks/useAdaptiveTranslation.js.map +1 -1
  9. package/lib/cjs/index.js +7 -0
  10. package/lib/cjs/index.js.map +1 -1
  11. package/lib/cjs/types/translation.js.map +1 -1
  12. package/lib/esm/components/AdaptiveTranslation.js +7 -3
  13. package/lib/esm/components/AdaptiveTranslation.js.map +1 -1
  14. package/lib/esm/components/TranslationOptionsProvider.js +19 -0
  15. package/lib/esm/components/TranslationOptionsProvider.js.map +1 -0
  16. package/lib/esm/constants/translationOptionsContext.js +7 -0
  17. package/lib/esm/constants/translationOptionsContext.js.map +1 -0
  18. package/lib/esm/hooks/useAdaptiveTranslation.js +5 -8
  19. package/lib/esm/hooks/useAdaptiveTranslation.js.map +1 -1
  20. package/lib/esm/index.js +1 -0
  21. package/lib/esm/index.js.map +1 -1
  22. package/lib/esm/types/translation.js.map +1 -1
  23. package/lib/types/components/AdaptiveTranslation.d.ts +1 -1
  24. package/lib/types/components/TranslationOptionsProvider.d.ts +12 -0
  25. package/lib/types/constants/translationOptionsContext.d.ts +6 -0
  26. package/lib/types/index.d.ts +1 -0
  27. package/lib/types/types/translation.d.ts +3 -0
  28. package/package.json +3 -2
@@ -5,13 +5,16 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
+ var _clsx = _interopRequireDefault(require("clsx"));
8
9
  var _useAdaptiveTranslation = require("../hooks/useAdaptiveTranslation");
9
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
11
  const AdaptiveTranslation = ({
11
12
  children,
12
13
  to,
13
14
  from,
14
- tagName: TagName = 'span'
15
+ tagName: TagName = 'span',
16
+ style,
17
+ className
15
18
  }) => {
16
19
  const {
17
20
  text,
@@ -22,11 +25,12 @@ const AdaptiveTranslation = ({
22
25
  to
23
26
  });
24
27
  return /*#__PURE__*/_react.default.createElement(TagName, {
25
- className: "notranslate",
28
+ className: (0, _clsx.default)('notranslate', className),
26
29
  style: {
27
30
  // eslint-disable-next-line no-nested-ternary
28
31
  opacity: isLoading ? 0 : isFetching ? 0.5 : 1,
29
- transition: 'opacity 0.5s ease'
32
+ transition: 'opacity 0.5s ease',
33
+ ...style
30
34
  }
31
35
  }, text);
32
36
  };
@@ -1 +1 @@
1
- {"version":3,"file":"AdaptiveTranslation.js","names":["_react","_interopRequireDefault","require","_useAdaptiveTranslation","e","__esModule","default","AdaptiveTranslation","children","to","from","tagName","TagName","text","isLoading","isFetching","useAdaptiveTranslation","createElement","className","style","opacity","transition","_default","exports"],"sources":["../../../src/components/AdaptiveTranslation.tsx"],"sourcesContent":["import React from 'react';\nimport { useAdaptiveTranslation } from '../hooks/useAdaptiveTranslation';\nimport { TranslationProps } from '../types/translation';\n\nconst AdaptiveTranslation = ({\n children,\n to,\n from,\n tagName: TagName = 'span',\n}: TranslationProps) => {\n const { text, isLoading, isFetching } = useAdaptiveTranslation(children, { from, to });\n\n return (\n <TagName\n className=\"notranslate\"\n style={{\n // eslint-disable-next-line no-nested-ternary\n opacity: isLoading ? 0 : isFetching ? 0.5 : 1,\n transition: 'opacity 0.5s ease',\n }}\n >\n {text}\n </TagName>\n );\n};\nexport default AdaptiveTranslation;\n"],"mappings":";;;;;;AAAC,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACD,IAAAC,uBAAA,GAAAD,OAAA;AAAyE,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGzE,MAAMG,mBAAmB,GAAGA,CAAC;EACzBC,QAAQ;EACRC,EAAE;EACFC,IAAI;EACJC,OAAO,EAAEC,OAAO,GAAG;AACL,CAAC,KAAK;EACpB,MAAM;IAAEC,IAAI;IAAEC,SAAS;IAAEC;EAAW,CAAC,GAAG,IAAAC,8CAAsB,EAACR,QAAQ,EAAE;IAAEE,IAAI;IAAED;EAAG,CAAC,CAAC;EAEtF,oBACIT,MAAA,CAAAM,OAAA,CAAAW,aAAA,CAACL,OAAO;IACJM,SAAS,EAAC,aAAa;IACvBC,KAAK,EAAE;MACH;MACAC,OAAO,EAAEN,SAAS,GAAG,CAAC,GAAGC,UAAU,GAAG,GAAG,GAAG,CAAC;MAC7CM,UAAU,EAAE;IAChB;EAAE,GAEDR,IACI,CAAC;AAElB,CAAC;AAAC,IAAAS,QAAA,GAAAC,OAAA,CAAAjB,OAAA,GACaC,mBAAmB","ignoreList":[]}
1
+ {"version":3,"file":"AdaptiveTranslation.js","names":["_react","_interopRequireDefault","require","_clsx","_useAdaptiveTranslation","e","__esModule","default","AdaptiveTranslation","children","to","from","tagName","TagName","style","className","text","isLoading","isFetching","useAdaptiveTranslation","createElement","clsx","opacity","transition","_default","exports"],"sources":["../../../src/components/AdaptiveTranslation.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport { useAdaptiveTranslation } from '../hooks/useAdaptiveTranslation';\nimport { TranslationProps } from '../types/translation';\n\nconst AdaptiveTranslation = ({\n children,\n to,\n from,\n tagName: TagName = 'span',\n style,\n className,\n}: TranslationProps) => {\n const { text, isLoading, isFetching } = useAdaptiveTranslation(children, { from, to });\n\n return (\n <TagName\n className={clsx('notranslate', className)}\n style={{\n // eslint-disable-next-line no-nested-ternary\n opacity: isLoading ? 0 : isFetching ? 0.5 : 1,\n transition: 'opacity 0.5s ease',\n ...style,\n }}\n >\n {text}\n </TagName>\n );\n};\nexport default AdaptiveTranslation;\n"],"mappings":";;;;;;AAAC,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACD,IAAAC,KAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,uBAAA,GAAAF,OAAA;AAAyE,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGzE,MAAMG,mBAAmB,GAAGA,CAAC;EACzBC,QAAQ;EACRC,EAAE;EACFC,IAAI;EACJC,OAAO,EAAEC,OAAO,GAAG,MAAM;EACzBC,KAAK;EACLC;AACc,CAAC,KAAK;EACpB,MAAM;IAAEC,IAAI;IAAEC,SAAS;IAAEC;EAAW,CAAC,GAAG,IAAAC,8CAAsB,EAACV,QAAQ,EAAE;IAAEE,IAAI;IAAED;EAAG,CAAC,CAAC;EAEtF,oBACIV,MAAA,CAAAO,OAAA,CAAAa,aAAA,CAACP,OAAO;IACJE,SAAS,EAAE,IAAAM,aAAI,EAAC,aAAa,EAAEN,SAAS,CAAE;IAC1CD,KAAK,EAAE;MACH;MACAQ,OAAO,EAAEL,SAAS,GAAG,CAAC,GAAGC,UAAU,GAAG,GAAG,GAAG,CAAC;MAC7CK,UAAU,EAAE,mBAAmB;MAC/B,GAAGT;IACP;EAAE,GAEDE,IACI,CAAC;AAElB,CAAC;AAAC,IAAAQ,QAAA,GAAAC,OAAA,CAAAlB,OAAA,GACaC,mBAAmB","ignoreList":[]}
@@ -0,0 +1,26 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = exports.TranslationOptionsProvider = void 0;
7
+ var _react = _interopRequireWildcard(require("react"));
8
+ var _translationOptionsContext = require("../constants/translationOptionsContext");
9
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
10
+ const TranslationOptionsProvider = ({
11
+ from,
12
+ to,
13
+ children
14
+ }) => {
15
+ const value = (0, _react.useMemo)(() => ({
16
+ from,
17
+ to
18
+ }), [from, to]);
19
+ return /*#__PURE__*/_react.default.createElement(_translationOptionsContext.TranslationOptionsContext.Provider, {
20
+ value: value
21
+ }, children);
22
+ };
23
+ exports.TranslationOptionsProvider = TranslationOptionsProvider;
24
+ TranslationOptionsProvider.displayName = 'TranslationOptionsProvider';
25
+ var _default = exports.default = TranslationOptionsProvider;
26
+ //# sourceMappingURL=TranslationOptionsProvider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TranslationOptionsProvider.js","names":["_react","_interopRequireWildcard","require","_translationOptionsContext","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","TranslationOptionsProvider","from","to","children","value","useMemo","createElement","TranslationOptionsContext","Provider","exports","displayName","_default"],"sources":["../../../src/components/TranslationOptionsProvider.tsx"],"sourcesContent":["import { Language } from 'chayns-api';\nimport React, { useMemo } from 'react';\nimport { TranslationOptionsContext } from '../constants/translationOptionsContext';\n\ntype TranslationOptionsProviderProps = {\n from: Exclude<Language, Language.Unknown>;\n to: Exclude<Language, Language.Unknown>;\n children: React.ReactNode;\n};\n\nexport const TranslationOptionsProvider = ({\n from,\n to,\n children,\n}: TranslationOptionsProviderProps) => {\n const value = useMemo(() => ({ from, to }), [from, to]);\n\n return (\n <TranslationOptionsContext.Provider value={value}>\n {children}\n </TranslationOptionsContext.Provider>\n );\n};\n\nTranslationOptionsProvider.displayName = 'TranslationOptionsProvider';\n\nexport default TranslationOptionsProvider;\n"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,0BAAA,GAAAD,OAAA;AAAmF,SAAAD,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAQ5E,MAAMkB,0BAA0B,GAAGA,CAAC;EACvCC,IAAI;EACJC,EAAE;EACFC;AAC6B,CAAC,KAAK;EACnC,MAAMC,KAAK,GAAG,IAAAC,cAAO,EAAC,OAAO;IAAEJ,IAAI;IAAEC;EAAG,CAAC,CAAC,EAAE,CAACD,IAAI,EAAEC,EAAE,CAAC,CAAC;EAEvD,oBACIzB,MAAA,CAAAc,OAAA,CAAAe,aAAA,CAAC1B,0BAAA,CAAA2B,yBAAyB,CAACC,QAAQ;IAACJ,KAAK,EAAEA;EAAM,GAC5CD,QAC+B,CAAC;AAE7C,CAAC;AAACM,OAAA,CAAAT,0BAAA,GAAAA,0BAAA;AAEFA,0BAA0B,CAACU,WAAW,GAAG,4BAA4B;AAAC,IAAAC,QAAA,GAAAF,OAAA,CAAAlB,OAAA,GAEvDS,0BAA0B","ignoreList":[]}
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.TranslationOptionsContext = void 0;
7
+ var _chaynsApi = require("chayns-api");
8
+ var _react = _interopRequireDefault(require("react"));
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
+ const TranslationOptionsContext = exports.TranslationOptionsContext = /*#__PURE__*/_react.default.createContext({
11
+ from: _chaynsApi.Language.German,
12
+ to: _chaynsApi.Language.German
13
+ });
14
+ //# sourceMappingURL=translationOptionsContext.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"translationOptionsContext.js","names":["_chaynsApi","require","_react","_interopRequireDefault","e","__esModule","default","TranslationOptionsContext","exports","React","createContext","from","Language","German","to"],"sources":["../../../src/constants/translationOptionsContext.ts"],"sourcesContent":["import { Language } from 'chayns-api';\nimport React from 'react';\n\nexport const TranslationOptionsContext = React.createContext<{\n from: Exclude<Language, Language.Unknown>;\n to: Exclude<Language, Language.Unknown>;\n}>({\n from: Language.German,\n to: Language.German,\n});\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAA0B,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEnB,MAAMG,yBAAyB,GAAAC,OAAA,CAAAD,yBAAA,gBAAGE,cAAK,CAACC,aAAa,CAGzD;EACCC,IAAI,EAAEC,mBAAQ,CAACC,MAAM;EACrBC,EAAE,EAAEF,mBAAQ,CAACC;AACjB,CAAC,CAAC","ignoreList":[]}
@@ -5,19 +5,16 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.useAdaptiveTranslation = void 0;
7
7
  var _react = require("react");
8
- var _chaynsApi = require("chayns-api");
8
+ var _translationOptionsContext = require("../constants/translationOptionsContext");
9
9
  var _translationHandler = _interopRequireDefault(require("../utils/translationHandler"));
10
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
11
  const useAdaptiveTranslation = (originalText, {
12
12
  to,
13
13
  from
14
14
  } = {}) => {
15
- const {
16
- active,
17
- site
18
- } = (0, _chaynsApi.useLanguage)();
19
- const toLanguage = to || active;
20
- const fromLanguage = from || site;
15
+ const options = (0, _react.useContext)(_translationOptionsContext.TranslationOptionsContext);
16
+ const toLanguage = to || options.to;
17
+ const fromLanguage = from || options.from;
21
18
  const shouldTranslate = (0, _react.useMemo)(() => toLanguage !== fromLanguage, [fromLanguage, toLanguage]);
22
19
  const [translatedText, setTranslatedText] = (0, _react.useState)(originalText);
23
20
  const [isLoading, setIsLoading] = (0, _react.useState)(shouldTranslate);
@@ -1 +1 @@
1
- {"version":3,"file":"useAdaptiveTranslation.js","names":["_react","require","_chaynsApi","_translationHandler","_interopRequireDefault","e","__esModule","default","useAdaptiveTranslation","originalText","to","from","active","site","useLanguage","toLanguage","fromLanguage","shouldTranslate","useMemo","translatedText","setTranslatedText","useState","isLoading","setIsLoading","isFetching","setIsFetching","useEffect","timeoutRef","setTimeout","translationHandler","translateText","then","text","finally","clearTimeout","exports"],"sources":["../../../src/hooks/useAdaptiveTranslation.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport { Language, useLanguage } from 'chayns-api';\nimport translationHandler from '../utils/translationHandler';\n\nexport const useAdaptiveTranslation = (\n originalText: string,\n {\n to,\n from,\n }: {\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n } = {},\n): { text: string; isLoading: boolean; isFetching: boolean } => {\n const { active, site } = useLanguage();\n const toLanguage = to || active;\n const fromLanguage = from || site;\n const shouldTranslate = useMemo(() => toLanguage !== fromLanguage, [fromLanguage, toLanguage]);\n const [translatedText, setTranslatedText] = useState<string>(originalText);\n const [isLoading, setIsLoading] = useState(shouldTranslate);\n const [isFetching, setIsFetching] = useState(false);\n\n useEffect(() => {\n const timeoutRef = setTimeout(() => {\n if (shouldTranslate) {\n setIsFetching(true);\n void translationHandler\n .translateText(originalText, fromLanguage, toLanguage)\n .then((text) => {\n setTranslatedText(text);\n })\n .finally(() => {\n setIsLoading(false);\n setIsFetching(false);\n });\n }\n }, 200);\n\n return () => clearTimeout(timeoutRef);\n }, [originalText, shouldTranslate, toLanguage, fromLanguage]);\n\n return useMemo(\n () => ({\n text: shouldTranslate ? translatedText : originalText,\n isFetching: shouldTranslate ? isFetching : false,\n isLoading: shouldTranslate ? isLoading : false,\n }),\n [isFetching, isLoading, originalText, shouldTranslate, translatedText],\n );\n};\n"],"mappings":";;;;;;AAAC,IAAAA,MAAA,GAAAC,OAAA;AACD,IAAAC,UAAA,GAAAD,OAAA;AACA,IAAAE,mBAAA,GAAAC,sBAAA,CAAAH,OAAA;AAA6D,SAAAG,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEtD,MAAMG,sBAAsB,GAAGA,CAClCC,YAAoB,EACpB;EACIC,EAAE;EACFC;AAIJ,CAAC,GAAG,CAAC,CAAC,KACsD;EAC5D,MAAM;IAAEC,MAAM;IAAEC;EAAK,CAAC,GAAG,IAAAC,sBAAW,EAAC,CAAC;EACtC,MAAMC,UAAU,GAAGL,EAAE,IAAIE,MAAM;EAC/B,MAAMI,YAAY,GAAGL,IAAI,IAAIE,IAAI;EACjC,MAAMI,eAAe,GAAG,IAAAC,cAAO,EAAC,MAAMH,UAAU,KAAKC,YAAY,EAAE,CAACA,YAAY,EAAED,UAAU,CAAC,CAAC;EAC9F,MAAM,CAACI,cAAc,EAAEC,iBAAiB,CAAC,GAAG,IAAAC,eAAQ,EAASZ,YAAY,CAAC;EAC1E,MAAM,CAACa,SAAS,EAAEC,YAAY,CAAC,GAAG,IAAAF,eAAQ,EAACJ,eAAe,CAAC;EAC3D,MAAM,CAACO,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAJ,eAAQ,EAAC,KAAK,CAAC;EAEnD,IAAAK,gBAAS,EAAC,MAAM;IACZ,MAAMC,UAAU,GAAGC,UAAU,CAAC,MAAM;MAChC,IAAIX,eAAe,EAAE;QACjBQ,aAAa,CAAC,IAAI,CAAC;QACnB,KAAKI,2BAAkB,CAClBC,aAAa,CAACrB,YAAY,EAAEO,YAAY,EAAED,UAAU,CAAC,CACrDgB,IAAI,CAAEC,IAAI,IAAK;UACZZ,iBAAiB,CAACY,IAAI,CAAC;QAC3B,CAAC,CAAC,CACDC,OAAO,CAAC,MAAM;UACXV,YAAY,CAAC,KAAK,CAAC;UACnBE,aAAa,CAAC,KAAK,CAAC;QACxB,CAAC,CAAC;MACV;IACJ,CAAC,EAAE,GAAG,CAAC;IAEP,OAAO,MAAMS,YAAY,CAACP,UAAU,CAAC;EACzC,CAAC,EAAE,CAAClB,YAAY,EAAEQ,eAAe,EAAEF,UAAU,EAAEC,YAAY,CAAC,CAAC;EAE7D,OAAO,IAAAE,cAAO,EACV,OAAO;IACHc,IAAI,EAAEf,eAAe,GAAGE,cAAc,GAAGV,YAAY;IACrDe,UAAU,EAAEP,eAAe,GAAGO,UAAU,GAAG,KAAK;IAChDF,SAAS,EAAEL,eAAe,GAAGK,SAAS,GAAG;EAC7C,CAAC,CAAC,EACF,CAACE,UAAU,EAAEF,SAAS,EAAEb,YAAY,EAAEQ,eAAe,EAAEE,cAAc,CACzE,CAAC;AACL,CAAC;AAACgB,OAAA,CAAA3B,sBAAA,GAAAA,sBAAA","ignoreList":[]}
1
+ {"version":3,"file":"useAdaptiveTranslation.js","names":["_react","require","_translationOptionsContext","_translationHandler","_interopRequireDefault","e","__esModule","default","useAdaptiveTranslation","originalText","to","from","options","useContext","TranslationOptionsContext","toLanguage","fromLanguage","shouldTranslate","useMemo","translatedText","setTranslatedText","useState","isLoading","setIsLoading","isFetching","setIsFetching","useEffect","timeoutRef","setTimeout","translationHandler","translateText","then","text","finally","clearTimeout","exports"],"sources":["../../../src/hooks/useAdaptiveTranslation.ts"],"sourcesContent":["import { useContext, useEffect, useMemo, useState } from 'react';\nimport { Language } from 'chayns-api';\nimport { TranslationOptionsContext } from '../constants/translationOptionsContext';\nimport translationHandler from '../utils/translationHandler';\n\nexport const useAdaptiveTranslation = (\n originalText: string,\n {\n to,\n from,\n }: {\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n } = {},\n): { text: string; isLoading: boolean; isFetching: boolean } => {\n const options = useContext(TranslationOptionsContext);\n const toLanguage = to || options.to;\n const fromLanguage = from || options.from;\n const shouldTranslate = useMemo(() => toLanguage !== fromLanguage, [fromLanguage, toLanguage]);\n const [translatedText, setTranslatedText] = useState<string>(originalText);\n const [isLoading, setIsLoading] = useState(shouldTranslate);\n const [isFetching, setIsFetching] = useState(false);\n\n useEffect(() => {\n const timeoutRef = setTimeout(() => {\n if (shouldTranslate) {\n setIsFetching(true);\n void translationHandler\n .translateText(originalText, fromLanguage, toLanguage)\n .then((text) => {\n setTranslatedText(text);\n })\n .finally(() => {\n setIsLoading(false);\n setIsFetching(false);\n });\n }\n }, 200);\n\n return () => clearTimeout(timeoutRef);\n }, [originalText, shouldTranslate, toLanguage, fromLanguage]);\n\n return useMemo(\n () => ({\n text: shouldTranslate ? translatedText : originalText,\n isFetching: shouldTranslate ? isFetching : false,\n isLoading: shouldTranslate ? isLoading : false,\n }),\n [isFetching, isLoading, originalText, shouldTranslate, translatedText],\n );\n};\n"],"mappings":";;;;;;AAAC,IAAAA,MAAA,GAAAC,OAAA;AAED,IAAAC,0BAAA,GAAAD,OAAA;AACA,IAAAE,mBAAA,GAAAC,sBAAA,CAAAH,OAAA;AAA6D,SAAAG,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEtD,MAAMG,sBAAsB,GAAGA,CAClCC,YAAoB,EACpB;EACIC,EAAE;EACFC;AAIJ,CAAC,GAAG,CAAC,CAAC,KACsD;EAC5D,MAAMC,OAAO,GAAG,IAAAC,iBAAU,EAACC,oDAAyB,CAAC;EACrD,MAAMC,UAAU,GAAGL,EAAE,IAAIE,OAAO,CAACF,EAAE;EACnC,MAAMM,YAAY,GAAGL,IAAI,IAAIC,OAAO,CAACD,IAAI;EACzC,MAAMM,eAAe,GAAG,IAAAC,cAAO,EAAC,MAAMH,UAAU,KAAKC,YAAY,EAAE,CAACA,YAAY,EAAED,UAAU,CAAC,CAAC;EAC9F,MAAM,CAACI,cAAc,EAAEC,iBAAiB,CAAC,GAAG,IAAAC,eAAQ,EAASZ,YAAY,CAAC;EAC1E,MAAM,CAACa,SAAS,EAAEC,YAAY,CAAC,GAAG,IAAAF,eAAQ,EAACJ,eAAe,CAAC;EAC3D,MAAM,CAACO,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAJ,eAAQ,EAAC,KAAK,CAAC;EAEnD,IAAAK,gBAAS,EAAC,MAAM;IACZ,MAAMC,UAAU,GAAGC,UAAU,CAAC,MAAM;MAChC,IAAIX,eAAe,EAAE;QACjBQ,aAAa,CAAC,IAAI,CAAC;QACnB,KAAKI,2BAAkB,CAClBC,aAAa,CAACrB,YAAY,EAAEO,YAAY,EAAED,UAAU,CAAC,CACrDgB,IAAI,CAAEC,IAAI,IAAK;UACZZ,iBAAiB,CAACY,IAAI,CAAC;QAC3B,CAAC,CAAC,CACDC,OAAO,CAAC,MAAM;UACXV,YAAY,CAAC,KAAK,CAAC;UACnBE,aAAa,CAAC,KAAK,CAAC;QACxB,CAAC,CAAC;MACV;IACJ,CAAC,EAAE,GAAG,CAAC;IAEP,OAAO,MAAMS,YAAY,CAACP,UAAU,CAAC;EACzC,CAAC,EAAE,CAAClB,YAAY,EAAEQ,eAAe,EAAEF,UAAU,EAAEC,YAAY,CAAC,CAAC;EAE7D,OAAO,IAAAE,cAAO,EACV,OAAO;IACHc,IAAI,EAAEf,eAAe,GAAGE,cAAc,GAAGV,YAAY;IACrDe,UAAU,EAAEP,eAAe,GAAGO,UAAU,GAAG,KAAK;IAChDF,SAAS,EAAEL,eAAe,GAAGK,SAAS,GAAG;EAC7C,CAAC,CAAC,EACF,CAACE,UAAU,EAAEF,SAAS,EAAEb,YAAY,EAAEQ,eAAe,EAAEE,cAAc,CACzE,CAAC;AACL,CAAC;AAACgB,OAAA,CAAA3B,sBAAA,GAAAA,sBAAA","ignoreList":[]}
package/lib/cjs/index.js CHANGED
@@ -9,6 +9,12 @@ Object.defineProperty(exports, "AdaptiveTranslation", {
9
9
  return _AdaptiveTranslation.default;
10
10
  }
11
11
  });
12
+ Object.defineProperty(exports, "TranslationOptionsProvider", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _TranslationOptionsProvider.default;
16
+ }
17
+ });
12
18
  exports.translateText = void 0;
13
19
  Object.defineProperty(exports, "useAdaptiveTranslation", {
14
20
  enumerable: true,
@@ -19,6 +25,7 @@ Object.defineProperty(exports, "useAdaptiveTranslation", {
19
25
  var _translationHandler = _interopRequireDefault(require("./utils/translationHandler"));
20
26
  var _useAdaptiveTranslation = require("./hooks/useAdaptiveTranslation");
21
27
  var _AdaptiveTranslation = _interopRequireDefault(require("./components/AdaptiveTranslation"));
28
+ var _TranslationOptionsProvider = _interopRequireDefault(require("./components/TranslationOptionsProvider"));
22
29
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
23
30
  const translateText = (text, from, to) => _translationHandler.default.translateText(text, from, to);
24
31
  exports.translateText = translateText;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_translationHandler","_interopRequireDefault","require","_useAdaptiveTranslation","_AdaptiveTranslation","e","__esModule","default","translateText","text","from","to","translationHandler","exports"],"sources":["../../src/index.ts"],"sourcesContent":["import translationHandler from './utils/translationHandler';\n\nexport { useAdaptiveTranslation } from './hooks/useAdaptiveTranslation';\nexport { default as AdaptiveTranslation } from './components/AdaptiveTranslation';\nexport const translateText = (text: string, from: string, to: string) =>\n translationHandler.translateText(text, from, to);\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA,IAAAA,mBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,uBAAA,GAAAD,OAAA;AACA,IAAAE,oBAAA,GAAAH,sBAAA,CAAAC,OAAA;AAAkF,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAC3E,MAAMG,aAAa,GAAGA,CAACC,IAAY,EAAEC,IAAY,EAAEC,EAAU,KAChEC,2BAAkB,CAACJ,aAAa,CAACC,IAAI,EAAEC,IAAI,EAAEC,EAAE,CAAC;AAACE,OAAA,CAAAL,aAAA,GAAAA,aAAA","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_translationHandler","_interopRequireDefault","require","_useAdaptiveTranslation","_AdaptiveTranslation","_TranslationOptionsProvider","e","__esModule","default","translateText","text","from","to","translationHandler","exports"],"sources":["../../src/index.ts"],"sourcesContent":["import translationHandler from './utils/translationHandler';\n\nexport { useAdaptiveTranslation } from './hooks/useAdaptiveTranslation';\nexport { default as AdaptiveTranslation } from './components/AdaptiveTranslation';\nexport { default as TranslationOptionsProvider } from './components/TranslationOptionsProvider';\nexport const translateText = (text: string, from: string, to: string) =>\n translationHandler.translateText(text, from, to);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,mBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,uBAAA,GAAAD,OAAA;AACA,IAAAE,oBAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,2BAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAAgG,SAAAD,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AACzF,MAAMG,aAAa,GAAGA,CAACC,IAAY,EAAEC,IAAY,EAAEC,EAAU,KAChEC,2BAAkB,CAACJ,aAAa,CAACC,IAAI,EAAEC,IAAI,EAAEC,EAAE,CAAC;AAACE,OAAA,CAAAL,aAAA,GAAAA,aAAA","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"translation.js","names":[],"sources":["../../../src/types/translation.ts"],"sourcesContent":["import { Language } from 'chayns-api';\nimport { Deferred } from '../utils/deferred';\n\nexport interface TranslationProps {\n children: string;\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n tagName?: keyof HTMLElementTagNameMap;\n}\n\ninterface BaseTranslation {\n text: string;\n to: string;\n from: string;\n}\n\nexport interface QueuedItem extends BaseTranslation {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationBatchItem extends TranslationRequest {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationRequest extends BaseTranslation {\n id: number;\n}\n"],"mappings":"","ignoreList":[]}
1
+ {"version":3,"file":"translation.js","names":[],"sources":["../../../src/types/translation.ts"],"sourcesContent":["import { Language } from 'chayns-api';\nimport React from 'react';\nimport { Deferred } from '../utils/deferred';\n\nexport interface TranslationProps {\n children: string;\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n tagName?: keyof HTMLElementTagNameMap;\n style?: React.CSSProperties;\n className?: string;\n}\n\ninterface BaseTranslation {\n text: string;\n to: string;\n from: string;\n}\n\nexport interface QueuedItem extends BaseTranslation {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationBatchItem extends TranslationRequest {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationRequest extends BaseTranslation {\n id: number;\n}\n"],"mappings":"","ignoreList":[]}
@@ -1,11 +1,14 @@
1
1
  import React from 'react';
2
+ import clsx from 'clsx';
2
3
  import { useAdaptiveTranslation } from '../hooks/useAdaptiveTranslation';
3
4
  const AdaptiveTranslation = _ref => {
4
5
  let {
5
6
  children,
6
7
  to,
7
8
  from,
8
- tagName: TagName = 'span'
9
+ tagName: TagName = 'span',
10
+ style,
11
+ className
9
12
  } = _ref;
10
13
  const {
11
14
  text,
@@ -16,11 +19,12 @@ const AdaptiveTranslation = _ref => {
16
19
  to
17
20
  });
18
21
  return /*#__PURE__*/React.createElement(TagName, {
19
- className: "notranslate",
22
+ className: clsx('notranslate', className),
20
23
  style: {
21
24
  // eslint-disable-next-line no-nested-ternary
22
25
  opacity: isLoading ? 0 : isFetching ? 0.5 : 1,
23
- transition: 'opacity 0.5s ease'
26
+ transition: 'opacity 0.5s ease',
27
+ ...style
24
28
  }
25
29
  }, text);
26
30
  };
@@ -1 +1 @@
1
- {"version":3,"file":"AdaptiveTranslation.js","names":["React","useAdaptiveTranslation","AdaptiveTranslation","_ref","children","to","from","tagName","TagName","text","isLoading","isFetching","createElement","className","style","opacity","transition"],"sources":["../../../src/components/AdaptiveTranslation.tsx"],"sourcesContent":["import React from 'react';\nimport { useAdaptiveTranslation } from '../hooks/useAdaptiveTranslation';\nimport { TranslationProps } from '../types/translation';\n\nconst AdaptiveTranslation = ({\n children,\n to,\n from,\n tagName: TagName = 'span',\n}: TranslationProps) => {\n const { text, isLoading, isFetching } = useAdaptiveTranslation(children, { from, to });\n\n return (\n <TagName\n className=\"notranslate\"\n style={{\n // eslint-disable-next-line no-nested-ternary\n opacity: isLoading ? 0 : isFetching ? 0.5 : 1,\n transition: 'opacity 0.5s ease',\n }}\n >\n {text}\n </TagName>\n );\n};\nexport default AdaptiveTranslation;\n"],"mappings":"AAAC,OAAOA,KAAK,MAAM,OAAO;AAC1B,SAASC,sBAAsB,QAAQ,iCAAiC;AAGxE,MAAMC,mBAAmB,GAAGC,IAAA,IAKJ;EAAA,IALK;IACzBC,QAAQ;IACRC,EAAE;IACFC,IAAI;IACJC,OAAO,EAAEC,OAAO,GAAG;EACL,CAAC,GAAAL,IAAA;EACf,MAAM;IAAEM,IAAI;IAAEC,SAAS;IAAEC;EAAW,CAAC,GAAGV,sBAAsB,CAACG,QAAQ,EAAE;IAAEE,IAAI;IAAED;EAAG,CAAC,CAAC;EAEtF,oBACIL,KAAA,CAAAY,aAAA,CAACJ,OAAO;IACJK,SAAS,EAAC,aAAa;IACvBC,KAAK,EAAE;MACH;MACAC,OAAO,EAAEL,SAAS,GAAG,CAAC,GAAGC,UAAU,GAAG,GAAG,GAAG,CAAC;MAC7CK,UAAU,EAAE;IAChB;EAAE,GAEDP,IACI,CAAC;AAElB,CAAC;AACD,eAAeP,mBAAmB","ignoreList":[]}
1
+ {"version":3,"file":"AdaptiveTranslation.js","names":["React","clsx","useAdaptiveTranslation","AdaptiveTranslation","_ref","children","to","from","tagName","TagName","style","className","text","isLoading","isFetching","createElement","opacity","transition"],"sources":["../../../src/components/AdaptiveTranslation.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport { useAdaptiveTranslation } from '../hooks/useAdaptiveTranslation';\nimport { TranslationProps } from '../types/translation';\n\nconst AdaptiveTranslation = ({\n children,\n to,\n from,\n tagName: TagName = 'span',\n style,\n className,\n}: TranslationProps) => {\n const { text, isLoading, isFetching } = useAdaptiveTranslation(children, { from, to });\n\n return (\n <TagName\n className={clsx('notranslate', className)}\n style={{\n // eslint-disable-next-line no-nested-ternary\n opacity: isLoading ? 0 : isFetching ? 0.5 : 1,\n transition: 'opacity 0.5s ease',\n ...style,\n }}\n >\n {text}\n </TagName>\n );\n};\nexport default AdaptiveTranslation;\n"],"mappings":"AAAC,OAAOA,KAAK,MAAM,OAAO;AAC1B,OAAOC,IAAI,MAAM,MAAM;AACvB,SAASC,sBAAsB,QAAQ,iCAAiC;AAGxE,MAAMC,mBAAmB,GAAGC,IAAA,IAOJ;EAAA,IAPK;IACzBC,QAAQ;IACRC,EAAE;IACFC,IAAI;IACJC,OAAO,EAAEC,OAAO,GAAG,MAAM;IACzBC,KAAK;IACLC;EACc,CAAC,GAAAP,IAAA;EACf,MAAM;IAAEQ,IAAI;IAAEC,SAAS;IAAEC;EAAW,CAAC,GAAGZ,sBAAsB,CAACG,QAAQ,EAAE;IAAEE,IAAI;IAAED;EAAG,CAAC,CAAC;EAEtF,oBACIN,KAAA,CAAAe,aAAA,CAACN,OAAO;IACJE,SAAS,EAAEV,IAAI,CAAC,aAAa,EAAEU,SAAS,CAAE;IAC1CD,KAAK,EAAE;MACH;MACAM,OAAO,EAAEH,SAAS,GAAG,CAAC,GAAGC,UAAU,GAAG,GAAG,GAAG,CAAC;MAC7CG,UAAU,EAAE,mBAAmB;MAC/B,GAAGP;IACP;EAAE,GAEDE,IACI,CAAC;AAElB,CAAC;AACD,eAAeT,mBAAmB","ignoreList":[]}
@@ -0,0 +1,19 @@
1
+ import React, { useMemo } from 'react';
2
+ import { TranslationOptionsContext } from '../constants/translationOptionsContext';
3
+ export const TranslationOptionsProvider = _ref => {
4
+ let {
5
+ from,
6
+ to,
7
+ children
8
+ } = _ref;
9
+ const value = useMemo(() => ({
10
+ from,
11
+ to
12
+ }), [from, to]);
13
+ return /*#__PURE__*/React.createElement(TranslationOptionsContext.Provider, {
14
+ value: value
15
+ }, children);
16
+ };
17
+ TranslationOptionsProvider.displayName = 'TranslationOptionsProvider';
18
+ export default TranslationOptionsProvider;
19
+ //# sourceMappingURL=TranslationOptionsProvider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TranslationOptionsProvider.js","names":["React","useMemo","TranslationOptionsContext","TranslationOptionsProvider","_ref","from","to","children","value","createElement","Provider","displayName"],"sources":["../../../src/components/TranslationOptionsProvider.tsx"],"sourcesContent":["import { Language } from 'chayns-api';\nimport React, { useMemo } from 'react';\nimport { TranslationOptionsContext } from '../constants/translationOptionsContext';\n\ntype TranslationOptionsProviderProps = {\n from: Exclude<Language, Language.Unknown>;\n to: Exclude<Language, Language.Unknown>;\n children: React.ReactNode;\n};\n\nexport const TranslationOptionsProvider = ({\n from,\n to,\n children,\n}: TranslationOptionsProviderProps) => {\n const value = useMemo(() => ({ from, to }), [from, to]);\n\n return (\n <TranslationOptionsContext.Provider value={value}>\n {children}\n </TranslationOptionsContext.Provider>\n );\n};\n\nTranslationOptionsProvider.displayName = 'TranslationOptionsProvider';\n\nexport default TranslationOptionsProvider;\n"],"mappings":"AACA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,yBAAyB,QAAQ,wCAAwC;AAQlF,OAAO,MAAMC,0BAA0B,GAAGC,IAAA,IAIH;EAAA,IAJI;IACvCC,IAAI;IACJC,EAAE;IACFC;EAC6B,CAAC,GAAAH,IAAA;EAC9B,MAAMI,KAAK,GAAGP,OAAO,CAAC,OAAO;IAAEI,IAAI;IAAEC;EAAG,CAAC,CAAC,EAAE,CAACD,IAAI,EAAEC,EAAE,CAAC,CAAC;EAEvD,oBACIN,KAAA,CAAAS,aAAA,CAACP,yBAAyB,CAACQ,QAAQ;IAACF,KAAK,EAAEA;EAAM,GAC5CD,QAC+B,CAAC;AAE7C,CAAC;AAEDJ,0BAA0B,CAACQ,WAAW,GAAG,4BAA4B;AAErE,eAAeR,0BAA0B","ignoreList":[]}
@@ -0,0 +1,7 @@
1
+ import { Language } from 'chayns-api';
2
+ import React from 'react';
3
+ export const TranslationOptionsContext = /*#__PURE__*/React.createContext({
4
+ from: Language.German,
5
+ to: Language.German
6
+ });
7
+ //# sourceMappingURL=translationOptionsContext.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"translationOptionsContext.js","names":["Language","React","TranslationOptionsContext","createContext","from","German","to"],"sources":["../../../src/constants/translationOptionsContext.ts"],"sourcesContent":["import { Language } from 'chayns-api';\nimport React from 'react';\n\nexport const TranslationOptionsContext = React.createContext<{\n from: Exclude<Language, Language.Unknown>;\n to: Exclude<Language, Language.Unknown>;\n}>({\n from: Language.German,\n to: Language.German,\n});\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,YAAY;AACrC,OAAOC,KAAK,MAAM,OAAO;AAEzB,OAAO,MAAMC,yBAAyB,gBAAGD,KAAK,CAACE,aAAa,CAGzD;EACCC,IAAI,EAAEJ,QAAQ,CAACK,MAAM;EACrBC,EAAE,EAAEN,QAAQ,CAACK;AACjB,CAAC,CAAC","ignoreList":[]}
@@ -1,17 +1,14 @@
1
- import { useEffect, useMemo, useState } from 'react';
2
- import { useLanguage } from 'chayns-api';
1
+ import { useContext, useEffect, useMemo, useState } from 'react';
2
+ import { TranslationOptionsContext } from '../constants/translationOptionsContext';
3
3
  import translationHandler from '../utils/translationHandler';
4
4
  export const useAdaptiveTranslation = function (originalText) {
5
5
  let {
6
6
  to,
7
7
  from
8
8
  } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
9
- const {
10
- active,
11
- site
12
- } = useLanguage();
13
- const toLanguage = to || active;
14
- const fromLanguage = from || site;
9
+ const options = useContext(TranslationOptionsContext);
10
+ const toLanguage = to || options.to;
11
+ const fromLanguage = from || options.from;
15
12
  const shouldTranslate = useMemo(() => toLanguage !== fromLanguage, [fromLanguage, toLanguage]);
16
13
  const [translatedText, setTranslatedText] = useState(originalText);
17
14
  const [isLoading, setIsLoading] = useState(shouldTranslate);
@@ -1 +1 @@
1
- {"version":3,"file":"useAdaptiveTranslation.js","names":["useEffect","useMemo","useState","useLanguage","translationHandler","useAdaptiveTranslation","originalText","to","from","arguments","length","undefined","active","site","toLanguage","fromLanguage","shouldTranslate","translatedText","setTranslatedText","isLoading","setIsLoading","isFetching","setIsFetching","timeoutRef","setTimeout","translateText","then","text","finally","clearTimeout"],"sources":["../../../src/hooks/useAdaptiveTranslation.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport { Language, useLanguage } from 'chayns-api';\nimport translationHandler from '../utils/translationHandler';\n\nexport const useAdaptiveTranslation = (\n originalText: string,\n {\n to,\n from,\n }: {\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n } = {},\n): { text: string; isLoading: boolean; isFetching: boolean } => {\n const { active, site } = useLanguage();\n const toLanguage = to || active;\n const fromLanguage = from || site;\n const shouldTranslate = useMemo(() => toLanguage !== fromLanguage, [fromLanguage, toLanguage]);\n const [translatedText, setTranslatedText] = useState<string>(originalText);\n const [isLoading, setIsLoading] = useState(shouldTranslate);\n const [isFetching, setIsFetching] = useState(false);\n\n useEffect(() => {\n const timeoutRef = setTimeout(() => {\n if (shouldTranslate) {\n setIsFetching(true);\n void translationHandler\n .translateText(originalText, fromLanguage, toLanguage)\n .then((text) => {\n setTranslatedText(text);\n })\n .finally(() => {\n setIsLoading(false);\n setIsFetching(false);\n });\n }\n }, 200);\n\n return () => clearTimeout(timeoutRef);\n }, [originalText, shouldTranslate, toLanguage, fromLanguage]);\n\n return useMemo(\n () => ({\n text: shouldTranslate ? translatedText : originalText,\n isFetching: shouldTranslate ? isFetching : false,\n isLoading: shouldTranslate ? isLoading : false,\n }),\n [isFetching, isLoading, originalText, shouldTranslate, translatedText],\n );\n};\n"],"mappings":"AAAC,SAASA,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACrD,SAAmBC,WAAW,QAAQ,YAAY;AAClD,OAAOC,kBAAkB,MAAM,6BAA6B;AAE5D,OAAO,MAAMC,sBAAsB,GAAG,SAAAA,CAClCC,YAAoB,EAQwC;EAAA,IAP5D;IACIC,EAAE;IACFC;EAIJ,CAAC,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,CAAC,CAAC;EAEN,MAAM;IAAEG,MAAM;IAAEC;EAAK,CAAC,GAAGV,WAAW,CAAC,CAAC;EACtC,MAAMW,UAAU,GAAGP,EAAE,IAAIK,MAAM;EAC/B,MAAMG,YAAY,GAAGP,IAAI,IAAIK,IAAI;EACjC,MAAMG,eAAe,GAAGf,OAAO,CAAC,MAAMa,UAAU,KAAKC,YAAY,EAAE,CAACA,YAAY,EAAED,UAAU,CAAC,CAAC;EAC9F,MAAM,CAACG,cAAc,EAAEC,iBAAiB,CAAC,GAAGhB,QAAQ,CAASI,YAAY,CAAC;EAC1E,MAAM,CAACa,SAAS,EAAEC,YAAY,CAAC,GAAGlB,QAAQ,CAACc,eAAe,CAAC;EAC3D,MAAM,CAACK,UAAU,EAAEC,aAAa,CAAC,GAAGpB,QAAQ,CAAC,KAAK,CAAC;EAEnDF,SAAS,CAAC,MAAM;IACZ,MAAMuB,UAAU,GAAGC,UAAU,CAAC,MAAM;MAChC,IAAIR,eAAe,EAAE;QACjBM,aAAa,CAAC,IAAI,CAAC;QACnB,KAAKlB,kBAAkB,CAClBqB,aAAa,CAACnB,YAAY,EAAES,YAAY,EAAED,UAAU,CAAC,CACrDY,IAAI,CAAEC,IAAI,IAAK;UACZT,iBAAiB,CAACS,IAAI,CAAC;QAC3B,CAAC,CAAC,CACDC,OAAO,CAAC,MAAM;UACXR,YAAY,CAAC,KAAK,CAAC;UACnBE,aAAa,CAAC,KAAK,CAAC;QACxB,CAAC,CAAC;MACV;IACJ,CAAC,EAAE,GAAG,CAAC;IAEP,OAAO,MAAMO,YAAY,CAACN,UAAU,CAAC;EACzC,CAAC,EAAE,CAACjB,YAAY,EAAEU,eAAe,EAAEF,UAAU,EAAEC,YAAY,CAAC,CAAC;EAE7D,OAAOd,OAAO,CACV,OAAO;IACH0B,IAAI,EAAEX,eAAe,GAAGC,cAAc,GAAGX,YAAY;IACrDe,UAAU,EAAEL,eAAe,GAAGK,UAAU,GAAG,KAAK;IAChDF,SAAS,EAAEH,eAAe,GAAGG,SAAS,GAAG;EAC7C,CAAC,CAAC,EACF,CAACE,UAAU,EAAEF,SAAS,EAAEb,YAAY,EAAEU,eAAe,EAAEC,cAAc,CACzE,CAAC;AACL,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"useAdaptiveTranslation.js","names":["useContext","useEffect","useMemo","useState","TranslationOptionsContext","translationHandler","useAdaptiveTranslation","originalText","to","from","arguments","length","undefined","options","toLanguage","fromLanguage","shouldTranslate","translatedText","setTranslatedText","isLoading","setIsLoading","isFetching","setIsFetching","timeoutRef","setTimeout","translateText","then","text","finally","clearTimeout"],"sources":["../../../src/hooks/useAdaptiveTranslation.ts"],"sourcesContent":["import { useContext, useEffect, useMemo, useState } from 'react';\nimport { Language } from 'chayns-api';\nimport { TranslationOptionsContext } from '../constants/translationOptionsContext';\nimport translationHandler from '../utils/translationHandler';\n\nexport const useAdaptiveTranslation = (\n originalText: string,\n {\n to,\n from,\n }: {\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n } = {},\n): { text: string; isLoading: boolean; isFetching: boolean } => {\n const options = useContext(TranslationOptionsContext);\n const toLanguage = to || options.to;\n const fromLanguage = from || options.from;\n const shouldTranslate = useMemo(() => toLanguage !== fromLanguage, [fromLanguage, toLanguage]);\n const [translatedText, setTranslatedText] = useState<string>(originalText);\n const [isLoading, setIsLoading] = useState(shouldTranslate);\n const [isFetching, setIsFetching] = useState(false);\n\n useEffect(() => {\n const timeoutRef = setTimeout(() => {\n if (shouldTranslate) {\n setIsFetching(true);\n void translationHandler\n .translateText(originalText, fromLanguage, toLanguage)\n .then((text) => {\n setTranslatedText(text);\n })\n .finally(() => {\n setIsLoading(false);\n setIsFetching(false);\n });\n }\n }, 200);\n\n return () => clearTimeout(timeoutRef);\n }, [originalText, shouldTranslate, toLanguage, fromLanguage]);\n\n return useMemo(\n () => ({\n text: shouldTranslate ? translatedText : originalText,\n isFetching: shouldTranslate ? isFetching : false,\n isLoading: shouldTranslate ? isLoading : false,\n }),\n [isFetching, isLoading, originalText, shouldTranslate, translatedText],\n );\n};\n"],"mappings":"AAAC,SAASA,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAEjE,SAASC,yBAAyB,QAAQ,wCAAwC;AAClF,OAAOC,kBAAkB,MAAM,6BAA6B;AAE5D,OAAO,MAAMC,sBAAsB,GAAG,SAAAA,CAClCC,YAAoB,EAQwC;EAAA,IAP5D;IACIC,EAAE;IACFC;EAIJ,CAAC,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,CAAC,CAAC;EAEN,MAAMG,OAAO,GAAGb,UAAU,CAACI,yBAAyB,CAAC;EACrD,MAAMU,UAAU,GAAGN,EAAE,IAAIK,OAAO,CAACL,EAAE;EACnC,MAAMO,YAAY,GAAGN,IAAI,IAAII,OAAO,CAACJ,IAAI;EACzC,MAAMO,eAAe,GAAGd,OAAO,CAAC,MAAMY,UAAU,KAAKC,YAAY,EAAE,CAACA,YAAY,EAAED,UAAU,CAAC,CAAC;EAC9F,MAAM,CAACG,cAAc,EAAEC,iBAAiB,CAAC,GAAGf,QAAQ,CAASI,YAAY,CAAC;EAC1E,MAAM,CAACY,SAAS,EAAEC,YAAY,CAAC,GAAGjB,QAAQ,CAACa,eAAe,CAAC;EAC3D,MAAM,CAACK,UAAU,EAAEC,aAAa,CAAC,GAAGnB,QAAQ,CAAC,KAAK,CAAC;EAEnDF,SAAS,CAAC,MAAM;IACZ,MAAMsB,UAAU,GAAGC,UAAU,CAAC,MAAM;MAChC,IAAIR,eAAe,EAAE;QACjBM,aAAa,CAAC,IAAI,CAAC;QACnB,KAAKjB,kBAAkB,CAClBoB,aAAa,CAAClB,YAAY,EAAEQ,YAAY,EAAED,UAAU,CAAC,CACrDY,IAAI,CAAEC,IAAI,IAAK;UACZT,iBAAiB,CAACS,IAAI,CAAC;QAC3B,CAAC,CAAC,CACDC,OAAO,CAAC,MAAM;UACXR,YAAY,CAAC,KAAK,CAAC;UACnBE,aAAa,CAAC,KAAK,CAAC;QACxB,CAAC,CAAC;MACV;IACJ,CAAC,EAAE,GAAG,CAAC;IAEP,OAAO,MAAMO,YAAY,CAACN,UAAU,CAAC;EACzC,CAAC,EAAE,CAAChB,YAAY,EAAES,eAAe,EAAEF,UAAU,EAAEC,YAAY,CAAC,CAAC;EAE7D,OAAOb,OAAO,CACV,OAAO;IACHyB,IAAI,EAAEX,eAAe,GAAGC,cAAc,GAAGV,YAAY;IACrDc,UAAU,EAAEL,eAAe,GAAGK,UAAU,GAAG,KAAK;IAChDF,SAAS,EAAEH,eAAe,GAAGG,SAAS,GAAG;EAC7C,CAAC,CAAC,EACF,CAACE,UAAU,EAAEF,SAAS,EAAEZ,YAAY,EAAES,eAAe,EAAEC,cAAc,CACzE,CAAC;AACL,CAAC","ignoreList":[]}
package/lib/esm/index.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import translationHandler from './utils/translationHandler';
2
2
  export { useAdaptiveTranslation } from './hooks/useAdaptiveTranslation';
3
3
  export { default as AdaptiveTranslation } from './components/AdaptiveTranslation';
4
+ export { default as TranslationOptionsProvider } from './components/TranslationOptionsProvider';
4
5
  export const translateText = (text, from, to) => translationHandler.translateText(text, from, to);
5
6
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["translationHandler","useAdaptiveTranslation","default","AdaptiveTranslation","translateText","text","from","to"],"sources":["../../src/index.ts"],"sourcesContent":["import translationHandler from './utils/translationHandler';\n\nexport { useAdaptiveTranslation } from './hooks/useAdaptiveTranslation';\nexport { default as AdaptiveTranslation } from './components/AdaptiveTranslation';\nexport const translateText = (text: string, from: string, to: string) =>\n translationHandler.translateText(text, from, to);\n"],"mappings":"AAAA,OAAOA,kBAAkB,MAAM,4BAA4B;AAE3D,SAASC,sBAAsB,QAAQ,gCAAgC;AACvE,SAASC,OAAO,IAAIC,mBAAmB,QAAQ,kCAAkC;AACjF,OAAO,MAAMC,aAAa,GAAGA,CAACC,IAAY,EAAEC,IAAY,EAAEC,EAAU,KAChEP,kBAAkB,CAACI,aAAa,CAACC,IAAI,EAAEC,IAAI,EAAEC,EAAE,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["translationHandler","useAdaptiveTranslation","default","AdaptiveTranslation","TranslationOptionsProvider","translateText","text","from","to"],"sources":["../../src/index.ts"],"sourcesContent":["import translationHandler from './utils/translationHandler';\n\nexport { useAdaptiveTranslation } from './hooks/useAdaptiveTranslation';\nexport { default as AdaptiveTranslation } from './components/AdaptiveTranslation';\nexport { default as TranslationOptionsProvider } from './components/TranslationOptionsProvider';\nexport const translateText = (text: string, from: string, to: string) =>\n translationHandler.translateText(text, from, to);\n"],"mappings":"AAAA,OAAOA,kBAAkB,MAAM,4BAA4B;AAE3D,SAASC,sBAAsB,QAAQ,gCAAgC;AACvE,SAASC,OAAO,IAAIC,mBAAmB,QAAQ,kCAAkC;AACjF,SAASD,OAAO,IAAIE,0BAA0B,QAAQ,yCAAyC;AAC/F,OAAO,MAAMC,aAAa,GAAGA,CAACC,IAAY,EAAEC,IAAY,EAAEC,EAAU,KAChER,kBAAkB,CAACK,aAAa,CAACC,IAAI,EAAEC,IAAI,EAAEC,EAAE,CAAC","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"translation.js","names":[],"sources":["../../../src/types/translation.ts"],"sourcesContent":["import { Language } from 'chayns-api';\nimport { Deferred } from '../utils/deferred';\n\nexport interface TranslationProps {\n children: string;\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n tagName?: keyof HTMLElementTagNameMap;\n}\n\ninterface BaseTranslation {\n text: string;\n to: string;\n from: string;\n}\n\nexport interface QueuedItem extends BaseTranslation {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationBatchItem extends TranslationRequest {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationRequest extends BaseTranslation {\n id: number;\n}\n"],"mappings":"","ignoreList":[]}
1
+ {"version":3,"file":"translation.js","names":[],"sources":["../../../src/types/translation.ts"],"sourcesContent":["import { Language } from 'chayns-api';\nimport React from 'react';\nimport { Deferred } from '../utils/deferred';\n\nexport interface TranslationProps {\n children: string;\n to?: Exclude<Language, Language.Unknown>;\n from?: Exclude<Language, Language.Unknown>;\n tagName?: keyof HTMLElementTagNameMap;\n style?: React.CSSProperties;\n className?: string;\n}\n\ninterface BaseTranslation {\n text: string;\n to: string;\n from: string;\n}\n\nexport interface QueuedItem extends BaseTranslation {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationBatchItem extends TranslationRequest {\n deferred: Deferred<string>;\n}\n\nexport interface TranslationRequest extends BaseTranslation {\n id: number;\n}\n"],"mappings":"","ignoreList":[]}
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { TranslationProps } from '../types/translation';
3
- declare const AdaptiveTranslation: ({ children, to, from, tagName: TagName, }: TranslationProps) => React.JSX.Element;
3
+ declare const AdaptiveTranslation: ({ children, to, from, tagName: TagName, style, className, }: TranslationProps) => React.JSX.Element;
4
4
  export default AdaptiveTranslation;
@@ -0,0 +1,12 @@
1
+ import { Language } from 'chayns-api';
2
+ import React from 'react';
3
+ type TranslationOptionsProviderProps = {
4
+ from: Exclude<Language, Language.Unknown>;
5
+ to: Exclude<Language, Language.Unknown>;
6
+ children: React.ReactNode;
7
+ };
8
+ export declare const TranslationOptionsProvider: {
9
+ ({ from, to, children, }: TranslationOptionsProviderProps): React.JSX.Element;
10
+ displayName: string;
11
+ };
12
+ export default TranslationOptionsProvider;
@@ -0,0 +1,6 @@
1
+ import { Language } from 'chayns-api';
2
+ import React from 'react';
3
+ export declare const TranslationOptionsContext: React.Context<{
4
+ from: Exclude<Language, Language.Unknown>;
5
+ to: Exclude<Language, Language.Unknown>;
6
+ }>;
@@ -1,3 +1,4 @@
1
1
  export { useAdaptiveTranslation } from './hooks/useAdaptiveTranslation';
2
2
  export { default as AdaptiveTranslation } from './components/AdaptiveTranslation';
3
+ export { default as TranslationOptionsProvider } from './components/TranslationOptionsProvider';
3
4
  export declare const translateText: (text: string, from: string, to: string) => Promise<string>;
@@ -1,10 +1,13 @@
1
1
  import { Language } from 'chayns-api';
2
+ import React from 'react';
2
3
  import { Deferred } from '../utils/deferred';
3
4
  export interface TranslationProps {
4
5
  children: string;
5
6
  to?: Exclude<Language, Language.Unknown>;
6
7
  from?: Exclude<Language, Language.Unknown>;
7
8
  tagName?: keyof HTMLElementTagNameMap;
9
+ style?: React.CSSProperties;
10
+ className?: string;
8
11
  }
9
12
  interface BaseTranslation {
10
13
  text: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/translation",
3
- "version": "5.0.0-beta.1131",
3
+ "version": "5.0.0-beta.1136",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -67,6 +67,7 @@
67
67
  "typescript": "^5.8.3"
68
68
  },
69
69
  "dependencies": {
70
+ "clsx": "^2.1.1",
70
71
  "lodash.throttle": "^4.1.1"
71
72
  },
72
73
  "peerDependencies": {
@@ -77,5 +78,5 @@
77
78
  "publishConfig": {
78
79
  "access": "public"
79
80
  },
80
- "gitHead": "f2ee8976122dfde035585866321eb8a05ded30c2"
81
+ "gitHead": "868eeb207ec5e80ade13ce46e6f0f1c1d95e33b1"
81
82
  }