Spa.astro

---
import buildScript from "./script.js";
import { minify } from "./terser.js";

export interface scrollIntoViewOptions {
  behavior?: "smooth" | "auto";
  block?: "start" | "center" | "end" | "nearest";
  inline?: "start" | "center" | "end" | "nearest";
}

export interface IntersectionObserverInit {
  root?: string;
  rootMargin?: string;
  threshold?: number | number[];
}

export interface progressBarOptions {
  height?: string;
  secondary?: boolean;
  colors?: {
    foreground?: string;
    background?: string;
  };
}

export interface analytics {
  trackingID: string;
  anonymizeIP?: boolean;
  colorDepth?: boolean;
  characterSet?: boolean;
  screenSize?: boolean;
  language?: boolean;
  fingerprinting?: boolean;
  trackingPeriod?: "year" | "month" | "day";
}

export interface Props {
  analytics?: analytics;
  attributes?: Partial<HTMLScriptElement>;
  cache?: boolean;
  containerSelector?: string;
  defaultAnimation?: boolean;
  delay?: number;
  external?: boolean;
  forceRequestIdleCallback?: boolean;
  highPriorityPrefetch?: boolean;
  ignores?: string[];
  intersectionObserverOptions?: IntersectionObserverInit;
  limit?: number;
  localLinkDetector?: boolean;
  prefetch?: boolean;
  prefetchUpgradation?: boolean;
  progressBar?: boolean;
  progressBarOptions?: progressBarOptions;
  scanOnMount?: boolean;
  scrollIntoView?: boolean;
  scrollIntoViewOptions?: boolean | scrollIntoViewOptions;
  timeout?: number | false;
}

const {
  analytics,
  attributes,
  cache = true,
  containerSelector = "",
  defaultAnimation = true,
  delay = 500,
  external = false,
  forceRequestIdleCallback = false,
  highPriorityPrefetch = false,
  ignores = [],
  intersectionObserverOptions,
  limit = 0,
  localLinkDetector = true,
  prefetch = true,
  prefetchUpgradation = true,
  progressBar = true,
  progressBarOptions,
  scanOnMount = true,
  scrollIntoView = true,
  scrollIntoViewOptions = { block: "start", behavior: "smooth" },
  timeout = 2000,
} = Astro.props as Props;

const scriptContent = buildScript(
  analytics,
  cache,
  containerSelector,
  defaultAnimation,
  delay,
  forceRequestIdleCallback,
  highPriorityPrefetch,
  ignores,
  intersectionObserverOptions,
  limit,
  localLinkDetector,
  prefetch,
  prefetchUpgradation,
  progressBar,
  progressBarOptions,
  scanOnMount,
  scrollIntoView,
  scrollIntoViewOptions,
  timeout
);

const { code } = await minify(scriptContent);

//path will not be used unless external is true
let path = "";

if (external) {
  import("node:crypto")
    .then((crypto) => {
      path = `public/astro-spa-${crypto
        .createHash("sha256")
        .update(code)
        .digest("hex")
        .slice(0, 8)}.js`;
    })
    .catch((err) => {
      console.error(
        "Node API Crypto is not available. The script will now inline. This is equal to the option 'external: false'."
      );
    });

  import("node:fs")
    .then((fs) => {
      fs.existsSync("public") || fs.mkdirSync("public");
      (fs.existsSync(path) && fs.readFileSync(path, "utf8") === code) ||
        fs.writeFileSync(path, code);
    })
    .catch((err) => {
      console.error(
        "Node API fs is not available. The script will now inline. This is equal to the option 'external: false'."
      );
    });
}

const Tag = "script";
---

<Tag {...attributes} src={external && path.substring(6)} set:html={code} />