import { default as CortexElement } from '../../../../base/src/cortex-element.ts';
import { TreeSelection } from '../../../../types/src/tree';
import { ExpandButtonPlacement } from '../../../../types/src/tree-item';
import { CSSResultGroup, PropertyValues } from 'lit';
import { default as Sortable } from 'sortablejs';
import { default as CxTreeItem } from '../tree-item/tree-item';

export declare function syncParentItem(treeItem: CxTreeItem): void;
export declare function syncAncestors(treeItem: CxTreeItem, selection?: TreeSelection): void;
export declare function syncCheckboxes(changedTreeItem: CxTreeItem, initialSync?: boolean, selection?: TreeSelection): void;
/**
 * @summary The <cx-tree> component is used to display a hierarchical list of selectable [tree items](?s=atoms&id=/tree-item). Items with children can be expanded and collapsed as desired by the user.
 *
 * @event {{ selection: CxTreeItem[] }} cx-selection-change - Emitted when a tree item is selected or deselected.
 *
 * @slot (default) - The default slot.
 * @slot expand-icon - The icon to show when the tree item is expanded. Works best with `<cx-icon>`.
 * @slot collapse-icon - The icon to show when the tree item is collapsed. Works best with `<cx-icon>`.
 *
 * @csspart base - The component's base wrapper.
 *
 * @cssproperty [--indent-size=var(--cx-spacing-medium)] - The size of the indentation for nested items.
 * @cssproperty [--indent-guide-color=var(--cx-color-neutral-200)] - The color of the indentation line.
 * @cssproperty [--indent-guide-offset=0] - The amount of vertical spacing to leave between the top and bottom of the
 *  indentation line's starting position.
 * @cssproperty [--indent-guide-style=solid] - The style of the indentation line, e.g. solid, dotted, dashed.
 * @cssproperty [--indent-guide-width=0] - The width of the indentation line.
 */
export default class CxTree extends CortexElement {
    static readonly styles: CSSResultGroup;
    defaultSlot: HTMLSlotElement;
    expandedIconSlot: HTMLSlotElement;
    collapsedIconSlot: HTMLSlotElement;
    /** Whether to allow the tree to be sorted by dragging and dropping items. */
    sortable: boolean;
    /** Defines the group name for this tree, allowing multiple trees to be sortable together. */
    sortableGroup: string | null;
    /** Whether to disable the sortable group feature, allowing items to be sorted only within the tree. */
    disabledSortableGroup: boolean;
    /**
     * The selection behavior of the tree. Single selection allows only one node to be selected at a time. Multiple
     * displays checkboxes and allows more than one node to be selected. Leaf allows only leaf nodes to be selected.
     */
    selection: TreeSelection;
    /**
     * Whether to automatically expand after loading finishes.
     */
    disabledAutoExpand: boolean;
    /**
     * Whether to automatically expand to the selected items.
     */
    autoExpandToSelected: boolean;
    /**
     * Expand button placement
     */
    expandButtonPlacement: ExpandButtonPlacement;
    /**
     * Whether to not forward the expand button placement to the children.
     */
    noForwardExpandButtonPlacement: boolean;
    /**
     * When set to true, the `cx-selection-change` event will be emitted on every change of the value, even if the value is not changed.
     */
    forceOnChange: boolean;
    /**
     * When set to true, clicking the label of a tree item will deselect all other items and select the clicked item.
     * This is useful when the selection mode is set to 'multiple' and you want to allow the user to select a single item
     * by clicking its label, without having to use the checkbox. This is the behavior of the filter in DAM view.
     */
    labelSelectSingle: boolean;
    /**
     * Whether to disable dragging an item inside another item for this tree.
     */
    noDragInside: boolean;
    /**
     * Indicates whether the tree items are focusable.
     * If set to 'false', the tree items will not be focusable and will not receive focus when the user clicks on it.
     */
    focusable: boolean;
    /**
     * A collection of all the items in the tree, in the order they appear.
     * The collection is live, meaning it is automatically updated when the underlying document is changed.
     */
    private lastFocusedItem;
    private mutationObserver;
    private autoExpandObserver;
    private clickTarget;
    private readonly localize;
    private sortableInstance;
    constructor();
    runConnectedCallback(): void;
    disconnectedCallback(): void;
    /**
     * Generates a clone of the expand icon element to use for each tree item
     */
    private getExpandButtonIcon;
    /**
     * Initializes new items by setting the `selectable` property and the expanded/collapsed icons if any
     */
    private initTreeItem;
    initTreeItems(): void;
    private handleTreeChanged;
    /**
     * Handles the selection of a tree item based on the current selection mode.
     *
     * @param selectedItem - The tree item that is being selected or toggled.
     * @param isSingleSelect - Optional flag to force the item to be selected and unselect all other items.
     */
    private selectItem;
    private getAllTreeItems;
    private getAllDirectTreeItems;
    private focusItem;
    private handleKeyDown;
    private handleClick;
    handleMouseDown(event: MouseEvent): void;
    private handleFocusOut;
    private handleFocusIn;
    private expandToItem;
    private handleSlotChange;
    handleSortableUpdate(evt: Sortable.SortableEvent): void;
    private destroySortable;
    getSortableGroup(): string | undefined;
    handleSortableStart(): void;
    handleSortableEnd(): void;
    private initSortable;
    handleSelectionChange(): Promise<void>;
    protected updated(changedProperties: PropertyValues): void;
    /**
     * Returns the list of tree items that are selected in the tree.
     *
     * @internal
     */
    get selectedItems(): CxTreeItem[];
    /**
     * Gets focusable tree items in the tree.
     *
     * @internal
     */
    getFocusableItems(): CxTreeItem[];
    render(): import('lit').TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'cx-tree': CxTree;
    }
}
