@tradeshift/elements.progress-bar - npm Package Compare versions

Comparing version 0.6.0 to 0.7.0

lib/progress-bar.umd.js

@@ -1,1 +0,108 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(require("@tradeshift/elements")):"function"==typeof define&&define.amd?define(["@tradeshift/elements"],e):e((t=t||self).ts.elements)}(this,function(t){"use strict";function e(t,e){for(var r=0;r<e.length;r++){var i=e[r];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function r(t,r,i){return r&&e(t.prototype,r),i&&e(t,i),t}function i(){var t,e,r=(t=['\n\t\t\t\t<div class="progress-bar-wrapper" ?data-indeterminate="','">\n\t\t\t\t\t<div class="progress-bar-total">\n\t\t\t\t\t\t<div style="','" class="progress-bar-done"></div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t'],e||(e=t.slice(0)),t.raw=e,t);return i=function(){return r},r}t.customElementDefineHelper("ts-progress-bar",function(e){var n,o;function a(){var t=e.call(this)||this;return t.total=100,t.done=0,t.indeterminate=!1,t}return o=e,(n=a).prototype=Object.create(o.prototype),n.prototype.constructor=n,n.__proto__=o,r(a,null,[{key:"styles",get:function(){return[t.TSElement.styles,t.unsafeCSS(":host{width:100%}.progress-bar-wrapper{height:8px;height:var(--ts-progress-bar-height);border-radius:100em;overflow:hidden}.progress-bar-total{position:relative;height:100%;width:100%;background-color:#ade5ff;background-color:var(--ts-color-blue-lighter)}.progress-bar-done{position:absolute;border-radius:100em;left:0;top:0;height:100%;background-color:#00aeff;background-color:var(--ts-color-blue)}.progress-bar-wrapper[data-indeterminate] .progress-bar-done{-webkit-animation:infinite-progress 1s linear infinite;animation:infinite-progress 1s linear infinite}@-webkit-keyframes infinite-progress{0%{width:0;margin-left:0;margin-right:100%}20%{width:30%;margin-left:0;margin-right:0}40%{width:30%;margin-left:30%;margin-right:0}60%{width:40%;margin-left:50%;margin-right:0}80%{width:40%;margin-left:70%;margin-right:0}to{width:0;margin-left:100%;margin-right:0}}@keyframes infinite-progress{0%{width:0;margin-left:0;margin-right:100%}20%{width:30%;margin-left:0;margin-right:0}40%{width:30%;margin-left:30%;margin-right:0}60%{width:40%;margin-left:50%;margin-right:0}80%{width:40%;margin-left:70%;margin-right:0}to{width:0;margin-left:100%;margin-right:0}}")]}},{key:"properties",get:function(){return{total:{type:Number,reflect:!0},done:{type:Number,reflect:!0},indeterminate:{type:Boolean,reflect:!0}}}}]),a.prototype.render=function(){return t.html(i(),this.indeterminate,this.doneWidthStyle)},r(a,[{key:"doneWidthStyle",get:function(){if(!this.indeterminate)return"width: "+this.done/this.total*100+"%"}}]),a}(t.TSElement))});
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(require('@tradeshift/elements')) :
+  typeof define === 'function' && define.amd ? define(['@tradeshift/elements'], factory) :
+  (global = global || self, factory(global.ts.elements));
+}(this, function (elements) { 'use strict';
+
+  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 _inheritsLoose(subClass, superClass) {
+    subClass.prototype = Object.create(superClass.prototype);
+    subClass.prototype.constructor = subClass;
+    subClass.__proto__ = superClass;
+  }
+
+  function _taggedTemplateLiteralLoose(strings, raw) {
+    if (!raw) {
+      raw = strings.slice(0);
+    }
+
+    strings.raw = raw;
+    return strings;
+  }
+
+  var css = "/* General........................................................ */\n:host {\n\twidth: 100%;\n}\n\n.progress-bar-wrapper {\n\theight: 8px;\n\theight: var(--ts-progress-bar-height);\n\tborder-radius: 100em;\n\toverflow: hidden;\n}\n\n.progress-bar-total {\n\tposition: relative;\n\theight: 100%;\n\twidth: 100%;\n\tbackground-color: rgb(173, 229, 255);\n\tbackground-color: var(--ts-color-blue-lighter);\n}\n\n.progress-bar-done {\n\tposition: absolute;\n\tborder-radius: 100em;\n\tleft: 0;\n\ttop: 0;\n\theight: 100%;\n\tbackground-color: rgb(0, 174, 255);\n\tbackground-color: var(--ts-color-blue);\n}\n\n.progress-bar-wrapper[data-indeterminate] .progress-bar-done {\n\t-webkit-animation: infinite-progress 1s linear infinite;\n\t        animation: infinite-progress 1s linear infinite;\n}\n\n@-webkit-keyframes infinite-progress {\n\t0% {\n\t\twidth: 0;\n\t\tmargin-left: 0;\n\t\tmargin-right: 100%;\n\t}\n\t20% {\n\t\twidth: 30%;\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\t40% {\n\t\twidth: 30%;\n\t\tmargin-left: 30%;\n\t\tmargin-right: 0;\n\t}\n\t60% {\n\t\twidth: 40%;\n\t\tmargin-left: 50%;\n\t\tmargin-right: 0;\n\t}\n\t80% {\n\t\twidth: 40%;\n\t\tmargin-left: 70%;\n\t\tmargin-right: 0;\n\t}\n\t100% {\n\t\twidth: 0;\n\t\tmargin-left: 100%;\n\t\tmargin-right: 0;\n\t}\n}\n\n@keyframes infinite-progress {\n\t0% {\n\t\twidth: 0;\n\t\tmargin-left: 0;\n\t\tmargin-right: 100%;\n\t}\n\t20% {\n\t\twidth: 30%;\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\t40% {\n\t\twidth: 30%;\n\t\tmargin-left: 30%;\n\t\tmargin-right: 0;\n\t}\n\t60% {\n\t\twidth: 40%;\n\t\tmargin-left: 50%;\n\t\tmargin-right: 0;\n\t}\n\t80% {\n\t\twidth: 40%;\n\t\tmargin-left: 70%;\n\t\tmargin-right: 0;\n\t}\n\t100% {\n\t\twidth: 0;\n\t\tmargin-left: 100%;\n\t\tmargin-right: 0;\n\t}\n}\n\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInByb2dyZXNzLWJhci5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsb0VBQW9FO0FBQ3BFO0NBQ0MsV0FBVztBQUNaOztBQUVBO0NBQ0MsV0FBcUM7Q0FBckMscUNBQXFDO0NBQ3JDLG9CQUFvQjtDQUNwQixnQkFBZ0I7QUFDakI7O0FBRUE7Q0FDQyxrQkFBa0I7Q0FDbEIsWUFBWTtDQUNaLFdBQVc7Q0FDWCxvQ0FBOEM7Q0FBOUMsOENBQThDO0FBQy9DOztBQUVBO0NBQ0Msa0JBQWtCO0NBQ2xCLG9CQUFvQjtDQUNwQixPQUFPO0NBQ1AsTUFBTTtDQUNOLFlBQVk7Q0FDWixrQ0FBc0M7Q0FBdEMsc0NBQXNDO0FBQ3ZDOztBQUVBO0NBQ0MsdURBQStDO1NBQS9DLCtDQUErQztBQUNoRDs7QUFFQTtDQUNDO0VBQ0MsUUFBUTtFQUNSLGNBQWM7RUFDZCxrQkFBa0I7Q0FDbkI7Q0FDQTtFQUNDLFVBQVU7RUFDVixjQUFjO0VBQ2QsZUFBZTtDQUNoQjtDQUNBO0VBQ0MsVUFBVTtFQUNWLGdCQUFnQjtFQUNoQixlQUFlO0NBQ2hCO0NBQ0E7RUFDQyxVQUFVO0VBQ1YsZ0JBQWdCO0VBQ2hCLGVBQWU7Q0FDaEI7Q0FDQTtFQUNDLFVBQVU7RUFDVixnQkFBZ0I7RUFDaEIsZUFBZTtDQUNoQjtDQUNBO0VBQ0MsUUFBUTtFQUNSLGlCQUFpQjtFQUNqQixlQUFlO0NBQ2hCO0FBQ0Q7O0FBL0JBO0NBQ0M7RUFDQyxRQUFRO0VBQ1IsY0FBYztFQUNkLGtCQUFrQjtDQUNuQjtDQUNBO0VBQ0MsVUFBVTtFQUNWLGNBQWM7RUFDZCxlQUFlO0NBQ2hCO0NBQ0E7RUFDQyxVQUFVO0VBQ1YsZ0JBQWdCO0VBQ2hCLGVBQWU7Q0FDaEI7Q0FDQTtFQUNDLFVBQVU7RUFDVixnQkFBZ0I7RUFDaEIsZUFBZTtDQUNoQjtDQUNBO0VBQ0MsVUFBVTtFQUNWLGdCQUFnQjtFQUNoQixlQUFlO0NBQ2hCO0NBQ0E7RUFDQyxRQUFRO0VBQ1IsaUJBQWlCO0VBQ2pCLGVBQWU7Q0FDaEI7QUFDRCIsImZpbGUiOiJwcm9ncmVzcy1iYXIuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyogR2VuZXJhbC4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uICovXG46aG9zdCB7XG5cdHdpZHRoOiAxMDAlO1xufVxuXG4ucHJvZ3Jlc3MtYmFyLXdyYXBwZXIge1xuXHRoZWlnaHQ6IHZhcigtLXRzLXByb2dyZXNzLWJhci1oZWlnaHQpO1xuXHRib3JkZXItcmFkaXVzOiAxMDBlbTtcblx0b3ZlcmZsb3c6IGhpZGRlbjtcbn1cblxuLnByb2dyZXNzLWJhci10b3RhbCB7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0aGVpZ2h0OiAxMDAlO1xuXHR3aWR0aDogMTAwJTtcblx0YmFja2dyb3VuZC1jb2xvcjogdmFyKC0tdHMtY29sb3ItYmx1ZS1saWdodGVyKTtcbn1cblxuLnByb2dyZXNzLWJhci1kb25lIHtcblx0cG9zaXRpb246IGFic29sdXRlO1xuXHRib3JkZXItcmFkaXVzOiAxMDBlbTtcblx0bGVmdDogMDtcblx0dG9wOiAwO1xuXHRoZWlnaHQ6IDEwMCU7XG5cdGJhY2tncm91bmQtY29sb3I6IHZhcigtLXRzLWNvbG9yLWJsdWUpO1xufVxuXG4ucHJvZ3Jlc3MtYmFyLXdyYXBwZXJbZGF0YS1pbmRldGVybWluYXRlXSAucHJvZ3Jlc3MtYmFyLWRvbmUge1xuXHRhbmltYXRpb246IGluZmluaXRlLXByb2dyZXNzIDFzIGxpbmVhciBpbmZpbml0ZTtcbn1cblxuQGtleWZyYW1lcyBpbmZpbml0ZS1wcm9ncmVzcyB7XG5cdDAlIHtcblx0XHR3aWR0aDogMDtcblx0XHRtYXJnaW4tbGVmdDogMDtcblx0XHRtYXJnaW4tcmlnaHQ6IDEwMCU7XG5cdH1cblx0MjAlIHtcblx0XHR3aWR0aDogMzAlO1xuXHRcdG1hcmdpbi1sZWZ0OiAwO1xuXHRcdG1hcmdpbi1yaWdodDogMDtcblx0fVxuXHQ0MCUge1xuXHRcdHdpZHRoOiAzMCU7XG5cdFx0bWFyZ2luLWxlZnQ6IDMwJTtcblx0XHRtYXJnaW4tcmlnaHQ6IDA7XG5cdH1cblx0NjAlIHtcblx0XHR3aWR0aDogNDAlO1xuXHRcdG1hcmdpbi1sZWZ0OiA1MCU7XG5cdFx0bWFyZ2luLXJpZ2h0OiAwO1xuXHR9XG5cdDgwJSB7XG5cdFx0d2lkdGg6IDQwJTtcblx0XHRtYXJnaW4tbGVmdDogNzAlO1xuXHRcdG1hcmdpbi1yaWdodDogMDtcblx0fVxuXHQxMDAlIHtcblx0XHR3aWR0aDogMDtcblx0XHRtYXJnaW4tbGVmdDogMTAwJTtcblx0XHRtYXJnaW4tcmlnaHQ6IDA7XG5cdH1cbn1cbiJdfQ== */";
+
+  function _templateObject() {
+    var data = _taggedTemplateLiteralLoose(["\n\t\t\t\t<div class=\"progress-bar-wrapper\" ?data-indeterminate=\"", "\">\n\t\t\t\t\t<div class=\"progress-bar-total\">\n\t\t\t\t\t\t<div style=\"", "\" class=\"progress-bar-done\"></div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t"]);
+
+    _templateObject = function _templateObject() {
+      return data;
+    };
+
+    return data;
+  }
+  elements.customElementDefineHelper('ts-progress-bar',
+  /*#__PURE__*/
+  function (_TSElement) {
+    _inheritsLoose(_class, _TSElement);
+
+    _createClass(_class, null, [{
+      key: "styles",
+      get: function get() {
+        return [elements.TSElement.styles, elements.unsafeCSS(css)];
+      }
+    }, {
+      key: "properties",
+      get: function get() {
+        return {
+          total: {
+            type: Number,
+            reflect: true
+          },
+          done: {
+            type: Number,
+            reflect: true
+          },
+          indeterminate: {
+            type: Boolean,
+            reflect: true
+          }
+        };
+      }
+    }]);
+
+    function _class() {
+      var _this;
+
+      _this = _TSElement.call(this) || this;
+      _this.total = 100;
+      _this.done = 0;
+      _this.indeterminate = false;
+      return _this;
+    }
+
+    var _proto = _class.prototype;
+
+    _proto.render = function render() {
+      return elements.html(_templateObject(), this.indeterminate, this.doneWidthStyle);
+    };
+
+    _createClass(_class, [{
+      key: "doneWidthStyle",
+      get: function get() {
+        if (!this.indeterminate) {
+          return "width: " + this.done / this.total * 100 + "%";
+        }
+      }
+    }]);
+
+    return _class;
+  }(elements.TSElement));
+
+}));
+//# sourceMappingURL=progress-bar.umd.js.map

package.json

 {
   "name": "@tradeshift/elements.progress-bar",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "src": "src/progress-bar.js",
@@ -12,5 +12,5 @@ "main": "lib/progress-bar.umd.js",
   "dependencies": {
-    "@tradeshift/elements": "^0.6.0"
+    "@tradeshift/elements": "^0.7.0"
   },
-  "gitHead": "a40f2b733b10bbc573ade7d66b39041459213810"
+  "gitHead": "d0ea80e217c6b4da934c0ad9f2e510bf4db76adb"
 }

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

24770

increased by25.49%

Lines of code

119

increased by466.67%

Number of low quality alerts

2

decreased by-33.33%

Dependency changes

• + Added@tradeshift/elements@0.7.6(transitive)

• - Removed@tradeshift/elements@0.6.0(transitive)

• Updated@tradeshift/elements@^0.7.0