import { PartInfo } from 'lit/directive.js';
import { AsyncDirective } from 'lit/async-directive.js';
declare class ObservableDirective extends AsyncDirective {
    private value?;
    private path?;
    private changeEvent?;
    private unsubscribe?;
    private lastValue?;
    constructor(_partInfo: PartInfo);
    get(path: string): unknown | undefined;
    /**
     * @param target The target object containing the data to render.
     * @param path The path to the property to render.
     * @param defaultValue The default value to use if the property is not found.
     * @param changeEvent The event type to listen for changes (default is 'change').
     */
    render(target: EventTarget, path: string, defaultValue?: unknown, changeEvent?: 'string'): unknown;
    subscribe(): void;
    protected disconnected(): void;
    protected reconnected(): void;
    protected listener(): void;
}
/**
 * A Lit directive that connects a `LiveData` property to a LitElement property.
 * When the `LiveData` property changes, the LitElement re-renders.
 *
 * @param liveData - The `LiveData` instance.
 * @param path - The dot-notation path to the property to observe (e.g., "user.name").
 * @returns The current value of the `LiveData` property.
 *
 * @example
 * ```typescript
 * import { LitElement, html } from 'lit'
 * import { customElement } from 'lit/decorators.js'
 *
 * class ObservableData extends EventTarget {
 *   // ...
 * }
 *
 * @customElement('my-element')
 * export class MyElement extends LitElement {
 *   // Create an observable instance
 *   userData = new ObservableData({ name: 'Initial Name' });
 *
 *   override render() {
 *     return html`
 *       <div>User Name: ${observable(this.userData, 'name', 'change')}</div>
 *     `;
 *   }
 * }
 * ```
 */
export declare const observable: (target: EventTarget, path: string, defaultValue?: unknown, changeEvent?: "string" | undefined) => import("lit-html/directive.js").DirectiveResult<typeof ObservableDirective>;
export {};
//# sourceMappingURL=observable.d.ts.map