@shopify/hydrogen-react/dist/node-prod/ExternalVideo.js

React components, hooks, and utilities for creating custom Shopify storefronts

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const ExternalVideo = React.forwardRef(
  (props, ref) => {
    const {
      data,
      options,
      id = data.id,
      frameBorder = "0",
      allow = "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",
      allowFullScreen = true,
      loading = "lazy",
      ...passthroughProps
    } = props;
    if (!data.embedUrl) {
      throw new Error(`<ExternalVideo/> requires the 'embedUrl' property`);
    }
    let finalUrl = data.embedUrl;
    if (options) {
      const urlObject = new URL(data.embedUrl);
      for (const [key, value] of Object.entries(options)) {
        if (typeof value === "undefined") {
          continue;
        }
        urlObject.searchParams.set(key, value.toString());
      }
      finalUrl = urlObject.toString();
    }
    return /* @__PURE__ */ jsxRuntime.jsx(
      "iframe",
      {
        ...passthroughProps,
        id: id ?? data.embedUrl,
        title: data.alt ?? data.id ?? "external video",
        frameBorder,
        allow,
        allowFullScreen,
        src: finalUrl,
        loading,
        ref
      }
    );
  }
);
exports.ExternalVideo = ExternalVideo;
//# sourceMappingURL=ExternalVideo.js.map