feat(no-vue): ability to use interpolation outside without vue

Author: neSpecc

dist/vue-gettext.js

@@ -184,6 +184,126 @@
 
   };
 
+  // Ensure to always use the same Vue instance throughout the plugin.
+  //
+  // This was previously done in `index.js` using both named and default exports.
+  // However, this currently must be kept in a separate file because we are using
+  // Rollup to build the dist files and it has a drawback when using named and
+  // default exports together, see:
+  // https://github.com/rollup/rollup/blob/fca14d/src/utils/getExportMode.js#L27
+  // https://github.com/rollup/rollup/wiki/JavaScript-API#exports
+  //
+  // If we had kept named and default exports in `index.js`, a user would have to
+  // do something like this to access the default export: GetTextPlugin['default']
+
+  var _Vue;
+
+  function shareVueInstance (Vue) {
+    _Vue = Vue;
+  }
+
+  var EVALUATION_RE = /[[\].]{1,2}/g;
+
+  /* Interpolation RegExp.
+   *
+   * Because interpolation inside attributes are deprecated in Vue 2 we have to
+   * use another set of delimiters to be able to use `translate-plural` etc.
+   * We use %{ } delimiters.
+   *
+   * /
+   *   %\{                => Starting delimiter: `%{`
+   *     (                => Start capture
+   *       (?:.|\n)       => Non-capturing group: any character or newline
+   *       +?             => One or more times (ungreedy)
+   *     )                => End capture
+   *   \}                 => Ending delimiter: `}`
+   * /g                   => Global: don't return after first match
+   */
+  var INTERPOLATION_RE = /%\{((?:.|\n)+?)\}/g;
+
+  var MUSTACHE_SYNTAX_RE = /\{\{((?:.|\n)+?)\}\}/g;
+
+  /**
+   * Evaluate a piece of template string containing %{ } placeholders.
+   * E.g.: 'Hi %{ user.name }' => 'Hi Bob'
+   *
+   * This is a vm.$interpolate alternative for Vue 2.
+   * https://vuejs.org/v2/guide/migration.html#vm-interpolate-removed
+   *
+   * @param {String} msgid - The translation key containing %{ } placeholders
+   * @param {Object} context - An object whose elements are put in their corresponding placeholders
+   *
+   * @return {String} The interpolated string
+   */
+  var interpolate = function (msgid, context, disableHtmlEscaping) {
+    if ( context === void 0 ) context = {};
+    if ( disableHtmlEscaping === void 0 ) disableHtmlEscaping = false;
+
+
+    if (_Vue && !_Vue.config.getTextPluginSilent && MUSTACHE_SYNTAX_RE.test(msgid)) {
+      console.warn(("Mustache syntax cannot be used with vue-gettext. Please use \"%{}\" instead of \"{{}}\" in: " + msgid));
+    }
+
+    var result = msgid.replace(INTERPOLATION_RE, function (match, token) {
+
+      var expression = token.trim();
+      var evaluated;
+
+      var escapeHtmlMap = {
+        '&': '&',
+        '<': '&lt;',
+        '>': '&gt;',
+        '"': '&quot;',
+        '\'': '&#039;',
+      };
+
+      // Avoid eval() by splitting `expression` and looping through its different properties if any, see #55.
+      function getProps (obj, expression) {
+        var arr = expression.split(EVALUATION_RE).filter(function (x) { return x; });
+        while (arr.length) {
+          obj = obj[arr.shift()];
+        }
+        return obj
+      }
+
+      function evalInContext (expression) {
+        try {
+          evaluated = getProps(this, expression);
+        } catch (e) {
+          // Ignore errors, because this function may be called recursively later.
+        }
+        if (evaluated === undefined) {
+          if (this.$parent) {
+            // Recursively climb the $parent chain to allow evaluation inside nested components, see #23 and #24.
+            return evalInContext.call(this.$parent, expression)
+          } else {
+            console.warn(("Cannot evaluate expression: " + expression));
+            evaluated = expression;
+          }
+        }
+        var result = evaluated.toString();
+        if (disableHtmlEscaping) {
+          // Do not escape HTML, see #78.
+          return result
+        }
+        // Escape HTML, see #78.
+        return result.replace(/[&<>"']/g, function (m) { return escapeHtmlMap[m] })
+      }
+
+      return evalInContext.call(context, expression)
+
+    });
+
+    return result
+
+  };
+
+  // Store this values as function attributes for easy access elsewhere to bypass a Rollup
+  // weak point with `export`:
+  // https://github.com/rollup/rollup/blob/fca14d/src/utils/getExportMode.js#L27
+  interpolate.INTERPOLATION_RE = INTERPOLATION_RE;
+  interpolate.INTERPOLATION_PREFIX = '%{';
+
   var SPACING_RE = /\s{2,}/g;
 
   // Default configuration if only the translation is passed.
@@ -371,6 +491,19 @@
       }
     },
 
+    /**
+     * Allows to use interpolation outside the Vue
+     *
+     * @example
+     *  import {translate} from 'vue-gettext';
+     *
+     *  const {gettext, gettextInterpolate} = translate;
+     *
+     *  let translated = gettext('%{ n } foos', n)
+     *  let interpolated = gettextInterpolate(translated, {n: 5})
+     */
+    gettextInterpolate: interpolate.bind(interpolate),
+
   };
 
   // UUID v4 generator (RFC4122 compliant).
@@ -395,24 +528,6 @@
 
   }
 
-  // Ensure to always use the same Vue instance throughout the plugin.
-  //
-  // This was previously done in `index.js` using both named and default exports.
-  // However, this currently must be kept in a separate file because we are using
-  // Rollup to build the dist files and it has a drawback when using named and
-  // default exports together, see:
-  // https://github.com/rollup/rollup/blob/fca14d/src/utils/getExportMode.js#L27
-  // https://github.com/rollup/rollup/wiki/JavaScript-API#exports
-  //
-  // If we had kept named and default exports in `index.js`, a user would have to
-  // do something like this to access the default export: GetTextPlugin['default']
-
-  var _Vue;
-
-  function shareVueInstance (Vue) {
-    _Vue = Vue;
-  }
-
   /**
    * Translate content according to the current language.
    */
@@ -510,108 +625,6 @@
 
   };
 
-  var EVALUATION_RE = /[[\].]{1,2}/g;
-
-  /* Interpolation RegExp.
-   *
-   * Because interpolation inside attributes are deprecated in Vue 2 we have to
-   * use another set of delimiters to be able to use `translate-plural` etc.
-   * We use %{ } delimiters.
-   *
-   * /
-   *   %\{                => Starting delimiter: `%{`
-   *     (                => Start capture
-   *       (?:.|\n)       => Non-capturing group: any character or newline
-   *       +?             => One or more times (ungreedy)
-   *     )                => End capture
-   *   \}                 => Ending delimiter: `}`
-   * /g                   => Global: don't return after first match
-   */
-  var INTERPOLATION_RE = /%\{((?:.|\n)+?)\}/g;
-
-  var MUSTACHE_SYNTAX_RE = /\{\{((?:.|\n)+?)\}\}/g;
-
-  /**
-   * Evaluate a piece of template string containing %{ } placeholders.
-   * E.g.: 'Hi %{ user.name }' => 'Hi Bob'
-   *
-   * This is a vm.$interpolate alternative for Vue 2.
-   * https://vuejs.org/v2/guide/migration.html#vm-interpolate-removed
-   *
-   * @param {String} msgid - The translation key containing %{ } placeholders
-   * @param {Object} context - An object whose elements are put in their corresponding placeholders
-   *
-   * @return {String} The interpolated string
-   */
-  var interpolate = function (msgid, context, disableHtmlEscaping) {
-    if ( context === void 0 ) context = {};
-    if ( disableHtmlEscaping === void 0 ) disableHtmlEscaping = false;
-
-
-    if (!_Vue.config.getTextPluginSilent && MUSTACHE_SYNTAX_RE.test(msgid)) {
-      console.warn(("Mustache syntax cannot be used with vue-gettext. Please use \"%{}\" instead of \"{{}}\" in: " + msgid));
-    }
-
-    var result = msgid.replace(INTERPOLATION_RE, function (match, token) {
-
-      var expression = token.trim();
-      var evaluated;
-
-      var escapeHtmlMap = {
-        '&': '&amp;',
-        '<': '&lt;',
-        '>': '&gt;',
-        '"': '&quot;',
-        '\'': '&#039;',
-      };
-
-      // Avoid eval() by splitting `expression` and looping through its different properties if any, see #55.
-      function getProps (obj, expression) {
-        var arr = expression.split(EVALUATION_RE).filter(function (x) { return x; });
-        while (arr.length) {
-          obj = obj[arr.shift()];
-        }
-        return obj
-      }
-
-      function evalInContext (expression) {
-        try {
-          evaluated = getProps(this, expression);
-        } catch (e) {
-          // Ignore errors, because this function may be called recursively later.
-        }
-        if (evaluated === undefined) {
-          if (this.$parent) {
-            // Recursively climb the $parent chain to allow evaluation inside nested components, see #23 and #24.
-            return evalInContext.call(this.$parent, expression)
-          } else {
-            console.warn(("Cannot evaluate expression: " + expression));
-            evaluated = expression;
-          }
-        }
-        var result = evaluated.toString();
-        if (disableHtmlEscaping) {
-          // Do not escape HTML, see #78.
-          return result
-        }
-        // Escape HTML, see #78.
-        return result.replace(/[&<>"']/g, function (m) { return escapeHtmlMap[m] })
-      }
-
-      return evalInContext.call(context, expression)
-
-    });
-
-    return result
-
-  };
-
-  // Store this values as function attributes for easy access elsewhere to bypass a Rollup
-  // weak point with `export`:
-  // https://github.com/rollup/rollup/blob/fca14d/src/utils/getExportMode.js#L27
-  interpolate.INTERPOLATION_RE = INTERPOLATION_RE;
-  interpolate.INTERPOLATION_PREFIX = '%{';
-
   // Check if two values are loosely equal - that is,
   // if they are plain objects, do they have the same shape?
   // https://github.com/vuejs/vue/blob/v2.6.11/src/shared/util.js#L285