react-pulsable - npm Package Compare versions

Comparing version 1.0.16 to 1.0.17

dist/index.js

@@ -1,2 +0,2 @@
-"use strict";var w=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var A=(a,l)=>{for(var s in l)w(a,s,{get:l[s],enumerable:!0})},S=(a,l,s,p)=>{if(l&&typeof l=="object"||typeof l=="function")for(let r of I(l))!R.call(a,r)&&r!==s&&w(a,r,{get:()=>l[r],enumerable:!(p=C(l,r))||p.enumerable});return a};var T=a=>S(w({},"__esModule",{value:!0}),a);var D={};A(D,{default:()=>M});module.exports=T(D);var f=require("react");var H=`
+"use strict";var w=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var A=(a,l)=>{for(var s in l)w(a,s,{get:l[s],enumerable:!0})},S=(a,l,s,p)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of I(l))!R.call(a,i)&&i!==s&&w(a,i,{get:()=>l[i],enumerable:!(p=C(l,i))||p.enumerable});return a};var T=a=>S(w({},"__esModule",{value:!0}),a);var D={};A(D,{default:()=>M});module.exports=T(D);var f=require("react");var H=`
   <svg
@@ -17,2 +17,2 @@ xmlns="http://www.w3.org/2000/svg"
   </svg>
-`,V={pulse:"pl-animate",wave:"pl-animate-wave","wave-reverse":"pl-animate-wave-r",none:"pl-animate-none"};function q(a){var l=window.getComputedStyle(a,null),s=parseInt(l.getPropertyValue("height"),10),p=parseInt(l.getPropertyValue("font-size"),10),r=parseInt(l.getPropertyValue("line-height"),10),d=l.getPropertyValue("box-sizing");if(Number.isNaN(r)&&(r=p*1.2),d==="border-box"){var v=parseInt(l.getPropertyValue("padding-top"),10),u=parseInt(l.getPropertyValue("padding-bottom"),10),h=parseInt(l.getPropertyValue("border-top-width"),10),g=parseInt(l.getPropertyValue("border-bottom-width"),10);s=s-v-u-h-g}var n=Math.ceil(s/r);return{lines:n,font_size:p,height:s}}var k=({rootElement:a,config:l,loading:s=!0})=>{let{animation:p="wave",bgColors:r,noRounded:d=!1,noPadding:v=!1}=l||{},u=t=>{t?a.classList.add("pulsable-base"):a.classList.remove("pulsable-base")},h=t=>{t?a.classList.add("pl-css"):a.classList.remove("pl-css")},g=()=>{if(typeof window>"u")return null;let t=document.createElement("div"),b=t.cloneNode(!0);b.classList.add("pl-child-para-cont","pl-no-rounded","pl-child"),t.style.setProperty("--color-transparent-medium",r?.medium||"rgba(130, 130, 130, 0.3)"),t.style.setProperty("--color-transparent-light",r?.light||"rgba(130, 130, 130, 0.2)"),t.classList.add(V[p]);let c=t.cloneNode(!0);c.classList.add("pl-child-para"),t.classList.add("pl-child");let m=t.cloneNode(!0);m.classList.add("pl-child-circle"),d&&(t.classList.add("pl-no-rounded"),c.classList.add("pl-no-rounded"));let o=t.cloneNode(!0);o.classList.add("pl-child-hidden");let e=t.cloneNode(!0);e.classList.add("pl-child-rect");let i=t.cloneNode(!0);return i.classList.add("pl-child-rect-full"),{pCircle:()=>m.cloneNode(!0),pPara:()=>c.cloneNode(!0),pHidden:()=>o.cloneNode(!0),pRect:()=>e.cloneNode(!0),pRectFull:()=>i.cloneNode(!0),pParaCont:()=>b.cloneNode(!0)}};var n=null;requestAnimationFrame(()=>{if(!a){u(!1);return}if(a.classList.contains("pulsable-cont")||a.classList.add("pulsable-cont"),s){if(u(!0),h(!0),n||(n=g()),!n){u(!1),h(!1);return}let b=document.createElement("div");b.classList.add("pl-svg-cont"),b.innerHTML=H;let c=a.querySelectorAll(".pulsable");for(let m=0;m<c.length;m++){let o=c[m];if(o.classList.add("pl-element"),o.hasAttribute("disabled")||(o.classList.add("pl-has-disabled-attr"),o.setAttribute("disabled","true")),o.childNodes.forEach(e=>{e.classList&&!e.classList.contains("pl-child")&&(e.classList.add("pl-child-element"),e?.hasAttribute("disabled")||(e.classList.add("pl-has-disabled-attr"),e.setAttribute("disabled","true")))}),!o.querySelector(".pl-child")){var t;let e=o.classList;if(!n)return;if(e.contains("pulsable-circle"))t=n.pCircle();else if(e.contains("pulsable-hidden"))t=n.pHidden();else if(e.contains("pulsable-para")){t=n.pParaCont();let i=q(o),z=(i.height-i.font_size*i.lines)/(i.lines+2),L=`${Math.max(z,8)}px`;t.style.setProperty("padding-top",L),t.style.setProperty("padding-bottom",L);let y=n.pPara();d&&e.contains("pulsable-rounded")?y.classList.remove("pl-no-rounded"):!d&&e.contains("pulsable-no-rounded")&&y.classList.add("pl-no-rounded"),y.style.setProperty("height",`${i.font_size*80/100}px`);for(let x=0;x<i.lines;x++)t.appendChild(y.cloneNode(!0))}else v?e.contains("pulsable-padding")?t=n.pRect():t=n.pRectFull():e.contains("pulsable-no-padding")?t=n.pRectFull():t=n.pRect();e.contains("pulsable-img")&&t.appendChild(b),d&&e.contains("pulsable-rounded")?t.classList.remove("pl-no-rounded"):!d&&e.contains("pulsable-no-rounded")&&t.classList.add("pl-no-rounded"),o.parentNode?.appendChild(t),o.appendChild(t)}}u(!1)}else{let b=a.querySelectorAll(".pl-child");for(let e=0;e<b.length;e++){let i=b[e];i.parentNode?.removeChild(i)}let c=a.querySelectorAll(".pl-element");for(let e=0;e<c.length;e++)c[e].classList&&c[e].classList.remove("pl-element");let m=a.querySelectorAll(".pl-has-disabled-attr");for(let e=0;e<m.length;e++){let i=m[e];i.removeAttribute("disabled"),i.classList.remove("pl-has-disabled-attr")}let o=a.querySelectorAll(".pl-child-element");for(let e=0;e<o.length;e++)o[e].classList.remove("pl-child-element");h(!1),u(!1)}})};(typeof global<"u"||typeof globalThis<"u")&&(typeof global<"u"&&(global.setPulsing=k),typeof globalThis<"u"&&(globalThis.setPulsing=k));var P=k;var N=require("react/jsx-runtime"),E=(a,l,s=[])=>{let p=(0,f.useRef)();(0,f.useEffect)(()=>(p.current=setTimeout(()=>{a()},l),()=>{clearTimeout(p.current)}),[l,...s])},F=({children:a,isLoading:l,className:s,config:p,...r})=>{let{animation:d="wave",bgColors:v,noRadius:u=!1,noPadding:h=!1}=p||{},g=(0,f.useRef)(null),[n,t]=(0,f.useState)(!0);return E(()=>{g.current&&(t(!1),P({rootElement:g.current,config:{animation:d,bgColors:v,noRadius:u,noPadding:h},loading:l}))},n?0:50,[l,g.current]),(0,N.jsx)("div",{ref:g,className:`${s} pulsable-cont pulsable-base`,...r,children:a})},M=F;
+`,V={pulse:"pl-animate",wave:"pl-animate-wave","wave-reverse":"pl-animate-wave-r",none:"pl-animate-none"};function q(a){var l=window.getComputedStyle(a,null),s=parseInt(l.getPropertyValue("height"),10),p=parseInt(l.getPropertyValue("font-size"),10),i=parseInt(l.getPropertyValue("line-height"),10),d=l.getPropertyValue("box-sizing");if(Number.isNaN(i)&&(i=p*1.2),d==="border-box"){var v=parseInt(l.getPropertyValue("padding-top"),10),u=parseInt(l.getPropertyValue("padding-bottom"),10),h=parseInt(l.getPropertyValue("border-top-width"),10),g=parseInt(l.getPropertyValue("border-bottom-width"),10);s=s-v-u-h-g}var n=Math.ceil(s/i);return{lines:n,font_size:p,height:s}}var k=({rootElement:a,config:l,loading:s=!0})=>{let{animation:p="wave",bgColors:i,noRounded:d=!1,noPadding:v=!1}=l||{},u=t=>{t?a.classList.add("pulsable-base"):a.classList.remove("pulsable-base")},h=t=>{t?a.classList.add("pl-css"):a.classList.remove("pl-css")},g=()=>{if(typeof window>"u")return null;let t=document.createElement("div"),b=t.cloneNode(!0);b.classList.add("pl-child-para-cont","pl-no-rounded","pl-child"),t.style.setProperty("--color-transparent-medium",i?.medium||"rgba(130, 130, 130, 0.3)"),t.style.setProperty("--color-transparent-light",i?.light||"rgba(130, 130, 130, 0.2)"),t.classList.add(V[p]);let c=t.cloneNode(!0);c.classList.add("pl-child-para"),t.classList.add("pl-child");let m=t.cloneNode(!0);m.classList.add("pl-child-circle"),d&&(t.classList.add("pl-no-rounded"),c.classList.add("pl-no-rounded"));let o=t.cloneNode(!0);o.classList.add("pl-child-hidden");let e=t.cloneNode(!0);e.classList.add("pl-child-rect");let r=t.cloneNode(!0);return r.classList.add("pl-child-rect-full"),{pCircle:()=>m.cloneNode(!0),pPara:()=>c.cloneNode(!0),pHidden:()=>o.cloneNode(!0),pRect:()=>e.cloneNode(!0),pRectFull:()=>r.cloneNode(!0),pParaCont:()=>b.cloneNode(!0)}};var n=null;requestAnimationFrame(()=>{if(!a){u(!1);return}if(a.classList.contains("pulsable-cont")||a.classList.add("pulsable-cont"),s){if(u(!0),h(!0),n||(n=g()),!n){u(!1),h(!1);return}let b=document.createElement("div");b.classList.add("pl-svg-cont"),b.innerHTML=H;let c=a.querySelectorAll(".pulsable");for(let m=0;m<c.length;m++){let o=c[m];if(o.classList.add("pl-element"),o.hasAttribute("disabled")||(o.classList.add("pl-has-disabled-attr"),o.setAttribute("disabled","true")),o.childNodes.forEach(e=>{e.classList&&!e.classList.contains("pl-child")&&(e.classList.add("pl-child-element"),e?.hasAttribute("disabled")||(e.classList.add("pl-has-disabled-attr"),e.setAttribute("disabled","true")))}),!o.querySelector(".pl-child")){var t;let e=o.classList;if(!n)return;if(e.contains("pulsable-circle"))t=n.pCircle();else if(e.contains("pulsable-hidden"))t=n.pHidden();else if(e.contains("pulsable-para")){t=n.pParaCont();let r=q(o),z=(r.height-r.font_size*r.lines)/(r.lines+2),L=`${Math.max(z,8)}px`;t.style.setProperty("padding-top",L),t.style.setProperty("padding-bottom",L);let y=n.pPara();d&&e.contains("pulsable-rounded")?y.classList.remove("pl-no-rounded"):!d&&e.contains("pulsable-no-rounded")&&y.classList.add("pl-no-rounded"),y.style.setProperty("height",`${r.font_size*80/100}px`);for(let x=0;x<r.lines;x++)t.appendChild(y.cloneNode(!0))}else v?e.contains("pulsable-padding")?t=n.pRect():t=n.pRectFull():e.contains("pulsable-no-padding")?t=n.pRectFull():t=n.pRect();e.contains("pulsable-img")&&t.appendChild(b),d&&e.contains("pulsable-rounded")?t.classList.remove("pl-no-rounded"):!d&&e.contains("pulsable-no-rounded")&&t.classList.add("pl-no-rounded"),o.parentNode?.appendChild(t),o.appendChild(t)}}u(!1)}else{let b=a.querySelectorAll(".pl-child");for(let e=0;e<b.length;e++){let r=b[e];r.parentNode?.removeChild(r)}let c=a.querySelectorAll(".pl-element");for(let e=0;e<c.length;e++)c[e].classList&&c[e].classList.remove("pl-element");let m=a.querySelectorAll(".pl-has-disabled-attr");for(let e=0;e<m.length;e++){let r=m[e];r.removeAttribute("disabled"),r.classList.remove("pl-has-disabled-attr")}let o=a.querySelectorAll(".pl-child-element");for(let e=0;e<o.length;e++)o[e].classList.remove("pl-child-element");h(!1),u(!1)}})};(typeof global<"u"||typeof globalThis<"u")&&(typeof global<"u"&&(global.setPulsing=k),typeof globalThis<"u"&&(globalThis.setPulsing=k));var P=k;var N=require("react/jsx-runtime"),E=(a,l,s=[])=>{let p=(0,f.useRef)();(0,f.useEffect)(()=>(p.current=setTimeout(()=>{a()},l),()=>{clearTimeout(p.current)}),[l,...s])},F=({children:a,isLoading:l,className:s,config:p,...i})=>{let{animation:d="wave",bgColors:v,noRadius:u=!1,noPadding:h=!1}=p||{},g=(0,f.useRef)(null),[n,t]=(0,f.useState)(!0);return E(()=>{g.current&&(t(!1),P({rootElement:g.current,config:{animation:d,bgColors:v,noRadius:u,noPadding:h},loading:l}))},n?0:50,[l,g.current]),(0,N.jsx)("div",{ref:g,className:`${s} pulsable-cont pulsable-base`,...i,children:a})},M=F;

package.json

@@ -5,3 +5,3 @@ {
   "license": "MIT",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "description": "This is a simple and customizable react component library to add a pulsing/skeleton loading effect to your existing component.",
@@ -59,3 +59,3 @@ "private": false,
   "dependencies": {
-    "pulsable": "^1.0.31"
+    "pulsable": "^1.0.32"
   },
@@ -62,0 +62,0 @@ "peerDependencies": {

No alert changes

Improved metrics

Total package byte prevSize

23470

increased by0.25%

Dependency changes

• Updatedpulsable@^1.0.32