@netlify/spark-ui 1.25.0 → 1.26.0-alpha.1

package/dist/components/index.d.ts

@@ -5,4 +5,7 @@ export { default as SearchLink } from './preact/SearchModal/components/SearchLin
 export { default as SearchHeading } from './preact/SearchModal/components/SearchHeading/SearchHeading';
 export { default as SearchToggle } from './preact/SearchModal/components/SearchToggle/SearchToggle';
 export { default as SearchModal } from './preact/SearchModal/components/SearchModal/SearchModal';
+export { default as DropZone } from './preact/DropZone/DropZone';
+export { AnonymousDropClient, deployFiles, readDataTransfer, readFileList, } from './preact/DropZone/drop-core';
+export type { DropClient, Deploy, Digest, DeployResult, DeployProgress, DeployPhase, ProcessedFile, } from './preact/DropZone/drop-core';
 export { type IconName } from './preact/Icon';

package/dist/components/preact/AskNetlify/AskNetlify.js

@@ -1,6 +1,6 @@
 import "../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
 import "../../../chunks/hooks.module.DRcxknIz.js";
-import { A as d } from "../../../chunks/AskNetlify.jaxhKBOK.js";
+import { A as d } from "../../../chunks/AskNetlify.B3RnU2w-.js";
 import "./components/QuestionList/questions.js";
 import "./components/QuestionList/QuestionList.js";
 import "./components/BackButton.js";

package/dist/components/preact/DropZone/DropZone.d.ts

@@ -0,0 +1,19 @@
+import { DropClient } from './drop-core';
+interface Props {
+    /** Override the API base (e.g. for a staging environment). */
+    apiBase?: string;
+    /** Inject a custom client (e.g. for testing). Defaults to AnonymousDropClient. */
+    client?: DropClient;
+    /** Build the "claim this site" URL from the assigned site name (subdomain). */
+    claimUrl?: (siteName: string) => string;
+    /** Called once the deploy is live. */
+    onDeploy?: (result: {
+        url: string;
+        token: string;
+        siteName: string;
+        siteId: string;
+    }) => void;
+    className?: string;
+}
+export default function DropZone({ apiBase, client, claimUrl, onDeploy, className, }: Props): import("preact").JSX.Element;
+export {};

package/dist/components/preact/DropZone/DropZone.js

@@ -0,0 +1,207 @@
+import { u as e } from "../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
+import { d as k, A as I } from "../../../chunks/hooks.module.DRcxknIz.js";
+import b from "../Icon/index.js";
+import { getSingleNonIndexHtmlFileName as $, hasMultipleHtmlFilesWithoutIndex as D, readDataTransfer as F, readFileList as T } from "./drop-core/readFiles.js";
+import { AnonymousDropClient as M } from "./drop-core/client.js";
+import { deployFiles as P } from "./drop-core/deploy.js";
+import { Fragment as p } from "preact";
+import '../../../assets/DropZone.css';const U = (n) => `https://app.netlify.com/drop/${n}/claim`;
+function A(n) {
+  switch (n.phase) {
+    case "creating":
+      return { kind: "creating" };
+    case "uploading":
+      return { kind: "uploading", uploaded: n.uploaded ?? 0, total: n.total ?? 0 };
+    case "processing":
+    case "ready":
+      return { kind: "processing" };
+  }
+}
+function Y({
+  apiBase: n,
+  client: h,
+  claimUrl: d = U,
+  onDeploy: s,
+  className: l
+}) {
+  const [o, t] = k({ kind: "idle" }), [w, c] = k(null), [C, g] = k(!1), x = I(h ?? new M(n)).current, f = o.kind !== "idle" && o.kind !== "done" && o.kind !== "error";
+  async function z(i) {
+    c(null), t({ kind: "reading" });
+    try {
+      const r = await i();
+      if (!r.length) {
+        t({ kind: "error", message: "No files found to deploy." });
+        return;
+      }
+      const y = $(r);
+      y ? c(`No index.html found — "${y}" won’t be served at the site root.`) : D(r) && c("No index.html found — your site may not have a landing page.");
+      const { url: v, token: m, deploy: a } = await P(x, r, {
+        onProgress: (S) => t(A(S))
+      });
+      try {
+        localStorage.setItem("drop-token", m), localStorage.setItem("dropSiteName", a.subdomain);
+      } catch {
+      }
+      t({ kind: "done", url: v, token: m, siteName: a.subdomain, siteId: a.id }), s == null || s({ url: v, token: m, siteName: a.subdomain, siteId: a.id });
+    } catch (r) {
+      t({ kind: "error", message: r instanceof Error ? r.message : String(r) });
+    }
+  }
+  function N() {
+    c(null), t({ kind: "idle" });
+  }
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      class: `n-dropzone${C ? " is-active" : ""}${f ? " is-busy" : ""}${l ? ` ${l}` : ""}`,
+      "data-state": o.kind,
+      onDragOver: (i) => {
+        f || (i.preventDefault(), g(!0));
+      },
+      onDragLeave: (i) => {
+        i.currentTarget === i.target && g(!1);
+      },
+      onDrop: (i) => {
+        if (i.preventDefault(), g(!1), f) return;
+        const r = i.dataTransfer;
+        r && z(() => F(r));
+      },
+      children: [
+        /* @__PURE__ */ e("div", { class: "n-dropzone-panel", children: /* @__PURE__ */ e(B, { status: o, claimUrl: d, onReset: N, onFiles: z }) }, o.kind),
+        w && o.kind !== "error" && /* @__PURE__ */ e("p", { class: "n-dropzone-warning n-fadeIn", role: "status", children: [
+          /* @__PURE__ */ e(b, { name: "lightbulb", className: "n-dropzone-warning-icon" }),
+          w
+        ] })
+      ]
+    }
+  );
+}
+function B({
+  status: n,
+  claimUrl: h,
+  onReset: d,
+  onFiles: s
+}) {
+  switch (n.kind) {
+    case "idle":
+      return /* @__PURE__ */ e(p, { children: [
+        /* @__PURE__ */ e(L, {}),
+        /* @__PURE__ */ e("p", { class: "n-dropzone-title", children: "Drag & drop your site folder or zip" }),
+        /* @__PURE__ */ e("p", { class: "n-dropzone-subtitle", children: "Deploys instantly to a live URL — no account needed." }),
+        /* @__PURE__ */ e("label", { class: "n-dropzone-browse", children: [
+          "Browse files",
+          /* @__PURE__ */ e(
+            "input",
+            {
+              type: "file",
+              hidden: !0,
+              multiple: !0,
+              webkitdirectory: "",
+              directory: "",
+              onChange: (l) => {
+                var t;
+                const o = l.currentTarget;
+                (t = o.files) != null && t.length && s(() => T(o.files));
+              }
+            }
+          )
+        ] })
+      ] });
+    case "reading":
+      return /* @__PURE__ */ e(u, { label: "Reading files…" });
+    case "creating":
+      return /* @__PURE__ */ e(u, { label: "Creating deploy…" });
+    case "processing":
+      return /* @__PURE__ */ e(u, { label: "Processing — almost live…" });
+    case "uploading": {
+      const l = n.total ? Math.round(n.uploaded / n.total * 100) : 0;
+      return /* @__PURE__ */ e(p, { children: [
+        /* @__PURE__ */ e(u, { label: `Uploading ${n.uploaded}/${n.total} files…` }),
+        /* @__PURE__ */ e("div", { class: "n-dropzone-progress", role: "progressbar", "aria-valuenow": l, children: /* @__PURE__ */ e("div", { class: "n-dropzone-progress-bar", style: { width: `${l}%` } }) })
+      ] });
+    }
+    case "done":
+      return /* @__PURE__ */ e(p, { children: [
+        /* @__PURE__ */ e(j, {}),
+        /* @__PURE__ */ e("p", { class: "n-dropzone-title", children: "Your site is live!" }),
+        /* @__PURE__ */ e("a", { class: "n-dropzone-link", href: n.url, target: "_blank", rel: "noopener noreferrer", children: [
+          n.url.replace(/^https?:\/\//, ""),
+          /* @__PURE__ */ e(b, { name: "link", className: "n-dropzone-link-icon" })
+        ] }),
+        /* @__PURE__ */ e("div", { class: "n-dropzone-actions", children: [
+          /* @__PURE__ */ e("a", { class: "n-dropzone-browse", href: h(n.siteName), children: "Claim this site" }),
+          /* @__PURE__ */ e("button", { type: "button", class: "n-dropzone-reset", onClick: d, children: "Deploy another" })
+        ] })
+      ] });
+    case "error":
+      return /* @__PURE__ */ e(p, { children: [
+        /* @__PURE__ */ e("p", { class: "n-dropzone-title n-dropzone-title--error", children: "Something went wrong" }),
+        /* @__PURE__ */ e("p", { class: "n-dropzone-subtitle", role: "alert", children: n.message }),
+        /* @__PURE__ */ e("button", { type: "button", class: "n-dropzone-browse", onClick: d, children: "Try again" })
+      ] });
+  }
+}
+function u({ label: n }) {
+  return /* @__PURE__ */ e("div", { class: "n-dropzone-loading", children: [
+    /* @__PURE__ */ e("span", { class: "n-dropzone-spinner", "aria-hidden": "true" }),
+    /* @__PURE__ */ e("p", { class: "n-dropzone-subtitle", "aria-live": "polite", children: [
+      n,
+      " ",
+      /* @__PURE__ */ e("span", { class: "n-dropzone-nudge", children: "Please don’t refresh." })
+    ] })
+  ] });
+}
+function L() {
+  return /* @__PURE__ */ e("span", { class: "n-dropzone-glyph", "aria-hidden": "true", children: /* @__PURE__ */ e("svg", { viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ e(
+      "path",
+      {
+        class: "n-dropzone-glyph-tray",
+        d: "M8 30v6a4 4 0 0 0 4 4h24a4 4 0 0 0 4-4v-6",
+        stroke: "currentColor",
+        "stroke-width": "3",
+        "stroke-linecap": "round"
+      }
+    ),
+    /* @__PURE__ */ e(
+      "path",
+      {
+        class: "n-dropzone-glyph-arrow",
+        d: "M24 32V10m0 0-8 8m8-8 8 8",
+        stroke: "currentColor",
+        "stroke-width": "3",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      }
+    )
+  ] }) });
+}
+function j() {
+  return /* @__PURE__ */ e("span", { class: "n-dropzone-glyph n-dropzone-glyph--success", "aria-hidden": "true", children: /* @__PURE__ */ e("svg", { viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ e(
+      "circle",
+      {
+        class: "n-dropzone-check-ring",
+        cx: "24",
+        cy: "24",
+        r: "20",
+        stroke: "currentColor",
+        "stroke-width": "3"
+      }
+    ),
+    /* @__PURE__ */ e(
+      "path",
+      {
+        class: "n-dropzone-check-mark",
+        d: "M15 24.5 21 30.5 33 18",
+        stroke: "currentColor",
+        "stroke-width": "3",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      }
+    )
+  ] }) });
+}
+export {
+  Y as default
+};

package/dist/components/preact/DropZone/drop-core/client.d.ts

@@ -0,0 +1,19 @@
+import { Deploy, Digest } from './types';
+export interface DropClient {
+    getToken(): Promise<string>;
+    createDeploy(digest: Digest, token: string): Promise<Deploy>;
+    uploadFile(deployId: string, path: string, content: ArrayBuffer, token: string): Promise<void>;
+    waitUntilReady(deploy: Deploy, token: string): Promise<void>;
+}
+/**
+ * Unauthenticated drop client. Authorized server-side by the Referer header,
+ * so it only works from an allowlisted origin (see backend checklist).
+ */
+export declare class AnonymousDropClient implements DropClient {
+    private apiBase;
+    constructor(apiBase?: string);
+    getToken(): Promise<string>;
+    createDeploy(files: Digest, token: string): Promise<Deploy>;
+    uploadFile(deployId: string, path: string, content: ArrayBuffer, token: string): Promise<void>;
+    waitUntilReady(deploy: Deploy, token: string): Promise<void>;
+}

package/dist/components/preact/DropZone/drop-core/client.js

@@ -0,0 +1,41 @@
+const i = "https://api.netlify.com/api/v1";
+class n {
+  constructor(e = i) {
+    this.apiBase = e;
+  }
+  async getToken() {
+    const e = await fetch(`${this.apiBase}/drop/token`, { method: "POST" });
+    if (!e.ok) throw new Error(`drop/token failed: ${e.status}`);
+    return (await e.json()).token;
+  }
+  async createDeploy(e, o) {
+    const t = await fetch(`${this.apiBase}/drop`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ files: e, token: o })
+    });
+    if (!t.ok) throw new Error(`drop failed: ${t.status}`);
+    return t.json();
+  }
+  async uploadFile(e, o, t, a) {
+    const r = await fetch(`${this.apiBase}/deploys/${e}/files${o}`, {
+      method: "PUT",
+      headers: { "Content-Type": "application/octet-stream", Authorization: `Bearer ${a}` },
+      body: t
+    });
+    if (!r.ok) throw new Error(`upload ${o} failed: ${r.status}`);
+  }
+  async waitUntilReady(e, o) {
+    for (let t = 0; t < 600; t++) {
+      const a = await fetch(`${this.apiBase}/deploys/${e.id}`, {
+        headers: { Authorization: `Bearer ${o}` }
+      });
+      if (a.ok && (await a.json()).state === "ready") return;
+      await new Promise((r) => setTimeout(r, 1e3));
+    }
+    throw new Error("Deploy did not become ready in time");
+  }
+}
+export {
+  n as AnonymousDropClient
+};

package/dist/components/preact/DropZone/drop-core/deploy.d.ts

@@ -0,0 +1,6 @@
+import { DropClient } from './client';
+import { DeployProgress, DeployResult, ProcessedFile } from './types';
+export interface DeployOptions {
+    onProgress?: (e: DeployProgress) => void;
+}
+export declare function deployFiles(client: DropClient, files: ProcessedFile[], opts?: DeployOptions): Promise<DeployResult>;

package/dist/components/preact/DropZone/drop-core/deploy.js

@@ -0,0 +1,30 @@
+import { getDigest as w, getShas as y } from "./digest.js";
+const r = 5;
+async function d(e, h, u, t, i, a) {
+  const n = u.filter((p) => t.has(p.sha));
+  let l = 0, c = 0;
+  const o = async () => {
+    for (; l < n.length; ) {
+      const p = n[l++];
+      await e.uploadFile(h, p.path, p.content, i), a == null || a(++c);
+    }
+  };
+  await Promise.all(Array.from({ length: Math.min(r, n.length) }, o));
+}
+async function f(e, h, u = {}) {
+  if (!h.length) throw new Error("No files to deploy");
+  const { onProgress: t } = u;
+  t == null || t({ phase: "creating" });
+  const i = await e.getToken(), a = await e.createDeploy(w(h), i), n = a.required.length;
+  return t == null || t({ phase: "uploading", uploaded: 0, total: n }), await d(
+    e,
+    a.id,
+    h,
+    y(a.required),
+    i,
+    (l) => t == null ? void 0 : t({ phase: "uploading", uploaded: l, total: n })
+  ), t == null || t({ phase: "processing" }), await e.waitUntilReady(a, i), t == null || t({ phase: "ready" }), { deploy: a, token: i, url: `https://${a.subdomain}.netlify.app` };
+}
+export {
+  f as deployFiles
+};

package/dist/components/preact/DropZone/drop-core/digest.d.ts

@@ -0,0 +1,3 @@
+import { Digest, ProcessedFile } from './types';
+export declare function getDigest(files: ProcessedFile[]): Digest;
+export declare function getShas(required: string[]): Set<string>;

package/dist/components/preact/DropZone/drop-core/digest.js

@@ -0,0 +1,12 @@
+function o(t) {
+  const e = {};
+  for (const n of t) e[n.path] = n.sha;
+  return e;
+}
+function r(t) {
+  return new Set(t);
+}
+export {
+  o as getDigest,
+  r as getShas
+};

package/dist/components/preact/DropZone/drop-core/index.d.ts

@@ -0,0 +1,5 @@
+export * from './types';
+export * from './digest';
+export * from './readFiles';
+export * from './client';
+export * from './deploy';

package/dist/components/preact/DropZone/drop-core/index.js

@@ -0,0 +1,16 @@
+import { getDigest as o, getShas as r } from "./digest.js";
+import { getSingleNonIndexHtmlFileName as l, hasMultipleHtmlFilesWithoutIndex as a, normalizeFiles as m, readDataTransfer as n, readFileList as s, readZip as p } from "./readFiles.js";
+import { AnonymousDropClient as x } from "./client.js";
+import { deployFiles as g } from "./deploy.js";
+export {
+  x as AnonymousDropClient,
+  g as deployFiles,
+  o as getDigest,
+  r as getShas,
+  l as getSingleNonIndexHtmlFileName,
+  a as hasMultipleHtmlFilesWithoutIndex,
+  m as normalizeFiles,
+  n as readDataTransfer,
+  s as readFileList,
+  p as readZip
+};

package/dist/components/preact/DropZone/drop-core/readFiles.d.ts

@@ -0,0 +1,15 @@
+import { ProcessedFile } from './types';
+/**
+ * Read a DataTransfer from a drop event into ProcessedFiles.
+ *
+ * NOTE: `webkitGetAsEntry()` must be called synchronously inside the drop
+ * handler — the DataTransfer is detached once the event turn ends. The
+ * component captures entries first (see `readDroppedEntries`) then calls the
+ * async readers, so this function is safe to `await`.
+ */
+export declare function readDataTransfer(dt: DataTransfer): Promise<ProcessedFile[]>;
+export declare function readFileList(files: FileList): Promise<ProcessedFile[]>;
+export declare function readZip(zip: File): Promise<ProcessedFile[]>;
+export declare function normalizeFiles(files: ProcessedFile[]): ProcessedFile[];
+export declare function getSingleNonIndexHtmlFileName(files: ProcessedFile[]): string | null;
+export declare function hasMultipleHtmlFilesWithoutIndex(files: ProcessedFile[]): boolean;