import type { CSSResultGroup } from 'lit';
import DSAIcon from '../icon/icon';
import { ShoelaceElement } from '../../internal/shoelace-element';
/**
 * @summary Split panels display two adjacent panels, allowing the user to reposition them.
 * @documentation https://dsa.service-public-autonomie.fr/latest/librairie-webcomponents/split-panel-panneau-fractionne/web-26fpFxUI
 *
 * @dependency dsa-icon
 *
 * @event dsa-reposition - Emitted when the divider's position changes.
 *
 * @slot start - Content to place in the start panel.
 * @slot end - Content to place in the end panel.
 *
 * @cssproperty [--min=0] - The minimum allowed size of the primary panel.
 * @cssproperty [--max=100%] - The maximum allowed size of the primary panel.
 */
export default class DSASplitPanel extends ShoelaceElement {
    static styles: CSSResultGroup;
    static dependencies: {
        'dsa-icon': typeof DSAIcon;
    };
    private cachedPositionInPixels;
    private readonly localize;
    private resizeObserver;
    private size;
    private snapValues;
    divider: HTMLElement;
    /**
     * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the
     * container's initial size.
     */
    position: number;
    /** The current position of the divider from the primary panel's edge in pixels. */
    positionInPixels: number;
    /** Draws the split panel in a vertical orientation with the start and end panels stacked. */
    vertical: boolean;
    /** Disables resizing. Note that the position may still change as a result of resizing the host element. */
    disabled: boolean;
    /**
     * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a
     * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the
     * host element is resized.
     */
    primary?: 'start' | 'end';
    /**
     * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.
     * `"100px 50%"`.
     */
    snap?: string;
    handleSnapChange(): void;
    /** How close the divider must be to a snap point until snapping occurs. */
    snapThreshold: number;
    connectedCallback(): void;
    disconnectedCallback(): void;
    private detectSize;
    private percentageToPixels;
    private pixelsToPercentage;
    private handleDrag;
    private handleKeyDown;
    private handleResize;
    handlePositionChange(): void;
    handlePositionInPixelsChange(): void;
    handleVerticalChange(): void;
    render(): import("lit").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'dsa-split-panel': DSASplitPanel;
    }
}