// #region Imports
import { directive } from 'lit/directive.js';
import { DirectiveBase, PartType } from '../Controls/Directives/Abstracts/DirectiveBase';
import { RendererServiceLocator } from '../Dom/Renderer';
class RouterLinkDirective extends DirectiveBase {
    constructor(args) {
        super(args);
        if (args.type !== PartType.ELEMENT) {
            throw new Error('routerLink directive can only be used on elements.');
        }
    }
    render(_opts) {
        return;
    }
    update(part, [opts]) {
        const href = this.buildHref(opts.href, opts.query ?? {});
        RendererServiceLocator.current.setAttribute(part.element, 'role', 'link');
        RendererServiceLocator.current.setAttribute(part.element, 'href', href);
        if (opts.target) {
            RendererServiceLocator.current.setAttribute(part.element, 'target', opts.target);
        }
        else {
            RendererServiceLocator.current.removeAttribute(part.element, 'target');
        }
        return;
    }
    /**
     * Builds the href value for the element.
     * Returns a path-based href that works with both hash and history routing.
     * The RouterController will handle the actual navigation based on its routing mode.
     */
    buildHref(href, query) {
        // Build query string if present
        const queryString = Object.entries(query)
            .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
            .join('&');
        // Return path with optional query string
        // The RouterController will interpret this correctly for both hash and history routing
        return queryString ? `${href}?${queryString}` : href;
    }
}
export const routerLink = directive(RouterLinkDirective);
//# sourceMappingURL=RouterLinkDirective.js.map