@commercetools-frontend/l10n 22.30.3 → 22.32.0

package/dist/commercetools-frontend-l10n.cjs.dev.js

@@ -50,7 +50,7 @@ var moment__default = /*#__PURE__*/_interopDefault(moment);
 var omit__default = /*#__PURE__*/_interopDefault(omit);
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "22.30.3";
+var version = "22.32.0";
 
 // https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
 const supportedLocales = ["en", "de", "es", "fr-FR", "pt-BR", "zh-CN"];
@@ -94,17 +94,14 @@ const getDisplayName = Component => {
   return Component.displayName || Component.name || 'Component';
 };
 const getPrimaryLocale = locale => locale.split('-')[0];
-const formatLocalizedFallbackHint = (value, locale) => {
-  var _context;
-  return _concatInstanceProperty__default["default"](_context = "".concat(value, " (")).call(_context, locale.toUpperCase(), ")");
-};
+const formatLocalizedFallbackHint = (value, locale) => `${value} (${locale.toUpperCase()})`;
 const findFallbackLocale = (localizedString, fallbackOrder) => {
-  var _context2;
-  return _findInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](fallbackOrder).call(fallbackOrder, _Object$keys__default["default"](localizedString))).call(_context2, lang => Boolean(localizedString[lang]));
+  var _context;
+  return _findInstanceProperty__default["default"](_context = _concatInstanceProperty__default["default"](fallbackOrder).call(fallbackOrder, _Object$keys__default["default"](localizedString))).call(_context, lang => Boolean(localizedString[lang]));
 };
 
 function ownKeys$2(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$2(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 const initialState = {
   isLoading: true,
   // Keep it as an empty object, for backwards compatibility
@@ -181,7 +178,6 @@ function createL10NInjector(_ref) {
   return function createHOC(mapPropsToLocale) {
     const useL10n = createL10NHook(loadLocale);
     return WrappedComponent => {
-      var _context;
       const L10NComponent = props => {
         const state = useL10n(mapPropsToLocale(props));
         return jsxRuntime.jsx(WrappedComponent, _objectSpread$2(_objectSpread$2({}, props), {}, {
@@ -189,7 +185,7 @@ function createL10NInjector(_ref) {
           [propKey]: state.data
         }));
       };
-      L10NComponent.displayName = _concatInstanceProperty__default["default"](_context = "".concat(displayName, "(")).call(_context, getDisplayName(WrappedComponent), ")");
+      L10NComponent.displayName = `${displayName}(${getDisplayName(WrappedComponent)})`;
       return L10NComponent;
     };
   };

package/dist/commercetools-frontend-l10n.cjs.prod.js

@@ -50,7 +50,7 @@ var moment__default = /*#__PURE__*/_interopDefault(moment);
 var omit__default = /*#__PURE__*/_interopDefault(omit);
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "22.30.3";
+var version = "22.32.0";
 
 // https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
 const supportedLocales = ["en", "de", "es", "fr-FR", "pt-BR", "zh-CN"];
@@ -94,17 +94,14 @@ const getDisplayName = Component => {
   return Component.displayName || Component.name || 'Component';
 };
 const getPrimaryLocale = locale => locale.split('-')[0];
-const formatLocalizedFallbackHint = (value, locale) => {
-  var _context;
-  return _concatInstanceProperty__default["default"](_context = "".concat(value, " (")).call(_context, locale.toUpperCase(), ")");
-};
+const formatLocalizedFallbackHint = (value, locale) => `${value} (${locale.toUpperCase()})`;
 const findFallbackLocale = (localizedString, fallbackOrder) => {
-  var _context2;
-  return _findInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](fallbackOrder).call(fallbackOrder, _Object$keys__default["default"](localizedString))).call(_context2, lang => Boolean(localizedString[lang]));
+  var _context;
+  return _findInstanceProperty__default["default"](_context = _concatInstanceProperty__default["default"](fallbackOrder).call(fallbackOrder, _Object$keys__default["default"](localizedString))).call(_context, lang => Boolean(localizedString[lang]));
 };
 
 function ownKeys$2(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$2(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 const initialState = {
   isLoading: true,
   // Keep it as an empty object, for backwards compatibility
@@ -181,7 +178,6 @@ function createL10NInjector(_ref) {
   return function createHOC(mapPropsToLocale) {
     const useL10n = createL10NHook(loadLocale);
     return WrappedComponent => {
-      var _context;
       const L10NComponent = props => {
         const state = useL10n(mapPropsToLocale(props));
         return jsxRuntime.jsx(WrappedComponent, _objectSpread$2(_objectSpread$2({}, props), {}, {
@@ -189,7 +185,7 @@ function createL10NInjector(_ref) {
           [propKey]: state.data
         }));
       };
-      L10NComponent.displayName = _concatInstanceProperty__default["default"](_context = "".concat(displayName, "(")).call(_context, getDisplayName(WrappedComponent), ")");
+      L10NComponent.displayName = `${displayName}(${getDisplayName(WrappedComponent)})`;
       return L10NComponent;
     };
   };

package/dist/commercetools-frontend-l10n.esm.js

@@ -24,7 +24,7 @@ import moment from 'moment-timezone';
 import omit from 'lodash/omit';
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "22.30.3";
+var version = "22.32.0";
 
 // https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
 const supportedLocales = ["en", "de", "es", "fr-FR", "pt-BR", "zh-CN"];
@@ -68,17 +68,14 @@ const getDisplayName = Component => {
   return Component.displayName || Component.name || 'Component';
 };
 const getPrimaryLocale = locale => locale.split('-')[0];
-const formatLocalizedFallbackHint = (value, locale) => {
-  var _context;
-  return _concatInstanceProperty(_context = "".concat(value, " (")).call(_context, locale.toUpperCase(), ")");
-};
+const formatLocalizedFallbackHint = (value, locale) => `${value} (${locale.toUpperCase()})`;
 const findFallbackLocale = (localizedString, fallbackOrder) => {
-  var _context2;
-  return _findInstanceProperty(_context2 = _concatInstanceProperty(fallbackOrder).call(fallbackOrder, _Object$keys(localizedString))).call(_context2, lang => Boolean(localizedString[lang]));
+  var _context;
+  return _findInstanceProperty(_context = _concatInstanceProperty(fallbackOrder).call(fallbackOrder, _Object$keys(localizedString))).call(_context, lang => Boolean(localizedString[lang]));
 };
 
 function ownKeys$2(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$2(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$2(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 const initialState = {
   isLoading: true,
   // Keep it as an empty object, for backwards compatibility
@@ -155,7 +152,6 @@ function createL10NInjector(_ref) {
   return function createHOC(mapPropsToLocale) {
     const useL10n = createL10NHook(loadLocale);
     return WrappedComponent => {
-      var _context;
       const L10NComponent = props => {
         const state = useL10n(mapPropsToLocale(props));
         return jsx(WrappedComponent, _objectSpread$2(_objectSpread$2({}, props), {}, {
@@ -163,7 +159,7 @@ function createL10NInjector(_ref) {
           [propKey]: state.data
         }));
       };
-      L10NComponent.displayName = _concatInstanceProperty(_context = "".concat(displayName, "(")).call(_context, getDisplayName(WrappedComponent), ")");
+      L10NComponent.displayName = `${displayName}(${getDisplayName(WrappedComponent)})`;
       return L10NComponent;
     };
   };

package/dist/declarations/src/localize.d.ts

@@ -1,6 +1,74 @@
 import { LocalizedString, LocalizedField, FieldNameTranformationMapping, FormatLocalizedStringOptions } from './types';
+/**
+ * Transforms a list of `LocalizedField` into a `LocalizedString` object
+ * [{ locale: 'sv', value: 'Hej' }] -> { sv: 'Hej' }
+ */
 export declare const transformLocalizedFieldToLocalizedString: (localizedFields?: LocalizedField[]) => LocalizedString | null;
+/**
+ * Transforms a `LocalizedString` object into a list of `LocalizedField`
+ *
+ * { sv: 'Hej' } -> [{ locale: 'sv', value: 'Hej' }]
+ */
 export declare const transformLocalizedStringToLocalizedField: (localizedString?: LocalizedString) => LocalizedField[];
+/**
+ * Given a list of localized field names to map, replace the fields in the
+ * format of `LocalizedField` to a `LocalizedString` object.
+ * The existing "localized" fields (the list version) will be removed.
+ *
+ * @param objectWithLocalizedFields
+ * the object with `LocalizedField` fields
+ * that need to be transformed into `LocalizedString`s
+ * @param fieldNames
+ * An array of objects with following shape:
+ *   * `from`: the field to transform and to remove after
+ *   * `to`: the target field to write the transformed shape
+ */
 export declare const applyTransformedLocalizedFields: <Input extends Record<string, unknown>, Output extends Record<string, unknown>>(objectWithLocalizedFields: Input, fieldNames: FieldNameTranformationMapping[]) => Output;
+/**
+ * Given a list of localized string names to map, replace the fields in the
+ * format of `LocalizedString` to a `LocalizedField` object.
+ * The existing "localized" strings (the list version) will be removed.
+ *
+ * @param objectWithLocalizedStrings
+ * the object with `LocalizedString` fields
+ * that need to be transformed into `LocalizedField`s
+ * @param fieldNames
+ * An array of objects with following shape:
+ *   * `from`: the field to transform and to remove after
+ *   * `to`: the target field to write the transformed shape
+ */
 export declare const applyTransformedLocalizedStrings: <Input extends Record<string, unknown>, Output extends Record<string, unknown>>(objectWithLocalizedStrings: Input, fieldNames: FieldNameTranformationMapping[]) => Output;
+/**
+ * Translates a localized string on an entity.
+ *
+ * The `localize` function receives a complete entity that can have several
+ * localized fields.
+ *
+ * Arguments
+ *  - `obj`: that entity
+ *  - `key`: the field within `obj` that might contain a localized strings
+ *  - `locale`: the language key that should be the first choice to show
+ *  - `fallbackOrder`: an array of language keys which will be tried in the
+ *     provided order for any set value
+ *  - `fallback`: the final fallback that should be displayed as a last resort.
+ *     This fallback will also be shown in case the field does not exist on the
+ *     provided object.
+ *
+ * Before `fallback` kicks in, the following is tried to display a meaningful value:
+ *  - if `locale` is `<language>-<extlang>`, eg. `de-AT`, try if `de` is set
+ *  - if not, iterate through all languages of project-settings
+ *    (passed as `fallbackOrder`) and pick the first one with a value
+ *  - if nothing is found, go through all the languages in provided localized
+ *    string an pick the first with a value
+ *  - if still no value is found display `fallback`
+ *
+ * NOTE: It is known that this might lead to strings displayed in different
+ *       languages within the same page. This is an accepted downside.
+ *
+ * NOTE: A missing field is treated like a localied string with no translations:
+ *       let a = formatLocalizedString({ name: { en: '', de: '' } }, { locale: 'en' })
+ *       let b = formatLocalizedString({}, { locale: 'en' })
+ *       let c = formatLocalizedString(undefined, { locale: 'en' })
+ *       a === b && a === c -> true
+ */
 export declare const formatLocalizedString: <Input extends Record<string, unknown>>(entity: Input | null, { key, locale, fallbackOrder, fallback, }: FormatLocalizedStringOptions<Input>) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools-frontend/l10n",
-  "version": "22.30.3",
+  "version": "22.32.0",
   "description": "React bindings to load l10n data",
   "bugs": "https://github.com/commercetools/merchant-center-application-kit/issues",
   "repository": {
@@ -31,7 +31,7 @@
   "dependencies": {
     "@babel/runtime": "^7.22.15",
     "@babel/runtime-corejs3": "^7.22.15",
-    "@commercetools-frontend/sentry": "22.30.3",
+    "@commercetools-frontend/sentry": "22.32.0",
     "@emotion/react": "^11.11.4",
     "@types/lodash": "^4.14.198",
     "@types/prop-types": "^15.7.5",