react-apiembed - npm Package Compare versions

Comparing version 0.1.3 to 0.1.4

dist/react-apiembed.js

@@ -989,3 +989,3 @@ (function (global, factory) {
 	        "pre",
-	        { className: "language-" + this.props.prismLanguage },
+	        { className: "language-" + this.props.prismLanguage, tabIndex: "0" },
 	        React.createElement("code", {
@@ -1019,3 +1019,4 @@ className: "language-" + this.props.prismLanguage,
 	    _this.state = {
-	      active: 0
+	      activeTab: 0,
+	      active: props.har.method + props.har.url + 0
 	    };
@@ -1026,2 +1027,9 @@ return _this;
 	  createClass(CodeSnippetWidget, [{
+	    key: "componentDidUpdate",
+	    value: function componentDidUpdate(prevProps) {
+	      if (prevProps.har.url !== this.props.har.url) {
+	        this.setState({ active: this.getHarKey(this.props.har) + this.state.activeTab });
+	      }
+	    }
+	  }, {
 	    key: "getSnippetKey",
@@ -1033,7 +1041,11 @@ value: function getSnippetKey(snippet) {
 	    key: "clickHandler",
-	    value: function clickHandler(e) {
-	      e.preventDefault();
-	      this.setState({ active: e.target.id });
+	    value: function clickHandler(index) {
+	      this.setState({ active: this.getHarKey(this.props.har) + index, activeTab: index });
 	    }
 	  }, {
+	    key: "getHarKey",
+	    value: function getHarKey(harObject) {
+	      return harObject.method + harObject.url;
+	    }
+	  }, {
 	    key: "render",
@@ -1046,2 +1058,4 @@ value: function render() {
 
+	      var harKey = this.getHarKey(har);
+
 	      return React.createElement(
@@ -1057,3 +1071,4 @@ "div",
 	            this.props.snippets.map(function (snippet, index) {
-	              var key = _this2.getSnippetKey(snippet);
+	              var snippetKey = _this2.getSnippetKey(snippet);
+
 	              return React.createElement(
@@ -1063,3 +1078,3 @@ "li",
 	                  role: "presentation",
-	                  className: "tabs-component-tab" + (index == _this2.state.active ? " is-active" : ""),
+	                  className: "tabs-component-tab" + (harKey + index == _this2.state.active ? " is-active" : ""),
 	                  key: index
@@ -1070,9 +1085,10 @@ },
 	                  {
-	                    "aria-controls": "" + key,
+	                    "aria-controls": "" + (snippetKey + harKey),
 	                    "aria-selected": "true",
 	                    role: "tab",
 	                    className: "tabs-component-tab-a",
-	                    id: index,
-	                    href: "#" + key,
-	                    onClick: _this2.clickHandler
+	                    id: harKey + index,
+	                    onClick: function onClick() {
+	                      return _this2.clickHandler(index);
+	                    }
 	                  },
@@ -1088,9 +1104,9 @@ snippet.target
 	            this.props.snippets.map(function (snippet, index) {
+	              var activeTab = harKey + index == _this2.state.active;
+	              var snippetKey = _this2.getSnippetKey(snippet);
 
-	              var activeTab = index == _this2.state.active;
-	              var key = _this2.getSnippetKey(snippet);
 	              return React.createElement(
 	                "section",
-	                { hidden: !activeTab, role: "tabpanel", id: "" + key, key: "#" + key },
-	                React.createElement(CodeSnippet, _extends({ har: _this2.props.har }, snippet))
+	                { hidden: !activeTab, role: "tabpanel", id: "" + (snippetKey + harKey), key: index },
+	                React.createElement(CodeSnippet, _extends({ har: har }, snippet))
 	              );
@@ -1097,0 +1113,0 @@ })

package.json

 {
   "name": "react-apiembed",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "React api embed component.",
@@ -5,0 +5,0 @@ "files": [

No alert changes

Improved metrics

Total package byte prevSize

52339

increased by1.21%

Lines of code

967

increased by1.47%

No dependency changes