@hirebus/academy/dist/Preview-BGpAtt6J.cjs

React component library for academy and learning platforms

"use strict";const y=require("./index-BH5PkfxW.cjs"),v=require("react");function w(r,e){for(var t=0;t<e.length;t++){const n=e[t];if(typeof n!="string"&&!Array.isArray(n)){for(const a in n)if(a!=="default"&&!(a in r)){const i=Object.getOwnPropertyDescriptor(n,a);i&&Object.defineProperty(r,a,i.get?i:{enumerable:!0,get:()=>n[a]})}}}return Object.freeze(Object.defineProperty(r,Symbol.toStringTag,{value:"Module"}))}var P=Object.create,s=Object.defineProperty,O=Object.getOwnPropertyDescriptor,x=Object.getOwnPropertyNames,I=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty,S=(r,e,t)=>e in r?s(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,E=(r,e)=>{for(var t in e)s(r,t,{get:e[t],enumerable:!0})},_=(r,e,t,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of x(e))!j.call(r,a)&&a!==t&&s(r,a,{get:()=>e[a],enumerable:!(n=O(e,a))||n.enumerable});return r},C=(r,e,t)=>(t=r!=null?P(I(r)):{},_(!r||!r.__esModule?s(t,"default",{value:r,enumerable:!0}):t,r)),N=r=>_(s({},"__esModule",{value:!0}),r),p=(r,e,t)=>(S(r,typeof e!="symbol"?e+"":e,t),t),g={};E(g,{default:()=>k});var m=N(g),o=C(v);const u="64px",d={};class k extends o.Component{constructor(){super(...arguments),p(this,"mounted",!1),p(this,"state",{image:null}),p(this,"handleKeyPress",e=>{(e.key==="Enter"||e.key===" ")&&this.props.onClick()})}componentDidMount(){this.mounted=!0,this.fetchImage(this.props)}componentDidUpdate(e){const{url:t,light:n}=this.props;(e.url!==t||e.light!==n)&&this.fetchImage(this.props)}componentWillUnmount(){this.mounted=!1}fetchImage({url:e,light:t,oEmbedUrl:n}){if(!o.default.isValidElement(t)){if(typeof t=="string"){this.setState({image:t});return}if(d[e]){this.setState({image:d[e]});return}return this.setState({image:null}),window.fetch(n.replace("{url}",e)).then(a=>a.json()).then(a=>{if(a.thumbnail_url&&this.mounted){const i=a.thumbnail_url.replace("height=100","height=480").replace("-d_295x166","-d_640");this.setState({image:i}),d[e]=i}})}}render(){const{light:e,onClick:t,playIcon:n,previewTabIndex:a,previewAriaLabel:i}=this.props,{image:h}=this.state,l=o.default.isValidElement(e),f={display:"flex",alignItems:"center",justifyContent:"center"},c={preview:{width:"100%",height:"100%",backgroundImage:h&&!l?`url(${h})`:void 0,backgroundSize:"cover",backgroundPosition:"center",cursor:"pointer",...f},shadow:{background:"radial-gradient(rgb(0, 0, 0, 0.3), rgba(0, 0, 0, 0) 60%)",borderRadius:u,width:u,height:u,position:l?"absolute":void 0,...f},playIcon:{borderStyle:"solid",borderWidth:"16px 0 16px 26px",borderColor:"transparent transparent transparent white",marginLeft:"7px"}},b=o.default.createElement("div",{style:c.shadow,className:"react-player__shadow"},o.default.createElement("div",{style:c.playIcon,className:"react-player__play-icon"}));return o.default.createElement("div",{style:c.preview,className:"react-player__preview",onClick:t,tabIndex:a,onKeyPress:this.handleKeyPress,...i?{"aria-label":i}:{}},l?e:null,n||b)}}const D=y.getDefaultExportFromCjs(m),M=w({__proto__:null,default:D},[m]);exports.Preview=M;