@twilio-paste/spinner - npm Package Compare versions

Comparing version 8.0.2 to 8.1.0

CHANGELOG.md

 # Change Log
 
+## 8.1.0
+
+### Minor Changes
+
+- [`68ee1a35e`](https://github.com/twilio-labs/paste/commit/68ee1a35e5aed2bf099be01ceef0d4dbd608c8c1) [#2304](https://github.com/twilio-labs/paste/pull/2304) Thanks [@gloriliale](https://github.com/gloriliale)! - [Spinner] make title an optional prop, throw an error when not decorative and no title
+
+### Patch Changes
+
+- [`dce15da77`](https://github.com/twilio-labs/paste/commit/dce15da77560a10be6a984a96519e68f958e4595) [#2315](https://github.com/twilio-labs/paste/pull/2315) Thanks [@SiTaggart](https://github.com/SiTaggart)! - [Spinner] title is no longer required. Matching prop types to typescript types
+
 ## 8.0.2
@@ -4,0 +14,0 @@

dist/index.d.ts

@@ -5,3 +5,3 @@ import * as React from 'react';
 export interface SpinnerProps extends IconWrapperProps {
-    title: string;
+    title?: string;
     delay?: number;
@@ -8,0 +8,0 @@ decorative: boolean;

dist/index.debug.es.js

@@ -94,2 +94,5 @@ var __defProp = Object.defineProperty;
   const [show, setShow] = React.useState(delay === 0);
+  if (!decorative && title == null) {
+    throw new Error("[Spinner]: Missing a title for non-decorative icon.");
+  }
   React.useEffect(() => {
@@ -126,3 +129,3 @@ if (delay === 0)
 Spinner.propTypes = {
-  title: PropTypes.string.isRequired,
+  title: PropTypes.string,
   delay: PropTypes.number,
@@ -129,0 +132,0 @@ element: PropTypes.string,

dist/index.debug.js

@@ -123,2 +123,5 @@ var __create = Object.create;
   const [show, setShow] = React.useState(delay === 0);
+  if (!decorative && title == null) {
+    throw new Error("[Spinner]: Missing a title for non-decorative icon.");
+  }
   React.useEffect(() => {
@@ -155,3 +158,3 @@ if (delay === 0)
 Spinner.propTypes = {
-  title: PropTypes.string.isRequired,
+  title: PropTypes.string,
   delay: PropTypes.number,
@@ -158,0 +161,0 @@ element: PropTypes.string,

dist/index.es.js

@@ -1,2 +0,2 @@
-var E=Object.defineProperty;var l=Object.getOwnPropertySymbols;var G=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var f=(o,t,e)=>t in o?E(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e,c=(o,t)=>{for(var e in t||(t={}))G.call(t,e)&&f(o,e,t[e]);if(l)for(var e of l(t))$.call(t,e)&&f(o,e,t[e]);return o};import*as r from"react";import*as s from"prop-types";import{useUID as K}from"@twilio-paste/uid-library";import{IconWrapper as z}from"@twilio-paste/icons/esm/helpers/IconWrapper";import{useTheme as B}from"@twilio-paste/theme";import{isIconSizeTokenProp as D}from"@twilio-paste/style-props";import{styled as a}from"@twilio-paste/styling-library";import{keyframes as y}from"@twilio-paste/styling-library";var d=45,p={cx:50,cy:50,r:d},i=Math.PI*2*d;var h=y`
+var E=Object.defineProperty;var f=Object.getOwnPropertySymbols;var G=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var d=(o,t,e)=>t in o?E(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e,c=(o,t)=>{for(var e in t||(t={}))G.call(t,e)&&d(o,e,t[e]);if(f)for(var e of f(t))$.call(t,e)&&d(o,e,t[e]);return o};import*as r from"react";import*as n from"prop-types";import{useUID as K}from"@twilio-paste/uid-library";import{IconWrapper as z}from"@twilio-paste/icons/esm/helpers/IconWrapper";import{useTheme as B}from"@twilio-paste/theme";import{isIconSizeTokenProp as D}from"@twilio-paste/style-props";import{styled as a}from"@twilio-paste/styling-library";import{keyframes as h}from"@twilio-paste/styling-library";var y=45,p={cx:50,cy:50,r:y},i=Math.PI*2*y;var S=h`
   0%,
@@ -18,3 +18,3 @@ 15% {
   }
-`,u=y`
+`,u=h`
   0% {
@@ -26,2 +26,2 @@ transform: rotateZ(0deg);
   }
-`;var S=a.circle({transformOrigin:"center",opacity:.25}),g=a.circle(({show:o})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${u}`,strokeDasharray:i,opacity:o?1:0})),x=a.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${h}`});var P=r.forwardRef(({size:o,color:t="currentColor",title:e,as:w,display:C,decorative:k,delay:n=250,element:T="SPINNER"},b)=>{let m=`spinner-${K()}`,{borderWidths:{borderWidth40:v}}=B(),[I,R]=r.useState(n===0);return r.useEffect(()=>{if(n===0)return;let W=setTimeout(()=>R(!0),n);return()=>clearTimeout(W)},[n]),r.createElement(z,{as:w,element:T,display:C,size:o,color:t,"aria-hidden":k,ref:b},r.createElement(x,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":m},e?r.createElement("title",{id:m},e):null,r.createElement("g",{strokeWidth:v,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},r.createElement(S,c({},p)),r.createElement(g,c({show:I},p)))))});P.displayName="Spinner";P.propTypes={title:s.string.isRequired,delay:s.number,element:s.string,size:D};export{P as Spinner};
+`;var g=a.circle({transformOrigin:"center",opacity:.25}),x=a.circle(({show:o})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${u}`,strokeDasharray:i,opacity:o?1:0})),P=a.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${S}`});var w=r.forwardRef(({size:o,color:t="currentColor",title:e,as:C,display:k,decorative:m,delay:s=250,element:T="SPINNER"},b)=>{let l=`spinner-${K()}`,{borderWidths:{borderWidth40:v}}=B(),[I,R]=r.useState(s===0);if(!m&&e==null)throw new Error("[Spinner]: Missing a title for non-decorative icon.");return r.useEffect(()=>{if(s===0)return;let W=setTimeout(()=>R(!0),s);return()=>clearTimeout(W)},[s]),r.createElement(z,{as:C,element:T,display:k,size:o,color:t,"aria-hidden":m,ref:b},r.createElement(P,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":l},e?r.createElement("title",{id:l},e):null,r.createElement("g",{strokeWidth:v,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},r.createElement(g,c({},p)),r.createElement(x,c({show:I},p)))))});w.displayName="Spinner";w.propTypes={title:n.string,delay:n.number,element:n.string,size:D};export{w as Spinner};

dist/index.js

@@ -1,5 +0,5 @@
-var L=Object.create;var n=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames,u=Object.getOwnPropertySymbols,V=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty,Z=Object.prototype.propertyIsEnumerable;var g=(e,r,t)=>r in e?n(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,l=(e,r)=>{for(var t in r||(r={}))S.call(r,t)&&g(e,t,r[t]);if(u)for(var t of u(r))Z.call(r,t)&&g(e,t,r[t]);return e};var x=e=>n(e,"__esModule",{value:!0});var q=(e,r)=>{for(var t in r)n(e,t,{get:r[t],enumerable:!0})},P=(e,r,t,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of O(r))!S.call(e,i)&&(t||i!=="default")&&n(e,i,{get:()=>r[i],enumerable:!(p=M(r,i))||p.enumerable});return e},w=(e,r)=>P(x(n(e!=null?L(V(e)):{},"default",!r&&e&&e.__esModule?{get:()=>e.default,enumerable:!0}:{value:e,enumerable:!0})),e),H=(e=>(r,t)=>e&&e.get(r)||(t=P(x({}),r,1),e&&e.set(r,t),t))(typeof WeakMap!="undefined"?new WeakMap:0);var U={};q(U,{Spinner:()=>y});var o=w(require("react")),c=w(require("prop-types")),R=require("@twilio-paste/uid-library"),W=require("@twilio-paste/icons/cjs/helpers/IconWrapper"),E=require("@twilio-paste/theme"),G=require("@twilio-paste/style-props");var m=require("@twilio-paste/styling-library");var d=require("@twilio-paste/styling-library");var C=45,f={cx:50,cy:50,r:C},s=Math.PI*2*C;var k=d.keyframes`
+var A=Object.create;var s=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames,u=Object.getOwnPropertySymbols,V=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty,Z=Object.prototype.propertyIsEnumerable;var x=(e,r,t)=>r in e?s(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,l=(e,r)=>{for(var t in r||(r={}))g.call(r,t)&&x(e,t,r[t]);if(u)for(var t of u(r))Z.call(r,t)&&x(e,t,r[t]);return e};var P=e=>s(e,"__esModule",{value:!0});var H=(e,r)=>{for(var t in r)s(e,t,{get:r[t],enumerable:!0})},w=(e,r,t,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of O(r))!g.call(e,i)&&(t||i!=="default")&&s(e,i,{get:()=>r[i],enumerable:!(p=L(r,i))||p.enumerable});return e},C=(e,r)=>w(P(s(e!=null?A(V(e)):{},"default",!r&&e&&e.__esModule?{get:()=>e.default,enumerable:!0}:{value:e,enumerable:!0})),e),U=(e=>(r,t)=>e&&e.get(r)||(t=w(P({}),r,1),e&&e.set(r,t),t))(typeof WeakMap!="undefined"?new WeakMap:0);var j={};H(j,{Spinner:()=>y});var o=C(require("react")),c=C(require("prop-types")),W=require("@twilio-paste/uid-library"),E=require("@twilio-paste/icons/cjs/helpers/IconWrapper"),G=require("@twilio-paste/theme"),$=require("@twilio-paste/style-props");var m=require("@twilio-paste/styling-library");var d=require("@twilio-paste/styling-library");var k=45,f={cx:50,cy:50,r:k},n=Math.PI*2*k;var T=d.keyframes`
   0%,
   15% {
-    stroke-dashoffset: ${s*.9999};
+    stroke-dashoffset: ${n*.9999};
     transform: rotate(0);
@@ -10,3 +10,3 @@ }
   75% {
-    stroke-dashoffset: ${s*.2};
+    stroke-dashoffset: ${n*.2};
     transform: rotate(45deg);
@@ -16,6 +16,6 @@ }
   100% {
-    stroke-dashoffset: ${s*.9999};
+    stroke-dashoffset: ${n*.9999};
     transform: rotate(360deg);
   }
-`,T=d.keyframes`
+`,b=d.keyframes`
   0% {
@@ -27,2 +27,2 @@ transform: rotateZ(0deg);
   }
-`;var b=m.styled.circle({transformOrigin:"center",opacity:.25}),v=m.styled.circle(({show:e})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${T}`,strokeDasharray:s,opacity:e?1:0})),I=m.styled.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${k}`});var y=o.forwardRef(({size:e,color:r="currentColor",title:t,as:p,display:i,decorative:$,delay:a=250,element:K="SPINNER"},z)=>{let h=`spinner-${(0,R.useUID)()}`,{borderWidths:{borderWidth40:B}}=(0,E.useTheme)(),[D,N]=o.useState(a===0);return o.useEffect(()=>{if(a===0)return;let A=setTimeout(()=>N(!0),a);return()=>clearTimeout(A)},[a]),o.createElement(W.IconWrapper,{as:p,element:K,display:i,size:e,color:r,"aria-hidden":$,ref:z},o.createElement(I,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":h},t?o.createElement("title",{id:h},t):null,o.createElement("g",{strokeWidth:B,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},o.createElement(b,l({},f)),o.createElement(v,l({show:D},f)))))});y.displayName="Spinner";y.propTypes={title:c.string.isRequired,delay:c.number,element:c.string,size:G.isIconSizeTokenProp};module.exports=H(U);0&&(module.exports={Spinner});
+`;var v=m.styled.circle({transformOrigin:"center",opacity:.25}),I=m.styled.circle(({show:e})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${b}`,strokeDasharray:n,opacity:e?1:0})),R=m.styled.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${T}`});var y=o.forwardRef(({size:e,color:r="currentColor",title:t,as:p,display:i,decorative:h,delay:a=250,element:K="SPINNER"},z)=>{let S=`spinner-${(0,W.useUID)()}`,{borderWidths:{borderWidth40:B}}=(0,G.useTheme)(),[D,M]=o.useState(a===0);if(!h&&t==null)throw new Error("[Spinner]: Missing a title for non-decorative icon.");return o.useEffect(()=>{if(a===0)return;let N=setTimeout(()=>M(!0),a);return()=>clearTimeout(N)},[a]),o.createElement(E.IconWrapper,{as:p,element:K,display:i,size:e,color:r,"aria-hidden":h,ref:z},o.createElement(R,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":S},t?o.createElement("title",{id:S},t):null,o.createElement("g",{strokeWidth:B,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},o.createElement(v,l({},f)),o.createElement(I,l({show:D},f)))))});y.displayName="Spinner";y.propTypes={title:c.string,delay:c.number,element:c.string,size:$.isIconSizeTokenProp};module.exports=U(j);0&&(module.exports={Spinner});

package.json

 {
   "name": "@twilio-paste/spinner",
-  "version": "8.0.2",
+  "version": "8.1.0",
   "category": "feedback",
@@ -41,7 +41,7 @@ "status": "production",
   "devDependencies": {
-    "@twilio-paste/box": "^5.0.2",
+    "@twilio-paste/box": "^5.1.0",
     "@twilio-paste/design-tokens": "^7.1.1",
     "@twilio-paste/icons": "^6.2.1",
     "@twilio-paste/style-props": "^4.0.2",
-    "@twilio-paste/styling-library": "^0.3.7",
+    "@twilio-paste/styling-library": "^0.3.8",
     "@twilio-paste/theme": "^6.0.2",
@@ -48,0 +48,0 @@ "@twilio-paste/types": "^3.1.5",

No alert changes

Improved metrics

Lines of code

436

increased by1.4%

Worsened metrics

Total package byte prevSize

483396

decreased by-0.29%

No dependency changes