import { ReactiveControllerHost } from 'lit';
/**
 * A reactive controller that provides a directive that listens for clicks outside the host element.
 * This provides a declarative way to listen for outside clicks.
 * Create an instance of `ClickOutsideController` in the constructor or in a class field, and call `instance.directive()` inside a html template.
 *
 * @example
 *
 * ```ts
 * class MyComponent extends DDSElement {
 *   private _clickOutsideController = new ClickOutsideController(
 *     this,
 *     this._onClickOutside
 *   );
 *
 *   private _onClickOutside(event: MouseEvent): void {
 *     console.debug("Click Outside", event);
 *     this.open = false;
 *   }
 *
 *   override render() {
 *     return html`<div ?hidden=${!open}>
 *       ${
 *         // Listen to click outside only when `this.open` is `true`.
 *         this._clickOutsideController.directive(this.open)
 *       }
 *     </div>`;
 *   }
 * }
 * ```
 */
export declare class ClickOutsideController<T extends ReactiveControllerHost & HTMLElement> {
    private readonly _host;
    private readonly _callback;
    constructor(_host: T, _callback: (this: T, event: MouseEvent) => void);
    directive(enabled?: boolean): import('lit-html/directive.js').DirectiveResult<import('lit-html/directive.js').DirectiveClass>;
}