storybook-addon-i18next - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

manager.js

@@ -13,8 +13,115 @@ 'use strict';
 
-const ADDON_ID = 'i18next';
-const PANEL_ID = `${ADDON_ID}/addon-panel`;
-const LANGUAGE_CHANGED_EVENT_ID = 'addon:i18next:languageChanged';
-const CONFIGURE_EVENT_ID = 'addon:i18next:configure';
+function _classCallCheck(instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+}
 
-const Container = styled.div({
+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);
+  }
+}
+
+function _createClass(Constructor, protoProps, staticProps) {
+  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+  if (staticProps) _defineProperties(Constructor, staticProps);
+  return Constructor;
+}
+
+function _inherits(subClass, superClass) {
+  if (typeof superClass !== "function" && superClass !== null) {
+    throw new TypeError("Super expression must either be null or a function");
+  }
+
+  subClass.prototype = Object.create(superClass && superClass.prototype, {
+    constructor: {
+      value: subClass,
+      writable: true,
+      configurable: true
+    }
+  });
+  if (superClass) _setPrototypeOf(subClass, superClass);
+}
+
+function _getPrototypeOf(o) {
+  _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+    return o.__proto__ || Object.getPrototypeOf(o);
+  };
+  return _getPrototypeOf(o);
+}
+
+function _setPrototypeOf(o, p) {
+  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+    o.__proto__ = p;
+    return o;
+  };
+
+  return _setPrototypeOf(o, p);
+}
+
+function _assertThisInitialized(self) {
+  if (self === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  }
+
+  return self;
+}
+
+function _possibleConstructorReturn(self, call) {
+  if (call && (typeof call === "object" || typeof call === "function")) {
+    return call;
+  }
+
+  return _assertThisInitialized(self);
+}
+
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
+}
+
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+
+function _iterableToArrayLimit(arr, i) {
+  var _arr = [];
+  var _n = true;
+  var _d = false;
+  var _e = undefined;
+
+  try {
+    for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+      _arr.push(_s.value);
+
+      if (i && _arr.length === i) break;
+    }
+  } catch (err) {
+    _d = true;
+    _e = err;
+  } finally {
+    try {
+      if (!_n && _i["return"] != null) _i["return"]();
+    } finally {
+      if (_d) throw _e;
+    }
+  }
+
+  return _arr;
+}
+
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance");
+}
+
+var ADDON_ID = 'i18next';
+var PANEL_ID = "".concat(ADDON_ID, "/addon-panel");
+var LANGUAGE_CHANGED_EVENT_ID = 'addon:i18next:languageChanged';
+var CONFIGURE_EVENT_ID = 'addon:i18next:configure';
+
+var Container = styled.div({
   padding: 15,
@@ -28,92 +135,101 @@ width: '100%',
 
-class Panel extends React.Component {
-  constructor(props, context) {
-    super(props, context);
-    this.state = {
+var Panel =
+/*#__PURE__*/
+function (_React$Component) {
+  _inherits(Panel, _React$Component);
+
+  function Panel(props, context) {
+    var _this;
+
+    _classCallCheck(this, Panel);
+
+    _this = _possibleConstructorReturn(this, _getPrototypeOf(Panel).call(this, props, context));
+    _this.state = {
       language: null,
       languages: null
     };
-    this.configure = this.configure.bind(this);
-    this.emitLanguageChanged = this.emitLanguageChanged.bind(this);
-    this.handleLanguageSelect = this.handleLanguageSelect.bind(this);
+    _this.configure = _this.configure.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.emitLanguageChanged = _this.emitLanguageChanged.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleLanguageSelect = _this.handleLanguageSelect.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
   }
 
-  componentDidMount() {
-    const {
-      channel
-    } = this.props;
-    channel.on(CONFIGURE_EVENT_ID, this.configure);
-  }
+  _createClass(Panel, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var channel = this.props.channel;
+      channel.on(CONFIGURE_EVENT_ID, this.configure);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var channel = this.props.channel;
+      channel.removeListener(CONFIGURE_EVENT_ID, this.configure);
+    }
+  }, {
+    key: "configure",
+    value: function configure(options) {
+      var i18n = options.i18n,
+          languages = options.languages;
+      var language = i18n.language;
+      this.setState({
+        language: language,
+        languages: languages
+      });
+    }
+  }, {
+    key: "emitLanguageChanged",
+    value: function emitLanguageChanged() {
+      var channel = this.props.channel;
+      var language = this.state.language;
+      channel.emit(LANGUAGE_CHANGED_EVENT_ID, language);
+    }
+  }, {
+    key: "handleLanguageSelect",
+    value: function handleLanguageSelect(event) {
+      var _this2 = this;
 
-  componentWillUnmount() {
-    const {
-      channel
-    } = this.props;
-    channel.removeListener(CONFIGURE_EVENT_ID, this.configure);
-  }
+      var language = event.target.value;
+      var prevLang = this.state.language;
 
-  configure(options) {
-    const {
-      i18n,
-      languages
-    } = options;
-    const {
-      language
-    } = i18n;
-    this.setState({
-      language,
-      languages
-    });
-  }
+      if (prevLang !== language) {
+        this.setState({
+          language: language
+        }, function () {
+          _this2.emitLanguageChanged();
+        });
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var active = this.props.active;
+      var _this$state = this.state,
+          language = _this$state.language,
+          languages = _this$state.languages;
+      return active ? React.createElement(Container, null, React.createElement(components.Field, {
+        label: "Language"
+      }, React.createElement(components.Select, {
+        size: "flex",
+        value: language || '',
+        onChange: this.handleLanguageSelect
+      }, languages ? Object.entries(languages).map(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+            key = _ref2[0],
+            name = _ref2[1];
 
-  emitLanguageChanged() {
-    const {
-      channel
-    } = this.props;
-    const {
-      language
-    } = this.state;
-    channel.emit(LANGUAGE_CHANGED_EVENT_ID, language);
-  }
-
-  handleLanguageSelect(event) {
-    const language = event.target.value;
-    const {
-      language: prevLang
-    } = this.state;
-
-    if (prevLang !== language) {
-      this.setState({
-        language
-      }, () => {
-        this.emitLanguageChanged();
-      });
+        return React.createElement("option", {
+          key: key,
+          value: key
+        }, name);
+      }) : React.createElement("option", {
+        value: "",
+        disabled: true
+      }, "(No Languages)")))) : null;
     }
-  }
+  }]);
 
-  render() {
-    const {
-      active
-    } = this.props;
-    const {
-      language,
-      languages
-    } = this.state;
-    return active ? React.createElement(Container, null, React.createElement(components.Field, {
-      label: "Language"
-    }, React.createElement(components.Select, {
-      size: "flex",
-      value: language || '',
-      onChange: this.handleLanguageSelect
-    }, languages ? Object.entries(languages).map(([key, name]) => React.createElement("option", {
-      key: key,
-      value: key
-    }, name)) : React.createElement("option", {
-      value: "",
-      disabled: true
-    }, "(No Languages)")))) : null;
-  }
+  return Panel;
+}(React.Component);
 
-}
-
 Panel.propTypes = {
@@ -130,18 +246,19 @@ active: PropTypes.bool.isRequired,
 
-const addChannel = api => {
-  const channel = addons.getChannel();
+var addChannel = function addChannel(api) {
+  var channel = addons.getChannel();
   addons.addPanel(PANEL_ID, {
     title: 'i18next',
     // eslint-disable-next-line react/prop-types
-    render: ({
-      active
-    }) => React.createElement(Panel, {
-      active: active,
-      channel: channel,
-      api: api
-    })
+    render: function render(_ref) {
+      var active = _ref.active;
+      return React.createElement(Panel, {
+        active: active,
+        channel: channel,
+        api: api
+      });
+    }
   });
 };
 
-const init = () => {
+var init = function init() {
   addons.register(ADDON_ID, addChannel);
@@ -148,0 +265,0 @@ };

package.json

 {
   "name": "storybook-addon-i18next",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "React Storybook addon for i18next",
@@ -5,0 +5,0 @@ "keywords": [

preview.js

@@ -13,46 +13,122 @@ 'use strict';
 
-const LANGUAGE_CHANGED_EVENT_ID = 'addon:i18next:languageChanged';
-const CONFIGURE_EVENT_ID = 'addon:i18next:configure';
-
-/* eslint react/jsx-filename-extension:off */
-
-class Wrapper extends React.Component {
-  constructor(props, context) {
-    super(props, context);
-    this.changeLanguage = this.changeLanguage.bind(this);
+function _classCallCheck(instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
   }
+}
 
-  componentDidMount() {
-    const {
-      channel
-    } = this.props;
-    channel.on(LANGUAGE_CHANGED_EVENT_ID, this.changeLanguage);
+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);
   }
+}
 
-  componentWillUnmount() {
-    const {
-      channel
-    } = this.props;
-    channel.removeListener(LANGUAGE_CHANGED_EVENT_ID, this.changeLanguage);
+function _createClass(Constructor, protoProps, staticProps) {
+  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+  if (staticProps) _defineProperties(Constructor, staticProps);
+  return Constructor;
+}
+
+function _inherits(subClass, superClass) {
+  if (typeof superClass !== "function" && superClass !== null) {
+    throw new TypeError("Super expression must either be null or a function");
   }
 
-  changeLanguage(language) {
-    const {
-      i18n
-    } = this.props;
-    i18n.changeLanguage(language);
+  subClass.prototype = Object.create(superClass && superClass.prototype, {
+    constructor: {
+      value: subClass,
+      writable: true,
+      configurable: true
+    }
+  });
+  if (superClass) _setPrototypeOf(subClass, superClass);
+}
+
+function _getPrototypeOf(o) {
+  _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+    return o.__proto__ || Object.getPrototypeOf(o);
+  };
+  return _getPrototypeOf(o);
+}
+
+function _setPrototypeOf(o, p) {
+  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+    o.__proto__ = p;
+    return o;
+  };
+
+  return _setPrototypeOf(o, p);
+}
+
+function _assertThisInitialized(self) {
+  if (self === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
   }
 
-  render() {
-    const {
-      story,
-      i18n
-    } = this.props;
-    return React.createElement(reactI18next.I18nextProvider, {
-      i18n: i18n
-    }, story);
+  return self;
+}
+
+function _possibleConstructorReturn(self, call) {
+  if (call && (typeof call === "object" || typeof call === "function")) {
+    return call;
   }
 
+  return _assertThisInitialized(self);
 }
 
+var LANGUAGE_CHANGED_EVENT_ID = 'addon:i18next:languageChanged';
+var CONFIGURE_EVENT_ID = 'addon:i18next:configure';
+
+var Wrapper =
+/*#__PURE__*/
+function (_React$Component) {
+  _inherits(Wrapper, _React$Component);
+
+  function Wrapper(props, context) {
+    var _this;
+
+    _classCallCheck(this, Wrapper);
+
+    _this = _possibleConstructorReturn(this, _getPrototypeOf(Wrapper).call(this, props, context));
+    _this.changeLanguage = _this.changeLanguage.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
+  }
+
+  _createClass(Wrapper, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var channel = this.props.channel;
+      channel.on(LANGUAGE_CHANGED_EVENT_ID, this.changeLanguage);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var channel = this.props.channel;
+      channel.removeListener(LANGUAGE_CHANGED_EVENT_ID, this.changeLanguage);
+    }
+  }, {
+    key: "changeLanguage",
+    value: function changeLanguage(language) {
+      var i18n = this.props.i18n;
+      i18n.changeLanguage(language);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          story = _this$props.story,
+          i18n = _this$props.i18n;
+      return React.createElement(reactI18next.I18nextProvider, {
+        i18n: i18n
+      }, story);
+    }
+  }]);
+
+  return Wrapper;
+}(React.Component);
+
 Wrapper.propTypes = {
@@ -68,11 +144,8 @@ story: PropTypes.node.isRequired,
 };
-const withI18next = addons.makeDecorator({
+var withI18next = addons.makeDecorator({
   name: 'withI18next',
-  wrapper: (getStory, context, {
-    options
-  }) => {
-    const channel = addons__default.getChannel();
-    const {
-      i18n
-    } = options;
+  wrapper: function wrapper(getStory, context, _ref) {
+    var options = _ref.options;
+    var channel = addons__default.getChannel();
+    var i18n = options.i18n;
     channel.emit(CONFIGURE_EVENT_ID, options);
@@ -79,0 +152,0 @@ return React.createElement(Wrapper, {

No alert changes

Improved metrics

Total package byte prevSize

20304

increased by44.86%

Lines of code

539

increased by42.22%

No dependency changes