@nano_kit/router 1.0.0-alpha.4

package/dist/index.js

@@ -0,0 +1,606 @@
+import { mountable, signal, action, onMount, record, readonly, atIndex, untracked, computed, batch, updateList, inject } from '@nano_kit/store';
+
+const PushHistoryAction = "push";
+const ReplaceHistoryAction = "replace";
+const PopHistoryAction = "pop";
+
+function onLinkClick(event) {
+  const link = event.target.closest("a");
+  if (link && event.button === 0 && link.target !== "_blank" && link.origin === location.origin && link.rel !== "external" && link.target !== "_self" && !link.download && !event.altKey && !event.metaKey && !event.ctrlKey && !event.shiftKey && !event.defaultPrevented) {
+    event.preventDefault();
+    this.push(link.href);
+  }
+}
+function listenLinks(navigation) {
+  const onClick = onLinkClick.bind(navigation);
+  document.body.addEventListener("click", onClick);
+  return () => {
+    document.body.removeEventListener("click", onClick);
+  };
+}
+function resetScroll() {
+  window.scrollTo(0, 0);
+}
+function scrollToAnchor(hash, options) {
+  if (hash) {
+    const id = hash.slice(1);
+    const anchor = document.getElementById(id) || document.getElementsByName(id)[0];
+    if (anchor) {
+      anchor.scrollIntoView(options);
+    }
+  }
+}
+class ScrollRestorator {
+  #storageKeyPrefix;
+  /**
+   * Create a ScrollRestorator instance.
+   * @param storageKeyPrefix - Prefix for session storage keys
+   */
+  constructor(storageKeyPrefix = "krsp-") {
+    this.#storageKeyPrefix = storageKeyPrefix;
+  }
+  /**
+   * Save the current scroll position for the given location.
+   * @param location - The location object
+   */
+  save(location2) {
+    sessionStorage.setItem(this.#storageKeyPrefix + location2.href, String(window.scrollY));
+  }
+  /**
+   * Restore the scroll position for the given location.
+   * @param location - The location object
+   * @returns True if a saved position was restored, false otherwise
+   */
+  restore(location2) {
+    const key = this.#storageKeyPrefix + location2.href;
+    const value = parseInt(sessionStorage.getItem(key));
+    if (!isNaN(value)) {
+      window.scrollTo(0, value);
+      this.clear(location2);
+      return true;
+    }
+    return false;
+  }
+  /**
+   * Clear the saved scroll position for the given location.
+   * @param location - The location object
+   */
+  clear(location2) {
+    sessionStorage.removeItem(this.#storageKeyPrefix + location2.href);
+  }
+}
+
+// @__NO_SIDE_EFFECTS__
+function removeTrailingSlash(path) {
+  return path.replace(/(.)\/($|\?)/, "$1$2");
+}
+// @__NO_SIDE_EFFECTS__
+function parseHref(href) {
+  return new URL(/* @__PURE__ */ removeTrailingSlash(href), "http://a");
+}
+// @__NO_SIDE_EFFECTS__
+function getHref(location) {
+  return /* @__PURE__ */ removeTrailingSlash(location.pathname + location.search + location.hash);
+}
+// @__NO_SIDE_EFFECTS__
+function createHrefObject(url) {
+  return {
+    pathname: url.pathname,
+    search: url.search,
+    hash: url.hash,
+    href: /* @__PURE__ */ getHref(url)
+  };
+}
+// @__NO_SIDE_EFFECTS__
+function updateHrefObject(url, update) {
+  const updateObject = typeof update === "string" ? /* @__PURE__ */ parseHref(update) : update;
+  const updatedUrl = /* @__PURE__ */ parseHref(updateObject.pathname ?? url.pathname);
+  updatedUrl.search = updateObject.search ?? url.search;
+  updatedUrl.hash = updateObject.hash ?? url.hash;
+  if (updateObject.searchParams) {
+    updatedUrl.search = updateObject.searchParams.toString();
+  }
+  return /* @__PURE__ */ createHrefObject(updatedUrl);
+}
+function updateHref(href, update) {
+  if (typeof update === "string") {
+    return /* @__PURE__ */ removeTrailingSlash(update);
+  }
+  return (/* @__PURE__ */ updateHrefObject(/* @__PURE__ */ parseHref(href), update)).href;
+}
+// @__NO_SIDE_EFFECTS__
+function composeMatchers(matchers, nomatch = null) {
+  const len = matchers.length;
+  return (...args) => {
+    for (let i = 0, result; i < len; i++) {
+      if (result = matchers[i](...args)) {
+        return result;
+      }
+    }
+    return nomatch;
+  };
+}
+// @__NO_SIDE_EFFECTS__
+function createLocation(url, action = null) {
+  return {
+    .../* @__PURE__ */ createHrefObject(url),
+    action
+  };
+}
+// @__NO_SIDE_EFFECTS__
+function updateLocation(url, update, action) {
+  return {
+    .../* @__PURE__ */ updateHrefObject(url, update),
+    action
+  };
+}
+
+function createPatternRegex(pattern) {
+  return new RegExp(`^${removeTrailingSlash(pattern).replace(/[\s!#$()+,.:<=?[\\\]^{|}]/g, "\\$&").replace(/\/\\:(\w+)\\\?/g, "(?:/(?<$1>(?<=/)[^/]+))?").replace(/\/\\:(\w+)/g, "/(?<$1>[^/]+)").replace(/\/\*$/g, "(?:/(?<wildcard>.+))?$")}/?$`, "i");
+}
+function patternMatcher(route, path) {
+  const matches = path.match(this);
+  if (!matches) {
+    return null;
+  }
+  const params = {};
+  if (matches.groups) {
+    Object.entries(matches.groups).forEach(([key, value]) => {
+      params[key] = value ? decodeURIComponent(value) : "";
+    });
+  }
+  return {
+    route,
+    params
+  };
+}
+const nomatch = {
+  route: null,
+  params: {}
+};
+function createMatcher$1(routes) {
+  return composeMatchers(Object.entries(routes).map(
+    ([route, pattern]) => patternMatcher.bind(
+      createPatternRegex(pattern),
+      route
+    )
+  ), nomatch);
+}
+const matcherCache$1 = /* @__PURE__ */ new WeakMap();
+function createCachedMatcher$1(routes) {
+  let matcher = matcherCache$1.get(routes);
+  if (!matcher) {
+    matcher = createMatcher$1(routes);
+    matcherCache$1.set(routes, matcher);
+  }
+  return matcher;
+}
+function applyBrowserLocation({ href, action: action2 }) {
+  if (action2 === PushHistoryAction) {
+    history.pushState(null, "", href);
+  } else if (action2 === ReplaceHistoryAction) {
+    history.replaceState(null, "", href);
+  }
+}
+// @__NO_SIDE_EFFECTS__
+function browserNavigation(routes = {}) {
+  const match = createCachedMatcher$1(routes);
+  const routerLocation = (location2) => ({
+    ...location2,
+    ...match(location2.pathname)
+  });
+  const $location = mountable(signal(
+    routerLocation(createLocation(location))
+  ));
+  const update = (location2) => {
+    if (location2 !== null) {
+      applyBrowserLocation(location2);
+      $location(location2);
+    }
+  };
+  const maybeUpdate = (nextLocation) => {
+    const location2 = $location();
+    if (location2.href !== nextLocation.href || nextLocation.hash.length > 1) {
+      const { action: action2 } = nextLocation;
+      const nextRouteLocation = routerLocation(nextLocation);
+      if (action2 === null || action2 === PopHistoryAction) {
+        update(nextRouteLocation);
+      } else {
+        navigation.transition(
+          update,
+          nextRouteLocation,
+          location2
+        );
+      }
+    }
+  };
+  const sync = (event) => {
+    maybeUpdate(
+      createLocation(
+        location,
+        event ? PopHistoryAction : null
+      )
+    );
+  };
+  const navigation = {
+    transition(fn, nextLocation) {
+      fn(nextLocation);
+    },
+    get length() {
+      return history.length;
+    },
+    back: action(() => {
+      navigation.transition(history.back, null, $location());
+    }),
+    forward: action(() => {
+      navigation.transition(history.forward, null, $location());
+    }),
+    push: action((to) => {
+      maybeUpdate(
+        updateLocation(location, to, PushHistoryAction)
+      );
+    }),
+    replace: action((to) => {
+      maybeUpdate(
+        updateLocation(location, to, ReplaceHistoryAction)
+      );
+    })
+  };
+  onMount($location, () => {
+    sync();
+    window.addEventListener("popstate", sync);
+    return () => {
+      window.removeEventListener("popstate", sync);
+    };
+  });
+  return [record(readonly($location)), navigation];
+}
+// @__NO_SIDE_EFFECTS__
+function virtualNavigation(initialPath = "/", routes = {}) {
+  const match = createCachedMatcher$1(routes);
+  const routerLocation = (location2) => ({
+    ...location2,
+    ...match(location2.pathname)
+  });
+  const $history = signal(
+    [routerLocation(createLocation(parseHref(initialPath)))]
+  );
+  const $activeIndex = signal(0);
+  const $location = mountable(atIndex($history, $activeIndex));
+  const go = (steps) => {
+    const newIndex = Math.max(0, Math.min(
+      $history().length - 1,
+      $activeIndex() + steps
+    ));
+    batch(() => {
+      $activeIndex(newIndex);
+      $location((location2) => ({
+        ...location2,
+        action: PopHistoryAction
+      }));
+    });
+  };
+  const back = () => go(-1);
+  const forward = () => go(1);
+  const update = (location2) => {
+    if (location2 !== null) {
+      if (location2.action === PushHistoryAction) {
+        const activeIndex = $activeIndex();
+        const nextIndex = activeIndex + 1;
+        batch(() => {
+          updateList($history, (history2) => {
+            history2.splice(nextIndex, history2.length - activeIndex - 1, location2);
+          });
+          $activeIndex(nextIndex);
+        });
+      } else if (location2.action === ReplaceHistoryAction) {
+        $location(location2);
+      }
+    }
+  };
+  const maybeUpdate = (nextLocation, location2) => {
+    if (location2.href !== nextLocation.href || nextLocation.hash.length > 1) {
+      const nextRouteLocation = routerLocation(nextLocation);
+      navigation.transition(
+        update,
+        nextRouteLocation,
+        location2
+      );
+    }
+  };
+  const navigation = {
+    transition(fn, location2) {
+      fn(location2);
+    },
+    get length() {
+      return untracked($history).length;
+    },
+    back: action(() => {
+      navigation.transition(back, null, $location());
+    }),
+    forward: action(() => {
+      navigation.transition(forward, null, $location());
+    }),
+    push: action((to) => {
+      const location2 = $location();
+      maybeUpdate(
+        updateLocation(location2, to, PushHistoryAction),
+        location2
+      );
+    }),
+    replace: action((to) => {
+      const location2 = $location();
+      maybeUpdate(
+        updateLocation(location2, to, ReplaceHistoryAction),
+        location2
+      );
+    })
+  };
+  return [record(readonly($location)), navigation];
+}
+// @__NO_SIDE_EFFECTS__
+function routeParam($location, key, parser = (_) => _) {
+  const { $params } = $location;
+  return computed(() => parser($params()[key]));
+}
+
+// @__NO_SIDE_EFFECTS__
+function searchParams($location) {
+  const { $search } = $location;
+  return computed(() => new URLSearchParams($search()));
+}
+// @__NO_SIDE_EFFECTS__
+function searchParam($searchParams, key, parser = (_) => _) {
+  return computed(() => parser($searchParams().get(key)));
+}
+
+function execPattern(params) {
+  return this.map((part, i) => i % 2 === 0 ? part : part(params)).join("");
+}
+function partToFunction(part, i) {
+  return i % 2 === 0 ? part : part === void 0 ? (params = {}) => params.wildcard ? `/${params.wildcard}` : "" : (params = {}) => part in params ? `/${encodeURIComponent(params[part])}` : "";
+}
+function patternToFunction(pattern) {
+  const parts = pattern.split(/\/(?::(\w+)\??|\*)/g).map(partToFunction);
+  return execPattern.bind(parts);
+}
+// @__NO_SIDE_EFFECTS__
+function buildPaths(routes) {
+  return Object.entries(routes).reduce(
+    (hrefs, [route, pattern]) => {
+      if (/:|\*/.test(pattern)) {
+        hrefs[route] = patternToFunction(pattern);
+      } else {
+        hrefs[route] = removeTrailingSlash(pattern);
+      }
+      return hrefs;
+    },
+    {}
+  );
+}
+// @__NO_SIDE_EFFECTS__
+function basePath(base, routes) {
+  if (!base) {
+    return routes;
+  }
+  const normalizedBase = removeTrailingSlash(base).replace(/^\.\//, "/");
+  if (normalizedBase === "" || normalizedBase === "/") {
+    return routes;
+  }
+  return Object.entries(routes).reduce(
+    (paths, [route, pattern]) => {
+      paths[route] = removeTrailingSlash(`${normalizedBase}${pattern}`);
+      return paths;
+    },
+    {}
+  );
+}
+
+async function loadPages(pages, tasks) {
+  const allTasks = tasks ?? /* @__PURE__ */ new Set();
+  for (const ref of pages) {
+    if ("expected" in ref) {
+      ref.page(allTasks);
+    } else {
+      ref.layout(allTasks);
+      void loadPages(ref.pages, allTasks);
+    }
+  }
+  if (!tasks) {
+    await Promise.all(allTasks);
+  }
+}
+async function loadPage(pages, route, tasks) {
+  const allTasks = tasks ?? /* @__PURE__ */ new Set();
+  for (const ref of pages) {
+    if ("expected" in ref) {
+      if (ref.expected === route) {
+        ref.page(allTasks);
+        allTasks.add(null);
+        break;
+      }
+    } else if (allTasks.size < (loadPage(ref.pages, route, allTasks), allTasks.size)) {
+      ref.layout(allTasks);
+      break;
+    }
+  }
+  if (!tasks) {
+    await Promise.all(allTasks);
+  }
+}
+// @__NO_SIDE_EFFECTS__
+function loadable(load, fallback) {
+  const $viewRef = signal({
+    view: fallback,
+    loading: true
+  });
+  const init = (tasks) => {
+    const promise = load().then((module) => $viewRef({
+      view: module.default,
+      storesToPreload: module.storesToPreload,
+      loading: false
+    }));
+    tasks?.add(promise);
+  };
+  let initialized = false;
+  return {
+    load(tasks) {
+      if (!initialized) {
+        initialized = true;
+        init(tasks);
+      }
+      return $viewRef();
+    }
+  };
+}
+function isLoadable(ref) {
+  return typeof ref?.load === "function";
+}
+function getViewRefGetter(page2, storesToPreload) {
+  let getter;
+  if (isLoadable(page2)) {
+    getter = page2.load;
+  } else {
+    const ref = {
+      view: page2,
+      storesToPreload
+    };
+    getter = () => ref;
+  }
+  return getter;
+}
+// @__NO_SIDE_EFFECTS__
+function page(expected, page2, storesToPreload) {
+  return {
+    expected,
+    page: getViewRefGetter(page2, storesToPreload)
+  };
+}
+// @__NO_SIDE_EFFECTS__
+function notFound(page2, storesToPreload) {
+  return {
+    expected: null,
+    page: getViewRefGetter(page2, storesToPreload)
+  };
+}
+// @__NO_SIDE_EFFECTS__
+function layout(layout2, stroesToPreloadOrPages, maybePages) {
+  let pages;
+  let storesToPreload;
+  if (maybePages === void 0) {
+    pages = stroesToPreloadOrPages;
+  } else {
+    pages = maybePages;
+    storesToPreload = stroesToPreloadOrPages;
+  }
+  return {
+    layout: getViewRefGetter(layout2, storesToPreload),
+    pages
+  };
+}
+function createMatcher(pages) {
+  return composeMatchers(pages.map(
+    (ref) => "expected" in ref ? createPageMatcher(ref) : createLayoutMatcher(ref)
+  ));
+}
+const matcherCache = /* @__PURE__ */ new WeakMap();
+function createCachedMatcher(pages) {
+  let matcher = matcherCache.get(pages);
+  if (!matcher) {
+    matcher = createMatcher(pages);
+    matcherCache.set(pages, matcher);
+  }
+  return matcher;
+}
+function createPageMatcher({ expected, page: page2 }) {
+  return (route) => route === expected ? page2() : null;
+}
+function createLayoutMatcher({ layout: layout2, pages }) {
+  const match = createCachedMatcher(pages);
+  return (route, composed) => {
+    const ref = match(route, composed);
+    if (ref) {
+      const layoutRef = layout2();
+      if (layoutRef.loading || !layoutRef.view) {
+        return layoutRef;
+      }
+      const storesToPreload = () => [
+        ...layoutRef.storesToPreload?.() ?? [],
+        ...ref.storesToPreload?.() ?? []
+      ];
+      return {
+        view: composed(layoutRef.view, ref.view),
+        storesToPreload
+      };
+    }
+    return null;
+  };
+}
+function createComposed(compose) {
+  const storage = /* @__PURE__ */ new Map();
+  return (layout2, page2) => {
+    let entry = storage.get(layout2);
+    if (!entry) {
+      const $page = signal(page2);
+      entry = {
+        page: $page,
+        composed: compose?.($page, layout2)
+      };
+      storage.set(layout2, entry);
+    } else {
+      entry.page(() => page2);
+    }
+    return entry.composed;
+  };
+}
+// @__NO_SIDE_EFFECTS__
+function router($location, pages, compose) {
+  const { $route } = $location;
+  const match = createCachedMatcher(pages);
+  const composed = createComposed(compose);
+  let ref = null;
+  const $page = computed(() => (ref = match($route(), composed))?.view ?? null);
+  const storesToPreload = () => {
+    $page();
+    return ref?.storesToPreload?.() ?? [];
+  };
+  return [$page, storesToPreload];
+}
+
+// @__NO_SIDE_EFFECTS__
+function browserNavigation$(routes = {}) {
+  const BrowserNavigation$ = () => browserNavigation(routes);
+  const Location$ = () => inject(BrowserNavigation$)[0];
+  const Navigation$ = () => inject(BrowserNavigation$)[1];
+  return [
+    Location$,
+    Navigation$
+  ];
+}
+// @__NO_SIDE_EFFECTS__
+function virtualNavigation$(initialPath, routes) {
+  const VirtualNavigation$ = () => virtualNavigation(initialPath, routes);
+  const Location$ = () => inject(VirtualNavigation$)[0];
+  const Navigation$ = () => inject(VirtualNavigation$)[1];
+  return [
+    Location$,
+    Navigation$
+  ];
+}
+// @__NO_SIDE_EFFECTS__
+function router$(Location$, pages, compose) {
+  const Router$ = () => router(
+    inject(Location$),
+    pages,
+    compose
+  );
+  const Page$ = () => inject(Router$)[0];
+  const StoresToPreload$ = () => inject(Router$)[1];
+  return [
+    Page$,
+    StoresToPreload$
+  ];
+}
+
+export { PopHistoryAction, PushHistoryAction, ReplaceHistoryAction, ScrollRestorator, basePath, browserNavigation, browserNavigation$, buildPaths, composeMatchers, createHrefObject, createLocation, getHref, layout, listenLinks, loadPage, loadPages, loadable, notFound, onLinkClick, page, parseHref, removeTrailingSlash, resetScroll, routeParam, router, router$, scrollToAnchor, searchParam, searchParams, updateHref, updateHrefObject, updateLocation, virtualNavigation, virtualNavigation$ };
+//# sourceMappingURL=index.js.map