import type { CSSResultGroup } from 'lit';
import SynergyElement from '../../internal/synergy-element.js';
import SynDropdown from '../dropdown/dropdown.component.js';
import SynIcon from '../icon/icon.component.js';
import SynMenu from '../menu/menu.component.js';
import SynNavItem from '../nav-item/nav-item.component.js';
/**
 * @summary The `<syn-prio-nav />` element provides a generic navigation bar
 * that can be used to group multiple navigation items  (usually horizontal `<syn-nav-item />`s)
 * together. It will automatically group all items not visible in the viewport into a custom
 * priority menu.
 *
 * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-prio-nav--docs
 * @example
 * <syn-prio-nav>
 *  <syn-nav-item current horizontal>Item 1</syn-nav-item>
 *  <button role="menuitem">Item 2 (custom)</button>
 *  <syn-nav-item horizontal>Item 3</syn-nav-item>
 * </syn-prio-nav>
 *
 * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-prio-nav--docs
 * @status stable
 * @since 1.14.0
 *
 * @dependency syn-dropdown
 * @dependency syn-icon
 * @dependency syn-menu
 * @dependency syn-nav-item
 *
 * @slot - The given navigation items. Must be horizontal `<syn-nav-item>`s
 *    or have a role of "menuitem"
 *
 * @csspart base - The component's base wrapper.
 * @csspart priority-menu - The wrapper around the priority menu
 * @csspart priority-menu-nav-item - The navigation item for the priority menu
 * @csspart priority-menu-label - The label for the priority menu
 * @csspart priority-menu-icon - The icon for the priority menu
 * @csspart priority-menu-container - The container for the shifted navigation items,
 *    if there is not enough space.
 *
 */
export default class SynPrioNav extends SynergyElement {
    static styles: CSSResultGroup;
    static dependencies: {
        'syn-dropdown': typeof SynDropdown;
        'syn-icon': typeof SynIcon;
        'syn-menu': typeof SynMenu;
        'syn-nav-item': typeof SynNavItem;
    };
    /**
     * Internal resize observer
     */
    private resizeObserver;
    private readonly localize;
    /**
     * Reference to the rendered children slot
     */
    private defaultSlot;
    /**
     * Reference to the slot where priority menu items are placed
     */
    private menuSlot;
    /**
     * The wrapper that holds the horizontal navigation items
     */
    private horizontalNav;
    /**
     * The priority menu dropdown
     */
    private priorityMenu;
    /**
     * Internal state reflecting if the item positions have been cached
     */
    private itemPositionsCached;
    /**
     * The amount of nav items that are currently slotted
     */
    private amountOfNavItems;
    /**
     * The amount of items that are currently visible
     */
    private amountOfVisibleItems;
    /**
     * Internal state reflecting if there are items in the priority menu
     */
    private hasItemsInDropdown;
    /**
     * Get a list of all slotted `<syn-nav-item />` elements
     * that are either in the main slot or the priority menu slot
     */
    private getSlottedNavItems;
    /**
     * Cache the items right offset position to make faster checks placement into priority menu
     * @param items The items to cache the position for
     */
    private cacheItemPositions;
    /**
     * Determines which items should be shown or hidden, depending on the current width
     */
    private handlePriorityMenu;
    private renderPriorityMenu;
    private slotChange;
    protected firstUpdated(): void;
    connectedCallback(): void;
    disconnectedCallback(): void;
    render(): import("lit").TemplateResult;
}