import { LitElement } from 'lit';
/**
 * CTT Side Panel Web Component - Enhanced Visual Design
 *
 * A modern, visually appealing fixed-position sidebar container for the CTT Design System.
 * Features enhanced shadows, smooth animations, and optimized layout structure.
 * Acts as a container for multiple collapsible sections (ctt-side-panel-item).
 *
 * @element ctt-side-panel
 *
 * @slot - Main content slot for ctt-side-panel-item components
 *
 * @csspart panel - The main panel container
 *
 * @cssprop --width - Custom width for the panel (default: 360px)
 *
 * @fires toggle - Dispatched when the panel is toggled between collapsed/expanded states
 *
 * @example
 * ```html
 * <ctt-side-panel width="360px" collapsible>
 *   <ctt-side-panel-item title="Section 1">
 *     Content here
 *   </ctt-side-panel-item>
 * </ctt-side-panel>
 * ```
 */
declare global {
    interface HTMLElementTagNameMap {
        'ctt-side-panel': CttSidePanel;
    }
}
export declare class CttSidePanel extends LitElement {
    static styles: import("lit").CSSResult;
    /**
     * Width of the side panel
     */
    width: string;
    /**
     * Whether the panel is collapsible (enables collapse/hide feature)
     */
    collapsible: boolean;
    /**
     * Whether the panel is currently collapsed (only relevant when collapsible is true)
     */
    collapsed: boolean;
    ariaLabel: string;
    constructor();
    connectedCallback(): void;
    disconnectedCallback(): void;
    /**
     * Handles toggle events from ctt-side-panel-item children.
     * Enforces exclusive-open: only one item may be open at a time.
     */
    private _handleItemToggle;
    /**
     * Toggles the collapsed state when collapsible is enabled
     */
    toggle(): void;
    render(): import("lit-html").TemplateResult<1>;
}