@tradeshift/elements.typography - npm Package Compare versions

Comparing version 0.6.0 to 0.7.0

lib/typography.umd.js

@@ -1,1 +0,119 @@
-!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 o=0;o<e.length;o++){var r=e[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}function o(t,e){return e||(e=t.slice(0)),t.raw=e,t}function r(){var t=o(['\n\t\t\t\t\t\t<div class="text-wrapper" title="','">\n\t\t\t\t\t\t\t<slot @slotchange="','">',"</slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t  "]);return r=function(){return t},t}function n(){var t=o(['\n\t\t\t\t\t\t<div class="text-wrapper">\n\t\t\t\t\t\t\t<slot>',"</slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t  "]);return n=function(){return t},t}t.customElementDefineHelper("ts-typography",function(o){var i,s;function a(){return o.apply(this,arguments)||this}s=o,(i=a).prototype=Object.create(s.prototype),i.prototype.constructor=i,i.__proto__=s;var l,p,c,f=a.prototype;return f.textChangeHandler=function(t){var e=t.currentTarget;this.tooltip=this.tooltip||this.text||e.assignedNodes()[0].data},f.render=function(){return this.noTooltip?t.html(n(),this.text):t.html(r(),this.tooltip||this.text,this.textChangeHandler,this.text)},l=a,c=[{key:"styles",get:function(){return[t.TSElement.styles,t.unsafeCSS(":host{display:block;line-height:20px;line-height:var(--ts-unit);min-width:0;color:#0f151a;color:var(--ts-color-black)}.text-wrapper{font-size:14px;font-size:var(--ts-font-size-default)}:host([variant=title]) .text-wrapper{font-size:16px;font-size:var(--ts-fontsize-medium);font-weight:600;font-weight:var(--ts-fontweight-semibold)}:host([variant=subtitle]) .text-wrapper{font-size:12px;font-size:var(--ts-fontsize-mini);color:#506b77;color:var(--ts-color-slate-lightest)}:host([variant=semi-bold]) .text-wrapper{font-weight:600;font-weight:var(--ts-fontweight-semibold)}:host([no-wrap]) .text-wrapper{position:relative;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host([type=inverted]) .text-wrapper{color:#fff;color:var(--ts-color-white)}:host([type=warning]) .text-wrapper{color:#ff8c00;color:var(--ts-color-orange)}:host([type=danger]) .text-wrapper,:host([type=error]) .text-wrapper{color:#bd0000;color:var(--ts-color-red)}:host([type=action]) .text-wrapper,:host([type=primary]) .text-wrapper{color:#00aeff;color:var(--ts-color-blue)}:host([type=success]) .text-wrapper{color:#50c610;color:var(--ts-color-green)}:host([type=disabled]) .text-wrapper{color:#cbd7dc;color:var(--ts-color-gray-light)}:host([type=disabled-checked]) .text-wrapper{color:#9ab2bc;color:var(--ts-color-gray)}:host([type=slate-lightest]) .text-wrapper{color:#506b77;color:var(--ts-color-slate-lightest)}")]}},{key:"properties",get:function(){return{text:{type:String},tooltip:{type:String},variant:{type:String},type:{type:String},inline:{type:Boolean},noWrap:{type:Boolean,attribute:"no-wrap"},noTooltip:{type:Boolean,attribute:"no-tooltip"}}}}],(p=null)&&e(l.prototype,p),c&&e(l,c),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\n:host {\n\tdisplay: block;\n\tline-height: 20px;\n\tline-height: var(--ts-unit);\n\t/* it's a hack for truncated text within flexbox */\n\t/* https://css-tricks.com/flexbox-truncated-text/ */\n\tmin-width: 0;\n\tcolor: rgb(15, 21, 26);\n\tcolor: var(--ts-color-black);\n}\n\n.text-wrapper {\n\tfont-size: 14px;\n\tfont-size: var(--ts-font-size-default);\n}\n\n:host([variant='title']) .text-wrapper {\n\tfont-size: 16px;\n\tfont-size: var(--ts-fontsize-medium);\n\tfont-weight: 600;\n\tfont-weight: var(--ts-fontweight-semibold);\n}\n\n:host([variant='subtitle']) .text-wrapper {\n\tfont-size: 12px;\n\tfont-size: var(--ts-fontsize-mini);\n\tcolor: rgb(80, 107, 119);\n\tcolor: var(--ts-color-slate-lightest);\n}\n\n:host([variant='semi-bold']) .text-wrapper {\n\tfont-weight: 600;\n\tfont-weight: var(--ts-fontweight-semibold);\n}\n\n:host([no-wrap]) .text-wrapper {\n\tposition: relative;\n\tmax-width: 100%;\n\twhite-space: nowrap;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n}\n\n:host([type='inverted']) .text-wrapper {\n\tcolor: rgb(255, 255, 255);\n\tcolor: var(--ts-color-white);\n}\n\n:host([type='warning']) .text-wrapper {\n\tcolor: rgb(255, 140, 0);\n\tcolor: var(--ts-color-orange);\n}\n\n:host([type='error']) .text-wrapper,\n:host([type='danger']) .text-wrapper {\n\tcolor: rgb(189, 0, 0);\n\tcolor: var(--ts-color-red);\n}\n\n:host([type='primary']) .text-wrapper,\n:host([type='action']) .text-wrapper {\n\tcolor: rgb(0, 174, 255);\n\tcolor: var(--ts-color-blue);\n}\n\n:host([type='success']) .text-wrapper {\n\tcolor: rgb(80, 198, 16);\n\tcolor: var(--ts-color-green);\n}\n\n:host([type='disabled']) .text-wrapper {\n\tcolor: rgb(203, 215, 220);\n\tcolor: var(--ts-color-gray-light);\n}\n\n:host([type='disabled-checked']) .text-wrapper {\n\tcolor: rgb(154, 178, 188);\n\tcolor: var(--ts-color-gray);\n}\n\n:host([type='slate-lightest']) .text-wrapper {\n\tcolor: rgb(80, 107, 119);\n\tcolor: var(--ts-color-slate-lightest);\n}\n\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInR5cG9ncmFwaHkuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLG9FQUFvRTs7QUFFcEU7Q0FDQyxjQUFjO0NBQ2QsaUJBQTJCO0NBQTNCLDJCQUEyQjtDQUMzQixrREFBa0Q7Q0FDbEQsbURBQW1EO0NBQ25ELFlBQVk7Q0FDWixzQkFBNEI7Q0FBNUIsNEJBQTRCO0FBQzdCOztBQUVBO0NBQ0MsZUFBc0M7Q0FBdEMsc0NBQXNDO0FBQ3ZDOztBQUVBO0NBQ0MsZUFBb0M7Q0FBcEMsb0NBQW9DO0NBQ3BDLGdCQUEwQztDQUExQywwQ0FBMEM7QUFDM0M7O0FBRUE7Q0FDQyxlQUFrQztDQUFsQyxrQ0FBa0M7Q0FDbEMsd0JBQXFDO0NBQXJDLHFDQUFxQztBQUN0Qzs7QUFFQTtDQUNDLGdCQUEwQztDQUExQywwQ0FBMEM7QUFDM0M7O0FBRUE7Q0FDQyxrQkFBa0I7Q0FDbEIsZUFBZTtDQUNmLG1CQUFtQjtDQUNuQixnQkFBZ0I7Q0FDaEIsdUJBQXVCO0FBQ3hCOztBQUVBO0NBQ0MseUJBQTRCO0NBQTVCLDRCQUE0QjtBQUM3Qjs7QUFFQTtDQUNDLHVCQUE2QjtDQUE3Qiw2QkFBNkI7QUFDOUI7O0FBRUE7O0NBRUMscUJBQTBCO0NBQTFCLDBCQUEwQjtBQUMzQjs7QUFFQTs7Q0FFQyx1QkFBMkI7Q0FBM0IsMkJBQTJCO0FBQzVCOztBQUVBO0NBQ0MsdUJBQTRCO0NBQTVCLDRCQUE0QjtBQUM3Qjs7QUFFQTtDQUNDLHlCQUFpQztDQUFqQyxpQ0FBaUM7QUFDbEM7O0FBRUE7Q0FDQyx5QkFBMkI7Q0FBM0IsMkJBQTJCO0FBQzVCOztBQUVBO0NBQ0Msd0JBQXFDO0NBQXJDLHFDQUFxQztBQUN0QyIsImZpbGUiOiJ0eXBvZ3JhcGh5LmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qIEdlbmVyYWwuLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLi4uLiAqL1xuXG46aG9zdCB7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRsaW5lLWhlaWdodDogdmFyKC0tdHMtdW5pdCk7XG5cdC8qIGl0J3MgYSBoYWNrIGZvciB0cnVuY2F0ZWQgdGV4dCB3aXRoaW4gZmxleGJveCAqL1xuXHQvKiBodHRwczovL2Nzcy10cmlja3MuY29tL2ZsZXhib3gtdHJ1bmNhdGVkLXRleHQvICovXG5cdG1pbi13aWR0aDogMDtcblx0Y29sb3I6IHZhcigtLXRzLWNvbG9yLWJsYWNrKTtcbn1cblxuLnRleHQtd3JhcHBlciB7XG5cdGZvbnQtc2l6ZTogdmFyKC0tdHMtZm9udC1zaXplLWRlZmF1bHQpO1xufVxuXG46aG9zdChbdmFyaWFudD0ndGl0bGUnXSkgLnRleHQtd3JhcHBlciB7XG5cdGZvbnQtc2l6ZTogdmFyKC0tdHMtZm9udHNpemUtbWVkaXVtKTtcblx0Zm9udC13ZWlnaHQ6IHZhcigtLXRzLWZvbnR3ZWlnaHQtc2VtaWJvbGQpO1xufVxuXG46aG9zdChbdmFyaWFudD0nc3VidGl0bGUnXSkgLnRleHQtd3JhcHBlciB7XG5cdGZvbnQtc2l6ZTogdmFyKC0tdHMtZm9udHNpemUtbWluaSk7XG5cdGNvbG9yOiB2YXIoLS10cy1jb2xvci1zbGF0ZS1saWdodGVzdCk7XG59XG5cbjpob3N0KFt2YXJpYW50PSdzZW1pLWJvbGQnXSkgLnRleHQtd3JhcHBlciB7XG5cdGZvbnQtd2VpZ2h0OiB2YXIoLS10cy1mb250d2VpZ2h0LXNlbWlib2xkKTtcbn1cblxuOmhvc3QoW25vLXdyYXBdKSAudGV4dC13cmFwcGVyIHtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRtYXgtd2lkdGg6IDEwMCU7XG5cdHdoaXRlLXNwYWNlOiBub3dyYXA7XG5cdG92ZXJmbG93OiBoaWRkZW47XG5cdHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xufVxuXG46aG9zdChbdHlwZT0naW52ZXJ0ZWQnXSkgLnRleHQtd3JhcHBlciB7XG5cdGNvbG9yOiB2YXIoLS10cy1jb2xvci13aGl0ZSk7XG59XG5cbjpob3N0KFt0eXBlPSd3YXJuaW5nJ10pIC50ZXh0LXdyYXBwZXIge1xuXHRjb2xvcjogdmFyKC0tdHMtY29sb3Itb3JhbmdlKTtcbn1cblxuOmhvc3QoW3R5cGU9J2Vycm9yJ10pIC50ZXh0LXdyYXBwZXIsXG46aG9zdChbdHlwZT0nZGFuZ2VyJ10pIC50ZXh0LXdyYXBwZXIge1xuXHRjb2xvcjogdmFyKC0tdHMtY29sb3ItcmVkKTtcbn1cblxuOmhvc3QoW3R5cGU9J3ByaW1hcnknXSkgLnRleHQtd3JhcHBlcixcbjpob3N0KFt0eXBlPSdhY3Rpb24nXSkgLnRleHQtd3JhcHBlciB7XG5cdGNvbG9yOiB2YXIoLS10cy1jb2xvci1ibHVlKTtcbn1cblxuOmhvc3QoW3R5cGU9J3N1Y2Nlc3MnXSkgLnRleHQtd3JhcHBlciB7XG5cdGNvbG9yOiB2YXIoLS10cy1jb2xvci1ncmVlbik7XG59XG5cbjpob3N0KFt0eXBlPSdkaXNhYmxlZCddKSAudGV4dC13cmFwcGVyIHtcblx0Y29sb3I6IHZhcigtLXRzLWNvbG9yLWdyYXktbGlnaHQpO1xufVxuXG46aG9zdChbdHlwZT0nZGlzYWJsZWQtY2hlY2tlZCddKSAudGV4dC13cmFwcGVyIHtcblx0Y29sb3I6IHZhcigtLXRzLWNvbG9yLWdyYXkpO1xufVxuXG46aG9zdChbdHlwZT0nc2xhdGUtbGlnaHRlc3QnXSkgLnRleHQtd3JhcHBlciB7XG5cdGNvbG9yOiB2YXIoLS10cy1jb2xvci1zbGF0ZS1saWdodGVzdCk7XG59XG4iXX0= */";
+
+  function _templateObject2() {
+    var data = _taggedTemplateLiteralLoose(["\n\t\t\t\t\t\t<div class=\"text-wrapper\" title=\"", "\">\n\t\t\t\t\t\t\t<slot @slotchange=\"", "\">", "</slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t  "]);
+
+    _templateObject2 = function _templateObject2() {
+      return data;
+    };
+
+    return data;
+  }
+
+  function _templateObject() {
+    var data = _taggedTemplateLiteralLoose(["\n\t\t\t\t\t\t<div class=\"text-wrapper\">\n\t\t\t\t\t\t\t<slot>", "</slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t  "]);
+
+    _templateObject = function _templateObject() {
+      return data;
+    };
+
+    return data;
+  }
+  elements.customElementDefineHelper('ts-typography',
+  /*#__PURE__*/
+  function (_TSElement) {
+    _inheritsLoose(_class, _TSElement);
+
+    function _class() {
+      return _TSElement.apply(this, arguments) || this;
+    }
+
+    var _proto = _class.prototype;
+
+    _proto.textChangeHandler = function textChangeHandler(event) {
+      var slot = event.currentTarget;
+      this.tooltip = this.tooltip || this.text || slot.assignedNodes()[0].data;
+    };
+
+    _proto.render = function render() {
+      return this.noTooltip ? elements.html(_templateObject(), this.text) : elements.html(_templateObject2(), this.tooltip || this.text, this.textChangeHandler, this.text);
+    };
+
+    _createClass(_class, null, [{
+      key: "styles",
+      get: function get() {
+        return [elements.TSElement.styles, elements.unsafeCSS(css)];
+      }
+    }, {
+      key: "properties",
+      get: function get() {
+        return {
+          text: {
+            type: String
+          },
+          tooltip: {
+            type: String
+          },
+          variant: {
+            type: String
+          },
+          type: {
+            type: String
+          },
+          inline: {
+            type: Boolean
+          },
+          noWrap: {
+            type: Boolean,
+            attribute: 'no-wrap'
+          },
+          noTooltip: {
+            type: Boolean,
+            attribute: 'no-tooltip'
+          }
+        };
+      }
+    }]);
+
+    return _class;
+  }(elements.TSElement));
+
+}));
+//# sourceMappingURL=typography.umd.js.map

package.json

 {
   "name": "@tradeshift/elements.typography",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "src": "src/typography.js",
@@ -12,5 +12,5 @@ "main": "lib/typography.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

26724

increased by26.89%

Lines of code

132

increased by450%

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