UNPKG

new-react-stars

Version:

Simple star rating component for your React projects

3 lines (2 loc) 2.82 kB
import{jsxs as t,jsx as o}from"react/jsx-runtime";import{useState as e,useEffect as r}from"react";var n=function(){return n=Object.assign||function(t){for(var o,e=1,r=arguments.length;e<r;e++)for(var n in o=arguments[e])Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n]);return t},n.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var a={overflow:"hidden",position:"relative"},i={position:"relative",overflow:"hidden",cursor:"pointer",display:"block",float:"left"},c=function(t,o){return"\n .react-stars-".concat(o,":before {\n position: absolute;\n overflow: hidden;\n display: block;\n z-index: 1;\n top: 0; left: 0;\n width: 50%;\n content: attr(data-forhalf);\n color: ").concat(t,";\n }")},l=function(l){var d=l.className,f=l.edit,u=void 0===f||f,s=l.half,h=void 0===s||s,v=l.value,p=void 0===v?0:v,g=l.count,m=void 0===g?5:g,M=l.char,b=void 0===M?"★":M,y=l.size,z=void 0===y?15:y,x=l.color1,w=void 0===x?"gray":x,N=l.color2,O=void 0===N?"#ffd700":N,j=l.onChange,S=void 0===j?function(t){}:j,k=e((Math.random()+"").replace(".",""))[0],C=e(p),T=C[0],A=C[1],E=e([]),L=E[0],_=E[1],B=e({at:Math.floor(p),hidden:h&&p%1<.5}),H=B[0],I=B[1],P=e({count:m,size:z,char:b,color1:w,color2:O,half:h,edit:u}),R=P[0],X=P[1];r((function(){_(D(T))}),[T,R]),r((function(){_(D(p)),A(p),I({at:Math.floor(p),hidden:R.half&&p%1<.5}),X({count:m,size:z,char:b,color1:w,color2:O,half:h,edit:u})}),[p,m,z,b,w,O,h,u]);var q=function(t){return t%1!=0},D=function(t){void 0===t&&(t=R.half?Math.floor(T):Math.round(T));for(var o=[],e=0;e<R.count;e++)o.push({active:e<=t-1});return o},F=function(t){if(R.edit){var o=Number(t.currentTarget.getAttribute("data-index"));if(R.half){var e=G(t,R.size);I(n(n({},H),{hidden:e,at:e?o+1:o})),o=e?o+1:o}else o+=1;_(D(o))}},G=function(t,o){var e=t.target,r=t.clientX-e.getBoundingClientRect().left;return(r=Math.round(Math.abs(r)))>o/2},J=function(){R.edit&&(R.half&&I(n(n({},H),{hidden:!q(T),at:Math.floor(T)})),_(D()))},K=function(t){if(R.edit){var o,e=Number(t.currentTarget.getAttribute("data-index"));if(R.half){var r=G(t,R.size);I(n(n({},H),{hidden:r,at:r?e+1:e})),o=r?e:e+.5}else o=e+=1;A(o),_(D(e)),S&&S(o)}};return t("div",{className:d,style:a,children:[R.half?o("style",{dangerouslySetInnerHTML:{__html:c(R.color2,k)}}):null,L.map((function(t,e){var r="";R.half&&!H.hidden&&H.at===e&&(r="react-stars-".concat(k));var n=Object.assign({},i,{color:t.active?R.color2:R.color1,cursor:R.edit?"pointer":"default",fontSize:"".concat(R.size,"px")});return o("span",{className:r,style:n,"data-index":e,"data-forhalf":R.char,onMouseOver:F,onMouseMove:F,onMouseLeave:J,onClick:K,children:R.char},"".concat(e,"-").concat(t.active?"active":"inactive","-").concat(k))}))]})};export{l as ReactStars}; //# sourceMappingURL=index.js.map