@octanejs/tanstack-router 0.1.10 → 0.1.12

package/src/link.ts

@@ -9,6 +9,7 @@
 // with replace/resetScroll/hashScrollIntoView/viewTransition/startTransition/
 // ignoreBlocker forwarded), and data-status/data-transitioning reflection.
 import { useRef, useState, useEffect, useCallback, flushSync, createElement } from 'octane';
+import type { ComponentBody } from 'octane';
 import {
 	deepEqual,
 	exactPathTest,
@@ -22,6 +23,9 @@ import { useRouter } from './context';
 import { useStore } from './useStore';
 import { splitSlot, subSlot } from './internal';
 import { Link } from './Link.tsrx';
+import type { AnyRouter, RegisteredRouter } from '@tanstack/router-core';
+import type { LinkComponent, OctaneAnchorProps, UseLinkPropsOptions } from './linkTypes';
+import type { ValidateLinkOptions, ValidateLinkOptionsArray } from './typePrimitives';
 
 const STATIC_EMPTY_OBJECT = {};
 const STATIC_ACTIVE_OBJECT = { class: 'active' };
@@ -82,6 +86,13 @@ function mergeStyles(base: any, active: any, inactive: any): any {
 	return Object.assign({}, ...parts);
 }
 
+export function useLinkProps<
+	TRouter extends AnyRouter = RegisteredRouter,
+	const TFrom extends string = string,
+	const TTo extends string | undefined = undefined,
+	const TMaskFrom extends string = TFrom,
+	const TMaskTo extends string = '',
+>(options: UseLinkPropsOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): OctaneAnchorProps;
 export function useLinkProps(...args: any[]): Record<string, any> {
 	const [user, slot] = splitSlot(args);
 	const options = (user[0] ?? {}) as Record<string, any>;
@@ -371,13 +382,23 @@ export function useLinkProps(...args: any[]): Record<string, any> {
 
 // Wrap a design-system component so it navigates like <Link> — the component
 // receives the fully-built link props (href, handlers, data-status, …).
+export function createLink<const TComp extends ComponentBody<any>>(
+	Comp: TComp,
+): LinkComponent<TComp>;
 export function createLink(Comp: any): any {
 	return function CreatedLink(props: any) {
 		return createElement(Link as any, { ...props, _asChild: Comp });
 	};
 }
 
-// Identity helper for pre-validating navigation options (type-level upstream).
-export function linkOptions(options: any): any {
-	return options;
-}
+export type LinkOptionsFnOptions<TOptions, TComp, TRouter extends AnyRouter = RegisteredRouter> =
+	TOptions extends ReadonlyArray<any>
+		? ValidateLinkOptionsArray<TRouter, TOptions, string, TComp>
+		: ValidateLinkOptions<TRouter, TOptions, string, TComp>;
+
+export type LinkOptionsFn<TComp> = <const TOptions, TRouter extends AnyRouter = RegisteredRouter>(
+	options: LinkOptionsFnOptions<TOptions, TComp, TRouter>,
+) => TOptions;
+
+// Identity helper for pre-validating and reusing navigation options.
+export const linkOptions: LinkOptionsFn<'a'> = (options) => options as any;

package/src/linkTypes.ts

@@ -0,0 +1,95 @@
+import type { ComponentBody, ElementDescriptor } from 'octane';
+import type { Octane } from 'octane/jsx-runtime';
+import type { AnyRouter, LinkOptions, RegisteredRouter, RoutePaths } from '@tanstack/router-core';
+export type OctaneAnchorProps = Octane.JSX.IntrinsicElements['a'];
+
+export type OctaneRenderable =
+	| ElementDescriptor<unknown>
+	| string
+	| number
+	| bigint
+	| boolean
+	| null
+	| undefined
+	| ReadonlyArray<OctaneRenderable>;
+
+type OctaneComponentProps<TComp> = TComp extends keyof Octane.JSX.IntrinsicElements
+	? Octane.JSX.IntrinsicElements[TComp]
+	: TComp extends ComponentBody<infer TProps, infer _TExtra>
+		? TProps
+		: never;
+
+export type UseLinkPropsOptions<
+	TRouter extends AnyRouter = RegisteredRouter,
+	TFrom extends RoutePaths<TRouter['routeTree']> | string = string,
+	TTo extends string | undefined = '.',
+	TMaskFrom extends RoutePaths<TRouter['routeTree']> | string = TFrom,
+	TMaskTo extends string = '.',
+> = ActiveLinkOptions<'a', TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & OctaneAnchorProps;
+
+export type ActiveLinkOptions<
+	TComp = 'a',
+	TRouter extends AnyRouter = RegisteredRouter,
+	TFrom extends string = string,
+	TTo extends string | undefined = '.',
+	TMaskFrom extends string = TFrom,
+	TMaskTo extends string = '.',
+> = LinkOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & ActiveLinkOptionProps<TComp>;
+
+type ActiveLinkProps<TComp> = Partial<
+	OctaneComponentProps<TComp> & {
+		[key: `data-${string}`]: unknown;
+	}
+>;
+
+export interface ActiveLinkOptionProps<TComp = 'a'> {
+	activeProps?: ActiveLinkProps<TComp> | (() => ActiveLinkProps<TComp>);
+	inactiveProps?: ActiveLinkProps<TComp> | (() => ActiveLinkProps<TComp>);
+}
+
+export type LinkProps<
+	TComp = 'a',
+	TRouter extends AnyRouter = RegisteredRouter,
+	TFrom extends string = string,
+	TTo extends string | undefined = '.',
+	TMaskFrom extends string = TFrom,
+	TMaskTo extends string = '.',
+> = ActiveLinkOptions<TComp, TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & LinkPropsChildren;
+
+export interface LinkPropsChildren {
+	children?:
+		OctaneRenderable | ((state: { isActive: boolean; isTransitioning: boolean }) => unknown);
+}
+
+export type CreateLinkProps = LinkProps<any, any, string, string, string, string>;
+
+export type LinkComponentProps<
+	TComp = 'a',
+	TRouter extends AnyRouter = RegisteredRouter,
+	TFrom extends string = string,
+	TTo extends string | undefined = '.',
+	TMaskFrom extends string = TFrom,
+	TMaskTo extends string = '.',
+> = Omit<OctaneComponentProps<TComp>, keyof CreateLinkProps> &
+	LinkProps<TComp, TRouter, TFrom, TTo, TMaskFrom, TMaskTo>;
+
+export type LinkComponent<in out TComp, in out TDefaultFrom extends string = string> = <
+	TRouter extends AnyRouter = RegisteredRouter,
+	const TFrom extends string = TDefaultFrom,
+	const TTo extends string | undefined = undefined,
+	const TMaskFrom extends string = TFrom,
+	const TMaskTo extends string = '',
+>(
+	props: LinkComponentProps<TComp, TRouter, TFrom, TTo, TMaskFrom, TMaskTo>,
+) => void;
+
+export interface LinkComponentRoute<in out TDefaultFrom extends string = string> {
+	defaultFrom: TDefaultFrom;
+	<
+		TRouter extends AnyRouter = RegisteredRouter,
+		const TTo extends string | undefined = undefined,
+		const TMaskTo extends string = '',
+	>(
+		props: LinkComponentProps<'a', TRouter, this['defaultFrom'], TTo, this['defaultFrom'], TMaskTo>,
+	): void;
+}

package/src/not-found.tsrx

@@ -27,8 +27,8 @@ export function CatchNotFound(props: {
 	children: OctaneNode;
 }) @{
 	const router = useRouter();
-	const pathname = useStore(router.stores.location, (l) => l.pathname);
-	const status = useStore(router.stores.status, (s) => s);
+	const pathname = useStore(router.stores.location, (l: any) => l.pathname as string);
+	const status = useStore(router.stores.status, (s: any) => s as string);
 	const resetKey = `not-found-${pathname}-${status}`;
 
 	<CatchBoundary

package/src/octane-compiler.d.ts

@@ -0,0 +1,12 @@
+declare module 'octane/compiler/volar' {
+	export interface VolarCompileResult {
+		code: string;
+		mappings: Array<unknown>;
+		cssMappings: Array<unknown>;
+		scriptMappings: Array<unknown>;
+		sourceAst: unknown;
+		errors: Array<unknown>;
+	}
+
+	export function compileToVolarMappings(source: string, filename?: string): VolarCompileResult;
+}