react-intl-polyfill/lib/IntlPolyfill.js

React component that add window.Intl support before rendering if the browser doesn't have it

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _react = require("react");

var _propTypes = _interopRequireDefault(require("prop-types"));

var IntlPolyfill = function (_PureComponent) {
  (0, _inherits2.default)(IntlPolyfill, _PureComponent);

  function IntlPolyfill() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, IntlPolyfill);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(IntlPolyfill)).call.apply(_getPrototypeOf2, [this].concat(args)));
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
      hasSupport: !!window.Intl
    });
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "polyfill", function (locales) {
      return new Promise(function (resolve) {
        return resolve(import('intl'));
      }).then(function () {
        return Promise.all(locales.map(function (locale) {
          return import("intl/locale-data/jsonp/".concat(locale, ".js"));
        }));
      }).then(function () {
        return _this.setState({
          hasSupport: true
        });
      }).catch(function (err) {
        throw err;
      });
    });
    return _this;
  }

  (0, _createClass2.default)(IntlPolyfill, [{
    key: "componentWillMount",
    value: function componentWillMount() {
      var locales = this.props.locales;
      var hasSupport = this.state.hasSupport;

      if (!hasSupport) {
        this.polyfill(locales);
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props = this.props,
          children = _this$props.children,
          fallback = _this$props.fallback;
      var hasSupport = this.state.hasSupport;
      return hasSupport ? children : fallback;
    }
  }]);
  return IntlPolyfill;
}(_react.PureComponent);

exports.default = IntlPolyfill;
(0, _defineProperty2.default)(IntlPolyfill, "propTypes", {
  children: _propTypes.default.any.isRequired,
  locales: _propTypes.default.array,
  fallback: _propTypes.default.any
});
(0, _defineProperty2.default)(IntlPolyfill, "defaultProps", {
  locales: [],
  fallback: null
});
module.exports = exports.default;