@tenon-io/tenon-ui - npm Package Compare versions

Comparing version 1.0.0-alpha.4 to 1.0.0-alpha.5

es/modules/forms/ErrorBlock.js

@@ -31,17 +31,21 @@ import React from 'react';
     return controlNameArray.length > 0 ? React.createElement(
-        'ul',
-        null,
-        controlNameArray.filter(function (control) {
-            return !formControls[control].validity;
-        }).map(function (control) {
-            return React.createElement(
-                'li',
-                { key: formControls[control].controlId },
-                React.createElement(
-                    'a',
-                    { href: '#' + formControls[control].controlId },
-                    formControls[control].errorText
-                )
-            );
-        })
+        'div',
+        { className: 'error-block' },
+        React.createElement(
+            'ul',
+            null,
+            controlNameArray.filter(function (control) {
+                return !formControls[control].validity;
+            }).map(function (control) {
+                return React.createElement(
+                    'li',
+                    { key: formControls[control].controlId },
+                    React.createElement(
+                        'a',
+                        { href: '#' + formControls[control].controlId },
+                        formControls[control].errorText
+                    )
+                );
+            })
+        )
     ) : null;
@@ -48,0 +52,0 @@ };

es/modules/tabs/Tabs.js

@@ -129,2 +129,6 @@ 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; };
             _this.setState({ activeTabId: tabId });
+        }, _this.registerTabRef = function (tabId, ref) {
+            _this.tabRefs[tabId] = ref;
+        }, _this.registerPanelRef = function (panelId, ref) {
+            _this.panelRefs[panelId] = ref;
         }, _this.calcIds = memoize(function (children) {
@@ -154,7 +158,7 @@ _this.tabRefs = {};
             return newChildren;
-        }, deepEqual), _this.registerTabRef = function (tabId, ref) {
-            _this.tabRefs[tabId] = ref;
-        }, _this.registerPanelRef = function (panelId, ref) {
-            _this.panelRefs[panelId] = ref;
-        }, _temp), _possibleConstructorReturn(_this, _ret);
+        }, deepEqual), _this.getSelectedTab = memoize(function (activeTabId, tabsById) {
+            return tabsById.filter(function (tab) {
+                return tab.tabId === activeTabId;
+            }).length === 0 ? _this.tabsById[0].tabId : activeTabId;
+        }, deepEqual), _temp), _possibleConstructorReturn(_this, _ret);
     }
@@ -194,14 +198,2 @@
      * @function
-     * Calculates and assigns ID's based on the containing Tab
-     * components used.
-     *
-     * This function is memoized as it should only be run when the
-     * children of the Tabs component changes.
-     *
-     *@returns {Array} Array of newly configured Tab elements.
-     */
-
-
-    /**
-     * @function
      * Registers the React ref related to the clickable control
@@ -230,2 +222,30 @@ * for each Tab.
 
+    /**
+     * @function
+     * Calculates and assigns ID's based on the containing Tab
+     * components used.
+     *
+     * This function is memoized as it should only be run when the
+     * children of the Tabs component changes.
+     *
+     *@param {React.Node} children - The children of the Tabs control.
+     *
+     *@returns {Array} Array of newly configured Tab elements.
+     */
+
+
+    /**
+     * @function
+     * Calculates a corrected active tab index, taking into acount first time
+     * render and changing the internal children. In these cases the first tab
+     * is to be activated.
+     *
+     * @params {string} activeTabIndex - String representing the unadjusted id
+     *                  of the estimated active tab.
+     * @param {array} tabsById - Array of tab configuration objects.
+     *
+     * @returns {string} - The id of the tab that should be rendered as active.
+     */
+
+
     Tabs.prototype.render = function render() {
@@ -237,3 +257,3 @@ var _this2 = this;
 
-        var selectedTabId = activeTabId || this.tabsById[0].tabId;
+        var selectedTabId = this.getSelectedTab(activeTabId, this.tabsById);
         return React.createElement(
@@ -240,0 +260,0 @@ Fragment,

lib/modules/forms/ErrorBlock.js

@@ -42,17 +42,21 @@ 'use strict';
     return controlNameArray.length > 0 ? _react2.default.createElement(
-        'ul',
-        null,
-        controlNameArray.filter(function (control) {
-            return !formControls[control].validity;
-        }).map(function (control) {
-            return _react2.default.createElement(
-                'li',
-                { key: formControls[control].controlId },
-                _react2.default.createElement(
-                    'a',
-                    { href: '#' + formControls[control].controlId },
-                    formControls[control].errorText
-                )
-            );
-        })
+        'div',
+        { className: 'error-block' },
+        _react2.default.createElement(
+            'ul',
+            null,
+            controlNameArray.filter(function (control) {
+                return !formControls[control].validity;
+            }).map(function (control) {
+                return _react2.default.createElement(
+                    'li',
+                    { key: formControls[control].controlId },
+                    _react2.default.createElement(
+                        'a',
+                        { href: '#' + formControls[control].controlId },
+                        formControls[control].errorText
+                    )
+                );
+            })
+        )
     ) : null;
@@ -59,0 +63,0 @@ };

lib/modules/tabs/Tabs.js

@@ -151,2 +151,6 @@ 'use strict';
             _this.setState({ activeTabId: tabId });
+        }, _this.registerTabRef = function (tabId, ref) {
+            _this.tabRefs[tabId] = ref;
+        }, _this.registerPanelRef = function (panelId, ref) {
+            _this.panelRefs[panelId] = ref;
         }, _this.calcIds = (0, _memoizeOne2.default)(function (children) {
@@ -176,7 +180,7 @@ _this.tabRefs = {};
             return newChildren;
-        }, _lodash2.default), _this.registerTabRef = function (tabId, ref) {
-            _this.tabRefs[tabId] = ref;
-        }, _this.registerPanelRef = function (panelId, ref) {
-            _this.panelRefs[panelId] = ref;
-        }, _temp), _possibleConstructorReturn(_this, _ret);
+        }, _lodash2.default), _this.getSelectedTab = (0, _memoizeOne2.default)(function (activeTabId, tabsById) {
+            return tabsById.filter(function (tab) {
+                return tab.tabId === activeTabId;
+            }).length === 0 ? _this.tabsById[0].tabId : activeTabId;
+        }, _lodash2.default), _temp), _possibleConstructorReturn(_this, _ret);
     }
@@ -216,14 +220,2 @@
      * @function
-     * Calculates and assigns ID's based on the containing Tab
-     * components used.
-     *
-     * This function is memoized as it should only be run when the
-     * children of the Tabs component changes.
-     *
-     *@returns {Array} Array of newly configured Tab elements.
-     */
-
-
-    /**
-     * @function
      * Registers the React ref related to the clickable control
@@ -252,2 +244,30 @@ * for each Tab.
 
+    /**
+     * @function
+     * Calculates and assigns ID's based on the containing Tab
+     * components used.
+     *
+     * This function is memoized as it should only be run when the
+     * children of the Tabs component changes.
+     *
+     *@param {React.Node} children - The children of the Tabs control.
+     *
+     *@returns {Array} Array of newly configured Tab elements.
+     */
+
+
+    /**
+     * @function
+     * Calculates a corrected active tab index, taking into acount first time
+     * render and changing the internal children. In these cases the first tab
+     * is to be activated.
+     *
+     * @params {string} activeTabIndex - String representing the unadjusted id
+     *                  of the estimated active tab.
+     * @param {array} tabsById - Array of tab configuration objects.
+     *
+     * @returns {string} - The id of the tab that should be rendered as active.
+     */
+
+
     Tabs.prototype.render = function render() {
@@ -259,3 +279,3 @@ var _this2 = this;
 
-        var selectedTabId = activeTabId || this.tabsById[0].tabId;
+        var selectedTabId = this.getSelectedTab(activeTabId, this.tabsById);
         return _react2.default.createElement(
@@ -262,0 +282,0 @@ _react.Fragment,

package.json

 {
     "name": "@tenon-io/tenon-ui",
-    "version": "1.0.0-alpha.4",
+    "version": "1.0.0-alpha.5",
     "description": "Tenon ui components library",
@@ -47,2 +47,3 @@ "contributors": [
     "devDependencies": {
+        "@reach/router": "^1.1.1",
         "babel-core": "6.26.0",
@@ -59,2 +60,4 @@ "babel-eslint": "7.2.3",
         "eslint-plugin-react": "7.4.0",
+        "i18next": "^11.5.0",
+        "i18next-browser-languagedetector": "^2.2.3",
         "jest": "22.1.4",
@@ -69,2 +72,3 @@ "jest-dom": "1.11.0",
         "react-dom": "16.4.1",
+        "react-i18next": "^7.10.1",
         "react-testing-library": "4.1.5"
@@ -71,0 +75,0 @@ },

New alerts

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

Fixed alerts

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

106261

increased by4.11%

Lines of code

2440

increased by3.83%

Worsened metrics

Dev dependency count

25

increased by19.05%

No dependency changes