diff --git a/app.tsx b/app.tsx index c51ef22..411929b 100644 --- a/app.tsx +++ b/app.tsx @@ -2,8 +2,8 @@ import {Route, useRoute} from ">able/iso-router.tsx"; const Tracer =()=> { - const {nestedDepth, pathIndex} = useRoute(); - return
Depth: {nestedDepth}, Index:{pathIndex}
+ const {nestedDepth, pathIndex, blocked} = useRoute(); + return
Depth: {nestedDepth}, Index:{pathIndex}, Match:{blocked.value}
} export default ()=>
@@ -11,23 +11,17 @@ export default ()=>
- - -

home page!

-
+

home page!

- - - -

About page!

-
- - -

more!

-
+

About page!

+

more!

+ couldnt find it
+

404 :(

; \ No newline at end of file diff --git a/iso-router.tsx b/iso-router.tsx index 25df41e..a050f50 100644 --- a/iso-router.tsx +++ b/iso-router.tsx @@ -22,10 +22,21 @@ export const Meta =(props:MetaFields)=> { useMeta(props); return null; } //////// Router +type RouteContextData = { + /** Current nested depth of the router */ nestedDepth:number, + /** Index into the page path to start matching routes */ pathIndex:number, + /** Collection of keys from matched routes ("page/:key/") */ keys: Record, + blocked: Signal.Signal +} +const context = React.createContext({nestedDepth:0, pathIndex:0, keys:{}, blocked:Signal.signal(false as false|string)} as RouteContextData); //// Create Signals export const pageURL = Signal.signal(new URL(globalThis?.location.href || "")); export const pagePath = Signal.signal([] as string[]); -Signal.effect(()=> pagePath.value = pageURL.value.pathname.split("/").filter(part=>part!="")); +Signal.effect(()=>{ + //@ts-ignore 1337 hax + if(context){context.__.blocked.value = false;} + pagePath.value = pageURL.value.pathname.split("/").filter(part=>part!=""); +}); //// Add handlers globalThis.addEventListener("click", e=> { @@ -44,14 +55,7 @@ globalThis.addEventListener("click", e=> }) }); globalThis.addEventListener("popstate", _=> pageURL.value = new URL(globalThis.location.href) ); -/// Rendering context -type RouteContextData = { - /** Current nested depth of the router */ nestedDepth:number, - /** Index into the page path to start matching routes */ pathIndex:number, - /** Collection of keys from matched routes ("page/:key/") */ keys: Record, - blocked: Signal.Signal -} -const context = React.createContext({nestedDepth:0, pathIndex:0, keys:{}, blocked:Signal.signal(false as false|string)} as RouteContextData); +//// Rendering context type PathFields = {pathAfter:string[], pathBefore:[], compare:typeof compare} const compare =(pathA:string[], pathB:string[])=> { @@ -88,21 +92,21 @@ export const useRoute =()=> { const pathBefore = pathFull.slice(0, Math.max(0, routeContext.pathIndex-1)); return { ...routeContext, pathAfter, pathBefore, compare } as PathFields&RouteContextData; } -export const Route =(props:{path:string[], children:React.ReactNode|React.ReactNode[]}):React.JSX.Element|null=> +export const Route =(props:{path?:string[], children:React.ReactNode|React.ReactNode[]}):React.JSX.Element|null=> { - const {nestedDepth, pathIndex, pathAfter, compare, keys} = useRoute(); - const check = compare(props.path, pathAfter); - if (check) + const {nestedDepth, pathIndex, pathAfter, compare, keys, blocked} = useRoute(); + + if(blocked.peek()){ return null; } + + const passOn:RouteContextData = { nestedDepth:nestedDepth+1, pathIndex, keys, blocked:Signal.signal(false) } + if(props.path) { - return {props.children}; - } - else - { - return null; + const check = compare(props.path, pathAfter); + if (!check){ return null; } + + blocked.value = "/"+props.path.join("/"); + passOn.pathIndex += check.comparisonSize; + passOn.keys = {...keys, ...check.keys}; } + return {props.children}; } \ No newline at end of file