import { r as registerInstance, h, H as Host } from './index-6334d911.js';
import './index-70f14ac5.js';
import { r as runState } from './runStore-777bbf80.js';
import { c as coreState } from './core-aa3ec348.js';
import './_commonjsHelpers-66ac50f5.js';
import { s as src } from './index-25ead363.js';

const PostCanvasGQL = `
    mutation createCanvas($canvasPageInput: CanvasPageInput!) {
        canvasPageCreate(canvasPageInput: $canvasPageInput) {
            id
            seo {
                url
            }
            canvas
        }
    }
`;

const templateFnc = (value, styles, title) => {
  let styleString = "";
  styles.forEach((style) => {
    styleString += style.outerHTML;
  });
  return `
<html>
    <head>
        <title>${title}</title>
        ${styleString}
        <script type="module" src="https://unpkg.com/@corejam/core-components@latest/web-components/index.js"></script>
        <script nomodule src="https://unpkg.com/@corejam/core-components@latest/web-components/index.cjs"></script>
    </head>
    <body>
        ${value}
    </body>
</html>
`;
};

const CorejamDeploy = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
  }
  async deploy(e) {
    e.preventDefault();
    const styleTags = document.querySelectorAll("style");
    const stringifiedHtml = document.getElementsByTagName("corejam-canvas")[0].outerHTML;
    const name = window.prompt("name");
    if (name) {
      const request = await coreState.client.mutate({
        mutation: src(PostCanvasGQL),
        variables: {
          canvasPageInput: {
            canvas: JSON.stringify(templateFnc(stringifiedHtml, styleTags, name)),
            seo: {
              url: name,
            },
          },
        },
      });
      if (request.data.canvasPageCreate.id) {
        runState.routes = [
          {
            url: `/${name}`,
            canvasPage: true,
            component: JSON.stringify(stringifiedHtml),
            exact: true,
          },
        ];
        runState.router.push(`/${name}`);
      }
    }
  }
  render() {
    return (h(Host, null, h("corejam-box", { flex: true, direction: "col", pt: 24 }, h("corejam-type", { as: "h3", size: "lg", weight: "hairline" }, "Deploy to CDN"), h("corejam-button", { w: "6", bg: "green-200", hoverBg: "green-300", p: "2", color: "gray-700", hoverColor: "white", onPointerUp: this.deploy }, "Deploy"))));
  }
};

export { CorejamDeploy as corejam_deploy };
