import { g as e } from "./alasql-f59e855e.js";
import t from "react";
function r(e2, t2) {
  for (var r2 = 0; r2 < t2.length; r2++) {
    const a2 = t2[r2];
    if ("string" != typeof a2 && !Array.isArray(a2)) {
      for (const t3 in a2)
        if ("default" !== t3 && !(t3 in e2)) {
          const r3 = Object.getOwnPropertyDescriptor(a2, t3);
          r3 && Object.defineProperty(e2, t3, r3.get ? r3 : { enumerable: true, get: () => a2[t3] });
        }
    }
  }
  return Object.freeze(Object.defineProperty(e2, Symbol.toStringTag, { value: "Module" }));
}
var a = Object.create, n = Object.defineProperty, o = Object.getOwnPropertyDescriptor, i = Object.getOwnPropertyNames, l = Object.getPrototypeOf, s = Object.prototype.hasOwnProperty, c = (e2, t2, r2, a2) => {
  if (t2 && "object" == typeof t2 || "function" == typeof t2)
    for (let l2 of i(t2))
      s.call(e2, l2) || l2 === r2 || n(e2, l2, { get: () => t2[l2], enumerable: !(a2 = o(t2, l2)) || a2.enumerable });
  return e2;
}, p = (e2, t2, r2) => (((e3, t3, r3) => {
  t3 in e3 ? n(e3, t3, { enumerable: true, configurable: true, writable: true, value: r3 }) : e3[t3] = r3;
})(e2, "symbol" != typeof t2 ? t2 + "" : t2, r2), r2), u = {};
((e2, t2) => {
  for (var r2 in t2)
    n(e2, r2, { get: t2[r2], enumerable: true });
})(u, { default: () => b });
var d, h = (d = u, c(n({}, "__esModule", { value: true }), d)), m = ((e2, t2, r2) => (r2 = null != e2 ? a(l(e2)) : {}, c(!t2 && e2 && e2.__esModule ? r2 : n(r2, "default", { value: e2, enumerable: true }), e2)))(t);
const f = "64px", g = {};
class b extends m.Component {
  constructor() {
    super(...arguments), p(this, "mounted", false), p(this, "state", { image: null }), p(this, "handleKeyPress", (e2) => {
      "Enter" !== e2.key && " " !== e2.key || this.props.onClick();
    });
  }
  componentDidMount() {
    this.mounted = true, this.fetchImage(this.props);
  }
  componentDidUpdate(e2) {
    const { url: t2, light: r2 } = this.props;
    e2.url === t2 && e2.light === r2 || this.fetchImage(this.props);
  }
  componentWillUnmount() {
    this.mounted = false;
  }
  fetchImage({ url: e2, light: t2, oEmbedUrl: r2 }) {
    if (!m.default.isValidElement(t2))
      if ("string" != typeof t2) {
        if (!g[e2])
          return this.setState({ image: null }), window.fetch(r2.replace("{url}", e2)).then((e3) => e3.json()).then((t3) => {
            if (t3.thumbnail_url && this.mounted) {
              const r3 = t3.thumbnail_url.replace("height=100", "height=480").replace("-d_295x166", "-d_640");
              this.setState({ image: r3 }), g[e2] = r3;
            }
          });
        this.setState({ image: g[e2] });
      } else
        this.setState({ image: t2 });
  }
  render() {
    const { light: e2, onClick: t2, playIcon: r2, previewTabIndex: a2, previewAriaLabel: n2 } = this.props, { image: o2 } = this.state, i2 = m.default.isValidElement(e2), l2 = { display: "flex", alignItems: "center", justifyContent: "center" }, s2 = { preview: { width: "100%", height: "100%", backgroundImage: o2 && !i2 ? `url(${o2})` : void 0, backgroundSize: "cover", backgroundPosition: "center", cursor: "pointer", ...l2 }, shadow: { background: "radial-gradient(rgb(0, 0, 0, 0.3), rgba(0, 0, 0, 0) 60%)", borderRadius: f, width: f, height: f, position: i2 ? "absolute" : void 0, ...l2 }, playIcon: { borderStyle: "solid", borderWidth: "16px 0 16px 26px", borderColor: "transparent transparent transparent white", marginLeft: "7px" } }, c2 = m.default.createElement("div", { style: s2.shadow, className: "react-player__shadow" }, m.default.createElement("div", { style: s2.playIcon, className: "react-player__play-icon" }));
    return m.default.createElement("div", { style: s2.preview, className: "react-player__preview", onClick: t2, tabIndex: a2, onKeyPress: this.handleKeyPress, ...n2 ? { "aria-label": n2 } : {} }, i2 ? e2 : null, r2 || c2);
  }
}
const y = r({ __proto__: null, default: e(h) }, [h]);
export {
  y as P
};
