import { RawParams, TransitionOptions, TargetState } from "@uirouter/core"; import { noChange, ElementPart } from "lit"; import { PartInfo } from "lit/directive.js"; import type { DirectiveResult } from "lit/directive.js"; import { AsyncDirective } from "lit/async-directive.js"; import { UIRouterLit } from "./core.js"; import { inLitDevMode } from "./dev-warn.js"; import { UiView } from "./ui-view.js"; import type { UiSrefElement } from "./sref-internals.js"; export { inLitDevMode }; export { UI_SREF_TARGET_EVENT, UI_SREF_TARGET_REMOVED_EVENT } from "./sref-internals.js"; export type { UiSrefElement, UiSrefTargetEvent } from "./sref-internals.js"; export { /** * @internal * @deprecated Directive plumbing, not a supported import. */ clickBelongsToBrowser, /** * @internal * @deprecated Directive plumbing, not a supported import. */ isNativeLink, /** * @internal * @deprecated Directive plumbing, not a supported import. */ sameTarget, /** * @internal * @deprecated Directive plumbing, not a supported import. */ srefEventLink, /** * @internal * @deprecated Directive plumbing, not a supported import. */ srefTransitionOptions, /** * @internal * @deprecated Directive plumbing, not a supported import. */ uiSrefTargetEvent, /** * @internal * @deprecated Directive plumbing, not a supported import. */ uiSrefTargetRemovedEvent } from "./sref-internals.js"; /** * Directive options for {@link uiSref}, passed alongside the transition * options in its third argument. These never reach `@uirouter/core`. * * @category types */ export interface UiSrefOptions { /** * Where the generated `href` is written. * * - `true` *(default in 1.x)* — always write it, whatever the element is. * This is the historical behaviour and the standing answer for a custom * element that declares its own `href`. * - `'auto'` — write it only to elements the HTML spec gives an `href`: * ``, ``, and SVG ``. This is the correct behaviour and * becomes the default in 2.0. * - `false` — never write it; the app manages the attribute itself. * * Under `true`, a non-link that receives an `href` warns once and names * `'auto'` as the fix. * * This option governs the `href` attribute **only**. Whether the click * handler defers to native browser behaviour is decided by the element * itself, never by this setting — see `isNativeLink`. */ assignHref?: boolean | "auto"; } /** * The third argument to {@link uiSref}: core's transition options plus this * directive's own. * * @category types */ export type UiSrefTransitionOptions = TransitionOptions & UiSrefOptions; /** * Directive class that creates state-based navigation links. * * This directive is used internally by the {@link uiSref} directive function. * It transforms elements (typically `` tags) into UI-Router navigation links * by setting the `href` attribute and handling click events. * * @see {@link uiSref} for the public API * @see {@link AsyncDirective} * @see {@link "@uirouter/core"!StateService.go | StateService.go} * * @category directives */ export declare class UiSrefDirective extends AsyncDirective { /** the target state name from the last render */ state: string | null; /** the target state params from the last render */ params: RawParams; /** the transition options from the last render */ options: TransitionOptions; /** @internal */ element: UiSrefElement | null; /** @internal */ uiRouter: UIRouterLit | undefined; /** @internal */ parentView: UiView | null; /** this directive's own options, stripped from the transition options */ uiSrefOptions: UiSrefOptions; /** the href computed for the target, or null when there is none */ href: string | null; /** the resolved target, or null until the router is found */ targetState: TargetState | null; /** whether the href currently on the element was written by us */ private _ownsHref; /** * Whether {@link seekRouter} has run. The seek is deferred a task past the * first render, so `uiRouter` being empty before it means "not looked yet", * not "not there" — only after it may a bail be reported as a missing * provider. * * @internal */ private _seekedRouter; /** @internal */ unsubscribe: (() => void) | undefined; /** * Kept across a disconnect so {@link reconnected} can re-arm. * @internal */ private _partElement; /** @internal */ constructor(partInfo: PartInfo); /** the transition options with `relative` defaulted to the enclosing view */ getOptions(opts?: TransitionOptions): TransitionOptions; /** @internal */ render(state: string, params?: RawParams, options?: TransitionOptions): typeof noChange; /** * Whether this render writes the `href`, warning once per element under lit's * dev build when the 1.x default puts one on something that cannot use it. * @internal */ shouldAssignHref(): boolean; /** @internal */ seekRouter(): void; /** * Names this sref in the missing-provider warning. Shared by the two sites * that observe the no-op — the render that writes no `href` and the click * that navigates nowhere — so an element that does both still warns once. * * @internal */ private warnMissingRouter; /** @internal */ seekParentView(): void; /** @internal */ disconnected(): void; /** * Re-arms after a detach/re-attach; `update` only re-arms on a NEW element. * @internal */ reconnected(): void; /** @internal */ onClick: (event: MouseEvent) => void; /** @internal */ update(part: ElementPart, [state, params, options]: [string, RawParams?, UiSrefTransitionOptions?]): typeof noChange; /** @internal */ doRender: () => typeof noChange; private _firstUpdated; /** * @internal */ firstUpdated(): void; } /** * Directive that creates state-based navigation links. * * The `uiSref` directive transforms elements (typically `` tags) into * UI-Router navigation links. It automatically generates the `href` attribute * based on the target state and handles click events to perform state transitions. * * **Arguments:** * - `state` - The target state name (can be relative like `.child` or `^.sibling`) * - `params` - Optional state parameters (see {@link RawParams}) * - `options` - Optional transition options (see {@link TransitionOptions}), plus * this directive's own (see {@link UiSrefOptions}) * * @example Basic usage * ```ts * import { uiSref } from 'lit-ui-router'; * import { html } from 'lit'; * * html`Go Home` * ``` * * @example With parameters * ```ts * html`View User` * ``` * * @example With transition options * ```ts * html`Reload Dashboard` * ``` * * @example Relative state references * ```ts * // Navigate to child state * html`Go to Child` * * // Navigate to sibling state * html`Go to Sibling` * ``` * * @example On an element that is not a link * ```ts * // `` * ``` * * @see {@link RawParams} * @see {@link TransitionOptions} * @see {@link UiSrefOptions} * @see {@link DirectiveResult} * * @category directives */ export declare const uiSref: (state: string, params?: RawParams, options?: UiSrefTransitionOptions) => DirectiveResult; //# sourceMappingURL=ui-sref.d.ts.map