terra-base - npm Package Compare versions

Comparing version 0.4.2 to 0.5.0

docs/README.md

 # Terra Base
 
-The base component sets minimal global styles for an application.
-This includes CSS to help normalize box-sizing, reset margins/paddings, and define global font styles.
+The base component receives customized translation messages from the application and passes translations into I18nProvider wrapper and sets minimal global styles for an application.
+Global styles include CSS to help normalize box-sizing, reset margins/paddings, and define global font styles.
 
@@ -6,0 +6,0 @@ **Note: This component should be imported before the other terra components in your app.** This is to help ensure that these styles are defined at the beginning of the [extracted stylesheet](https://github.com/webpack-contrib/extract-text-webpack-plugin) and are inherited down to the other terra components.

lib/Base.js

@@ -7,2 +7,6 @@ 'use strict';
 
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
 var _react = require('react');
@@ -16,2 +20,4 @@
 
+var _terraI18n = require('terra-i18n');
+
 require('./baseStyles');
@@ -23,2 +29,8 @@
 
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 var propTypes = {
@@ -28,18 +40,88 @@ /**
    */
-  children: _propTypes2.default.node.isRequired
+  children: _propTypes2.default.node.isRequired,
+  /**
+   * The locale name.
+   */
+  locale: _propTypes2.default.string,
+  /**
+   * Customized translations provided by consuming application
+   * only for current locale.
+   */
+  /* eslint-disable consistent-return */
+  customMessages: function customMessages(props, propName, componentName) {
+    if (Object.keys(props[propName]).length !== 0 && props.locale === undefined) {
+      return new Error('Missing locale prop for ' + propName + ' in ' + componentName + ' props');
+    }
+  }
 };
 
-var Base = function Base(_ref) {
-  var children = _ref.children,
-      customProps = _objectWithoutProperties(_ref, ['children']);
-
-  return _react2.default.createElement(
-    'div',
-    customProps,
-    children
-  );
+var defaultProps = {
+  customMessages: {}
 };
 
+var Base = function (_React$Component) {
+  _inherits(Base, _React$Component);
+
+  function Base(props) {
+    _classCallCheck(this, Base);
+
+    var _this = _possibleConstructorReturn(this, (Base.__proto__ || Object.getPrototypeOf(Base)).call(this, props));
+
+    _this.state = {
+      areTranslationsLoaded: false,
+      locale: props.locale,
+      messages: {}
+    };
+    return _this;
+  }
+
+  _createClass(Base, [{
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      if (this.props.locale !== undefined) {
+        (0, _terraI18n.i18nLoader)(this.props.locale, this.setState, this);
+      }
+    }
+  }, {
+    key: 'componentWillReceiveProps',
+    value: function componentWillReceiveProps(nextProps) {
+      if (this.props === nextProps) return;
+      if (nextProps.locale !== undefined) {
+        (0, _terraI18n.i18nLoader)(nextProps.locale, this.setState, this);
+      }
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var _props = this.props,
+          children = _props.children,
+          locale = _props.locale,
+          customMessages = _props.customMessages,
+          customProps = _objectWithoutProperties(_props, ['children', 'locale', 'customMessages']);
+
+      var childComponent = _react2.default.createElement(
+        'div',
+        customProps,
+        children
+      );
+
+      var messages = _extends({}, this.state.messages, customMessages);
+
+      if (locale === undefined) return childComponent;
+      if (!this.state.areTranslationsLoaded) return null;
+      return _react2.default.createElement(
+        _terraI18n.I18nProvider,
+        { locale: this.state.locale, messages: messages },
+        childComponent
+      );
+    }
+  }]);
+
+  return Base;
+}(_react2.default.Component);
+
 Base.propTypes = propTypes;
 
+Base.defaultProps = defaultProps;
+
 exports.default = Base;

package.json

 {
   "name": "terra-base",
   "main": "lib/Base.js",
-  "version": "0.4.2",
+  "version": "0.5.0",
   "description": "The base component sets minimal global styles for an application.",
@@ -24,3 +24,3 @@ "repository": {
   "devDependencies": {
-    "terra-toolkit": "^0.3.2"
+    "terra-toolkit": "^0.4.0"
   },
@@ -33,3 +33,4 @@ "peerDependencies": {
     "classnames": "^2.2.5",
-    "prop-types": "^15.5.8"
+    "prop-types": "^15.5.8",
+    "terra-i18n": "^0.3.0"
   },
@@ -36,0 +37,0 @@ "scripts": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

23575

decreased by-0.94%

Dependency count

5

increased by25%

Number of package files

11

decreased by-38.89%

Lines of code

110

decreased by-24.66%

Dependency changes

• + Addedterra-i18n@^0.3.0

• + Addedhoist-non-react-statics@3.3.2(transitive)

• + Addedintl@1.2.5(transitive)

• + Addedintl-format-cache@2.2.9(transitive)

• + Addedintl-messageformat@2.2.0(transitive)

• + Addedintl-messageformat-parser@1.4.0(transitive)

• + Addedintl-relativeformat@2.2.0(transitive)

• + Addedinvariant@2.2.4(transitive)

• + Addedreact-intl@2.9.0(transitive)

• + Addedterra-i18n@0.3.0(transitive)