@vertz/ui 0.2.0 → 0.2.2

package/dist/shared/chunk-hh0dhmb4.js

@@ -0,0 +1,528 @@
+import {
+  isNavPrefetchActive
+} from "./chunk-jrtrk5z4.js";
+import {
+  getAdapter,
+  isRenderNode
+} from "./chunk-g4rch80a.js";
+import {
+  _tryOnCleanup,
+  computed,
+  domEffect,
+  lifecycleEffect,
+  popScope,
+  pushScope,
+  runCleanups,
+  setReadValueCallback,
+  signal,
+  untrack
+} from "./chunk-hrd0mft1.js";
+
+// src/query/cache.ts
+class MemoryCache {
+  _store = new Map;
+  get(key) {
+    return this._store.get(key);
+  }
+  set(key, value) {
+    this._store.set(key, value);
+  }
+  delete(key) {
+    this._store.delete(key);
+  }
+  clear() {
+    this._store.clear();
+  }
+}
+
+// src/query/key-derivation.ts
+function deriveKey(thunk) {
+  return `__q:${hashString(thunk.toString())}`;
+}
+function hashString(str) {
+  let hash = 5381;
+  for (let i = 0;i < str.length; i++) {
+    hash = hash * 33 ^ str.charCodeAt(i);
+  }
+  return (hash >>> 0).toString(36);
+}
+
+// src/query/query.ts
+import { isQueryDescriptor } from "@vertz/fetch";
+
+// src/query/ssr-hydration.ts
+function hydrateQueryFromSSR(key, resolve, options) {
+  const ssrData = globalThis.__VERTZ_SSR_DATA__;
+  if (!ssrData)
+    return null;
+  const persistent = options?.persistent ?? false;
+  const existing = ssrData.find((entry) => entry.key === key);
+  if (existing) {
+    resolve(existing.data);
+    if (!persistent)
+      return () => {};
+  }
+  const handler = (event) => {
+    const detail = event.detail;
+    if (detail.key === key) {
+      resolve(detail.data);
+      if (!persistent) {
+        document.removeEventListener("vertz:ssr-data", handler);
+      }
+    }
+  };
+  document.addEventListener("vertz:ssr-data", handler);
+  return () => {
+    document.removeEventListener("vertz:ssr-data", handler);
+  };
+}
+
+// src/query/query.ts
+function isSSR() {
+  const check = typeof globalThis !== "undefined" && globalThis.__VERTZ_IS_SSR__;
+  return typeof check === "function" ? check() : false;
+}
+function getGlobalSSRTimeout() {
+  const g = globalThis;
+  const getter = typeof globalThis !== "undefined" && g.__VERTZ_GET_GLOBAL_SSR_TIMEOUT__;
+  return typeof getter === "function" ? getter() : undefined;
+}
+var defaultCache = new MemoryCache;
+var inflight = new Map;
+function clearDefaultQueryCache() {
+  defaultCache.clear();
+  inflight.clear();
+}
+globalThis.__VERTZ_CLEAR_QUERY_CACHE__ = clearDefaultQueryCache;
+function query(source, options = {}) {
+  if (isQueryDescriptor(source)) {
+    return query(async () => {
+      const result = await source._fetch();
+      if (!result.ok)
+        throw result.error;
+      return result.data;
+    }, { ...options, key: source._key });
+  }
+  const thunk = source;
+  const {
+    initialData,
+    debounce: debounceMs,
+    enabled = true,
+    key: customKey,
+    cache = defaultCache
+  } = options;
+  const baseKey = deriveKey(thunk);
+  const depHashSignal = signal("");
+  const cacheKeyComputed = computed(() => {
+    const dh = depHashSignal.value;
+    return customKey ?? (dh ? `${baseKey}:${dh}` : `${baseKey}:init`);
+  });
+  function getCacheKey() {
+    return cacheKeyComputed.value;
+  }
+  function callThunkWithCapture() {
+    const captured = [];
+    const prevCb = setReadValueCallback((v) => captured.push(v));
+    let promise;
+    try {
+      promise = thunk();
+    } finally {
+      setReadValueCallback(prevCb);
+    }
+    const serialized = captured.map((v) => JSON.stringify(v)).join("|");
+    untrack(() => {
+      depHashSignal.value = hashString(serialized);
+    });
+    return promise;
+  }
+  const data = signal(initialData);
+  const loading = signal(initialData === undefined && enabled);
+  const revalidating = signal(false);
+  const error = signal(undefined);
+  if (initialData !== undefined) {
+    cache.set(getCacheKey(), initialData);
+  }
+  const ssrTimeout = options.ssrTimeout ?? getGlobalSSRTimeout() ?? 300;
+  if (isSSR() && enabled && ssrTimeout !== 0 && initialData === undefined) {
+    const promise = callThunkWithCapture();
+    const key = untrack(() => getCacheKey());
+    const cached = cache.get(key);
+    if (cached !== undefined) {
+      promise.catch(() => {});
+      data.value = cached;
+      loading.value = false;
+    } else {
+      promise.catch(() => {});
+      const register = globalThis.__VERTZ_SSR_REGISTER_QUERY__;
+      if (typeof register === "function") {
+        register({
+          promise,
+          timeout: ssrTimeout,
+          resolve: (result) => {
+            data.value = result;
+            loading.value = false;
+            cache.set(key, result);
+          },
+          key
+        });
+      }
+    }
+  }
+  let ssrHydrationCleanup = null;
+  let ssrHydrated = false;
+  let navPrefetchDeferred = false;
+  if (!isSSR() && enabled && initialData === undefined) {
+    const hydrationKey = customKey ?? baseKey;
+    const isNavigation = isNavPrefetchActive();
+    ssrHydrationCleanup = hydrateQueryFromSSR(hydrationKey, (result) => {
+      data.value = result;
+      loading.value = false;
+      cache.set(hydrationKey, result);
+      ssrHydrated = true;
+    }, { persistent: isNavigation });
+    if (!ssrHydrated && ssrHydrationCleanup !== null && isNavPrefetchActive()) {
+      if (customKey) {
+        const cached = cache.get(customKey);
+        if (cached !== undefined) {
+          data.value = cached;
+          loading.value = false;
+          ssrHydrated = true;
+        }
+      }
+    }
+    if (!ssrHydrated && ssrHydrationCleanup !== null && isNavPrefetchActive()) {
+      navPrefetchDeferred = true;
+      const doneHandler = () => {
+        document.removeEventListener("vertz:nav-prefetch-done", doneHandler);
+        if (data.peek() === undefined && !ssrHydrated) {
+          refetchTrigger.value = refetchTrigger.peek() + 1;
+        }
+      };
+      document.addEventListener("vertz:nav-prefetch-done", doneHandler);
+      const prevCleanup = ssrHydrationCleanup;
+      ssrHydrationCleanup = () => {
+        prevCleanup?.();
+        document.removeEventListener("vertz:nav-prefetch-done", doneHandler);
+      };
+    }
+  }
+  let fetchId = 0;
+  let debounceTimer;
+  let intervalTimer;
+  const refetchIntervalOption = options.refetchInterval;
+  const hasInterval = typeof refetchIntervalOption === "function" || typeof refetchIntervalOption === "number" && refetchIntervalOption > 0;
+  let intervalIteration = 0;
+  const inflightKeys = new Set;
+  const refetchTrigger = signal(0);
+  let intervalPaused = false;
+  function scheduleInterval() {
+    if (!hasInterval || isSSR() || intervalPaused)
+      return;
+    let ms;
+    if (typeof refetchIntervalOption === "function") {
+      ms = refetchIntervalOption(data.peek(), intervalIteration);
+    } else {
+      ms = refetchIntervalOption;
+    }
+    if (ms === false || ms <= 0) {
+      intervalIteration = 0;
+      return;
+    }
+    intervalIteration++;
+    clearTimeout(intervalTimer);
+    intervalTimer = setTimeout(() => {
+      refetch();
+    }, ms);
+  }
+  let visibilityHandler;
+  if (hasInterval && enabled && !isSSR() && typeof document !== "undefined") {
+    visibilityHandler = () => {
+      if (document.visibilityState === "hidden") {
+        intervalPaused = true;
+        clearTimeout(intervalTimer);
+      } else {
+        intervalPaused = false;
+        refetch();
+      }
+    };
+    document.addEventListener("visibilitychange", visibilityHandler);
+  }
+  function handleFetchPromise(promise, id, key) {
+    promise.then((result) => {
+      inflight.delete(key);
+      inflightKeys.delete(key);
+      if (id !== fetchId)
+        return;
+      cache.set(key, result);
+      data.value = result;
+      loading.value = false;
+      revalidating.value = false;
+      scheduleInterval();
+    }, (err) => {
+      inflight.delete(key);
+      inflightKeys.delete(key);
+      if (id !== fetchId)
+        return;
+      error.value = err;
+      loading.value = false;
+      revalidating.value = false;
+      scheduleInterval();
+    });
+  }
+  function startFetch(fetchPromise, key) {
+    const id = ++fetchId;
+    untrack(() => {
+      if (data.value !== undefined) {
+        revalidating.value = true;
+      } else {
+        loading.value = true;
+      }
+      error.value = undefined;
+    });
+    const existing = inflight.get(key);
+    if (existing) {
+      handleFetchPromise(existing, id, key);
+      return;
+    }
+    inflight.set(key, fetchPromise);
+    inflightKeys.add(key);
+    handleFetchPromise(fetchPromise, id, key);
+  }
+  function refetch() {
+    const key = getCacheKey();
+    cache.delete(key);
+    inflight.delete(key);
+    refetchTrigger.value = refetchTrigger.peek() + 1;
+  }
+  let disposeFn;
+  if (enabled) {
+    let isFirst = true;
+    disposeFn = lifecycleEffect(() => {
+      refetchTrigger.value;
+      if (isFirst && ssrHydrated) {
+        isFirst = false;
+        return;
+      }
+      if (isFirst && navPrefetchDeferred) {
+        if (customKey) {
+          const cached = untrack(() => cache.get(customKey));
+          if (cached !== undefined) {
+            untrack(() => {
+              data.value = cached;
+              loading.value = false;
+            });
+            isFirst = false;
+            return;
+          }
+        } else {
+          const trackPromise = callThunkWithCapture();
+          trackPromise.catch(() => {});
+          const derivedKey = untrack(() => getCacheKey());
+          const cached = untrack(() => cache.get(derivedKey));
+          if (cached !== undefined) {
+            untrack(() => {
+              data.value = cached;
+              loading.value = false;
+            });
+            isFirst = false;
+            return;
+          }
+        }
+        isFirst = false;
+        return;
+      }
+      if (customKey) {
+        const existing = untrack(() => inflight.get(customKey));
+        if (existing) {
+          const id = ++fetchId;
+          untrack(() => {
+            if (data.value !== undefined) {
+              revalidating.value = true;
+            } else {
+              loading.value = true;
+            }
+            error.value = undefined;
+          });
+          handleFetchPromise(existing, id, customKey);
+          isFirst = false;
+          return;
+        }
+      }
+      const promise = callThunkWithCapture();
+      const key = untrack(() => getCacheKey());
+      if (!customKey) {
+        const existing = untrack(() => inflight.get(key));
+        if (existing) {
+          promise.catch(() => {});
+          const id = ++fetchId;
+          untrack(() => {
+            if (data.value !== undefined) {
+              revalidating.value = true;
+            } else {
+              loading.value = true;
+            }
+            error.value = undefined;
+          });
+          handleFetchPromise(existing, id, key);
+          isFirst = false;
+          return;
+        }
+      }
+      const isNavigation = ssrHydrationCleanup !== null;
+      const shouldCheckCache = isNavigation || (isFirst ? !!customKey : !customKey);
+      if (shouldCheckCache) {
+        const cached = untrack(() => cache.get(key));
+        if (cached !== undefined) {
+          promise.catch(() => {});
+          untrack(() => {
+            data.value = cached;
+            loading.value = false;
+            error.value = undefined;
+          });
+          isFirst = false;
+          scheduleInterval();
+          return;
+        }
+      }
+      if (isFirst && initialData !== undefined) {
+        promise.catch(() => {});
+        isFirst = false;
+        scheduleInterval();
+        return;
+      }
+      isFirst = false;
+      if (debounceMs !== undefined && debounceMs > 0) {
+        clearTimeout(debounceTimer);
+        promise.catch(() => {});
+        debounceTimer = setTimeout(() => {
+          startFetch(promise, key);
+        }, debounceMs);
+      } else {
+        startFetch(promise, key);
+      }
+    });
+  }
+  function dispose() {
+    disposeFn?.();
+    ssrHydrationCleanup?.();
+    clearTimeout(debounceTimer);
+    clearTimeout(intervalTimer);
+    if (visibilityHandler && typeof document !== "undefined") {
+      document.removeEventListener("visibilitychange", visibilityHandler);
+    }
+    fetchId++;
+    for (const key of inflightKeys) {
+      inflight.delete(key);
+    }
+    inflightKeys.clear();
+  }
+  _tryOnCleanup(dispose);
+  return {
+    data,
+    loading,
+    revalidating,
+    error,
+    refetch,
+    revalidate: refetch,
+    dispose
+  };
+}
+
+// src/query/query-match.ts
+var cache = new WeakMap;
+function queryMatch(queryResult, handlers) {
+  const key = queryResult;
+  const existing = cache.get(key);
+  if (existing && !existing.disposed) {
+    existing.handlers = handlers;
+    return existing.wrapper;
+  }
+  if (existing) {
+    cache.delete(key);
+  }
+  const wrapper = getAdapter().createElement("span");
+  wrapper.style.display = "contents";
+  const entry = { wrapper, handlers, disposed: false };
+  cache.set(key, entry);
+  let currentBranch = null;
+  let branchCleanups = [];
+  const outerScope = pushScope();
+  domEffect(() => {
+    const isLoading = queryResult.loading.value;
+    const err = queryResult.error.value;
+    const dataValue = queryResult.data.value;
+    let branch;
+    if (isLoading || err === undefined && dataValue === undefined) {
+      branch = "loading";
+    } else if (err !== undefined) {
+      branch = "error";
+    } else {
+      branch = "data";
+    }
+    if (branch === currentBranch && branch !== "data") {
+      return;
+    }
+    runCleanups(branchCleanups);
+    while (wrapper.firstChild) {
+      wrapper.removeChild(wrapper.firstChild);
+    }
+    currentBranch = branch;
+    const scope = pushScope();
+    let branchResult = null;
+    if (branch === "loading") {
+      branchResult = entry.handlers.loading();
+    } else if (branch === "error") {
+      branchResult = entry.handlers.error(err);
+    } else {
+      const dataSignal = queryResult.data;
+      const dataProxy = new Proxy({}, {
+        get(_target, prop, receiver) {
+          const current = dataSignal.value;
+          if (current == null)
+            return;
+          const value = Reflect.get(current, prop, receiver);
+          if (typeof value === "function") {
+            return value.bind(current);
+          }
+          return value;
+        },
+        has(_target, prop) {
+          const current = dataSignal.value;
+          if (current == null)
+            return false;
+          return Reflect.has(current, prop);
+        },
+        ownKeys() {
+          const current = dataSignal.value;
+          if (current == null)
+            return [];
+          return Reflect.ownKeys(current);
+        },
+        getOwnPropertyDescriptor(_target, prop) {
+          const current = dataSignal.value;
+          if (current == null)
+            return;
+          return Reflect.getOwnPropertyDescriptor(current, prop);
+        }
+      });
+      branchResult = entry.handlers.data(dataProxy);
+    }
+    popScope();
+    branchCleanups = scope;
+    if (branchResult != null && isRenderNode(branchResult)) {
+      wrapper.appendChild(branchResult);
+    }
+  });
+  popScope();
+  const dispose = () => {
+    entry.disposed = true;
+    runCleanups(branchCleanups);
+    runCleanups(outerScope);
+    cache.delete(key);
+  };
+  wrapper.dispose = dispose;
+  _tryOnCleanup(dispose);
+  return wrapper;
+}
+
+export { MemoryCache, deriveKey, query, queryMatch };