@microlink/hover-react/dist/microlink.min.cjs

Turn links into beautiful previews.

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/defineProperty"),n=require("@babel/runtime/helpers/objectWithoutProperties"),t=require("@babel/runtime/helpers/taggedTemplateLiteral"),r=require("@babel/runtime/helpers/extends"),a=require("react"),o=require("styled-components"),i=require("@microlink/mql");const l=["accessibility","debounce","ellipsis","is","lines","text"];function c(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function s(n){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?c(Object(r),!0).forEach((function(t){e(n,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(r)):c(Object(r)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(r,e))}))}return n}const u=e=>{let{accessibility:t=!0,debounce:r=300,ellipsis:o="…",is:i="div",lines:c=3,text:u}=e,d=n(e,l);const p=a.useRef(null),m=a.useRef("."),f=s(s({ref:p},t?{title:u}:{}),d),g=a.useMemo((()=>"string"==typeof u&&u.length>0),[u]),b=a.useCallback((()=>{var e,n,t,r;if(!g)return;const a=e=>{m.current=e,null!=p.current&&(p.current.innerText=e)};a(".");const i=((null!==(n=null===(e=p.current)||void 0===e?void 0:e.clientHeight)&&void 0!==n?n:0)+1)*c+1,l="…"===o?5:1.2*o.length;let s=0,d=0,f=u.length;for(;s<=f;){if(d=Math.floor((s+f)/2),a(u.slice(0,d)),d===u.length)return;(null!==(r=null===(t=p.current)||void 0===t?void 0:t.clientHeight)&&void 0!==r?r:0)<=i?s=d+1:f=d-1}a(u.slice(0,Math.max(d-l,0)).trim()+o)}),[o,g,c,u]);return a.useEffect((()=>{b();const e=((e,n)=>{let t;const r=()=>{t=void 0,e()};return()=>{const a=null==t;clearTimeout(t),t=setTimeout(r,n),a&&e()}})(b,r);return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)}),[b,r]),g?a.createElement(i,f,m.current):null};function d(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var p,m=d((()=>/^https?:\/\/(localhost|0|10|127|192(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}|\[::1?\])/gi));const f="undefined"==typeof window,g=e=>"function"==typeof e,b=e=>"object"==typeof e,h=e=>null==e,y=e=>b(e)?e.url:e,v=function(){return o.css(p||(p=t(["\n    @media (max-width: 48em) {\n      ",";\n    }\n  "])),o.css(...arguments))},w=e=>"large"===e,k=e=>"small"===e,x=e=>m().test(e)?e:"https://images.weserv.nl/?".concat(new URLSearchParams({url:e,default:e,l:9,af:"",il:"",n:-1}).toString()),$=!f&&"IntersectionObserver"in window,z=e=>{const n=parseInt(e,10);return[Math.floor(n/3600),Math.floor(n/60)%60,n%60].filter(((e,n)=>e>0||n>0)).map((e=>e>=10?e:"0".concat(e))).join(":")},O=(e,n,t)=>{switch(!0){case e<=n:return n;case e>=t:return t;default:return e}},E="microlink_card",S="".concat(E,"__content"),C="".concat(E,"__media"),P="".concat(C,"__controls"),M={main:E,content:S,title:"".concat(S,"_title"),description:"".concat(S,"_description"),url:"".concat(S,"_url"),mediaWrapper:"".concat(C,"_wrapper"),media:C,image:"".concat(C,"_image"),videoWrapper:"".concat(C,"_video_wrapper"),video:"".concat(C,"_video"),audioWrapper:"".concat(C,"_audio_wrapper"),audio:"".concat(C,"_audio"),mediaControls:P,playbackControl:"".concat(P,"_playback"),volumeControl:"".concat(P,"_volume"),rwControl:"".concat(P,"_rewind"),ffwControl:"".concat(P,"_fast_forward"),rateControl:"".concat(P,"_rate"),progressBar:"".concat(P,"_progress_bar"),progressTime:"".concat(P,"_progress_time"),spinner:"".concat(P,"_spinner"),iframe:"".concat(E,"__iframe")},j=["useNanoClamp","children"];var D,_;function N(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function R(n){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?N(Object(r),!0).forEach((function(t){e(n,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(r)):N(Object(r)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(r,e))}))}return n}const F=o.styled((e=>{let{children:n,className:t,lines:r}=e;return h(n)?null:a.createElement(u,{className:t,lines:r,text:n,is:"p"})}))(D||(D=t(["\n  &&& {\n    text-align: inherit;\n    font-weight: inherit;\n    font-family: inherit;\n    color: inherit;\n    margin: 0;\n\n    ","\n  }\n"])),(e=>{let{$useNanoClamp:n}=e;return!n&&o.css(_||(_=t(["\n        overflow: hidden;\n        white-space: nowrap;\n        text-overflow: ellipsis;\n      "])))})),T=e=>{let{useNanoClamp:t=!0,children:o}=e,i=n(e,j);const l=t?i:R(R({},i),{},{as:"p",title:o});return a.createElement(F,r({$useNanoClamp:t},l),o)},L={short:"100ms",medium:"150ms",long:"300ms"},V={short:"cubic-bezier(.25,.8,.25,1)",medium:"cubic-bezier(.25,.8,.25,1)",long:"cubic-bezier(.4, 0, .2, 1)"},I=(e,n)=>{const t="".concat(L[n]," ").concat(V[n]);return e.map((e=>"".concat(e," ").concat(t))).join(", ")},U=function(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];return I(n,"short")},W=function(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];return I(n,"medium")},B=function(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];return I(n,"long")},H="InterUI, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', sans-serif",q="'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace",X=["autoPlay","children","controls","loop","mediaRef","muted","playsInline","size"];function A(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function K(n){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?A(Object(r),!0).forEach((function(t){e(n,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(r)):A(Object(r)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(r,e))}))}return n}const J={},G=a.createContext(J),Q=e=>{let{autoPlay:t,children:r,controls:o,loop:i,mediaRef:l,muted:c,playsInline:s,size:u}=e,d=n(e,X);const[p,m]=a.useState(J),f=a.useCallback((e=>m((n=>K(K({},n),e)))),[]),g=a.useMemo((()=>({autoPlay:t,controls:o,loop:i,mediaRef:l,muted:c,playsInline:s,size:u})),[t,o,i,l,c,s,u]),b=a.useMemo((()=>({props:g,state:p,updateState:f})),[g,p,f]);return a.createElement(G.Provider,{value:b},r(d))};var Y,Z,ee,ne,te,re,ae,oe,ie,le,ce,se;const ue=/^www\./,de="16px",pe=o.css(Y||(Y=t(["\n  ",";\n"])),v(Z||(Z=t(["\n    > p {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n  "])))),me=o.styled("div").attrs({className:M.content})(ee||(ee=t(["\n  display: flex;\n  padding: 10px 15px;\n  min-width: 0;\n  box-sizing: border-box;\n  ",";\n"])),(e=>{let{$cardSize:n}=e;return o.css(ne||(ne=t(["\n    flex: ",";\n    justify-content: ",";\n    flex-direction: ",";\n    align-items: ",";\n  "])),w(n)?"0 0 125px":1,k(n)?"space-between":"space-around",k(n)?"row":"column",k(n)?"center":"stretch")})),fe=o.styled("header").attrs({className:M.title})(te||(te=t(["\n  text-align: left;\n  font-weight: bold;\n  margin: 0;\n  width: 100%;\n  ","\n"])),(e=>{let{$cardSize:n}=e;return o.css(re||(re=t(["\n    flex-grow: ",";\n    font-size: ",";\n\n    ","\n  "])),k(n)?.8:1.2,k(n)?"15px":"16px",k(n)&&o.css(ae||(ae=t(["\n      min-width: 0;\n      padding-right: 14px;\n    "]))))})),ge=o.styled("div").attrs({className:M.description})(oe||(oe=t(["\n  text-align: left;\n  font-size: 14px;\n  flex-grow: 2;\n  margin: auto 0;\n  line-height: 18px;\n  font-weight: normal;\n  ",";\n"])),(e=>{let{$cardSize:n}=e;return!w(n)&&pe})),be=o.styled("footer").attrs({className:M.url})(ie||(ie=t(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  text-align: left;\n  margin: 0;\n  flex-grow: 0;\n  font-weight: normal;\n  ",";\n"])),(e=>{let{$cardSize:n}=e;return o.css(le||(le=t(["\n    font-size: ",";\n    ","\n  "])),k(n)?"10px":"12px",!k(n)&&"width: 100%;")})),he=o.styled(T)(ce||(ce=t(["\n  opacity: 0.75;\n  transition: ",";\n  will-change: opacity;\n\n  .",":hover & {\n    opacity: 1;\n  }\n"])),W("opacity"),M.main),ye=o.styled("span").attrs({title:"microlink.io"})(se||(se=t(["\n  background: url('https://cdn.microlink.io/logo/logo.svg') no-repeat center\n    center;\n  display: block;\n  margin-left: 15px;\n  transition: ",";\n  will-change: filter, opacity;\n  &:not(:hover) {\n    filter: grayscale(100%);\n    opacity: 0.75;\n  }\n\n  min-width: ",";\n  width: ",";\n  background-size: ",";\n  height: ",";\n"])),W("filter","opacity"),de,de,de,"12px"),ve=()=>{const{state:{description:e,title:n,url:t},props:{size:r}}=a.useContext(G),o=k(r),i=a.useMemo((()=>(e=>{if(h(e))return"";const{hostname:n}=new URL(e);return n.replace(ue,"")})(t)),[t]),l=a.useCallback((e=>{e.preventDefault(),window.open("https://www.microlink.io","_blank")}),[]);return a.createElement(me,{$cardSize:r},a.createElement(fe,{$cardSize:r},a.createElement(T,{$useNanoClamp:!1},n)),!o&&a.createElement(ge,{$cardSize:r},a.createElement(T,{lines:2},e)),a.createElement(be,{$cardSize:r},a.createElement(he,{$useNanoClamp:!1},i),a.createElement(ye,{onClick:l})))};var we,ke,xe,$e;const ze=o.keyframes(we||(we=t(["\n  0% {\n    background: #e1e8ed;\n  }\n  70% {\n    background: #cdd4d8;\n  }\n  100% {\n    background: #e1e8ed;\n  }\n"]))),Oe=o.keyframes(ke||(ke=t(["\n  0% {\n    background: #e1e8ed;\n  }\n  70% {\n    background: #dce3e8;\n  }\n  100% {\n    background: #e1e8ed;\n  }\n"]))),Ee=o.css(xe||(xe=t(["\n  animation: "," .75s linear infinite;\n"])),ze),Se=o.css($e||($e=t(["\n  animation: "," 1.25s linear infinite;\n"])),Oe);var Ce,Pe,Me;const je=o.styled("img")(Ce||(Ce=t(["\n  height: 1px;\n  width: 1px;\n  position: absolute;\n  z-index: -1;\n"]))),De=o.css(Pe||(Pe=t(["\n  &::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    background: #e1e8ed;\n    z-index: 1;\n    transition: ",";\n    will-change: opacity;\n\n    ",";\n  }\n"])),W("opacity","visibility"),(e=>{let{$isLoading:n}=e;return o.css(Me||(Me=t(["\n      opacity: ",";\n      visibility: ",";\n    "])),n?1:0,n?"$visible":"hidden")}));var _e,Ne,Re,Fe,Te;const Le={small:o.css(_e||(_e=t(["\n    flex: 0 0 48px;\n  "]))),normal:o.css(Ne||(Ne=t(["\n    flex: 0 0 125px;\n\n    ","\n  "])),v(Re||(Re=t(["\n      flex: 0 0 92px;\n    "])))),large:o.css(Fe||(Fe=t(["\n    flex: 1;\n\n    &::before {\n      padding-bottom: 0;\n    }\n  "])))},Ve=o.styled("div")(Te||(Te=t(["\n  background: transparent no-repeat center center / cover;\n  display: block;\n  overflow: hidden;\n  height: auto;\n  position: relative;\n\n  &::before {\n    content: '';\n    padding-bottom: 100%;\n    display: block;\n  }\n\n  ",";\n\n  ",";\n"])),(e=>{let{$cardSize:n}=e;return Le[n]}),De),Ie=e=>{const{props:{size:n}}=a.useContext(G);return a.createElement(Ve,r({$cardSize:n},e))};var Ue;const We=o.styled(Ie).attrs({className:"".concat(M.media," ").concat(M.image)})(Ue||(Ue=t(["\n  background-image: ",";\n"])),(e=>{let{url:n}=e;return n?"url('".concat(x(n),"')"):""})),Be=e=>{const{state:{imageUrl:n}}=a.useContext(G);return a.createElement(We,r({url:n},e))};var He,qe,Xe,Ae,Ke;const Je=o.styled(Be)(He||(He=t(["\n  ",";\n"])),Se),Ge=o.styled("span")(qe||(qe=t(["\n  opacity: 0.8;\n  height: 16px;\n  width: ",";\n  display: block;\n  background: #e1e8ed;\n  margin: ",";\n  ",";\n\n  ",";\n"])),(e=>{let{$cardSize:n}=e;return k(n)?"75%":"60%"}),(e=>{let{$cardSize:n}=e;return k(n)?"0 20px 0 0":"2px 0 8px"}),Ee,(e=>{let{$cardSize:n}=e;return!w(n)&&"\n    height: 15px;\n  "})),Qe=o.styled("span")(Xe||(Xe=t(["\n  opacity: 0.8;\n  height: 14px;\n  width: 95%;\n  display: block;\n  position: relative;\n  ",";\n  animation-delay: 0.125s;\n"])),Ee),Ye=o.styled("span")(Ae||(Ae=t(["\n  opacity: 0.8;\n  height: 12px;\n  width: 30%;\n  display: block;\n  "," animation-delay: .25s;\n\n  ",";\n"])),Ee,(e=>{let{$cardSize:n}=e;return!w(n)&&"\n    height: 10px;\n  "})),Ze=()=>{const{props:{size:e}}=a.useContext(G),n=k(e);return a.createElement(a.Fragment,null,a.createElement(Je,{$cardSize:e}),a.createElement(me,{$cardSize:e},a.createElement(Ge,{$cardSize:e}),n?null:a.createElement(a.Fragment,null,a.createElement(Qe,{$cardSize:e}),a.createElement(Qe,{$cardSize:e,style:{marginBottom:"12px"}})),Ke||(Ke=a.createElement(Ye,null))))};var en;const nn=o.styled("div")(en||(en=t(["\n  backface-visibility: hidden;\n  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));\n  transition: ",";\n  will-change: transform;\n\n  > svg {\n    display: block;\n  }\n\n  &:active:not(:focus) {\n    transform: scale(0.9);\n  }\n"])),U("transform"));var tn,rn,an,on,ln,cn,sn,un,dn;const pn=e=>a.createElement("svg",r({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 14 14"},e),tn||(tn=a.createElement("path",{fill:"#FFF",fillRule:"evenodd",stroke:"none",strokeWidth:"1",d:"M15.5 6.205l-.705-.705L13 7.295 11.205 5.5l-.705.705L12.295 8 10.5 9.795l.705.705L13 8.705l1.795 1.795.705-.705L13.705 8 15.5 6.205zM9 15a.5.5 0 01-.355-.15L4.835 11H1.5a.5.5 0 01-.5-.5v-5a.5.5 0 01.5-.5h3.335l3.81-3.85a.5.5 0 01.705 0 .5.5 0 01.15.35v13a.5.5 0 01-.5.5z",transform:"translate(-1 -1)"}))),mn=e=>a.createElement("svg",r({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 14 14"},e),rn||(rn=a.createElement("path",{fill:"#FFF",fillRule:"evenodd",stroke:"none",strokeWidth:"1",d:"M13.58 4.04l-.765.645a5 5 0 01-.145 6.615l.735.7a6 6 0 00.175-7.94v-.02zM10.79 6a3 3 0 01-.09 3.97l.735.68a4 4 0 00.115-5.295L10.79 6zM9 15a.5.5 0 01-.355-.15L4.835 11H1.5a.5.5 0 01-.5-.5v-5a.5.5 0 01.5-.5h3.335l3.81-3.85a.5.5 0 01.705 0 .5.5 0 01.15.35v13a.5.5 0 01-.5.5z",transform:"translate(-1 -1)"}))),fn=o.styled("div")(an||(an=t(["\n  z-index: 2;\n  position: absolute;\n  bottom: ","px;\n  left: 0;\n  right: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  transition: ",";\n  will-change: opacity;\n"])),(e=>{let{$cardSize:n}=e;return w(n)?18:14}),W("opacity")),gn=o.styled("svg")(on||(on=t(["\n  stroke: #fff;\n"]))),bn=o.styled(nn).attrs({className:M.volumeControl})(ln||(ln=t(["\n  "," {\n    width: ","px;\n    height: ","px;\n\n    ","\n  }\n"])),gn,(e=>{let{$cardSize:n}=e;return w(n)?16:14}),(e=>{let{$cardSize:n}=e;return w(n)?16:14}),(e=>{let{$cardSize:n}=e;return!w(n)&&v(cn||(cn=t(["\n      width: 12px;\n      height: 12px;\n    "])))})),hn=o.styled(nn).attrs({className:M.rateControl})(sn||(sn=t(["\n  font-size: ","px;\n  min-width: ","px;\n  line-height: 1;\n  font-weight: bold;\n  border: 1.5px solid #fff;\n  border-radius: 9999px;\n  padding: 1px 5px;\n  text-align: center;\n  color: #fff;\n  margin-left: 10px;\n\n  ","\n"])),(e=>{let{$cardSize:n}=e;return w(n)?12:10}),(e=>{let{$cardSize:n}=e;return w(n)?33:28}),(e=>{let{$cardSize:n}=e;return!w(n)&&v(un||(un=t(["\n    font-size: 8px;\n    margin-left: 8px;\n    min-width: 23px;\n  "])))})),yn=o.styled("span").attrs({className:M.progressTime})(dn||(dn=t(["\n  margin: ",";\n  font-family: ",";\n  font-size: 12px;\n  padding: 0 16px;\n  color: #fff;\n  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);\n"])),(e=>{let{$right:n}=e;return n?"0 0 0 auto":"0 auto 0 0"}),q),vn=e=>{let{$cardSize:n,currentTime:t,endTime:r,isMuted:o,onMuteClick:i,onPlaybackRateClick:l,playbackRate:c}=e;const s=a.useMemo((()=>o?pn:mn),[o]),u=a.useMemo((()=>w(n)),[n]);return a.createElement(fn,{$cardSize:n},u&&a.createElement(yn,null,t),a.createElement(bn,{title:o?"Unmute":"Mute",$cardSize:n,onClick:i},a.createElement(gn,{as:s})),a.createElement(hn,{title:"Playback Rate",$cardSize:n,onClick:l},a.createElement("span",null,c,"x")),u&&a.createElement(yn,{$right:!0},r))},wn=["$isPlaying"];var kn,xn,$n,zn,On,En;const Sn=e=>a.createElement("svg",r({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 20"},e),kn||(kn=a.createElement("path",{fill:"#FFF",fillRule:"evenodd",stroke:"none",strokeWidth:"1",d:"M12 6h-2a2 2 0 00-2 2v16a2 2 0 002 2h2a2 2 0 002-2V8a2 2 0 00-2-2zm10 0h-2a2 2 0 00-2 2v16a2 2 0 002 2h2a2 2 0 002-2V8a2 2 0 00-2-2z",transform:"translate(-8 -6)"}))),Cn=e=>a.createElement("svg",r({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 21 24"},e),xn||(xn=a.createElement("path",{fill:"#FFF",fillRule:"evenodd",stroke:"none",strokeWidth:"1",d:"M7 28a1 1 0 01-1-1V5a1 1 0 011.501-.865l19 11a1 1 0 010 1.73l-19 11A.998.998 0 017 28z",transform:"translate(-6 -4)"}))),Pn={large:"50px",normal:"35px",small:"20px"},Mn=o.styled("svg")($n||($n=t(["\n  stroke: #fff;\n"]))),jn=o.styled(nn).attrs({className:M.playbackControl})(zn||(zn=t(["\n  "," {\n    ","\n  }\n"])),Mn,(e=>{let{$cardSize:n}=e;return o.css(On||(On=t(["\n      width: ",";\n      height: ",";\n      padding: ",";\n\n      ","\n    "])),Pn[n],Pn[n],w(n)?0:"8px",!w(n)&&!k(n)&&v(En||(En=t(["\n        width: calc("," * 1.2);\n        height: calc("," * 1.2);\n      "])),Pn.small,Pn.small))})),Dn=e=>{let{$isPlaying:t}=e,o=n(e,wn);const i=a.useMemo((()=>t?Sn:Cn),[t]);return a.createElement(jn,r({title:t?"Pause":"Play"},o),a.createElement(Mn,{as:i}))};var _n,Nn;const Rn={normal:.8,small:.9},Fn=o.styled("div").attrs((e=>{let{$isVisible:n,$positionX:t}=e;return{style:{left:t,transform:"scale(".concat(n?1:.5,") translate(-50%, -50%)"),opacity:n?1:0,visibility:n?"$visible":"hidden"}}}))(_n||(_n=t(["\n  position: absolute;\n  top: 50%;\n  background: #ffffff;\n  border-radius: 50%;\n  transform-origin: center center;\n  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);\n  transition: ",";\n  will-change: left, transform, opacity, visibility;\n  backface-visibility: hidden;\n  z-index: 3;\n\n  ","\n"])),U("transform","opacity","visibility"),(e=>{let{$cardSize:n}=e;const r=(a=n,Math.floor(12*(Rn[a]||1)));var a;return o.css(Nn||(Nn=t(["\n      height: ","px;\n      width: ","px;\n    "])),r,r)})),Tn=["$isDragging","$isVisible","label","$positionX","size"];var Ln;const Vn={normal:.8},In=o.styled("span").attrs((e=>{let{$position:n,$isDragging:t,$visible:r}=e;return{style:{left:"".concat(n,"px"),top:r?"-4px":"0px",visibility:r?"$visible":"hidden",opacity:r?1:0,transform:"translate(-50%, ".concat(t?-110:-100,"%)")}}}))(Ln||(Ln=t(["\n  position: absolute;\n  background: rgba(24, 25, 25, 0.75);\n  color: #fff;\n  text-shadow: 0 1px 2px rgba(24, 25, 25, 0.15);\n  padding: 2px 3px;\n  border-radius: 4px;\n  font-family: ",";\n  font-size: ","px;\n  line-height: 1;\n  transition: ",",\n    ",";\n  will-change: top, left, visibility, opacity, transform;\n  backface-visibility: hidden;\n"])),q,(e=>{let{$cardSize:n}=e;return 11*(Vn[n]||1)}),W("opacity","visibility","transform"),B("top")),Un=a.forwardRef(((e,t)=>{let{$isDragging:o,$isVisible:i,label:l,$positionX:c,size:s}=e,u=n(e,Tn);return a.createElement(a.Fragment,null,a.createElement(In,r({$visible:i,$position:c,$cardSize:s,ref:t,$isDragging:o},u),l))}));Un.displayName="Tooltip";const Wn=["key"];var Bn,Hn,qn,Xn,An,Kn,Jn;const Gn={normal:.7,small:.6},Qn={small:.9,large:1.4},Yn=e=>Math.floor(6*(Qn[e]||1)),Zn=o.styled("div").attrs((()=>({className:M.progressBar})))(Bn||(Bn=t(["\n  position: relative;\n  padding: ","px ","px ","px;\n  z-index: 2;\n  backface-visibility: hidden;\n"])),6,3,3),et=o.styled("div").attrs((e=>{let{$cardSize:n,$isDragging:t}=e;if(t){const e=Yn(n);return{style:{height:"".concat(e,"px")}}}return{}}))(Hn||(Hn=t(["\n  background: transparent;\n  border-radius: 9999px;\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);\n  background: rgba(255, 255, 255, 0.15);\n  transition: ",";\n  will-change: height;\n  pointer-events: none;\n  position: relative;\n\n  ","\n"])),U("height"),(e=>{let{$cardSize:n}=e;const r=(a=n,Math.floor(6*(Gn[a]||1)));var a;const i=Yn(n);return o.css(qn||(qn=t(["\n      height: ","px;\n\n      ",":hover & {\n        height: ","px;\n      }\n    "])),r,Zn,i)})),nt=o.styled("div")(Xn||(Xn=t(["\n  border-radius: inherit;\n  height: 100%;\n  position: relative;\n  overflow: hidden;\n"]))),tt=o.styled("div").attrs((e=>{let{$maskScale:n}=e;return{style:{transform:"scaleX(".concat(n,")")}}}))(An||(An=t(["\n  position: absolute;\n  left: 0;\n  top: -50%;\n  height: 200%;\n  width: 100%;\n  background: #ffffff;\n  transform-origin: left center;\n  will-change: transform;\n"]))),rt=o.styled("div").attrs((e=>{let{$cursorRatio:n,$isHovering:t,$progressPercent:r}=e;return{style:{left:r,transform:"scaleX(".concat(n,")"),opacity:t?1:0,visibility:t?"$visible":"hidden"}}}))(Kn||(Kn=t(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(255, 255, 255, 0.4);\n  transform-origin: left center;\n  transition: ",";\n  will-change: left, transform, opacity, $visible;\n"])),U("opacity","visibility")),at=o.styled("div").attrs((e=>{let{start:n,end:t}=e;return{style:{left:"".concat(n,"px"),right:"".concat(t,"px")}}}))(Jn||(Jn=t(["\n  background: rgba(255, 255, 255, 0.35);\n  position: absolute;\n  top: 0;\n  bottom: 0;\n"]))),ot=e=>{let{bufferedMedia:t,cursorX:o,duration:i,hoveredTime:l,$isDragging:c,$isHovering:s,onClick:u,onMouseDown:d,onMouseOver:p,progress:m,showTooltip:f}=e;const{props:{size:g}}=a.useContext(G),b=a.useRef(),h=a.useRef(),y=a.useMemo((()=>k(g)),[g]),v=a.useCallback((()=>b.current?b.current.getBoundingClientRect().width-6:0),[]),w=a.useMemo((()=>O(m/i,0,1)),[i,m]),x=a.useMemo((()=>"".concat(O(100*w,1,99),"%")),[w]),$=a.useMemo((()=>{if(b.current){const e=v(),n=w*e,t=o-n;if(t>0)return O((t/(e-n)).toFixed(3),0,.99)}return 0}),[o,v,w]),E=a.useMemo((()=>{const e=v();return t.map(((n,t)=>({key:t,start:n.start*e,end:e-n.end*e})))}),[t,v]),S=a.useMemo((()=>z(l)),[l]),C=a.useMemo((()=>{if(b.current&&h.current){const e=v(),n=h.current.getBoundingClientRect().width/2;return O(o,n,e-n)}return 0}),[o,v]),P=a.useMemo((()=>({onClick:u,onMouseDown:d,onMouseOver:p})),[u,d,p]),M=a.useMemo((()=>c||s),[c,s]);return a.createElement(Zn,r({$cardSize:g,ref:b},P),a.createElement(et,{$cardSize:g,$isDragging:c},a.createElement(nt,null,a.createElement(rt,{$cursorRatio:$,$isHovering:s,$progressPercent:x}),E.map((e=>{let{key:t}=e,o=n(e,Wn);return a.createElement(at,r({key:t},o))})),a.createElement(tt,{$maskScale:w})),a.createElement(Fn,{$cardSize:g,$isVisible:M,$positionX:x}),!y&&a.createElement(Un,{$isDragging:c,$isVisible:M,label:S,$positionX:C,ref:h,size:g})))};var it,lt,ct,st,ut;const dt=["$cardSize"],pt=["$cardSize"],mt=["type","$cardSize"],ft=e=>{let t=n(e,dt);return a.createElement("svg",r({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 29"},t),it||(it=a.createElement("path",{fill:"#FFF",fillRule:"evenodd",stroke:"none",strokeWidth:"1",d:"M4 18c0 6.627 5.373 12 12 12s12-5.373 12-12S22.627 6 16 6h-4V1L6 7l6 6V8h4c5.523 0 10 4.477 10 10s-4.477 10-10 10S6 23.523 6 18H4zm15.63 4.13a2.84 2.84 0 01-1.28-.27 2.44 2.44 0 01-.89-.77 3.57 3.57 0 01-.52-1.25 7.69 7.69 0 01-.17-1.68 7.83 7.83 0 01.17-1.68c.094-.445.27-.87.52-1.25.23-.325.535-.59.89-.77.4-.188.838-.28 1.28-.27a2.44 2.44 0 012.16 1 5.23 5.23 0 01.7 2.93 5.23 5.23 0 01-.7 2.93 2.44 2.44 0 01-2.16 1.08zm0-1.22c.411.025.8-.19 1-.55a3.38 3.38 0 00.37-1.51v-1.38a3.31 3.31 0 00-.29-1.5 1.23 1.23 0 00-2.06 0 3.31 3.31 0 00-.29 1.5v1.38a3.38 3.38 0 00.29 1.51c.195.356.575.57.98.55zm-9 1.09v-1.18h2v-5.19l-1.86 1-.55-1.06 2.32-1.3H14v6.5h1.78V22h-5.15z",transform:"translate(-4 -1)"})))},gt=e=>{let t=n(e,pt);return a.createElement("svg",r({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 29"},t),lt||(lt=a.createElement("path",{fill:"#FFF",fillRule:"evenodd",stroke:"none",strokeWidth:"1",d:"M26 18c0 5.523-4.477 10-10 10S6 23.523 6 18 10.477 8 16 8h4v5l6-6-6-6v5h-4C9.373 6 4 11.373 4 18s5.373 12 12 12 12-5.373 12-12h-2zm-6.36 4.13a2.81 2.81 0 01-1.28-.27 2.36 2.36 0 01-.89-.77 3.39 3.39 0 01-.47-1.25 7.12 7.12 0 01-.17-1.68 7.24 7.24 0 01.17-1.68 3.46 3.46 0 01.52-1.25 2.36 2.36 0 01.89-.77c.4-.19.838-.282 1.28-.27a2.44 2.44 0 012.16 1 5.31 5.31 0 01.7 2.93 5.31 5.31 0 01-.7 2.93 2.44 2.44 0 01-2.21 1.08zm0-1.22a1 1 0 001-.55c.22-.472.323-.99.3-1.51v-1.38a3.17 3.17 0 00-.3-1.5 1.22 1.22 0 00-2.05 0 3.18 3.18 0 00-.29 1.5v1.38a3.25 3.25 0 00.29 1.51 1 1 0 001.05.55zm-7.02-3.49c.355.035.71-.06 1-.27a.84.84 0 00.31-.68v-.08a.94.94 0 00-.3-.74 1.2 1.2 0 00-.83-.27 1.65 1.65 0 00-.89.24 2.1 2.1 0 00-.68.68l-.93-.83a5.37 5.37 0 01.44-.51 2.7 2.7 0 01.54-.4 2.55 2.55 0 01.7-.27 3.25 3.25 0 01.87-.1 3.94 3.94 0 011.06.14c.297.078.576.214.82.4.224.168.408.383.54.63.123.26.184.543.18.83a2 2 0 01-.11.67 1.82 1.82 0 01-.32.52 1.79 1.79 0 01-.47.36 2.27 2.27 0 01-.57.2V18c.219.04.431.11.63.21a1.7 1.7 0 01.85.93c.084.234.124.481.12.73a2 2 0 01-.2.92 2 2 0 01-.58.72 2.66 2.66 0 01-.89.45 3.76 3.76 0 01-1.15.16 4.1 4.1 0 01-1-.11 3.1 3.1 0 01-.76-.31 2.76 2.76 0 01-.56-.45 4.22 4.22 0 01-.44-.55l1.07-.81c.082.147.175.288.28.42.105.128.226.243.36.34.137.097.29.171.45.22a2 2 0 00.57.07 1.45 1.45 0 001-.3 1.12 1.12 0 00.34-.85v-.08a1 1 0 00-.37-.8 1.78 1.78 0 00-1.06-.28h-.76v-1.21h.74z",transform:"translate(-4 -1)"})))},bt=o.styled("svg")(ct||(ct=t(["\n  stroke: #fff;\n  width: ","px;\n  height: ","px;\n\n  ","\n"])),(e=>{let{$cardSize:n}=e;return w(n)?30:24}),(e=>{let{$cardSize:n}=e;return w(n)?30:24}),(e=>{let{$cardSize:n}=e;return!w(n)&&v(st||(st=t(["\n    width: 0;\n    height: 0;\n  "])))})),ht=o.styled(nn)(ut||(ut=t(["\n  margin: 0 ",";\n"])),(e=>{let{$cardSize:n}=e;return w(n)?"28px":"3px"})),yt=e=>{let{type:t="rewind",$cardSize:o}=e,i=n(e,mt);const l=a.useMemo((()=>"rewind"===t?ft:gt),[t]);return a.createElement(ht,r({title:"rewind"===t?"Rewind":"Forward",$cardSize:o},i),a.createElement(bt,{as:l,$cardSize:o}))};var vt,wt,kt,xt,$t,zt;const Ot={normal:.8,small:.6},Et={normal:.9,small:.8},St=o.keyframes(vt||(vt=t(["\n  100% {\n    transform: rotate(360deg);\n  }\n"]))),Ct=o.keyframes(wt||(wt=t(["\n  0% {\n    stroke-dasharray: 1, 150;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -35;\n  }\n  100% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -124;\n  }\n"]))),Pt=o.styled(nn).attrs((e=>{let{$isVisible:n}=e;return{style:{opacity:n?1:0,visibility:n?"$visible":"hidden"}}}))((e=>{let{$cardSize:n}=e;const r="".concat((e=>Math.floor(12*(Et[e]||1)))(n),"px"),a="".concat((e=>Math.floor(6*(Ot[e]||1)))(n),"px");return o.css(kt||(kt=t(["\n    position: absolute;\n    width: ",";\n    right: ",";\n    top: ",";\n    transition: ",";\n    will-change: opacity, visibility;\n    pointer-events: none;\n  "])),r,a,a,W("opacity","visibility"))})),Mt=o.styled("svg")(xt||(xt=t(["\n  width: 100%;\n  animation: "," 2s linear infinite;\n  will-change: transform;\n"])),St),jt=o.styled("circle")($t||($t=t(["\n  stroke: #fff;\n  stroke-linecap: round;\n  stroke-width: 7;\n  fill: none;\n  animation: "," 1.5s ease-in-out infinite;\n  will-change: stroke-dasharray, stroke-dashoffset;\n"])),Ct),Dt=e=>{let{size:n,$isVisible:t}=e;return a.createElement(Pt,{$cardSize:n,className:M.spinner,$isVisible:t},zt||(zt=a.createElement(Mt,{viewBox:"0 0 50 50"},a.createElement(jt,{cx:"25",cy:"25",r:"20"}))))};var _t,Nt,Rt,Ft,Tt;const Lt=32,Vt=37,It=39,Ut=77,Wt=o.styled("div").attrs({className:M.mediaControls})(_t||(_t=t(["\n  position: absolute;\n  left: 0;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  transition: ",", ",";\n  will-change: background;\n  display: flex;\n  flex-direction: column;\n  pointer-events: auto;\n\n  ","\n"])),B("background"),W("opacity"),(e=>{let{$hasInteracted:n,$isDragging:r,$isPlaying:a}=e;const i="rgba(0, 0, 0, 0.35)",l=n&&!a;return o.css(Nt||(Nt=t(["\n      .",":hover & {\n        background: ",";\n      }\n\n      .",":not(:hover) & {\n        opacity: ",";\n        ",";\n      }\n    "])),M.main,r?"rgba(0, 0, 0, 0.2)":i,M.main,!n||l?1:0,l&&"background: ".concat(i))})),Bt=o.styled("div")(Rt||(Rt=t(["\n  position: absolute;\n  left: 0;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 2;\n"]))),Ht=o.styled("div")(Ft||(Ft=t(["\n  flex: 1;\n\n  ","\n"])),(e=>{let{$isVisible:n}=e;return!n&&o.css(Tt||(Tt=t(["\n      *[class*='","']:not(.",") {\n        transition: ",";\n        opacity: 0;\n        visibility: hidden;\n      }\n    "])),M.mediaControls,M.progressTime,W("opacity","visibility"))})),qt=e=>{let{MediaComponent:n,mediaProps:t}=e;const{props:{autoPlay:o,controls:i,mediaRef:l,muted:c,loop:s,size:u}}=a.useContext(G),[d,p]=a.useState(0),[m,f]=a.useState(0),[b,h]=a.useState([]),[y,v]=a.useState(0),[w,x]=a.useState(0),[$,E]=a.useState(o),[S,C]=a.useState(c),[P,j]=a.useState(!1),[D,_]=a.useState(!1),[N,R]=a.useState(!1),[F,T]=a.useState(1),[L,V]=a.useState(o),[I,U]=a.useState(!1),W=a.useRef(),B=a.useCallback((e=>{W.current=e,l&&(g(l)?l(e):l.current=e)}),[l]),H=a.useMemo((()=>!k(u)),[u]),q=a.useMemo((()=>({onCanPlay:()=>j(!1),onLoadedMetadata:e=>p(e.currentTarget.duration),onPause:()=>E(!1),onPlay:()=>E(!0),onPlaying:()=>j(!1),onProgress:e=>h(e.currentTarget.buffered),onRateChange:e=>T(e.currentTarget.playbackRate),onTimeUpdate:e=>f(e.currentTarget.currentTime),onVolumeChange:e=>C(e.currentTarget.muted),onWaiting:e=>j(!0)})),[]),X=a.useCallback((e=>{if(W.current){const n=e.currentTarget.getBoundingClientRect(),t=O(Math.floor(e.clientX-n.left),0,n.width);return{cursor:t,time:t/n.width*W.current.duration}}return{cursor:0,time:0}}),[]),A=a.useCallback((()=>{W.current&&(W.current.paused?(L||V(!0),W.current.play()):W.current.pause())}),[L]),K=a.useCallback((e=>{if(W.current){const n=O(e,0,W.current.duration);W.current.currentTime=n,f(n)}}),[]),J=a.useCallback(((e,n)=>{if(e.preventDefault(),e.stopPropagation(),W.current){const{currentTime:e}=W.current;K("rewind"===n?e-10:e+30)}}),[K]),Q=a.useCallback((e=>{e.preventDefault(),e.stopPropagation(),W.current&&(W.current.muted=!W.current.muted)}),[]),Y=a.useCallback((e=>{e.preventDefault(),e.stopPropagation(),W.current&&(W.current.playbackRate=(e=>{switch(e){case 1:return 1.25;case 1.25:return 1.5;case 1.5:return 2;default:return 1}})(W.current.playbackRate))}),[]),Z=a.useCallback((e=>{e.preventDefault(),e.stopPropagation(),R(!1)}),[]),ee=a.useCallback((e=>{e.preventDefault(),e.stopPropagation(),R(!0);const{time:n}=X(e);K(n)}),[X,K]),ne=a.useCallback((()=>_(!0)),[]),te=a.useCallback((e=>{e.preventDefault(),e.stopPropagation(),N?R(!1):A()}),[N,A]),re=a.useCallback((e=>{if((N||D)&&W.current){e.preventDefault();const{cursor:n,time:t}=X(e);x(t),v(n),N&&(W.current.paused||(W.current.pause(),U(!0)),K(t))}}),[X,N,D,K]),ae=a.useCallback((e=>{N&&0===e.buttons&&R(!1)}),[N]),oe=a.useCallback((e=>{if(N)return;const{keyCode:n}=e;if([Lt,Vt,It,Ut].includes(n)&&W.current)switch(e.preventDefault(),n){case Lt:A();break;case Vt:K(W.current.currentTime-5);break;case It:K(W.current.currentTime+5);break;case Ut:W.current.muted=!W.current.muted}}),[N,K,A]),ie=a.useMemo((()=>({onClick:te,onKeyDown:oe,onMouseMove:re,onMouseOut:()=>_(!1),onMouseOver:ae})),[te,oe,re,ae]),le=a.useMemo((()=>L?{title:""}:{}),[L]),ce=a.useMemo((()=>b&&b.length&&W.current?[...Array(b.length).keys()].map((e=>({start:b.start(e)/W.current.duration,end:b.end(e)/W.current.duration}))):[]),[b]),se=a.useMemo((()=>z(m||0)),[m]),ue=a.useMemo((()=>z(d||0)),[d]),de=a.useMemo((()=>({$cardSize:u,currentTime:se,endTime:ue,isMuted:S,onMuteClick:Q,onPlaybackRateClick:Y,playbackRate:F})),[se,ue,S,Q,Y,F,u]),pe=a.useMemo((()=>({bufferedMedia:ce,cursorX:y,duration:d,hoveredTime:w,$isDragging:N,$isHovering:D,onClick:Z,onMouseDown:ee,onMouseOver:ne,progress:m,showTooltip:N||D})),[ce,y,d,w,N,D,Z,ee,ne,m]);return a.useEffect((()=>{!N&&I&&W.current&&W.current.paused&&(W.current.play(),U(!1))}),[I,N]),a.createElement(a.Fragment,null,a.createElement(n,r({},t,q,{ref:B,autoPlay:o,loop:s,muted:c})),i&&a.createElement(Wt,r({},le,{tabIndex:0,$hasInteracted:L,$isDragging:N,$isPlaying:$},ie),a.createElement(Dt,{size:u,$isVisible:P}),L?a.createElement(a.Fragment,null,a.createElement(Ht,{$isVisible:!N},a.createElement(Bt,null,H&&a.createElement(yt,{className:M.rwControl,type:"rewind",$cardSize:u,onClick:e=>J(e,"rewind")}),a.createElement(Dn,{$cardSize:u,$isPlaying:$}),H&&a.createElement(yt,{className:M.ffwControl,type:"fastforward",$cardSize:u,onClick:e=>J(e,"fastforward")})),H&&a.createElement(vn,de)),a.createElement(ot,pe)):a.createElement(Bt,null,a.createElement(Dn,{$cardSize:u}))))};var Xt;const At=o.styled("video")(Xt||(Xt=t(["\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n\n  &::media-controls-start-playback-button {\n    display: none;\n    appearance: none;\n  }\n"]))),Kt={video:e=>{const{state:{imageUrl:n,playsInline:t,videoUrl:o}}=a.useContext(G),i=a.useMemo((()=>{const e={className:"".concat(M.media," ").concat(M.video),src:o,playsInline:t};return n&&(e.poster=x(n)),e}),[n,t,o]);return a.createElement(Ie,r({className:"".concat(M.mediaWrapper," ").concat(M.videoWrapper)},e),a.createElement(qt,{MediaComponent:At,mediaProps:i}))},image:Be,audio:e=>{const{state:{audioUrl:n}}=a.useContext(G),t=a.useMemo((()=>({className:"".concat(M.media," ").concat(M.audio),src:n})),[n]);return a.createElement(Be,r({className:"".concat(M.mediaWrapper," ").concat(M.audioWrapper)},e),a.createElement(qt,{MediaComponent:"audio",mediaProps:t}))}},Jt=()=>{const{state:{imageUrl:e,isAudio:n,isVideo:t}}=a.useContext(G),[r,o]=a.useState(null!==y(e));const i=((e,n)=>e?"audio":n?"video":"image")(n,t),l=Kt[i];return a.createElement(a.Fragment,null,a.createElement(l,{$isLoading:r}),r&&a.createElement(je,{src:e,onLoad:()=>o(!1)}))},Gt=["href","rel","target","as"];var Qt,Yt,Zt,er,nr;function tr(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function rr(n){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?tr(Object(r),!0).forEach((function(t){e(n,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(r)):tr(Object(r)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(r,e))}))}return n}const ar="382px",or=e=>{let{$backgroundColor:n,color:r}=e;return o.css(Qt||(Qt=t(["\n  background-color: ",";\n  border-color: ",";\n  transition-property: filter;\n  will-change: filter;\n\n  &&& {\n    color: ",";\n  }\n\n  &:hover {\n    filter: brightness(90%);\n  }\n"])),n,r,r)},ir=o.css(Yt||(Yt=t(["\n  flex-direction: column;\n  height: ",";\n  ",";\n"])),ar,v(Zt||(Zt=t(["\n    height: calc("," * 7/9);\n  "])),ar)),lr=o.css(er||(er=t(["\n  transition-property: background, border-color;\n  will-change: background, border-color;\n  &:hover {\n    background-color: var(--microlink-hover-background-color, #f5f8fa);\n    border-color: var(--microlink-hover-border-color, #8899a680);\n  }\n"]))),cr=e=>{let{$cardSize:n}=e;return o.css(nr||(nr=t(["\n  flex-direction: ",";\n"])),w(n)?"column-reverse":"row-reverse")},sr=o.css((()=>"\n  max-width: var(--microlink-max-width, 500px);\n  background-color: var(--microlink-background-color, #fff);\n  border-width: var(--microlink-border-width, 1px);\n  border-style: var(--microlink-border-style, solid);\n  border-color: var(--microlink-border-color, #e1e8ed);\n  color: var(--microlink-color, #181919);\n  overflow: hidden;\n  font-family: ".concat(H,";\n  display: flex;\n  text-decoration: none;\n  opacity: 1;\n  position: relative;\n  transition-duration: ").concat(L.medium,";\n  transition-timing-function: ").concat(V.medium,";\n\n  &:active,\n  &:hover {\n    outline: 0;\n  }\n"))),ur=o.styled("a")(sr,(e=>{let{$isLoading:n,contrast:t}=e;return!n&&!t&&lr}),(e=>{let{$cardSize:n}=e;return w(n)&&ir}),(e=>{let{direction:n}=e;return"rtl"===n&&cr}),(e=>{let{$backgroundColor:n,color:t,contrast:r}=e;return r&&t&&n&&or}),(e=>{let{$backgroundColor:n,color:t,contrast:r}=e;return r&&(!t||!n)&&lr})),dr=a.forwardRef(((e,t)=>{let{href:r,rel:o="noopener noreferrer",target:i="_blank",as:l="a"}=e,c=n(e,Gt);const{state:{$backgroundColor:s,color:u,title:d},props:{size:p}}=a.useContext(G);return a.createElement(ur,rr(rr(rr({},"a"===l?{href:r,rel:o,target:i}:void 0),c),{},{$backgroundColor:s,$cardSize:p,color:u,ref:t,title:d}))}));dr.displayName="CardWrap";var pr,mr,fr;const gr=["className","fetchData","lazy","loading","media","setData","url","apiKey"],br=["className","apiKey","autoPlay","controls","direction","lazy","loop","media","fetchData","muted","playsInline","size"];function hr(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function yr(n){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?hr(Object(r),!0).forEach((function(t){e(n,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(r)):hr(Object(r)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(r,e))}))}return n}const vr=e=>{const{className:t,fetchData:o,lazy:l,loading:c,media:s,setData:u,url:d,apiKey:p}=e,m=n(e,gr),v=a.useMemo((()=>[].concat(s)),[s]),{updateState:w}=a.useContext(G),[k,x]=a.useState(!0),[z,O]=a.useState(null),[E,S]=a.useState(!1),C=a.useMemo((()=>void 0===c),[c]),[P,j]=a.useMemo((()=>(e=>{let{apiKey:n,contrast:t=!1,data:r,endpoint:a,force:o,headers:l,media:c,prerender:s,proxy:u,ttl:d,url:p}=e;return i.getApiUrl(p,{apiKey:n,audio:c.includes("audio"),data:r,endpoint:a,force:o,headers:l,iframe:c.includes("iframe"),palette:t,prerender:s,proxy:u,screenshot:c.includes("screenshot"),ttl:d,video:c.includes("video")})})(yr(yr({},e),{},{media:v}))),[v,e]),D=a.useMemo((()=>$&&(!0===l||b(l))),[l]),_=a.useMemo((()=>b(l)?l:void 0),[l]),[N,R]=((e,n)=>{const[t,r]=a.useState(!1);return[t,a.useCallback((t=>{if(e){const e=new IntersectionObserver(((e,n)=>{let[t]=e;t.isIntersecting&&(r(!0),n.unobserve(t.target))}),n);null!==t&&e.observe(t)}else r(!0)}),[e,n])]})(D,_),F=a.useMemo((()=>!D||D&&N),[D,N]),T=a.useCallback((e=>{const n=g(u)?u(e):yr(yr({},e),u),{title:t,description:r,url:a,video:o,audio:i,image:l,logo:c,iframe:s}=n,d=l||c||{};let p,m,f=d,b=!1,k=!1;const $=((e,n)=>{let t;for(let r=0;r<n.length;r++){const a=n[r],o=e[a];if(!h(o)){t=a;break}}return t})(n,v);switch($){case"audio":k=!0,m=y(i);break;case"video":b=!0,p=y(o);break;case"iframe":O(s);break;default:f=((e,n)=>e[n.find((n=>!h(e[n])))])(n,v)||d}const z=y(f),{color:E,background_color:S}=f;w({url:a,color:E,title:t,description:r,imageUrl:z,videoUrl:p,audioUrl:m,isVideo:b,isAudio:k,$backgroundColor:S}),x(!1)}),[w,v,u]),L=a.useCallback((()=>{if(F){x(!0);(o?i.fetchFromApi(P,j):Promise.resolve({})).then((e=>{let{data:n}=e;return T(n)})).catch((e=>{x(!1),S(!0),console.error("\n┌───────────────┐\n│ Microlink SDK │\n└───────────────┘\n\n".concat(e.description,"\n\n").concat(JSON.stringify(e.data),"\n\nid   ").concat(e.headers["x-request-id"],"\nuri  ").concat(e.url,"\ncode ").concat(e.code," (").concat(e.statusCode,")\n\nmicrolink.io/").concat(e.code.toLowerCase(),"\n"))}))}}),[j,o,P,T,F]);a.useEffect(L,[d,u,N]);const V=C?k:c;return E?a.createElement("a",r({href:d},m),d):z?(f||z.scripts.forEach((e=>{if(!document.querySelector('script[src="'.concat(e.src,'"]'))){const n=document.createElement("script");Object.keys(e).forEach((t=>n[t]=e[t])),document.body.appendChild(n)}})),a.createElement("div",r({className:M.iframe,dangerouslySetInnerHTML:{__html:z.html}},m))):a.createElement(dr,r({className:"".concat(M.main," ").concat(t).trim(),href:d,$isLoading:V,ref:R},m),V?pr||(pr=a.createElement(Ze,null)):a.createElement(a.Fragment,null,mr||(mr=a.createElement(Jt,null)),fr||(fr=a.createElement(ve,null))))},wr=e=>{let{className:t="",apiKey:o,autoPlay:i=!0,controls:l=!0,direction:c="ltr",lazy:s=!0,loop:u=!0,media:d=["iframe","video","audio","image","logo"],fetchData:p=!0,muted:m=!0,playsInline:f=!0,size:g="normal"}=e,b=n(e,br);return a.createElement(Q,r({className:t,apiKey:o,autoPlay:i,controls:l,direction:c,lazy:s,loop:u,media:d,fetchData:p,muted:m,playsInline:f,size:g},b),(e=>a.createElement(vr,e)))},kr=["LinkComponent"];var xr,$r;function zr(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function Or(n){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?zr(Object(r),!0).forEach((function(t){e(n,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(r)):zr(Object(r)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(r,e))}))}return n}const Er=o.div(xr||(xr=t(["\n  --microlink-hover-background-color: var(--microlink-background-color, white);\n\n  position: absolute;\n  overflow: hidden;\n  visibility: hidden;\n  transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);\n  opacity: 0;\n  right: 50%;\n  transform: translate(50%, 0);\n  bottom: 100%;\n  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);\n  width: 500px;\n  padding: 0.5rem;\n  border-radius: 4px;\n\n  .microlink_card {\n    border: 0;\n  }\n\n  border: 1px solid var(--microlink-border-color, #e1e8ed);\n  background-color: var(--microlink-hover-background-color);\n\n  &:hover {\n    box-shadow: rgba(0, 0, 0, 0.12) 0px 30px 60px;\n    border-color: var(--microlink-hover-border-color, #f5f8fa);\n  }\n"]))),Sr=o.span($r||($r=t(["\n  text-decoration: inherit;\n  position: relative;\n  display: inline-block;\n\n  &:hover "," {\n    margin-bottom: var(--microlink-gap, 15px);\n    visibility: visible;\n    opacity: 1;\n  }\n"])),Er),Cr=e=>{let{LinkComponent:t}=e,r=n(e,kr);return a.createElement(Sr,null,a.createElement(t,r),a.createElement(Er,{className:"microlink_hover"},a.createElement(wr,r)))},Pr=(e,n)=>t=>Cr(Or(Or({LinkComponent:e},n),t));Pr.withHover=Cr,exports.default=Pr;
//# sourceMappingURL=microlink.min.cjs.map