useRouter hook

I'm trying to use the useRouter hook so that I can acquire the base path and pass it into my sidebar component without the end user having to write it themselves. Also, I'd like to acquire all defined routes so that I can match against whatever route was defined in my component, and tell the end user the route defined doesn't exist. But correct me if I'm wrong, is the useRouter hook private?

Missing "./dist/routing" specifier in "@solidjs/router" package

Missing "./dist/routing" specifier in "@solidjs/router" package

Upon analyzing the router/index.jsx distribution, I think it is private, right? So that's why I'm getting the previous error.

export * from "./routers/index.js";
export * from "./components.jsx";
export * from "./lifecycle.js";
export { useHref, useIsRouting, useLocation, useMatch, useCurrentMatches, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing.js";
export { mergeSearchString as _mergeSearchString } from "./utils.js";
export * from "./data/index.js";

export * from "./routers/index.js";
export * from "./components.jsx";
export * from "./lifecycle.js";
export { useHref, useIsRouting, useLocation, useMatch, useCurrentMatches, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing.js";
export { mergeSearchString as _mergeSearchString } from "./utils.js";
export * from "./data/index.js";

Could we discuss a PR to expose the useRouter hook, or perhaps a new hook exposing read-only access to this information?

The component im building for better context:

<Sidenav.Component
    baseUri={'/dash'} // replace this internally
    useBackdrop={true}
>
    <Sidenav.Nav
        name={'Principal'}
        route={'/doesnt-exist'} // throw an error
        icon={principalIcon}
    />

    <Sidenav.Group
        name={'Obra'}
        icon={constructionIcon}
    >
        <Sidenav.Nav
            name={'Catalogo'}
            route={'/construction/catalog'}
        />
    </Sidenav.Group>
</Sidenav.Component>

<Sidenav.Component
    baseUri={'/dash'} // replace this internally
    useBackdrop={true}
>
    <Sidenav.Nav
        name={'Principal'}
        route={'/doesnt-exist'} // throw an error
        icon={principalIcon}
    />

    <Sidenav.Group
        name={'Obra'}
        icon={constructionIcon}
    >
        <Sidenav.Nav
            name={'Catalogo'}
            route={'/construction/catalog'}
        />
    </Sidenav.Group>
</Sidenav.Component>

useRouter hook

Missing "./dist/routing" specifier in "@solidjs/router" package

Missing "./dist/routing" specifier in "@solidjs/router" package

Upon analyzing the router/index.jsx distribution, I think it is private, right? So that's why I'm getting the previous error.

export * from "./routers/index.js";
export * from "./components.jsx";
export * from "./lifecycle.js";
export { useHref, useIsRouting, useLocation, useMatch, useCurrentMatches, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing.js";
export { mergeSearchString as _mergeSearchString } from "./utils.js";
export * from "./data/index.js";

export * from "./routers/index.js";
export * from "./components.jsx";
export * from "./lifecycle.js";
export { useHref, useIsRouting, useLocation, useMatch, useCurrentMatches, useNavigate, useParams, useResolvedPath, useSearchParams, useBeforeLeave, } from "./routing.js";
export { mergeSearchString as _mergeSearchString } from "./utils.js";
export * from "./data/index.js";

Could we discuss a PR to expose the useRouter hook, or perhaps a new hook exposing read-only access to this information?

The component im building for better context:

<Sidenav.Component
    baseUri={'/dash'} // replace this internally
    useBackdrop={true}
>
    <Sidenav.Nav
        name={'Principal'}
        route={'/doesnt-exist'} // throw an error
        icon={principalIcon}
    />

    <Sidenav.Group
        name={'Obra'}
        icon={constructionIcon}
    >
        <Sidenav.Nav
            name={'Catalogo'}
            route={'/construction/catalog'}
        />
    </Sidenav.Group>
</Sidenav.Component>

<Sidenav.Component
    baseUri={'/dash'} // replace this internally
    useBackdrop={true}
>
    <Sidenav.Nav
        name={'Principal'}
        route={'/doesnt-exist'} // throw an error
        icon={principalIcon}
    />

    <Sidenav.Group
        name={'Obra'}
        icon={constructionIcon}
    >
        <Sidenav.Nav
            name={'Catalogo'}
            route={'/construction/catalog'}
        />
    </Sidenav.Group>
</Sidenav.Component>

useRouter hook

Similar Threads

useRouter hook

Similar Threads

Similar Threads

Similar Threads