text: import React,{useState,useRef,useEffect}from"react";function __rest(t,e){var i={};for(o in t)Object.prototype.hasOwnProperty.call(t,o)&&e.indexOf(o)<0&&(i[o]=t[o]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols)for(var s=0,o=Object.getOwnPropertySymbols(t);s<o.length;s++)e.indexOf(o[s])<0&&Object.prototype.propertyIsEnumerable.call(t,o[s])&&(i[o[s]]=t[o[s]]);return i}const get_all_styles_from_button=t=>{return{backgroundColor:t.backgroundColor,paddingTop:parseFloat(t.paddingTop.replace("px","")),paddingRight:parseFloat(t.paddingRight.replace("px","")),paddingLeft:parseFloat(t.paddingLeft.replace("px","")),paddingBottom:parseFloat(t.paddingBottom.replace("px","")),borderWidth:parseFloat(t.borderWidth.replace("px","")),borderColor:t.borderColor,borderStyle:t.borderStyle,borderRadius:parseFloat(t.borderRadius.replace("px","")),fontSize:parseFloat(t.fontSize.replace("px","")),fontColor:t.color,fontWeight:t.fontWeight,fontFamily:t.fontFamily,textTransform:t.textTransform,boxShadow:t.boxShadow}};class Square{constructor(t,e,i,s){this.size=i,this.x_pos=t,this.y_pos=e,this.y_size=s,this.start={x:i,y:s,x_pos:t,y_pos:e,time:Date.now()},this.last={x:this.size,y:this.y_size}}render(t,e,i){t.putImageData(e,0,0,this.x_pos,this.y_pos,this.size,this.y_size)}update(t){var e=t-(Date.now()-this.start.time),t={x_size:e*this.start.x/t,y_size:e*this.start.y/t,x_pos:e*this.start.x_pos/t,y_pos:e*this.start.y_pos/t};this.size=t.x_size,this.y_size=t.y_size,this.x_pos+=(this.last.x-t.x_size)/2,this.y_pos+=(this.last.y-t.y_size)/2,this.last={x:t.x_size,y:t.y_size}}}class Ctx_Management{constructor(t,e,i,s,o,a,r){this.ctx=null===(t=t.current)||void 0===t?void 0:t.getContext("2d"),this.options=i,this.width=e.width,this.height=e.height,this.title=s,this.duration=o,this.row_quantity=a,this.col_quantity=r,this.CanvasRoundRect(i.backgroundColor,0,0,this.width,this.height,i.borderRadius),this.CanvasText(),this.imageData=this.get_image_from_canvas(),this.squares=this.create_squares(),this.render_squares(),this.Draw_until_end=this.Draw_until_end.bind(this),this.Draw_until_end()}CanvasRoundRect(t,e,i,s,o,a,r){const n=this.ctx;o<2*(a=s<2*a?s/2:a)&&(a=o/2),n.beginPath(),n.fillStyle=t,n.strokeStyle=t,n.moveTo(e+a,i),n.arcTo(e+s,i,e+s,i+o,a),n.arcTo(e+s,i+o,e,i+o,a),n.arcTo(e,i+o,e,i,a),n.arcTo(e,i,e+s,i,a),n.fill(),r&&n.stroke()}CanvasText(){var t=this.options.fontSize,e=this.options.fontFamily;this.ctx.fillStyle=this.options.fontColor,this.ctx.font=this.options.fontWeight+` ${t}px `+e,this.ctx.fillText(this.title,this.options.paddingLeft,this.options.paddingTop+t-1)}get_image_from_canvas(){var t=this.ctx.getImageData(0,0,this.width,this.height);return this.ctx.clearRect(0,0,this.width,this.height),t}create_squares(){var i=this.row_quantity,s=this.col_quantity;let o=[];for(let e=0;e<i;e++)for(let t=0;t<s;t++){var a=this.height/s*t,r=this.width/i*e,a=new Square(r,a,this.width/i,this.height/s);o.push(a)}return o}render_squares(){if(this.ctx.clearRect(0,0,this.width,this.height),"none"!==this.options.boxShadow){const t=this.options.boxShadow.split(" ");this.ctx.shadowColor=t[0]+t[1]+t[2],this.ctx.shadowOffsetX=parseFloat(t[3].replace("px","")),this.ctx.shadowOffsetY=parseFloat(t[4].replace("px","")),this.ctx.shadowBlur=parseFloat(t[5].replace("px",""))}this.squares.map(t=>{t.render(this.ctx,this.imageData,this.options.backgroundColor)})}Draw_until_end(){this.ctx.clearRect(0,0,this.width,this.height),this.squares.map(t=>{t.update(this.duration),t.render(this.ctx,this.imageData,this.options.backgroundColor)}),0<this.squares[0].size&&window.requestAnimationFrame(this.Draw_until_end)}}const Button=t=>{var{title:e,className:i,id:s,duration:o,row_quantity:a,col_quantity:r,onClick:n}=t;__rest(t,["title","className","id","duration","row_quantity","col_quantity","onClick"]);const[h,l]=useState(!1),[,d]=useState(),[p,c]=useState(null),[u,_]=useState(),g=useRef(null),f=useRef(null);return useEffect(()=>{h&&p&&d(new Ctx_Management(g,p,u,e,o||500,a||15,r||5))},[h]),React.createElement(React.Fragment,null,!h&&React.createElement("button",{ref:f,id:s,className:"rc_bt "+i,onClickCapture:()=>{var t={top:null===(t=f.current)||void 0===t?void 0:t.getBoundingClientRect().top,left:null===(e=f.current)||void 0===e?void 0:e.getBoundingClientRect().left,width:null===(t=f.current)||void 0===t?void 0:t.offsetWidth,height:null===(e=f.current)||void 0===e?void 0:e.offsetHeight,padding:parseFloat(window.getComputedStyle(f.current).padding.replace("px",""))},e=get_all_styles_from_button(window.getComputedStyle(f.current));_(e),c(t),l(!0),n&&n()}},e),React.createElement("canvas",{ref:g,width:p?p.width:100,height:p?p.height:100,style:{top:p?p.top:0,left:p?p.left:0,pointerEvents:"none",position:"absolute"}}))};export{Button};
  