@twilio-paste/spinner - npm Package Compare versions

Comparing version 13.0.0 to 14.0.0

dist/index.debug.es.js

@@ -1,18 +0,1 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-
 // src/index.tsx
@@ -115,3 +98,3 @@ import * as React from "react";
       },
-      /* @__PURE__ */ React.createElement(StyledSvg, { viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": titleId }, title ? /* @__PURE__ */ React.createElement("title", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement("g", { strokeWidth: borderWidth40, stroke: "currentColor", strokeLinecap: "round", fill: "transparent" }, /* @__PURE__ */ React.createElement(StyledCircleTrack, __spreadValues({}, circleGeometry)), /* @__PURE__ */ React.createElement(AnimatedStyledCircle, __spreadValues({ show }, circleGeometry))))
+      /* @__PURE__ */ React.createElement(StyledSvg, { viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": titleId }, title ? /* @__PURE__ */ React.createElement("title", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement("g", { strokeWidth: borderWidth40, stroke: "currentColor", strokeLinecap: "round", fill: "transparent" }, /* @__PURE__ */ React.createElement(StyledCircleTrack, { ...circleGeometry }), /* @__PURE__ */ React.createElement(AnimatedStyledCircle, { show, ...circleGeometry })))
     );
@@ -118,0 +101,0 @@ }

dist/index.debug.js

@@ -6,18 +6,4 @@ "use strict";
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
 var __export = (target, all) => {
@@ -143,3 +129,3 @@ for (var name in all)
       },
-      /* @__PURE__ */ React.createElement(StyledSvg, { viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": titleId }, title ? /* @__PURE__ */ React.createElement("title", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement("g", { strokeWidth: borderWidth40, stroke: "currentColor", strokeLinecap: "round", fill: "transparent" }, /* @__PURE__ */ React.createElement(StyledCircleTrack, __spreadValues({}, circleGeometry)), /* @__PURE__ */ React.createElement(AnimatedStyledCircle, __spreadValues({ show }, circleGeometry))))
+      /* @__PURE__ */ React.createElement(StyledSvg, { viewBox: "0 0 100 100", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": titleId }, title ? /* @__PURE__ */ React.createElement("title", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement("g", { strokeWidth: borderWidth40, stroke: "currentColor", strokeLinecap: "round", fill: "transparent" }, /* @__PURE__ */ React.createElement(StyledCircleTrack, { ...circleGeometry }), /* @__PURE__ */ React.createElement(AnimatedStyledCircle, { show, ...circleGeometry })))
     );
@@ -155,5 +141,1 @@ }
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Spinner
-});

dist/index.es.js

@@ -1,2 +0,2 @@
-var __defProp=Object.defineProperty;var __getOwnPropSymbols=Object.getOwnPropertySymbols;var __hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable;var __defNormalProp=(obj,key,value)=>key in obj?__defProp(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value,__spreadValues=(a,b)=>{for(var prop in b||(b={}))__hasOwnProp.call(b,prop)&&__defNormalProp(a,prop,b[prop]);if(__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(b))__propIsEnum.call(b,prop)&&__defNormalProp(a,prop,b[prop]);return a};import*as React from"react";import PropTypes from"prop-types";import{useUID}from"@twilio-paste/uid-library";import{IconWrapper}from"@twilio-paste/icons/esm/helpers/IconWrapper";import{useTheme}from"@twilio-paste/theme";import{isIconSizeTokenProp}from"@twilio-paste/style-props";import{styled}from"@twilio-paste/styling-library";import{keyframes}from"@twilio-paste/styling-library";var circleGeometry={cx:50,cy:50,r:45},circleCircumference=Math.PI*2*45;var SvgKeyframes=keyframes`
+import*as React from"react";import PropTypes from"prop-types";import{useUID}from"@twilio-paste/uid-library";import{IconWrapper}from"@twilio-paste/icons/esm/helpers/IconWrapper";import{useTheme}from"@twilio-paste/theme";import{isIconSizeTokenProp}from"@twilio-paste/style-props";import{styled}from"@twilio-paste/styling-library";import{keyframes}from"@twilio-paste/styling-library";var circleGeometry={cx:50,cy:50,r:45},circleCircumference=Math.PI*2*45;var SvgKeyframes=keyframes`
   0%,
@@ -25,2 +25,2 @@ 15% {
   }
-`;var StyledCircleTrack=styled.circle({transformOrigin:"center",opacity:.25}),AnimatedStyledCircle=styled.circle(({show})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${CircleKeyframes}`,strokeDasharray:circleCircumference,opacity:show?1:0})),StyledSvg=styled.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${SvgKeyframes}`});var Spinner=React.forwardRef(({size,color="currentColor",title,as,display,decorative,delay=250,element="SPINNER"},ref)=>{let titleId=`spinner-${useUID()}`,{borderWidths:{borderWidth40}}=useTheme(),[show,setShow]=React.useState(delay===0);if(!decorative&&title==null)throw new Error("[Spinner]: Missing a title for non-decorative icon.");return React.useEffect(()=>{if(delay===0)return;let showTimer=setTimeout(()=>setShow(!0),delay);return()=>clearTimeout(showTimer)},[delay]),React.createElement(IconWrapper,{as,element,display,size,color,"aria-hidden":decorative,ref},React.createElement(StyledSvg,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":titleId},title?React.createElement("title",{id:titleId},title):null,React.createElement("g",{strokeWidth:borderWidth40,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},React.createElement(StyledCircleTrack,__spreadValues({},circleGeometry)),React.createElement(AnimatedStyledCircle,__spreadValues({show},circleGeometry)))))});Spinner.displayName="Spinner";Spinner.propTypes={title:PropTypes.string,delay:PropTypes.number,element:PropTypes.string,size:isIconSizeTokenProp};export{Spinner};
+`;var StyledCircleTrack=styled.circle({transformOrigin:"center",opacity:.25}),AnimatedStyledCircle=styled.circle(({show})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${CircleKeyframes}`,strokeDasharray:circleCircumference,opacity:show?1:0})),StyledSvg=styled.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${SvgKeyframes}`});var Spinner=React.forwardRef(({size,color="currentColor",title,as,display,decorative,delay=250,element="SPINNER"},ref)=>{let titleId=`spinner-${useUID()}`,{borderWidths:{borderWidth40}}=useTheme(),[show,setShow]=React.useState(delay===0);if(!decorative&&title==null)throw new Error("[Spinner]: Missing a title for non-decorative icon.");return React.useEffect(()=>{if(delay===0)return;let showTimer=setTimeout(()=>setShow(!0),delay);return()=>clearTimeout(showTimer)},[delay]),React.createElement(IconWrapper,{as,element,display,size,color,"aria-hidden":decorative,ref},React.createElement(StyledSvg,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":titleId},title?React.createElement("title",{id:titleId},title):null,React.createElement("g",{strokeWidth:borderWidth40,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},React.createElement(StyledCircleTrack,{...circleGeometry}),React.createElement(AnimatedStyledCircle,{show,...circleGeometry}))))});Spinner.displayName="Spinner";Spinner.propTypes={title:PropTypes.string,delay:PropTypes.number,element:PropTypes.string,size:isIconSizeTokenProp};export{Spinner};

dist/index.js

@@ -1,2 +0,2 @@
-"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames,__getOwnPropSymbols=Object.getOwnPropertySymbols,__getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable;var __defNormalProp=(obj,key,value)=>key in obj?__defProp(obj,key,{enumerable:!0,configurable:!0,writable:!0,value}):obj[key]=value,__spreadValues=(a,b)=>{for(var prop in b||(b={}))__hasOwnProp.call(b,prop)&&__defNormalProp(a,prop,b[prop]);if(__getOwnPropSymbols)for(var prop of __getOwnPropSymbols(b))__propIsEnum.call(b,prop)&&__defNormalProp(a,prop,b[prop]);return a};var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var src_exports={};__export(src_exports,{Spinner:()=>Spinner});module.exports=__toCommonJS(src_exports);var React=__toESM(require("react")),import_prop_types=__toESM(require("prop-types")),import_uid_library=require("@twilio-paste/uid-library"),import_IconWrapper=require("@twilio-paste/icons/cjs/helpers/IconWrapper"),import_theme=require("@twilio-paste/theme"),import_style_props=require("@twilio-paste/style-props");var import_styling_library2=require("@twilio-paste/styling-library");var import_styling_library=require("@twilio-paste/styling-library");var circleGeometry={cx:50,cy:50,r:45},circleCircumference=Math.PI*2*45;var SvgKeyframes=import_styling_library.keyframes`
+"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var src_exports={};__export(src_exports,{Spinner:()=>Spinner});module.exports=__toCommonJS(src_exports);var React=__toESM(require("react")),import_prop_types=__toESM(require("prop-types")),import_uid_library=require("@twilio-paste/uid-library"),import_IconWrapper=require("@twilio-paste/icons/cjs/helpers/IconWrapper"),import_theme=require("@twilio-paste/theme"),import_style_props=require("@twilio-paste/style-props");var import_styling_library2=require("@twilio-paste/styling-library");var import_styling_library=require("@twilio-paste/styling-library");var circleGeometry={cx:50,cy:50,r:45},circleCircumference=Math.PI*2*45;var SvgKeyframes=import_styling_library.keyframes`
   0%,
@@ -25,2 +25,2 @@ 15% {
   }
-`;var StyledCircleTrack=import_styling_library2.styled.circle({transformOrigin:"center",opacity:.25}),AnimatedStyledCircle=import_styling_library2.styled.circle(({show})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${CircleKeyframes}`,strokeDasharray:circleCircumference,opacity:show?1:0})),StyledSvg=import_styling_library2.styled.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${SvgKeyframes}`});var Spinner=React.forwardRef(({size,color="currentColor",title,as,display,decorative,delay=250,element="SPINNER"},ref)=>{let titleId=`spinner-${(0,import_uid_library.useUID)()}`,{borderWidths:{borderWidth40}}=(0,import_theme.useTheme)(),[show,setShow]=React.useState(delay===0);if(!decorative&&title==null)throw new Error("[Spinner]: Missing a title for non-decorative icon.");return React.useEffect(()=>{if(delay===0)return;let showTimer=setTimeout(()=>setShow(!0),delay);return()=>clearTimeout(showTimer)},[delay]),React.createElement(import_IconWrapper.IconWrapper,{as,element,display,size,color,"aria-hidden":decorative,ref},React.createElement(StyledSvg,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":titleId},title?React.createElement("title",{id:titleId},title):null,React.createElement("g",{strokeWidth:borderWidth40,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},React.createElement(StyledCircleTrack,__spreadValues({},circleGeometry)),React.createElement(AnimatedStyledCircle,__spreadValues({show},circleGeometry)))))});Spinner.displayName="Spinner";Spinner.propTypes={title:import_prop_types.default.string,delay:import_prop_types.default.number,element:import_prop_types.default.string,size:import_style_props.isIconSizeTokenProp};0&&(module.exports={Spinner});
+`;var StyledCircleTrack=import_styling_library2.styled.circle({transformOrigin:"center",opacity:.25}),AnimatedStyledCircle=import_styling_library2.styled.circle(({show})=>({transformOrigin:"center",animation:`1.5s ease-in-out infinite both ${CircleKeyframes}`,strokeDasharray:circleCircumference,opacity:show?1:0})),StyledSvg=import_styling_library2.styled.svg({height:"100%",width:"100%",display:"block",animation:`4.25s linear infinite both ${SvgKeyframes}`});var Spinner=React.forwardRef(({size,color="currentColor",title,as,display,decorative,delay=250,element="SPINNER"},ref)=>{let titleId=`spinner-${(0,import_uid_library.useUID)()}`,{borderWidths:{borderWidth40}}=(0,import_theme.useTheme)(),[show,setShow]=React.useState(delay===0);if(!decorative&&title==null)throw new Error("[Spinner]: Missing a title for non-decorative icon.");return React.useEffect(()=>{if(delay===0)return;let showTimer=setTimeout(()=>setShow(!0),delay);return()=>clearTimeout(showTimer)},[delay]),React.createElement(import_IconWrapper.IconWrapper,{as,element,display,size,color,"aria-hidden":decorative,ref},React.createElement(StyledSvg,{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg","aria-labelledby":titleId},title?React.createElement("title",{id:titleId},title):null,React.createElement("g",{strokeWidth:borderWidth40,stroke:"currentColor",strokeLinecap:"round",fill:"transparent"},React.createElement(StyledCircleTrack,{...circleGeometry}),React.createElement(AnimatedStyledCircle,{show,...circleGeometry}))))});Spinner.displayName="Spinner";Spinner.propTypes={title:import_prop_types.default.string,delay:import_prop_types.default.number,element:import_prop_types.default.string,size:import_style_props.isIconSizeTokenProp};

package.json

 {
   "name": "@twilio-paste/spinner",
-  "version": "13.0.0",
+  "version": "14.0.0",
   "category": "feedback",
@@ -23,3 +23,2 @@ "status": "production",
     "build:js": "NODE_ENV=development node build.js",
-    "build:props": "typedoc --tsconfig ./tsconfig.json --json ./dist/prop-types.json",
     "clean": "rm -rf ./dist",
@@ -29,13 +28,13 @@ "tsc": "tsc"
   "peerDependencies": {
-    "@twilio-paste/animation-library": "^1.0.0",
-    "@twilio-paste/box": "^9.0.0",
-    "@twilio-paste/color-contrast-utils": "^4.0.0",
-    "@twilio-paste/customization": "^7.0.0",
-    "@twilio-paste/design-tokens": "^9.0.0",
-    "@twilio-paste/icons": "^11.0.0",
-    "@twilio-paste/style-props": "^8.0.0",
-    "@twilio-paste/styling-library": "^2.0.0",
-    "@twilio-paste/theme": "^10.0.0",
-    "@twilio-paste/types": "^5.0.0",
-    "@twilio-paste/uid-library": "^1.0.0",
+    "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/box": "^10.0.0",
+    "@twilio-paste/color-contrast-utils": "^5.0.0",
+    "@twilio-paste/customization": "^8.0.0",
+    "@twilio-paste/design-tokens": "^10.0.0",
+    "@twilio-paste/icons": "^12.0.0",
+    "@twilio-paste/style-props": "^9.0.0",
+    "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/theme": "^11.0.0",
+    "@twilio-paste/types": "^6.0.0",
+    "@twilio-paste/uid-library": "^2.0.0",
     "@types/react": "^16.8.6 || ^17.0.2 || ^18.0.27",
@@ -48,13 +47,13 @@ "@types/react-dom": "^16.8.6 || ^17.0.2 || ^18.0.10",
   "devDependencies": {
-    "@twilio-paste/animation-library": "^1.0.0",
-    "@twilio-paste/box": "^9.0.0",
-    "@twilio-paste/color-contrast-utils": "^4.0.0",
-    "@twilio-paste/customization": "^7.0.0",
-    "@twilio-paste/design-tokens": "^9.0.2",
-    "@twilio-paste/icons": "^11.0.0",
-    "@twilio-paste/style-props": "^8.0.0",
-    "@twilio-paste/styling-library": "^2.0.0",
-    "@twilio-paste/theme": "^10.0.0",
-    "@twilio-paste/types": "^5.0.0",
-    "@twilio-paste/uid-library": "^1.0.0",
+    "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/box": "^10.0.0",
+    "@twilio-paste/color-contrast-utils": "^5.0.0",
+    "@twilio-paste/customization": "^8.0.0",
+    "@twilio-paste/design-tokens": "^10.0.0",
+    "@twilio-paste/icons": "^12.0.0",
+    "@twilio-paste/style-props": "^9.0.0",
+    "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/theme": "^11.0.0",
+    "@twilio-paste/types": "^6.0.0",
+    "@twilio-paste/uid-library": "^2.0.0",
     "@types/react": "^18.0.27",
@@ -61,0 +60,0 @@ "@types/react-dom": "^18.0.10",

New 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

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

112450

increased by3.82%

Worsened metrics

Lines of code

331

decreased by-10.3%

No dependency changes