New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

@tradeshift/elements.spinner

Package Overview
Dependencies
Maintainers
8
Versions
77
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@tradeshift/elements.spinner - npm Package Compare versions

Comparing version 0.19.3 to 0.20.0

lib/spinner.umd.js.map

2

lib/spinner.esm.js

@@ -1,1 +0,1 @@

import{html as r,customElementDefineHelper as e,TSElement as t,unsafeCSS as i}from"@tradeshift/elements";function n(r,e){for(var t=0;t<e.length;t++){var i=e[t];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(r,i.key,i)}}function o(r,e){return e||(e=r.slice(0)),r.raw=e,r}var s="large",a="blue";function p(){var r=o(['\n\t\t\t<div class="message">',"</div>\n\t\t"]);return p=function(){return r},r}function l(){var r=o(['\n\t\t\t<div class="spinner"></div>\n\t\t\t',"\n\t\t"]);return l=function(){return r},r}function d(){var r=o([""]);return d=function(){return r},r}var m=function(e){var o,m,u,f,h;function g(){var r=e.call(this)||this;return r.color=a,r.size=s,r}return m=e,(o=g).prototype=Object.create(m.prototype),o.prototype.constructor=o,o.__proto__=m,g.prototype.render=function(){return this.visible?r(l(),this.messageHtml):r(d())},u=g,h=[{key:"styles",get:function(){return[t.styles,i(":host{z-index:4000;z-index:var(--ts-zindex-spin)}:host .spinner{border:8px solid rgba(203,215,220,.5);border:var(--spinner-border-large) solid var(--spinner-border-color);border-top-color:#00aeff;border-top-color:var(--spinner-color-blue);border-radius:50%;width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large);-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;margin:0 auto}:host .message{text-align:center;margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-font-size-default)}:host([data-size=large]) .spinner{border-width:8px;border-width:var(--spinner-border-large);width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large)}:host([data-size=large]) .message{margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-fontsize)}:host([data-size=medium]) .spinner{border-width:4px;border-width:var(--spinner-border-medium);width:40px;width:var(--spinner-size-medium);height:40px;height:var(--spinner-size-medium)}:host([data-size=medium]) .message{margin:10px;margin:var(--ts-unit-half);font-size:12px;font-size:var(--ts-fontsize-mini)}:host([data-size=small]) .spinner{border-width:3px;border-width:var(--spinner-border-small);width:20px;width:var(--spinner-size-small);height:20px;height:var(--spinner-size-small)}:host([data-size=small]) .message{margin:5px;margin:var(--ts-unit-quarter);font-size:11px;font-size:var(--ts-fontsize-small)}:host([data-color=blue]) .spinner{border-top-color:#00aeff;border-top-color:var(--spinner-color-blue)}:host([data-color=mono]) .spinner{border-top-color:#506b77;border-top-color:var(--spinner-color-mono)}:host([data-color=white]) .spinner{border-top-color:#fff;border-top-color:var(--spinner-color-white)}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}")]}},{key:"properties",get:function(){return{color:{type:String,attribute:"data-color",reflect:!0},message:{type:String,attribute:"data-message",reflect:!0},size:{type:String,attribute:"data-size",reflect:!0},visible:{type:Boolean,attribute:"data-visible",reflect:!0}}}}],(f=[{key:"messageHtml",get:function(){return this.message?r(p(),this.message):""}}])&&n(u.prototype,f),h&&n(u,h),g}(t);e("ts-spinner",m);export{m as TSSpinner};
import{html as e,customElementDefineHelper as r,TSElement as t,unsafeCSS as i}from"@tradeshift/elements";function n(e,r){for(var t=0;t<r.length;t++){var i=r[t];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function o(e,r){return(o=Object.setPrototypeOf||function(e,r){return e.__proto__=r,e})(e,r)}function s(e,r){return r||(r=e.slice(0)),e.raw=r,e}var a,p,l,d="large",m="blue",f=function(r){var f,h,g,u,b;function c(){var e=r.call(this)||this;return e.color=m,e.size=d,e}return h=r,(f=c).prototype=Object.create(h.prototype),f.prototype.constructor=f,o(f,h),c.prototype.render=function(){return this.visible?e(p||(p=s(['\n\t\t\t<div class="spinner"></div>\n\t\t\t',"\n\t\t"])),this.messageHtml):e(a||(a=s([""])))},g=c,b=[{key:"styles",get:function(){return[t.styles,i(":host{z-index:4000;z-index:var(--ts-zindex-spin)}:host .spinner{border:8px solid rgba(203,215,220,.5);border:var(--spinner-border-large) solid var(--spinner-border-color);border-top-color:#00aeff;border-top-color:var(--spinner-color-blue);border-radius:50%;width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large);-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;margin:0 auto}:host .message{text-align:center;margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-font-size-default)}:host([data-size=large]) .spinner{border-width:8px;border-width:var(--spinner-border-large);width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large)}:host([data-size=large]) .message{margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-fontsize)}:host([data-size=medium]) .spinner{border-width:4px;border-width:var(--spinner-border-medium);width:40px;width:var(--spinner-size-medium);height:40px;height:var(--spinner-size-medium)}:host([data-size=medium]) .message{margin:10px;margin:var(--ts-unit-half);font-size:12px;font-size:var(--ts-fontsize-mini)}:host([data-size=small]) .spinner{border-width:3px;border-width:var(--spinner-border-small);width:20px;width:var(--spinner-size-small);height:20px;height:var(--spinner-size-small)}:host([data-size=small]) .message{margin:5px;margin:var(--ts-unit-quarter);font-size:11px;font-size:var(--ts-fontsize-small)}:host([data-color=blue]) .spinner{border-top-color:#00aeff;border-top-color:var(--spinner-color-blue)}:host([data-color=mono]) .spinner{border-top-color:#506b77;border-top-color:var(--spinner-color-mono)}:host([data-color=white]) .spinner{border-top-color:#fff;border-top-color:var(--spinner-color-white)}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}")]}},{key:"properties",get:function(){return{color:{type:String,attribute:"data-color",reflect:!0},message:{type:String,attribute:"data-message",reflect:!0},size:{type:String,attribute:"data-size",reflect:!0},visible:{type:Boolean,attribute:"data-visible",reflect:!0}}}}],(u=[{key:"messageHtml",get:function(){return this.message?e(l||(l=s(['\n\t\t\t<div class="message">',"</div>\n\t\t"])),this.message):""}}])&&n(g.prototype,u),b&&n(g,b),c}(t);r("ts-spinner",f);export{f as TSSpinner};

@@ -1,1 +0,1 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@tradeshift/elements")):"function"==typeof define&&define.amd?define(["exports","@tradeshift/elements"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).ts=e.ts||{},e.ts.elements=e.ts.elements||{},e.ts.elements.spinner=e.ts.elements.spinner||{}),e.ts.elements)}(this,(function(e,t){"use strict";function r(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function n(e,t){return t||(t=e.slice(0)),e.raw=t,e}var i="large",s="blue";function o(){var e=n(['\n\t\t\t<div class="message">',"</div>\n\t\t"]);return o=function(){return e},e}function a(){var e=n(['\n\t\t\t<div class="spinner"></div>\n\t\t\t',"\n\t\t"]);return a=function(){return e},e}function l(){var e=n([""]);return l=function(){return e},e}var p=function(e){var n,p,d,f,m;function u(){var t=e.call(this)||this;return t.color=s,t.size=i,t}return p=e,(n=u).prototype=Object.create(p.prototype),n.prototype.constructor=n,n.__proto__=p,u.prototype.render=function(){return this.visible?t.html(a(),this.messageHtml):t.html(l())},d=u,m=[{key:"styles",get:function(){return[t.TSElement.styles,t.unsafeCSS(":host{z-index:4000;z-index:var(--ts-zindex-spin)}:host .spinner{border:8px solid rgba(203,215,220,.5);border:var(--spinner-border-large) solid var(--spinner-border-color);border-top-color:#00aeff;border-top-color:var(--spinner-color-blue);border-radius:50%;width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large);-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;margin:0 auto}:host .message{text-align:center;margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-font-size-default)}:host([data-size=large]) .spinner{border-width:8px;border-width:var(--spinner-border-large);width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large)}:host([data-size=large]) .message{margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-fontsize)}:host([data-size=medium]) .spinner{border-width:4px;border-width:var(--spinner-border-medium);width:40px;width:var(--spinner-size-medium);height:40px;height:var(--spinner-size-medium)}:host([data-size=medium]) .message{margin:10px;margin:var(--ts-unit-half);font-size:12px;font-size:var(--ts-fontsize-mini)}:host([data-size=small]) .spinner{border-width:3px;border-width:var(--spinner-border-small);width:20px;width:var(--spinner-size-small);height:20px;height:var(--spinner-size-small)}:host([data-size=small]) .message{margin:5px;margin:var(--ts-unit-quarter);font-size:11px;font-size:var(--ts-fontsize-small)}:host([data-color=blue]) .spinner{border-top-color:#00aeff;border-top-color:var(--spinner-color-blue)}:host([data-color=mono]) .spinner{border-top-color:#506b77;border-top-color:var(--spinner-color-mono)}:host([data-color=white]) .spinner{border-top-color:#fff;border-top-color:var(--spinner-color-white)}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}")]}},{key:"properties",get:function(){return{color:{type:String,attribute:"data-color",reflect:!0},message:{type:String,attribute:"data-message",reflect:!0},size:{type:String,attribute:"data-size",reflect:!0},visible:{type:Boolean,attribute:"data-visible",reflect:!0}}}}],(f=[{key:"messageHtml",get:function(){return this.message?t.html(o(),this.message):""}}])&&r(d.prototype,f),m&&r(d,m),u}(t.TSElement);t.customElementDefineHelper("ts-spinner",p),e.TSSpinner=p,Object.defineProperty(e,"__esModule",{value:!0})}));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@tradeshift/elements")):"function"==typeof define&&define.amd?define(["exports","@tradeshift/elements"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).ts=e.ts||{},e.ts.elements=e.ts.elements||{},e.ts.elements.spinner=e.ts.elements.spinner||{}),e.ts.elements)}(this,(function(e,t){"use strict";function r(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function n(e,t){return(n=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function i(e,t){return t||(t=e.slice(0)),e.raw=t,e}var s,o,a,l="large",p="blue",d=function(e){var d,m,f,u,h;function g(){var t=e.call(this)||this;return t.color=p,t.size=l,t}return m=e,(d=g).prototype=Object.create(m.prototype),d.prototype.constructor=d,n(d,m),g.prototype.render=function(){return this.visible?t.html(o||(o=i(['\n\t\t\t<div class="spinner"></div>\n\t\t\t',"\n\t\t"])),this.messageHtml):t.html(s||(s=i([""])))},f=g,h=[{key:"styles",get:function(){return[t.TSElement.styles,t.unsafeCSS(":host{z-index:4000;z-index:var(--ts-zindex-spin)}:host .spinner{border:8px solid rgba(203,215,220,.5);border:var(--spinner-border-large) solid var(--spinner-border-color);border-top-color:#00aeff;border-top-color:var(--spinner-color-blue);border-radius:50%;width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large);-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;margin:0 auto}:host .message{text-align:center;margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-font-size-default)}:host([data-size=large]) .spinner{border-width:8px;border-width:var(--spinner-border-large);width:80px;width:var(--spinner-size-large);height:80px;height:var(--spinner-size-large)}:host([data-size=large]) .message{margin:20px;margin:var(--ts-unit);font-size:14px;font-size:var(--ts-fontsize)}:host([data-size=medium]) .spinner{border-width:4px;border-width:var(--spinner-border-medium);width:40px;width:var(--spinner-size-medium);height:40px;height:var(--spinner-size-medium)}:host([data-size=medium]) .message{margin:10px;margin:var(--ts-unit-half);font-size:12px;font-size:var(--ts-fontsize-mini)}:host([data-size=small]) .spinner{border-width:3px;border-width:var(--spinner-border-small);width:20px;width:var(--spinner-size-small);height:20px;height:var(--spinner-size-small)}:host([data-size=small]) .message{margin:5px;margin:var(--ts-unit-quarter);font-size:11px;font-size:var(--ts-fontsize-small)}:host([data-color=blue]) .spinner{border-top-color:#00aeff;border-top-color:var(--spinner-color-blue)}:host([data-color=mono]) .spinner{border-top-color:#506b77;border-top-color:var(--spinner-color-mono)}:host([data-color=white]) .spinner{border-top-color:#fff;border-top-color:var(--spinner-color-white)}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}")]}},{key:"properties",get:function(){return{color:{type:String,attribute:"data-color",reflect:!0},message:{type:String,attribute:"data-message",reflect:!0},size:{type:String,attribute:"data-size",reflect:!0},visible:{type:Boolean,attribute:"data-visible",reflect:!0}}}}],(u=[{key:"messageHtml",get:function(){return this.message?t.html(a||(a=i(['\n\t\t\t<div class="message">',"</div>\n\t\t"])),this.message):""}}])&&r(f.prototype,u),h&&r(f,h),g}(t.TSElement);t.customElementDefineHelper("ts-spinner",d),e.TSSpinner=d,Object.defineProperty(e,"__esModule",{value:!0})}));
{
"name": "@tradeshift/elements.spinner",
"version": "0.19.3",
"version": "0.20.0",
"repository": {

@@ -18,6 +18,6 @@ "type": "git",

"dependencies": {
"@tradeshift/elements": "^0.19.3"
"@tradeshift/elements": "^0.20.0"
},
"src": "src/spinner.js",
"gitHead": "de21b6b94b9c536f1030fe9905cd4f81288eebb3"
"gitHead": "2c7e9c7c5b436cb1103cfdc15f48834a74f43f36"
}

@@ -30,3 +30,3 @@ <h1 align="center">

table {
width:100%;
width:100%;
}

@@ -37,8 +37,8 @@ </style>

| Property | Attribute | Type | Default | Description |
| -------- | ------------ | ------- | ------- | ----------------------------------------------- |
| visible | data-visible | boolean | false | Show/hide the spinner |
| message | data-message | string | - | Text to show below the spinner |
| size | data-size | string | large | Size of the spinner, `large`, `medium`, `small` |
| color | data-color | string | blue | Spinner color, `blue`, `mono`, `white` |
| Property | Attribute | Type | Default | Description |
| -------- | ------------ | ------- | ----------- | ----------------------------------------------- |
| color | data-color | String | colors.BLUE | Spinner color, `blue`, `mono`, `white` |
| message | data-message | String | | Text to show below the spinner |
| size | data-size | String | sizes.LARGE | Size of the spinner, `large`, `medium`, `small` |
| visible | data-visible | Boolean | false | Show/hide the spinner |

@@ -45,0 +45,0 @@ ## ➤ How to use it

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc