bun-plugin-stx 0.0.0

package/dist/client.d.ts

@@ -0,0 +1,42 @@
+export declare const version: unknown;
+export declare interface HydrationConfig {
+  autoStart?: boolean
+  preload?: 'none' | 'eager' | 'lazy'
+}
+export declare type IslandHandlers = Record<string, () => Promise<any>>
+
+export type HydrationFunction = (element: HTMLElement, props: any) => void | Promise<void>
+
+const isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined'
+
+async function hydrateIsland(
+  element: HTMLElement,
+  name: string,
+  handler: () => Promise<any>,
+): Promise<void> {
+  if (!isBrowser) return
+
+  try {
+    const id = element.getAttribute('data-island-id')
+    const propsScript = document.querySelector(`script[data-island-props="${id}"]`) as HTMLScriptElement
+    const props = propsScript ? JSON.parse(propsScript.textContent || '{}') : {}
+
+    const module = await handler()
+    const hydrateFn: HydrationFunction = module.default || module.hydrate
+
+    if (typeof hydrateFn !== 'function') {
+      console.error(`Island handler for "${name}" does not export a valid hydration function`)
+      return
+    }
+
+    await hydrateFn(element, props)
+
+    element.setAttribute('data-hydrated', 'true')
+  }
+  catch (error) {
+    console.error(`Failed to hydrate island "${name}":`, error)
+  }
+}
+export declare function hydrateIslands(handlers: IslandHandlers): void;
+export declare function preloadIslandHandlers(handlers: IslandHandlers): void;
+export declare function initIslands(handlers: IslandHandlers, config: HydrationConfig = {}): void;

package/dist/client.js

@@ -0,0 +1,144 @@
+// @bun
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __toESM = (mod, isNodeMode, target) => {
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: () => mod[key],
+        enumerable: true
+      });
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, {
+      get: all[name],
+      enumerable: true,
+      configurable: true,
+      set: (newValue) => all[name] = () => newValue
+    });
+};
+var __esm = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
+var __require = import.meta.require;
+
+// src/client.ts
+var version = "1.0.0";
+var isBrowser = typeof window !== "undefined" && typeof document !== "undefined";
+async function hydrateIsland(element, name, handler) {
+  if (!isBrowser)
+    return;
+  try {
+    const id = element.getAttribute("data-island-id");
+    const propsScript = document.querySelector(`script[data-island-props="${id}"]`);
+    const props = propsScript ? JSON.parse(propsScript.textContent || "{}") : {};
+    const module = await handler();
+    const hydrateFn = module.default || module.hydrate;
+    if (typeof hydrateFn !== "function") {
+      console.error(`Island handler for "${name}" does not export a valid hydration function`);
+      return;
+    }
+    await hydrateFn(element, props);
+    element.setAttribute("data-hydrated", "true");
+  } catch (error) {
+    console.error(`Failed to hydrate island "${name}":`, error);
+  }
+}
+function hydrateIslands(handlers) {
+  if (!isBrowser)
+    return;
+  const islands = document.querySelectorAll("[data-island]");
+  const lazyIslands = [];
+  islands.forEach((island) => {
+    const name = island.getAttribute("data-island");
+    const priority = island.getAttribute("data-priority") || "lazy";
+    if (!name || !handlers[name] || island.getAttribute("data-hydrated") === "true") {
+      return;
+    }
+    if (priority === "eager") {
+      hydrateIsland(island, name, handlers[name]);
+    } else {
+      lazyIslands.push([island, name]);
+    }
+  });
+  if (lazyIslands.length > 0 && "IntersectionObserver" in window) {
+    const observer = new IntersectionObserver((entries) => {
+      entries.forEach((entry) => {
+        if (entry.isIntersecting) {
+          const element = entry.target;
+          const name = element.getAttribute("data-island");
+          if (name && handlers[name] && element.getAttribute("data-hydrated") !== "true") {
+            hydrateIsland(element, name, handlers[name]);
+            observer.unobserve(element);
+          }
+        }
+      });
+    }, {
+      rootMargin: "200px",
+      threshold: 0
+    });
+    lazyIslands.forEach(([element]) => {
+      observer.observe(element);
+    });
+  } else {
+    setTimeout(() => {
+      lazyIslands.forEach(([element, name]) => {
+        if (element.getAttribute("data-hydrated") !== "true") {
+          hydrateIsland(element, name, handlers[name]);
+        }
+      });
+    }, 1000);
+  }
+}
+function preloadIslandHandlers(handlers) {
+  if (!isBrowser)
+    return;
+  Object.entries(handlers).forEach(([name, getHandler]) => {
+    try {
+      const handlerString = getHandler.toString();
+      const moduleMatch = handlerString.match(/import\(['"](.+)['"]\)/);
+      if (moduleMatch && moduleMatch[1]) {
+        const link = document.createElement("link");
+        link.rel = "modulepreload";
+        link.href = moduleMatch[1];
+        link.setAttribute("data-island-module", name);
+        document.head.appendChild(link);
+      }
+    } catch (error) {
+      console.warn(`Failed to preload island handler for "${name}":`, error);
+    }
+  });
+}
+function initIslands(handlers, config = {}) {
+  if (!isBrowser)
+    return;
+  const defaultConfig = {
+    autoStart: true,
+    preload: "lazy"
+  };
+  const options = { ...defaultConfig, ...config };
+  if (options.preload !== "none") {
+    preloadIslandHandlers(handlers);
+  }
+  if (options.autoStart) {
+    if (document.readyState === "loading") {
+      document.addEventListener("DOMContentLoaded", () => {
+        hydrateIslands(handlers);
+      });
+    } else {
+      hydrateIslands(handlers);
+    }
+  }
+}
+export {
+  version,
+  preloadIslandHandlers,
+  initIslands,
+  hydrateIslands
+};

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+import type { BunPlugin } from 'bun';
+
+export declare let plugin: BunPlugin;
+
+export default plugin;