import { LitElement, type PropertyValues } from 'lit';
import { LayoutBreakpoint, SiderTheme } from './layout.types.js';
declare const NrSiderElement_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
/**
 * # Sider Component
 *
 * The sidebar component with collapsible functionality, theme support, and responsive behavior.
 * Must be placed inside a Layout component.
 *
 * @element nr-sider
 *
 * @slot - Default slot for sider content (usually navigation menu)
 * @slot trigger - Custom trigger slot (overrides default trigger)
 *
 * @fires collapse - Fired when the sider is collapsed or expanded
 * @fires breakpoint - Fired when the breakpoint is triggered
 *
 * @csspart sider - The sider container element
 * @csspart trigger - The collapse trigger element
 * @csspart children - The inner content wrapper div
 *
 * @example
 * ```html
 * <nr-layout has-sider>
 *   <nr-sider collapsible breakpoint="lg">
 *     <nav>Navigation Menu</nav>
 *   </nr-sider>
 *   <nr-content>Content</nr-content>
 * </nr-layout>
 * ```
 */
export declare class NrSiderElement extends NrSiderElement_base {
    static styles: import("lit").CSSResult;
    static useShadowDom: boolean;
    /**
     * Breakpoint for responsive collapsing
     */
    breakpoint?: LayoutBreakpoint;
    /**
     * Current collapsed state (controlled)
     */
    collapsed: boolean;
    /**
     * Width when collapsed. Set to 0 for a special trigger.
     */
    collapsedWidth: number;
    /**
     * Whether the sider can be collapsed
     */
    collapsible: boolean;
    /**
     * Initial collapsed state (uncontrolled)
     */
    defaultCollapsed: boolean;
    /**
     * Reverse the arrow direction (for right-side sider)
     */
    reverseArrow: boolean;
    /**
     * Sider theme (light or dark)
     */
    theme: SiderTheme;
    /**
     * Custom trigger element. Set to null to hide trigger.
     */
    trigger: 'default' | null;
    /**
     * Sider width when expanded
     */
    width: number | string;
    /**
     * Custom styles for zero-width trigger
     */
    zeroWidthTriggerStyle: string;
    /**
     * Internal state for tracking if breakpoint is active
     */
    private belowBreakpoint;
    /**
     * ResizeObserver for responsive behavior
     */
    private resizeObserver?;
    connectedCallback(): void;
    disconnectedCallback(): void;
    updated(changedProperties: PropertyValues): void;
    /**
     * Setup ResizeObserver for responsive breakpoint behavior
     */
    private setupResizeObserver;
    /**
     * Toggle collapsed state
     */
    private toggleCollapse;
    /**
     * Dispatch collapse event
     */
    private dispatchCollapseEvent;
    /**
     * Dispatch breakpoint event
     */
    private dispatchBreakpointEvent;
    /**
     * Get the current width based on collapsed state
     */
    private getCurrentWidth;
    /**
     * Render the collapse trigger
     */
    private renderTrigger;
    render(): import("lit-html").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'nr-sider': NrSiderElement;
    }
}
export {};
//# sourceMappingURL=sider.component.d.ts.map