lit-ui-router / RoutedLitTemplate

Type Alias: RoutedLitTemplate<T>

type RoutedLitTemplate<T> = (props?) => TemplateResult | (props) => TemplateResult;

Defined in: packages/lit-ui-router/src/interface.ts:216

A function that returns a Lit TemplateResult for rendering in a <ui-view>.

This is the simplest way to define route components - no LitElement class needed. The function optionally receives UIViewInjectedProps as its argument.

Type Parameters

Type Parameter	Default type
T extends DefaultResolvesType	DefaultResolvesType

Examples

const HomeView: RoutedLitTemplate = () => html`<h1>Welcome Home</h1>`;

// Or use directly inline in a state declaration:
{ name: 'home', url: '/', component: () => html`<h1>Home</h1>` }

const UserView: RoutedLitTemplate = (props) => html`
  <h1>User: ${props?.transition?.params().id}</h1>
`;

interface UserResolves {
  user: { name: string };
}

const UserDetail: RoutedLitTemplate<UserResolves> = (props) => html`
  <h1>${props?.resolves?.user?.name}</h1>
`;