(self.webpackChunkui=self.webpackChunkui||[]).push([[49],{447:(e,n,t)=>{Object.defineProperty(n,"__esModule",{value:!0});var a=t(6);function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=r(a);!function(e){if("undefined"==typeof window)return;const n=document.createElement("style");n.setAttribute("type","text/css"),n.innerHTML=e,document.head.appendChild(n)}('.marquee-container {\n  overflow-x: hidden !important;\n  display: flex !important;\n  flex-direction: row !important;\n  position: relative;\n  width: var(--width);\n  transform: var(--transform);\n}\n.marquee-container:hover div {\n  animation-play-state: var(--pause-on-hover);\n}\n.marquee-container:active div {\n  animation-play-state: var(--pause-on-click);\n}\n\n.overlay {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n}\n.overlay::before, .overlay::after {\n  background: linear-gradient(to right, var(--gradient-color));\n  content: "";\n  height: 100%;\n  position: absolute;\n  width: var(--gradient-width);\n  z-index: 2;\n}\n.overlay::after {\n  right: 0;\n  top: 0;\n  transform: rotateZ(180deg);\n}\n.overlay::before {\n  left: 0;\n  top: 0;\n}\n\n.marquee {\n  flex: 0 0 auto;\n  min-width: var(--min-width);\n  z-index: 1;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  animation: scroll var(--duration) linear var(--delay) var(--iteration-count);\n  animation-play-state: var(--play);\n  animation-delay: var(--delay);\n  animation-direction: var(--direction);\n}\n@keyframes scroll {\n  0% {\n    transform: translateX(0%);\n  }\n  100% {\n    transform: translateX(-100%);\n  }\n}\n\n.initial-child-container {\n  flex: 0 0 auto;\n  display: flex;\n  min-width: auto;\n  flex-direction: row;\n}\n\n.child {\n  transform: var(--transform);\n}');const o=a.forwardRef((function({style:e={},className:n="",autoFill:t=!1,play:r=!0,pauseOnHover:o=!1,pauseOnClick:l=!1,direction:s="left",speed:d=50,delay:u=0,loop:c=0,gradient:f=!1,gradientColor:m=[255,255,255],gradientWidth:p=200,onFinish:h,onCycleComplete:v,onMount:y,children:g},w){const[b,E]=a.useState(0),[x,C]=a.useState(0),[k,M]=a.useState(1),[N,$]=a.useState(!1),q=a.useRef(null),O=w||q,R=a.useRef(null),j=a.useCallback((()=>{if(R.current&&O.current){const e=O.current.getBoundingClientRect(),n=R.current.getBoundingClientRect();let a=e.width,r=n.width;"up"!==s&&"down"!==s||(a=e.height,r=n.height),M(t&&a&&r&&r<a?Math.ceil(a/r):1),E(a),C(r)}}),[t,O,s]);a.useEffect((()=>{if(N&&(j(),R.current&&O.current)){const e=new ResizeObserver((()=>j()));return e.observe(O.current),e.observe(R.current),()=>{e&&e.disconnect()}}}),[j,O,N]),a.useEffect((()=>{j()}),[j,g]),a.useEffect((()=>{$(!0)}),[]),a.useEffect((()=>{"function"==typeof y&&y()}),[]);const A=a.useMemo((()=>t?x*k/d:x<b?b/d:x/d),[t,b,x,k,d]),F=`rgba(${m[0]}, ${m[1]}, ${m[2]}`,S=a.useMemo((()=>Object.assign(Object.assign({},e),{"--pause-on-hover":!r||o?"paused":"running","--pause-on-click":!r||o&&!l||l?"paused":"running","--width":"up"===s||"down"===s?"100vh":"100%","--transform":"up"===s?"rotate(-90deg)":"down"===s?"rotate(90deg)":"none"})),[e,r,o,l,s]),z=a.useMemo((()=>({"--gradient-color":`${F}, 1), ${F}, 0)`,"--gradient-width":"number"==typeof p?`${p}px`:p})),[F,p]),B=a.useMemo((()=>({"--play":r?"running":"paused","--direction":"left"===s?"normal":"reverse","--duration":`${A}s`,"--delay":`${u}s`,"--iteration-count":c?`${c}`:"infinite","--min-width":t?"auto":"100%"})),[r,s,A,u,c,t]),H=a.useMemo((()=>({"--transform":"up"===s?"rotate(90deg)":"down"===s?"rotate(-90deg)":"none"})),[s]),X=a.useCallback((e=>[...Array(Number.isFinite(e)&&e>=0?e:0)].map(((e,n)=>i.default.createElement(a.Fragment,{key:n},a.Children.map(g,(e=>i.default.createElement("div",{style:H,className:"child"},e))))))),[H,g]);return N?i.default.createElement("div",{ref:O,style:S,className:"marquee-container "+n},f&&i.default.createElement("div",{style:z,className:"overlay"}),i.default.createElement("div",{className:"marquee",style:B,onAnimationIteration:v,onAnimationEnd:h},i.default.createElement("div",{className:"initial-child-container",ref:R},a.Children.map(g,(e=>i.default.createElement("div",{style:H,className:"child"},e)))),X(k-1)),i.default.createElement("div",{className:"marquee",style:B},X(k))):null}));n.default=o}}]);