rynex
Version:
A minimalist TypeScript framework for building reactive web applications with no virtual DOM
72 lines • 2.02 kB
TypeScript
/**
* Routing Helper Functions
* UI components and utilities for routing
*/
import { Router, RouteContext } from '../router.js';
/**
* Link component - creates a router-aware link
*/
export declare function Link(props: {
to: string;
class?: string;
style?: Partial<CSSStyleDeclaration>;
activeClass?: string;
exact?: boolean;
}, children: string | HTMLElement | (string | HTMLElement)[]): HTMLAnchorElement;
/**
* NavLink component - Link with automatic active styling
*/
export declare function NavLink(props: {
to: string;
class?: string;
activeClass?: string;
style?: Partial<CSSStyleDeclaration>;
exact?: boolean;
}, children: string | HTMLElement | (string | HTMLElement)[]): HTMLAnchorElement;
/**
* Router outlet component - renders matched route
*/
export declare function RouterOutlet(router: Router): HTMLDivElement;
/**
* Route guard component - conditionally render based on route
*/
export declare function RouteGuard(condition: (ctx: RouteContext) => boolean, children: HTMLElement, fallback?: HTMLElement): HTMLElement;
/**
* Breadcrumb component
*/
export declare function Breadcrumb(props?: {
separator?: string;
class?: string;
style?: Partial<CSSStyleDeclaration>;
}): HTMLElement;
/**
* Back button component
*/
export declare function BackButton(props?: {
text?: string;
class?: string;
style?: Partial<CSSStyleDeclaration>;
}): HTMLButtonElement;
/**
* Route params display (for debugging)
*/
export declare function RouteParamsDebug(router: Router): HTMLElement;
/**
* Loading component for lazy routes
*/
export declare function RouteLoading(props?: {
text?: string;
class?: string;
style?: Partial<CSSStyleDeclaration>;
}): HTMLElement;
/**
* 404 Not Found component
*/
export declare function NotFound(props?: {
title?: string;
message?: string;
homeLink?: boolean;
class?: string;
style?: Partial<CSSStyleDeclaration>;
}): HTMLElement;
//# sourceMappingURL=routing.d.ts.map