primereact/progressspinner/progressspinner.min.js

PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

this.primereact=this.primereact||{},this.primereact.progressspinner=function(e,n,r,s,t,i){"use strict";function o(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,s.get?s:{enumerable:!0,get:function(){return e[r]}})}})),n.default=e,Object.freeze(n)}var a=o(n),p=s.ComponentBase.extend({defaultProps:{__TYPE:"ProgressSpinner",id:null,style:null,className:null,strokeWidth:"2",fill:"none",animationDuration:"2s",children:void 0},css:{classes:{root:"p-progress-spinner",spinner:"p-progress-spinner-svg",circle:"p-progress-spinner-circle"},styles:"\n@layer primereact {\n    .p-progress-spinner {\n        position: relative;\n        margin: 0 auto;\n        width: 100px;\n        height: 100px;\n        display: inline-block;\n    }\n    \n    .p-progress-spinner::before {\n        content: '';\n        display: block;\n        padding-top: 100%;\n    }\n    \n    .p-progress-spinner-svg {\n        animation: p-progress-spinner-rotate 2s linear infinite;\n        height: 100%;\n        transform-origin: center center;\n        width: 100%;\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n        margin: auto;\n    }\n    \n    .p-progress-spinner-circle {\n        stroke-dasharray: 89, 200;\n        stroke-dashoffset: 0;\n        stroke: #d62d20;\n        animation: p-progress-spinner-dash 1.5s ease-in-out infinite, p-progress-spinner-color 6s ease-in-out infinite;\n        stroke-linecap: round;\n    }\n}\n\n@keyframes p-progress-spinner-rotate {\n    100% {\n        transform: rotate(360deg);\n    }\n}\n\n@keyframes p-progress-spinner-dash {\n    0% {\n        stroke-dasharray: 1, 200;\n        stroke-dashoffset: 0;\n    }\n    50% {\n        stroke-dasharray: 89, 200;\n        stroke-dashoffset: -35px;\n    }\n    100% {\n        stroke-dasharray: 89, 200;\n        stroke-dashoffset: -124px;\n    }\n}\n\n@keyframes p-progress-spinner-color {\n    100%,\n    0% {\n        stroke: #d62d20;\n    }\n    40% {\n        stroke: #0057e7;\n    }\n    66% {\n        stroke: #008744;\n    }\n    80%,\n    90% {\n        stroke: #ffa700;\n    }\n}\n",inlineStyles:{spinner:function(e){return{animationDuration:e.props.animationDuration}}}}}),l=a.memo(a.forwardRef((function(e,n){var o=t.useMergeProps(),l=a.useContext(r.PrimeReactContext),c=p.getProps(e,l),u=a.useRef(null),d=p.setMetaData({props:c}),f=d.ptm,m=d.cx,g=d.sx;s.useHandleStyle(p.css.styles,d.isUnstyled,{name:"progressspinner"}),a.useImperativeHandle(n,(function(){return{props:c,getElement:function(){return u.current}}}));var h=o({id:c.id,ref:u,style:c.style,className:i.classNames(c.className,m("root")),role:"progressbar","aria-busy":!0},p.getOtherProps(c),f("root")),y=o({className:m("spinner"),viewBox:"25 25 50 50",style:g("spinner")},f("spinner")),k=o({className:m("circle"),cx:"50",cy:"50",r:"20",fill:c.fill,strokeWidth:c.strokeWidth,strokeMiterlimit:"10"},f("circle"));return a.createElement("div",h,a.createElement("svg",y,a.createElement("circle",k)))})));return l.displayName="ProgressSpinner",e.ProgressSpinner=l,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.componentbase,primereact.hooks,primereact.utils);