@graphql-yoga/render-apollo-sandbox/esm/index.js

export function renderApolloSandbox(sandboxOpts) {
    return function renderApolloSandbox(graphiqlOpts) {
        const initialState = {
            document: graphiqlOpts.defaultQuery,
            headers: graphiqlOpts.headers,
            sharedHeaders: graphiqlOpts.additionalHeaders,
            ...sandboxOpts?.initialState,
        };
        const finalOpts = {
            ...sandboxOpts,
            initialState,
        };
        return /* HTML */ `
      <div style="width: 100%; height: 100%;" id="embedded-sandbox"></div>
      <script src="https://embeddable-sandbox.cdn.apollographql.com/_latest/embeddable-sandbox.umd.production.min.js"></script>
      <script>
        const opts = ${JSON.stringify(finalOpts)};
        opts.initialEndpoint ||= new URL(location.pathname, location.href).toString();
        new window.EmbeddedSandbox(opts);
      </script>
    `;
    };
}