sibujs 1.1.0 → 1.3.0

package/dist/browser.cjs

@@ -20,21 +20,42 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // browser.ts
 var browser_exports = {};
 __export(browser_exports, {
+  animationFrame: () => animationFrame,
   battery: () => battery,
+  bounds: () => bounds,
+  broadcast: () => broadcast,
   clipboard: () => clipboard,
   colorScheme: () => colorScheme,
   draggable: () => draggable,
   dropZone: () => dropZone,
+  favicon: () => favicon,
   formatCurrency: () => formatCurrency,
   formatNumber: () => formatNumber,
+  fullscreen: () => fullscreen,
+  gamepad: () => gamepad,
   geo: () => geo,
   idle: () => idle,
+  imageLoader: () => imageLoader,
+  keyboard: () => keyboard,
   media: () => media,
+  mouse: () => mouse,
+  mutationObserver: () => mutationObserver,
+  network: () => network,
   online: () => online,
   permissions: () => permissions,
+  pointerLock: () => pointerLock,
   resize: () => resize,
   scroll: () => scroll,
-  title: () => title
+  speech: () => speech,
+  svgFavicon: () => svgFavicon,
+  swipe: () => swipe,
+  textSelection: () => textSelection,
+  title: () => title,
+  urlState: () => urlState,
+  vibrate: () => vibrate,
+  visibility: () => visibility,
+  wakeLock: () => wakeLock,
+  windowSize: () => windowSize
 });
 module.exports = __toCommonJS(browser_exports);
 
@@ -843,21 +864,802 @@ function formatCurrency(value, currency, options) {
     ...formatOptions
   }).format(value);
 }
+
+// src/browser/visibility.ts
+function visibility() {
+  if (typeof document === "undefined") {
+    const [visible2] = signal(true);
+    return { visible: visible2, dispose: () => {
+    } };
+  }
+  const [visible, setVisible] = signal(!document.hidden);
+  const handler = () => setVisible(!document.hidden);
+  document.addEventListener("visibilitychange", handler);
+  function dispose() {
+    document.removeEventListener("visibilitychange", handler);
+  }
+  return { visible, dispose };
+}
+
+// src/browser/network.ts
+function network() {
+  const connection = typeof navigator !== "undefined" ? navigator.connection ?? navigator.mozConnection ?? navigator.webkitConnection : void 0;
+  const [effectiveType, setEffectiveType] = signal(connection?.effectiveType ?? "unknown");
+  const [downlink, setDownlink] = signal(connection?.downlink ?? 0);
+  const [rtt, setRtt] = signal(connection?.rtt ?? 0);
+  const [saveData, setSaveData] = signal(connection?.saveData ?? false);
+  if (!connection) {
+    return { effectiveType, downlink, rtt, saveData, dispose: () => {
+    } };
+  }
+  const update = () => {
+    setEffectiveType(connection.effectiveType ?? "unknown");
+    setDownlink(connection.downlink ?? 0);
+    setRtt(connection.rtt ?? 0);
+    setSaveData(connection.saveData ?? false);
+  };
+  connection.addEventListener("change", update);
+  function dispose() {
+    connection?.removeEventListener("change", update);
+  }
+  return { effectiveType, downlink, rtt, saveData, dispose };
+}
+
+// src/browser/mouse.ts
+function mouse(options = {}) {
+  const [x, setX] = signal(0);
+  const [y, setY] = signal(0);
+  if (typeof window === "undefined") {
+    return { x, y, dispose: () => {
+    } };
+  }
+  const target = options.target ?? window;
+  const trackTouch = options.touch ?? true;
+  const onMove = (e) => {
+    setX(e.clientX);
+    setY(e.clientY);
+  };
+  const onTouchMove = (e) => {
+    if (e.touches.length === 0) return;
+    setX(e.touches[0].clientX);
+    setY(e.touches[0].clientY);
+  };
+  target.addEventListener("mousemove", onMove, { passive: true });
+  if (trackTouch) {
+    target.addEventListener("touchmove", onTouchMove, { passive: true });
+  }
+  function dispose() {
+    target.removeEventListener("mousemove", onMove);
+    if (trackTouch) {
+      target.removeEventListener("touchmove", onTouchMove);
+    }
+  }
+  return { x, y, dispose };
+}
+
+// src/browser/swipe.ts
+function swipe(target, options = {}) {
+  const threshold = options.threshold ?? 50;
+  const [direction, setDirection] = signal(null);
+  if (typeof window === "undefined") {
+    return { direction, dispose: () => {
+    } };
+  }
+  let startX = 0;
+  let startY = 0;
+  let tracking = false;
+  const onStart = (e) => {
+    if (e.touches.length === 0) return;
+    startX = e.touches[0].clientX;
+    startY = e.touches[0].clientY;
+    tracking = true;
+  };
+  const onEnd = (e) => {
+    if (!tracking) return;
+    tracking = false;
+    const touch = e.changedTouches[0];
+    if (!touch) return;
+    const dx = touch.clientX - startX;
+    const dy = touch.clientY - startY;
+    const absX = Math.abs(dx);
+    const absY = Math.abs(dy);
+    if (Math.max(absX, absY) < threshold) return;
+    let dir;
+    if (absX > absY) {
+      dir = dx > 0 ? "right" : "left";
+    } else {
+      dir = dy > 0 ? "down" : "up";
+    }
+    setDirection(dir);
+    options.onSwipe?.(dir, Math.max(absX, absY));
+  };
+  target.addEventListener("touchstart", onStart, { passive: true });
+  target.addEventListener("touchend", onEnd, { passive: true });
+  function dispose() {
+    target.removeEventListener("touchstart", onStart);
+    target.removeEventListener("touchend", onEnd);
+  }
+  return { direction, dispose };
+}
+
+// src/browser/windowSize.ts
+function windowSize() {
+  if (typeof window === "undefined") {
+    const [width2] = signal(0);
+    const [height2] = signal(0);
+    return { width: width2, height: height2, dispose: () => {
+    } };
+  }
+  const [width, setWidth] = signal(window.innerWidth);
+  const [height, setHeight] = signal(window.innerHeight);
+  const handler = () => {
+    setWidth(window.innerWidth);
+    setHeight(window.innerHeight);
+  };
+  window.addEventListener("resize", handler, { passive: true });
+  function dispose() {
+    window.removeEventListener("resize", handler);
+  }
+  return { width, height, dispose };
+}
+
+// src/browser/urlState.ts
+function urlState() {
+  if (typeof window === "undefined") {
+    const [params2] = signal(new URLSearchParams());
+    const [hash2] = signal("");
+    return {
+      params: params2,
+      hash: hash2,
+      setParams: () => {
+      },
+      setHash: () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  const [params, setParamsSignal] = signal(new URLSearchParams(window.location.search));
+  const [hash, setHashSignal] = signal(window.location.hash);
+  const syncFromLocation = () => {
+    setParamsSignal(new URLSearchParams(window.location.search));
+    setHashSignal(window.location.hash);
+  };
+  const onPopState = () => syncFromLocation();
+  window.addEventListener("popstate", onPopState);
+  function setParams(next, opts = {}) {
+    const p = next instanceof URLSearchParams ? next : new URLSearchParams(next);
+    const query = p.toString();
+    const newUrl = `${window.location.pathname}${query ? `?${query}` : ""}${window.location.hash}`;
+    if (opts.replace) window.history.replaceState(null, "", newUrl);
+    else window.history.pushState(null, "", newUrl);
+    setParamsSignal(new URLSearchParams(p));
+  }
+  function setHash(next, opts = {}) {
+    const normalized = next.startsWith("#") ? next : next ? `#${next}` : "";
+    const newUrl = `${window.location.pathname}${window.location.search}${normalized}`;
+    if (opts.replace) window.history.replaceState(null, "", newUrl);
+    else window.history.pushState(null, "", newUrl);
+    setHashSignal(normalized);
+  }
+  function dispose() {
+    window.removeEventListener("popstate", onPopState);
+  }
+  return { params, hash, setParams, setHash, dispose };
+}
+
+// src/browser/broadcast.ts
+function broadcast(channelName) {
+  if (typeof BroadcastChannel === "undefined") {
+    const [last2] = signal(null);
+    return { last: last2, post: () => {
+    }, dispose: () => {
+    } };
+  }
+  const [last, setLast] = signal(null);
+  const channel = new BroadcastChannel(channelName);
+  const handler = (ev) => setLast(ev.data);
+  channel.addEventListener("message", handler);
+  function post(message) {
+    channel.postMessage(message);
+  }
+  function dispose() {
+    channel.removeEventListener("message", handler);
+    channel.close();
+  }
+  return { last, post, dispose };
+}
+
+// src/browser/fullscreen.ts
+function fullscreen() {
+  if (typeof document === "undefined") {
+    const [isFullscreen2] = signal(false);
+    const [element2] = signal(null);
+    return {
+      isFullscreen: isFullscreen2,
+      element: element2,
+      enter: async () => {
+      },
+      exit: async () => {
+      },
+      toggle: async () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  const [isFullscreen, setIsFullscreen] = signal(!!document.fullscreenElement);
+  const [element, setElement] = signal(document.fullscreenElement);
+  const handler = () => {
+    setIsFullscreen(!!document.fullscreenElement);
+    setElement(document.fullscreenElement);
+  };
+  document.addEventListener("fullscreenchange", handler);
+  async function enter(el) {
+    if (!document.fullscreenElement && el.requestFullscreen) {
+      await el.requestFullscreen();
+    }
+  }
+  async function exit() {
+    if (document.fullscreenElement && document.exitFullscreen) {
+      await document.exitFullscreen();
+    }
+  }
+  async function toggle(el) {
+    if (document.fullscreenElement) await exit();
+    else await enter(el);
+  }
+  function dispose() {
+    document.removeEventListener("fullscreenchange", handler);
+  }
+  return { isFullscreen, element, enter, exit, toggle, dispose };
+}
+
+// src/browser/wakeLock.ts
+function wakeLock() {
+  const [active, setActive] = signal(false);
+  if (typeof navigator === "undefined" || !("wakeLock" in navigator) || typeof document === "undefined") {
+    return {
+      active,
+      request: async () => {
+      },
+      release: async () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  const api = navigator.wakeLock;
+  let sentinel = null;
+  async function request() {
+    try {
+      sentinel = await api.request("screen");
+      setActive(true);
+      sentinel.addEventListener("release", () => {
+        setActive(false);
+      });
+    } catch {
+      setActive(false);
+    }
+  }
+  async function release() {
+    if (sentinel && !sentinel.released) {
+      await sentinel.release();
+    }
+    sentinel = null;
+    setActive(false);
+  }
+  const onVisibility = () => {
+    if (sentinel?.released && !document.hidden) {
+      void request();
+    }
+  };
+  document.addEventListener("visibilitychange", onVisibility);
+  function dispose() {
+    document.removeEventListener("visibilitychange", onVisibility);
+    void release();
+  }
+  return { active, request, release, dispose };
+}
+
+// src/browser/animationFrame.ts
+function animationFrame(options = {}) {
+  const [delta, setDelta] = signal(0);
+  const [elapsed, setElapsed] = signal(0);
+  const [running, setRunning] = signal(false);
+  if (typeof requestAnimationFrame === "undefined") {
+    return {
+      delta,
+      elapsed,
+      running,
+      pause: () => {
+      },
+      resume: () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  let id = null;
+  let prev = -1;
+  let start = -1;
+  const minFrameMs = options.fpsLimit ? 1e3 / options.fpsLimit : 0;
+  const step = (now) => {
+    if (start < 0) start = now;
+    const firstTick = prev < 0;
+    const dt = firstTick ? 0 : now - prev;
+    if (firstTick || dt >= minFrameMs) {
+      setDelta(dt);
+      setElapsed(now - start);
+      prev = now;
+    }
+    id = requestAnimationFrame(step);
+  };
+  function resume() {
+    if (id !== null) return;
+    setRunning(true);
+    id = requestAnimationFrame(step);
+  }
+  function pause() {
+    if (id !== null) {
+      cancelAnimationFrame(id);
+      id = null;
+    }
+    setRunning(false);
+    prev = -1;
+    start = -1;
+  }
+  function dispose() {
+    pause();
+  }
+  if (options.immediate !== false) resume();
+  return { delta, elapsed, running, pause, resume, dispose };
+}
+
+// src/browser/mutationObserver.ts
+function mutationObserver(target, options = { childList: true, subtree: true }) {
+  const [records, setRecords] = signal([]);
+  if (typeof MutationObserver === "undefined") {
+    return { records, dispose: () => {
+    } };
+  }
+  const observer = new MutationObserver((batch2) => {
+    setRecords(batch2);
+  });
+  observer.observe(target, options);
+  function dispose() {
+    observer.disconnect();
+  }
+  return { records, dispose };
+}
+
+// src/browser/bounds.ts
+var ZERO = {
+  x: 0,
+  y: 0,
+  width: 0,
+  height: 0,
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0
+};
+function readRect(el) {
+  const r = el.getBoundingClientRect();
+  return {
+    x: r.x,
+    y: r.y,
+    width: r.width,
+    height: r.height,
+    top: r.top,
+    left: r.left,
+    right: r.right,
+    bottom: r.bottom
+  };
+}
+function bounds(target) {
+  const [rect, setRect] = signal(ZERO);
+  if (typeof window === "undefined" || !target) {
+    return {
+      rect,
+      refresh: () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  function refresh() {
+    setRect(readRect(target));
+  }
+  refresh();
+  let resizeObserver = null;
+  if (typeof ResizeObserver !== "undefined") {
+    resizeObserver = new ResizeObserver(refresh);
+    resizeObserver.observe(target);
+  }
+  const onScroll = () => refresh();
+  window.addEventListener("scroll", onScroll, { passive: true, capture: true });
+  function dispose() {
+    resizeObserver?.disconnect();
+    window.removeEventListener("scroll", onScroll, { capture: true });
+  }
+  return { rect, refresh, dispose };
+}
+
+// src/browser/keyboard.ts
+function keyboard(options = {}) {
+  const [pressed, setPressed] = signal(/* @__PURE__ */ new Set());
+  if (typeof window === "undefined") {
+    return {
+      pressed,
+      isPressed: () => false,
+      dispose: () => {
+      }
+    };
+  }
+  const target = options.target ?? window;
+  const filter = options.keys ? new Set(options.keys) : null;
+  const onDown = (e) => {
+    if (filter && !filter.has(e.key)) return;
+    setPressed((prev) => {
+      if (prev.has(e.key)) return prev;
+      const next = new Set(prev);
+      next.add(e.key);
+      return next;
+    });
+  };
+  const onUp = (e) => {
+    if (filter && !filter.has(e.key)) return;
+    setPressed((prev) => {
+      if (!prev.has(e.key)) return prev;
+      const next = new Set(prev);
+      next.delete(e.key);
+      return next;
+    });
+  };
+  const onBlur = () => setPressed(/* @__PURE__ */ new Set());
+  target.addEventListener("keydown", onDown);
+  target.addEventListener("keyup", onUp);
+  window.addEventListener("blur", onBlur);
+  function isPressed(key) {
+    return pressed().has(key);
+  }
+  function dispose() {
+    target.removeEventListener("keydown", onDown);
+    target.removeEventListener("keyup", onUp);
+    window.removeEventListener("blur", onBlur);
+  }
+  return { pressed, isPressed, dispose };
+}
+
+// src/browser/speech.ts
+function speech() {
+  const [speaking, setSpeaking] = signal(false);
+  const [paused, setPaused] = signal(false);
+  if (typeof window === "undefined" || typeof window.speechSynthesis === "undefined") {
+    return {
+      speaking,
+      paused,
+      speak: () => {
+      },
+      pause: () => {
+      },
+      resume: () => {
+      },
+      cancel: () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  const synth = window.speechSynthesis;
+  const interval = setInterval(() => {
+    setSpeaking(synth.speaking);
+    setPaused(synth.paused);
+  }, 200);
+  function speak(text, options = {}) {
+    const u = new SpeechSynthesisUtterance(text);
+    if (options.lang) u.lang = options.lang;
+    if (options.rate != null) u.rate = options.rate;
+    if (options.pitch != null) u.pitch = options.pitch;
+    if (options.volume != null) u.volume = options.volume;
+    if (options.voice) {
+      const voices = synth.getVoices();
+      const match = voices.find((v) => v.name === options.voice);
+      if (match) u.voice = match;
+    }
+    u.addEventListener("start", () => setSpeaking(true));
+    u.addEventListener("end", () => {
+      setSpeaking(false);
+      setPaused(false);
+    });
+    u.addEventListener("error", () => {
+      setSpeaking(false);
+      setPaused(false);
+    });
+    synth.speak(u);
+  }
+  function dispose() {
+    clearInterval(interval);
+    synth.cancel();
+  }
+  return {
+    speaking,
+    paused,
+    speak,
+    pause: () => synth.pause(),
+    resume: () => synth.resume(),
+    cancel: () => synth.cancel(),
+    dispose
+  };
+}
+
+// src/browser/gamepad.ts
+function gamepad() {
+  const [pads, setPads] = signal([]);
+  if (typeof window === "undefined" || typeof navigator === "undefined" || typeof navigator.getGamepads !== "function") {
+    return { pads, dispose: () => {
+    } };
+  }
+  let rafId = null;
+  function snapshot(pad) {
+    return {
+      index: pad.index,
+      id: pad.id,
+      connected: pad.connected,
+      buttons: pad.buttons.map((b) => ({ pressed: b.pressed, value: b.value })),
+      axes: [...pad.axes]
+    };
+  }
+  function equal(a, b) {
+    if (a.length !== b.length) return false;
+    for (let i = 0; i < a.length; i++) {
+      const pa = a[i];
+      const pb = b[i];
+      if (pa.index !== pb.index || pa.connected !== pb.connected) return false;
+      if (pa.buttons.length !== pb.buttons.length) return false;
+      for (let j = 0; j < pa.buttons.length; j++) {
+        if (pa.buttons[j].pressed !== pb.buttons[j].pressed) return false;
+        if (pa.buttons[j].value !== pb.buttons[j].value) return false;
+      }
+      if (pa.axes.length !== pb.axes.length) return false;
+      for (let j = 0; j < pa.axes.length; j++) {
+        if (pa.axes[j] !== pb.axes[j]) return false;
+      }
+    }
+    return true;
+  }
+  function poll() {
+    const raw = navigator.getGamepads();
+    const snap = Array.from(raw).filter((g) => g !== null).map(snapshot);
+    const current = pads();
+    if (!equal(current, snap)) setPads(snap);
+    rafId = requestAnimationFrame(poll);
+  }
+  function startPolling() {
+    if (rafId === null) poll();
+  }
+  function stopPolling() {
+    if (rafId !== null) {
+      cancelAnimationFrame(rafId);
+      rafId = null;
+    }
+  }
+  const onConnect = () => startPolling();
+  const onDisconnect = () => {
+    const raw = navigator.getGamepads();
+    const hasAny = Array.from(raw).some((g) => g !== null);
+    if (!hasAny) stopPolling();
+  };
+  window.addEventListener("gamepadconnected", onConnect);
+  window.addEventListener("gamepaddisconnected", onDisconnect);
+  const initial = Array.from(navigator.getGamepads()).some((g) => g !== null);
+  if (initial) startPolling();
+  function dispose() {
+    stopPolling();
+    window.removeEventListener("gamepadconnected", onConnect);
+    window.removeEventListener("gamepaddisconnected", onDisconnect);
+  }
+  return { pads, dispose };
+}
+
+// src/browser/pointerLock.ts
+function pointerLock() {
+  const [locked, setLocked] = signal(false);
+  if (typeof document === "undefined") {
+    return {
+      locked,
+      request: () => {
+      },
+      exit: () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  const handler = () => {
+    setLocked(!!document.pointerLockElement);
+  };
+  document.addEventListener("pointerlockchange", handler);
+  function request(element) {
+    if (typeof element.requestPointerLock === "function") {
+      element.requestPointerLock();
+    }
+  }
+  function exit() {
+    if (typeof document.exitPointerLock === "function") {
+      document.exitPointerLock();
+    }
+  }
+  function dispose() {
+    document.removeEventListener("pointerlockchange", handler);
+  }
+  return { locked, request, exit, dispose };
+}
+
+// src/browser/vibrate.ts
+function vibrate(pattern) {
+  if (typeof navigator === "undefined" || typeof navigator.vibrate !== "function") {
+    return false;
+  }
+  return navigator.vibrate(pattern);
+}
+
+// src/browser/favicon.ts
+function favicon(url) {
+  if (typeof document === "undefined") return;
+  let link = document.querySelector("link[rel='icon']");
+  if (!link) {
+    link = document.createElement("link");
+    link.rel = "icon";
+    document.head.appendChild(link);
+  }
+  link.href = url;
+}
+function svgFavicon(svg) {
+  return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
+}
+
+// src/browser/textSelection.ts
+function textSelection() {
+  const [text, setText] = signal("");
+  const [rect, setRect] = signal(null);
+  if (typeof document === "undefined") {
+    return {
+      text,
+      rect,
+      hasSelection: () => false,
+      clear: () => {
+      },
+      dispose: () => {
+      }
+    };
+  }
+  const handler = () => {
+    const sel = document.getSelection();
+    if (!sel || sel.rangeCount === 0 || sel.isCollapsed) {
+      setText("");
+      setRect(null);
+      return;
+    }
+    setText(sel.toString());
+    try {
+      const r = sel.getRangeAt(0).getBoundingClientRect();
+      setRect(r.width > 0 || r.height > 0 ? r : null);
+    } catch {
+      setRect(null);
+    }
+  };
+  document.addEventListener("selectionchange", handler);
+  function clear() {
+    const sel = document.getSelection();
+    sel?.removeAllRanges();
+    setText("");
+    setRect(null);
+  }
+  function dispose() {
+    document.removeEventListener("selectionchange", handler);
+  }
+  return {
+    text,
+    rect,
+    hasSelection: () => text().length > 0,
+    clear,
+    dispose
+  };
+}
+
+// src/browser/imageLoader.ts
+function imageLoader(src) {
+  const [status, setStatus] = signal("pending");
+  const [image, setImage] = signal(null);
+  const [width, setWidth] = signal(0);
+  const [height, setHeight] = signal(0);
+  if (typeof Image === "undefined") {
+    return {
+      status,
+      image,
+      width,
+      height,
+      dispose: () => {
+      }
+    };
+  }
+  let current = null;
+  let disposed = false;
+  function start(url) {
+    if (current) {
+      current.onload = null;
+      current.onerror = null;
+    }
+    setStatus("pending");
+    setImage(null);
+    const img = new Image();
+    current = img;
+    img.onload = () => {
+      if (disposed || current !== img) return;
+      setImage(img);
+      setWidth(img.naturalWidth);
+      setHeight(img.naturalHeight);
+      setStatus("loaded");
+    };
+    img.onerror = () => {
+      if (disposed || current !== img) return;
+      setStatus("error");
+    };
+    img.src = url;
+  }
+  if (typeof src === "function") {
+    start(src());
+  } else {
+    start(src);
+  }
+  function dispose() {
+    disposed = true;
+    if (current) {
+      current.onload = null;
+      current.onerror = null;
+      current = null;
+    }
+  }
+  return { status, image, width, height, dispose };
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  animationFrame,
   battery,
+  bounds,
+  broadcast,
   clipboard,
   colorScheme,
   draggable,
   dropZone,
+  favicon,
   formatCurrency,
   formatNumber,
+  fullscreen,
+  gamepad,
   geo,
   idle,
+  imageLoader,
+  keyboard,
   media,
+  mouse,
+  mutationObserver,
+  network,
   online,
   permissions,
+  pointerLock,
   resize,
   scroll,
-  title
+  speech,
+  svgFavicon,
+  swipe,
+  textSelection,
+  title,
+  urlState,
+  vibrate,
+  visibility,
+  wakeLock,
+  windowSize
 });