import * as React from "react";
import { useLocation, useMatches } from "@remix-run/react";
export function ExternalScripts() {
  let location = useLocation();
  let scripts = useMatches().flatMap((match, index, matches) => {
    let scripts = match.handle?.scripts;
    if (typeof scripts !== "function") return [];
    let result = scripts({
      id: match.id,
      data: match.data,
      params: match.params,
      location,
      parentsData: matches.slice(0, index).map((match) => match.data),
      matches,
    });
    if (Array.isArray(result)) return result;
    return [];
  });
  return React.createElement(
    React.Fragment,
    null,
    scripts.map((props) => {
      let rel = props.noModule ? "modulepreload" : "preload";
      let as = !props.noModule ? "script" : undefined;
      return React.createElement("link", {
        key: props.src,
        rel: rel,
        href: props.src,
        as: as,
        crossOrigin: props.crossOrigin,
        integrity: props.integrity,
        referrerPolicy: props.referrerPolicy,
      });
    }),
    scripts.map((props) => {
      return React.createElement("script", { ...props, key: props.src });
    })
  );
}
