@nvent-addon/app 0.5.15 → 1.0.0-alpha.10

package/dist/runtime/app/composables/useComponentRouter.js

@@ -1,248 +0,0 @@
-import {
-  computed,
-  inject,
-  provide,
-  shallowRef,
-  useRoute,
-  useRouter,
-  watch,
-  defineAsyncComponent
-} from "#imports";
-import { createHooks } from "hookable";
-export function useComponentRouter(opts) {
-  const CTX_KEY = "component-router";
-  if (!opts || !("routes" in opts) || !opts.routes) {
-    const key = opts?.provideKey ?? CTX_KEY;
-    const ctx = inject(key, null);
-    if (!ctx) {
-      console.warn(
-        "[useComponentRouter] No parent router context found. Ensure a parent uses useComponentRouter with routes or wrap children in <component-router>."
-      );
-      const emptyRoute = shallowRef({ path: "", params: {}, query: {} });
-      const warnNav = async (_p) => console.warn(
-        "[useComponentRouter] push/replace called without a parent router context."
-      );
-      const noopMake = (p, _params) => p;
-      const noopHref = (p, _params) => p;
-      const emptyHooks = createHooks();
-      return {
-        route: emptyRoute,
-        push: warnNav,
-        replace: warnNav,
-        makePath: noopMake,
-        makeHref: noopHref,
-        pushTo: async (p, _params) => warnNav(p),
-        replaceTo: async (p, _params) => warnNav(p),
-        hooks: emptyHooks,
-        component: void 0
-      };
-    }
-    return ctx;
-  }
-  const props = {
-    routes: Array.isArray(opts.routes) ? opts.routes : Object.entries(opts.routes || {}).map(([path, component2]) => ({
-      path,
-      component: component2
-    })),
-    base: opts.base ?? "fp",
-    mode: opts.mode ?? "query",
-    initial: opts.initial,
-    provideKey: opts.provideKey ?? CTX_KEY,
-    debug: opts.debug === true
-  };
-  const nuxtRoute = useRoute();
-  const nuxtRouter = useRouter();
-  const component = shallowRef(null);
-  const route = shallowRef({
-    path: "",
-    params: {},
-    query: {}
-  });
-  const hooks = createHooks();
-  const dbg = (...args) => {
-    if (props.debug) console.info("[component-router]", ...args);
-  };
-  function esc(text) {
-    return text.replace(/([.+*?=^!${}()[\]|\\])/g, "\\$1");
-  }
-  function compilePattern(path) {
-    const keys = [];
-    const dyn = /\/:([^/]+)/g;
-    let last = 0;
-    let pattern = "";
-    let m;
-    while (m = dyn.exec(path)) {
-      pattern += esc(path.slice(last, m.index));
-      keys.push(m[1]);
-      pattern += "/([^/]+)";
-      last = m.index + m[0].length;
-    }
-    pattern += esc(path.slice(last));
-    const regex = new RegExp("^" + pattern + "$");
-    dbg("compiled", { path, pattern, regex, keys });
-    return { regex, keys };
-  }
-  const records = computed(
-    () => props.routes.map((r) => {
-      const { regex, keys } = compilePattern(r.path);
-      return { ...r, regex, keys };
-    })
-  );
-  function matchPath(path) {
-    dbg("matchPath", path);
-    for (const r of records.value) {
-      const m = r.regex.exec(path);
-      dbg(" try", r.path, r.regex, !!m);
-      if (m) {
-        const params = {};
-        r.keys.forEach(
-          (k, i) => params[k] = decodeURIComponent(m[i + 1] || "")
-        );
-        return { record: r, params };
-      }
-    }
-    return null;
-  }
-  function setCurrent(path) {
-    dbg("setCurrent", path);
-    const m = matchPath(path) || matchPath(props.routes[0]?.path || "/");
-    if (!m) return;
-    component.value = m.record.component;
-    const [pathOnly, queryString] = path.split("?");
-    const queryParams = {};
-    if (queryString) {
-      const params = new URLSearchParams(queryString);
-      params.forEach((value, key) => {
-        queryParams[key] = value;
-      });
-    }
-    route.value = {
-      path: pathOnly || path,
-      params: m.params,
-      query: queryParams
-      // Only use query params from the current path, not from nuxtRoute
-    };
-    dbg("current", route.value);
-    dbg("calling navigated hook with", { path: pathOnly || path, params: m.params });
-    hooks.callHook("navigated", { path: pathOnly || path, params: m.params });
-  }
-  function readFromHost() {
-    if (props.mode === "query") {
-      const p = nuxtRoute.query?.[props.base];
-      dbg("readFromHost(query)", p);
-      return typeof p === "string" ? p : null;
-    }
-    if (props.mode === "hash") {
-      const h = (typeof window !== "undefined" ? window.location.hash : "") || "";
-      const key = `#${props.base}=`;
-      const idx = h.indexOf(key);
-      dbg("readFromHost(hash)", h);
-      return idx >= 0 ? h.slice(idx + key.length) : null;
-    }
-    return null;
-  }
-  async function writeToHost(path, replace2 = false) {
-    dbg("writeToHost", path, { replace: replace2, mode: props.mode });
-    const prevPath = route.value.path;
-    dbg("current path before write:", prevPath, "new path:", path);
-    if (props.mode === "query") {
-      const [pathOnly, queryString] = path.split("?");
-      const pathQuery = {};
-      if (queryString) {
-        const params = new URLSearchParams(queryString);
-        params.forEach((value, key) => {
-          pathQuery[key] = value;
-        });
-      }
-      const nextQuery = { [props.base]: pathOnly, ...pathQuery };
-      if (nuxtRoute.query?.[props.base] === pathOnly && !queryString) {
-        setCurrent(path);
-        return;
-      }
-      await (replace2 ? nuxtRouter.replace({ query: nextQuery }) : nuxtRouter.push({ query: nextQuery }));
-      return;
-    }
-    if (props.mode === "hash" && typeof window !== "undefined") {
-      const key = `#${props.base}=`;
-      const nextHash = key + path;
-      if (window.location.hash !== nextHash) {
-        if (replace2) {
-          const url = window.location.href.replace(/#.*/, "") + nextHash;
-          window.history.replaceState(null, "", url);
-        } else {
-          window.location.hash = nextHash;
-        }
-      }
-      setCurrent(path);
-      return;
-    }
-    setCurrent(path);
-  }
-  async function push(path) {
-    await writeToHost(path, false);
-  }
-  async function replace(path) {
-    await writeToHost(path, true);
-  }
-  function makePath(patternOrPath, params) {
-    const hasDyn = /:[^/]+/.test(patternOrPath);
-    if (!hasDyn) return patternOrPath;
-    const replaced = patternOrPath.replace(/:([^/]+)/g, (_m, key) => {
-      const v = params?.[key];
-      return encodeURIComponent(v == null ? "" : String(v));
-    });
-    return replaced.replace(/\/{2,}/g, "/");
-  }
-  function makeHref(patternOrPath, params) {
-    const path = makePath(patternOrPath, params);
-    if (props.mode === "query") return `?${props.base}=${path}`;
-    if (props.mode === "hash") return `#${props.base}=${path}`;
-    return path;
-  }
-  async function pushTo(patternOrPath, params) {
-    const path = makePath(patternOrPath, params);
-    await push(path);
-  }
-  async function replaceTo(patternOrPath, params) {
-    const path = makePath(patternOrPath, params);
-    await replace(path);
-  }
-  const exposed = { push, replace, route, makePath, makeHref, pushTo, replaceTo, hooks };
-  provide(props.provideKey, exposed);
-  const initialPath = readFromHost() || props.initial || props.routes[0]?.path || "/";
-  dbg("init", { initialPath });
-  writeToHost(initialPath, true);
-  watch(
-    () => ({
-      q: nuxtRoute.query?.[props.base],
-      h: typeof window !== "undefined" ? window.location.hash : ""
-    }),
-    () => {
-      const path = readFromHost();
-      dbg("watch change detected ->", path);
-      if (path) setCurrent(path);
-    }
-  );
-  return { component, route, push, replace, makePath, makeHref, pushTo, replaceTo, hooks };
-}
-export default useComponentRouter;
-export function createComponentRoutes(glob, options) {
-  const base = options?.base || "";
-  const toPath = (key) => {
-    let p = key.replace(/^\.\//, "/").replace(/\.(vue|tsx?|jsx?)$/, "");
-    p = p.replace(/\/index$/, "");
-    p = p.replace(/\[(.+?)\]/g, ":$1");
-    if (!p.startsWith("/")) p = "/" + p;
-    if (base) {
-      const b = base.startsWith("/") ? base : "/" + base;
-      p = (b + (p === "/" ? "" : p)).replace(/\/+/, "/");
-    }
-    return p || "/";
-  };
-  return Object.entries(glob).map(([key, loader]) => ({
-    path: toPath(key),
-    component: defineAsyncComponent(
-      () => loader().then((m) => m.default || m)
-    )
-  }));
-}