Where does this request go?
Enter a URL and follow it through TLS, host and path matching, middleware and upstream choice to the demo service that answers.
Installation
pnpm dlx shadcn@latest add @lumesec/sv-route-testerFirst timeRegister the @lumesec registry once, or install by URL+
Adds @lumesec to your components.json:
pnpm dlx shadcn@latest registry add @lumesec=https://elements.lumesec.ai/r/{name}.jsonOr skip the setup and install by URL:
npx shadcn@latest add https://elements.lumesec.ai/r/sv-route-tester.jsonUsage
import { SvRouteTester } from "@/components/lumesec/sv-route-tester";
export function Example() {
return (
<SvRouteTester />
);
}Behaviour
Enter a URL and follow it through TLS, host and path matching, middleware and upstream choice to the service that answers.
API reference
Events
Events bubble and cross the shadow boundary unless the description says otherwise.
routeReact proponRouteDetail{ status: number | string, upstream: string | null }Fires when the walkthrough ends. status is 200, 302 (sign-in redirect), 404 (no route), 400 (invalid URL) or 'TLS' for a failed handshake; upstream is the answering service id or null.
Methods
Call them on the element, for example through a React ref.
send()Routes the URL currently in the field and plays the steps, as Send does.
Accessibility
- The URL field is labelled Request URL and sits in a form, so Enter sends it.
- The result line is a polite live region: Routing, then the status.
- The step canvas is
aria-hidden. - Reduced motion: each step resolves in 0.01 s instead of 0.42 s and no particle travels down the pipeline.
Theming
The element reads your shadcn theme tokens through its shadow root, so light and dark follow your theme. The accent comes from --lumesec. See Theming.
This component reads --border, --card, --destructive, --foreground, --input, --lumesec, --lumesec-success, --lumesec-warning and --muted-foreground.
To restyle only LumeSec elements, set the matching --ui-* overrides: --ui-accent, --ui-border, --ui-border-strong, --ui-danger, --ui-fg, --ui-mono, --ui-muted, --ui-ok, --ui-surface and --ui-warn.
Notes
- Routes against the demo routes in
INFRA: hosts outside*.lumesec.localfail TLS, unknown hosts get 404, the longest matching path wins, routes with SSO required redirect, and the upstream is picked at random from the route's backends. - The field starts with https://api.lumesec.local/v1/infer; no attribute sets it. Example buttons fill in and send sample URLs, including docs.lumesec.local, which has no route.
Related
Was this page helpful?