diff --git a/src/index.tsx b/src/index.tsx index 354ce1d..a4531ae 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -2,18 +2,15 @@ import * as pathToRegexp from "path-to-regexp"; import * as React from "react"; import { Context } from "@blakeembrey/react-location"; -/** - * Use context to communicate the route params. - */ -export interface Route
{
- params: P;
- pathname: string;
-}
-
/**
* Internal context for nested route matching.
*/
-export const RouteContext = React.createContext (
);
}
+/**
+ * Standard options for `pathToRegexp.match`.
+ */
+export interface MatchOptions {
+ sensitive?: boolean;
+ start?: boolean;
+ end?: boolean;
+ strict?: boolean;
+}
+
/**
* React hook for matching URLs.
*/
@@ -86,16 +93,6 @@ export type RouteComponent = React.ComponentType<{
params: P;
}>;
-/**
- * Standard options for `pathToRegexp.match`.
- */
-export interface MatchOptions {
- sensitive?: boolean;
- start?: boolean;
- end?: boolean;
- strict?: boolean;
-}
-
/**
* Route props accept a path, options and a function to render on match.
*/
@@ -125,30 +122,25 @@ function toMatchOptions(
/**
* Conditionally renders `children` when the path matches the active URL.
*/
-export function Route ({
- path = "",
- start,
- end,
- sensitive,
- strict,
- component,
-}: RouteProps ) {
+export function Route (props: RouteProps ) {
const pathname = usePathname();
- const match = useMatch (path, { start, end, sensitive, strict });
+ const match = useMatch (props.path || "", props);
const result = React.useMemo(() => match(pathname), [match, pathname]);
- return result ? (props: {
+function Output (props: {
component: RouteComponent ;
result: pathToRegexp.MatchResult ;
}) {
- const { component: Component, result: match } = props;
+ const {
+ component: Component,
+ result: { params, index, path },
+ } = props;
const pathname = usePathname();
- const { params, index, path } = match;
const route = React.useMemo(
() => ({
pathname: nestedPathname(pathname, index, path),
@@ -172,18 +164,10 @@ export interface SwitchProps {
children: Array