import { CustomElement } from '../../Abstracts/CustomElement';
import type { IRegionElementProps } from './IRegionElementProps';
import { IEventDetail } from '@breadstone/mosaik-elements';
declare const RegionElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
/**
 * Region - A container that hosts multiple view definitions with exclusive activation.
 *
 * Manages the lifecycle of views within it, ensuring only one view is instantiated and rendered at a time.
 * Views are lazily instantiated when activated and cleanly destroyed when deactivated,
 * providing efficient memory usage and proper lifecycle management for complex multi-view layouts.
 *
 * Perfect for wizards, steppers, tabbed interfaces, or any scenario requiring mutually exclusive view states
 * without manual DOM manipulation or conditional rendering logic in templates.
 *
 * @name RegionElement
 * @element mosaik-region
 * @category Grouping
 *
 * @slot default - Contains mosaik-region-view definitions to be managed by the region
 *
 * @csspart host - The container element that renders the active view's content
 *
 * @fires activeChanged - Fired when the active view changes, with detail { active: string, previous?: string }
 *
 * @dependency RegionViewElement - View definition component
 *
 * @example
 * ```html
 * <!-- Basic region with navigation -->
 * <mosaik-region id="wizard" active="step1">
 *   <mosaik-region-view name="step1" default>
 *     <div>Welcome to Step 1</div>
 *   </mosaik-region-view>
 *   <mosaik-region-view name="step2">
 *     <div>Proceed to Step 2</div>
 *   </mosaik-region-view>
 *   <mosaik-region-view name="step3">
 *     <div>Final Step</div>
 *   </mosaik-region-view>
 * </mosaik-region>
 *
 * <script>
 *   const region = document.getElementById('wizard');
 *   region.activate('step2'); // Switch to step 2
 * </script>
 * ```
 *
 * @example
 * ```html
 * <!-- Tabbed interface -->
 * <mosaik-region active="overview">
 *   <mosaik-region-view name="overview" default>
 *     <my-overview-component></my-overview-component>
 *   </mosaik-region-view>
 *   <mosaik-region-view name="details">
 *     <my-details-component></my-details-component>
 *   </mosaik-region-view>
 *   <mosaik-region-view name="settings">
 *     <my-settings-component></my-settings-component>
 *   </mosaik-region-view>
 * </mosaik-region>
 *
 * <mosaik-button-group>
 *   <mosaik-button onclick="document.querySelector('mosaik-region').activate('overview')">Overview</mosaik-button>
 *   <mosaik-button onclick="document.querySelector('mosaik-region').activate('details')">Details</mosaik-button>
 *   <mosaik-button onclick="document.querySelector('mosaik-region').activate('settings')">Settings</mosaik-button>
 * </mosaik-button-group>
 * ```
 *
 * @public
 */
export declare class RegionElement extends RegionElement_base implements IRegionElementProps {
    private readonly _viewDefinitions;
    private _active;
    private _currentActiveName;
    private _hostContainer;
    private _isInitialized;
    /**
     * @public
     */
    constructor();
    /**
     * Returns the `{@link is}` property.
     * The `{@link is}` property represents natural name of this element.
     *
     * @public
     * @static
     * @readonly
     */
    static get is(): string;
    /**
     * The name of the currently active view.
     *
     * @public
     */
    get active(): string;
    set active(value: string);
    /**
     * @public
     * @override
     */
    connectedCallback(): void;
    /**
     * @public
     * @override
     */
    firstUpdated(changedProperties: Map<keyof this, unknown>): void;
    /**
     * Waits for all child RegionViewElements to complete their firstUpdated
     * and capture their templates before rendering the active view.
     *
     * @private
     */
    private waitForViewsAndRender;
    /**
     * @public
     * @override
     */
    updated(changedProperties: Map<string | number | symbol, unknown>): void;
    /**
     * Activates a view by name.
     *
     * @param name - The name of the view to activate
     * @public
     */
    activate(name: string): void;
    /**
     * Collects all mosaik-region-view children and builds the view definitions map.
     *
     * @private
     */
    private collectViewDefinitions;
    /**
     * Determines the initial active view based on the active attribute, default attribute, or first view.
     *
     * @private
     */
    private determineInitialActive;
    /**
     * Renders the currently active view by cloning its template content.
     *
     * @private
     */
    private renderActiveView;
    /**
     * Dispatches the active-changed event.
     *
     * @param previousActive - The previously active view name
     * @private
     */
    private _dispatchActiveChangedEvent;
}
/**
 * @public
 */
export declare namespace RegionElement {
    type Props = IRegionElementProps;
}
/**
 * @public
 */
declare global {
    interface HTMLElementTagNameMap {
        'mosaik-region': RegionElement;
    }
    interface HTMLElementEventMap {
        activeChanged: CustomEvent<IEventDetail>;
    }
}
export {};
//# sourceMappingURL=RegionElement.d.ts.map