'use strict';

var React = require('react');
var reactDom = require('react-dom');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

const Lightbox = ({ items, currentUrl, setCurrentUrl }) => {
  const currentItem = items.find((item) => item.url === currentUrl);
  const goToNextItem = React.useCallback(() => {
    const currentIndex = items.findIndex((item) => item.url === currentUrl);
    const nextItem = items.at((currentIndex + 1) % items.length);
    if (nextItem) {
      setCurrentUrl(nextItem.url);
    }
  }, [currentUrl]);
  const goToPreviousItem = React.useCallback(() => {
    const currentIndex = items.findIndex((item) => item.url === currentUrl);
    const previousItem = items.at((currentIndex - 1) % items.length);
    if (previousItem) {
      setCurrentUrl(previousItem.url);
    }
  }, [currentUrl]);
  const innerRef = React.useRef(null);
  React.useEffect(() => {
    const keydownListener = (e) => {
      if (!currentUrl || !currentItem) {
        return;
      }
      if (e.key === "Escape") {
        e.preventDefault();
        e.stopPropagation();
        setCurrentUrl(void 0);
      }
      if (e.key === "ArrowRight") {
        e.preventDefault();
        e.stopPropagation();
        goToNextItem();
      }
      if (e.key === "ArrowLeft") {
        e.preventDefault();
        e.stopPropagation();
        goToPreviousItem();
      }
    };
    window.addEventListener("keydown", keydownListener);
    return () => {
      window.removeEventListener("keydown", keydownListener);
    };
  }, [currentUrl, currentItem]);
  if (!currentUrl || !currentItem) {
    return null;
  }
  return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, reactDom.createPortal(
    /* @__PURE__ */ React__default["default"].createElement("div", {
      className: "absolute top-0 left-0 w-screen h-screen bg-[rgba(0,0,0,0.9)] text-white flex justify-center items-center z-[999999]",
      onClick: (e) => {
        if (e.target !== innerRef.current) {
          setCurrentUrl(void 0);
        }
      }
    }, currentItem.type === "photo" && /* @__PURE__ */ React__default["default"].createElement("img", {
      className: "cursor-pointer max-w-[90vw] max-h-[90vh]",
      src: currentUrl,
      onClick: () => {
        window.open(currentUrl, "_blank");
      },
      ref: innerRef
    }), currentItem.type === "video" && new URL(currentUrl).hostname.replace("www.", "").startsWith("youtube.com") && /* @__PURE__ */ React__default["default"].createElement("iframe", {
      width: "560",
      height: "315",
      src: currentUrl.replace("watch?v=", "embed/")
    })),
    document.body
  ));
};

exports.Lightbox = Lightbox;
//# sourceMappingURL=Lightbox-880f4672.js.map
