import { TemplateResult } from 'lit';
import { ApiDefinitions } from '@api-client/core/build/browser.js';
import { ApiEndpointsTreeItem, DocumentMeta, NavigationLayout, SelectionType, SelectableMenuItem, EndpointItem, EditableMenuItem, SchemaAddType, OperationItem, DocumentationItem, NodeShapeItem, SecurityItem } from '../../amf/types.js';
import ApiElement from '../ApiElement.js';
import '../../define/ui/ui-icon.js';
import '../../define/ui/ui-collapse.js';
import '../../define/ui/ui-icon-button.js';
/**
 * @fires apinavigate - Dispatched when a selection change
 * @fires graphload - When the graph was loaded
 */
export default class ApiNavigation extends ApiElement {
    protected queryingInternal?: boolean;
    protected abortControllerInternal?: AbortController;
    protected domainIdInternal?: string;
    protected domainTypeInternal?: SelectionType;
    protected selectedItemInternal?: HTMLElement;
    protected focusedItemInternal?: HTMLElement;
    /**
     * The processed and final query term for the list items.
     */
    protected queryInternal?: string;
    documentMeta?: DocumentMeta;
    protected layoutInternal?: NavigationLayout;
    protected endpointsExpandedInternal?: boolean;
    protected endpointsInternal?: EndpointItem[];
    get endpoints(): EndpointItem[] | undefined;
    protected documentationsInternal?: ApiDefinitions.IDocumentationItem[];
    get documentations(): ApiDefinitions.IDocumentationItem[] | undefined;
    protected schemasInternal?: ApiDefinitions.INodeShapeItem[];
    get schemas(): ApiDefinitions.INodeShapeItem[] | undefined;
    protected securityInternal?: ApiDefinitions.ISecurityItem[];
    get security(): ApiDefinitions.ISecurityItem[] | undefined;
    /**
     * Holds a list of ids of currently opened endpoints.
     */
    openedEndpoints: string[];
    /**
     * Cached list of all list elements
     */
    protected itemsInternal?: HTMLElement[];
    get items(): HTMLElement[] | undefined;
    sourceEndpoints?: ApiDefinitions.IApiEndPointWithOperationsListItem[];
    protected shiftTabPressedInternal?: boolean;
    get shiftTabPressed(): boolean;
    protected summarySelectedInternal?: boolean;
    protected addingSchemaTypeInternal?: string;
    protected addingSchemaInternal?: boolean;
    protected addingDocumentationInternal?: boolean;
    protected addingExternalInternal?: boolean;
    protected addingEndpointInternal?: boolean;
    /**
     * When true then the element is currently querying for the graph data.
     */
    get querying(): boolean;
    /**
     * Set when `querying`. Use to abort the query operation.
     * When calling `abort` on the controller the element stops querying and processing the graph data.
     * All data that already has been processed are not cleared.
     */
    get abortController(): AbortController | undefined;
    /**
     * A model `@id` of selected documentation part.
     * Special case is for `summary` view. It's not part of an API
     * but most applications has some kins of summary view for the
     * API.
     * @attribute
     */
    get domainId(): string | undefined;
    set domainId(value: string | undefined);
    /**
     * Type of the selected domain item.
     */
    get domainType(): SelectionType | undefined;
    /**
     * true when `_docs` property is set with values
     */
    get hasDocs(): boolean;
    /**
     * true when has schemas definitions
     */
    get hasSchemas(): boolean;
    /**
     * true when `_security` property is set with values
     */
    get hasSecurity(): boolean;
    /**
     * true when `_endpoints` property is set with values
     */
    get hasEndpoints(): boolean;
    /**
     * A reference to currently selected element.
     */
    get selectedItem(): HTMLElement | undefined;
    /**
     * The currently focused item.
     */
    get focusedItem(): HTMLElement | undefined;
    /**
     * Filters list elements by this value when set.
     * Clear the value to reset the search.
     *
     * This is not currently exposed in element's UI due
     * to complexity of search and performance.
     * @attribute
     */
    get query(): string | undefined;
    set query(value: string | undefined);
    /**
     * By default the endpoints are rendered one-by-one as defined in the API spec file
     * without any tree structure. When this option is set it sorts the endpoints
     * alphabetically and creates a tree structure for the endpoints.
     *
     * - tree - creates a tree structure from the endpoints list
     * - natural - behavior consistent with the previous version of the navigation. Creates a tree structure based on the previous endpoints.
     * - natural-sort - as `natural` but endpoints are sorted by name.
     * - off (or none) - just like in the API spec.
     *
     * Note, the resulted tree structure will likely be different to the one encoded
     * in the API spec file.
     * @attribute
     */
    get layout(): NavigationLayout | undefined;
    set layout(value: NavigationLayout | undefined);
    /**
     * When set it expands or opens all endpoints and makes all operations visible.
     * Note, the user can toggle an endpoint anyway so this property does not mean
     * that all endpoints are expanded. When it's true then it means that all endpoints
     * was expanded at some point in time.
     * @attribute
     */
    get endpointsExpanded(): boolean;
    set endpointsExpanded(value: boolean | undefined);
    /**
     * True when the summary entry is rendered.
     * Summary should be rendered only when `summary` is set and current model is not a RAML fragment.
     */
    get summaryRendered(): boolean;
    /**
     * When this property change the element queries the graph store for the data model.
     * It can be skipped when the application calls the `queryGraph()` method imperatively.
     * @attribute
     */
    apiId?: string;
    /**
     * If set it renders `API summary` menu option.
     * It will allow to set `domainId` and `domainType` to `summary`
     * when this option is set.
     * @attribute
     */
    summary?: boolean;
    /**
     * A label for the `summary` section.
     * @attribute
     */
    summaryLabel: string;
    /**
     * Determines and changes state of documentation panel.
     * @attribute
     */
    documentationsOpened?: boolean;
    /**
     * Determines and changes state of schemas (types) panel.
     * @attribute
     */
    schemasOpened?: boolean;
    /**
     * Determines and changes state of security panel.
     * @attribute
     */
    securityOpened?: boolean;
    /**
     * Determines and changes state of endpoints panel.
     * @attribute
     */
    endpointsOpened?: boolean;
    /**
     * Size of endpoint indentation for nested resources.
     * In pixels.
     *
     * The attribute name for this property is `indent-size`. Note, that this
     * will change to web consistent name `indentSize` in the future.
     * @attribute
     */
    indentSize?: number;
    /**
     * When set it renders an input to filter the menu items.
     * @attribute
     */
    filter?: boolean;
    /**
     * When set the element won't query the store when attached to the DOM.
     * Instead set the `apiId` property or directly call the `queryGraph()` function.
     * @attribute
     */
    manualQuery?: boolean;
    /**
     * When set it enables graph items editing functionality.
     * The user can double-click on a menu item and edit its name.
     * @attribute
     */
    edit?: boolean;
    constructor();
    /**
     * Ensures aria role attribute is in place.
     * Attaches element's listeners.
     */
    connectedCallback(): void;
    disconnectedCallback(): void;
    /**
     * Handler for the event dispatched by the store when the graph model change.
     */
    graphChangeHandler(): void;
    /**
     * Queries for the API data from the graph store.
     */
    queryGraph(): Promise<void>;
    /**
     * Queries for the current API base info.
     */
    queryApi(signal: AbortSignal): Promise<void>;
    /**
     * Queries and sets endpoints data
     */
    queryEndpoints(signal: AbortSignal): Promise<void>;
    /**
     * Queries and sets documentations data
     */
    queryDocumentations(signal: AbortSignal): Promise<void>;
    /**
     * Queries and sets types (schemas) data
     */
    querySchemas(signal: AbortSignal): Promise<void>;
    /**
     * Queries and sets security data
     */
    querySecurity(signal: AbortSignal): Promise<void>;
    createFlatTreeItems(items: ApiDefinitions.IApiEndPointWithOperationsListItem[]): ApiDefinitions.IEndpointItem[];
    /**
     * Processes endpoints layout for the given configuration.
     */
    layoutEndpoints(): void;
    /**
     * Filters the current endpoints by the current query value.
     */
    getFilteredEndpoints(): ApiEndpointsTreeItem[] | undefined;
    /**
     * Computes `style` attribute value for endpoint item.
     * It sets padding-left property to indent resources.
     * See https://github.com/mulesoft/api-console/issues/571.
     *
     * @param indent The computed indentation of the item.
     * @returns The value for the left padding of the endpoint menu item.
     */
    computeEndpointPaddingValue(indent?: number): string;
    /**
     * Computes endpoint list item left padding from CSS variables.
     */
    computeEndpointPaddingLeft(): number;
    /**
     * Computes `style` attribute value for an operation item.
     * It sets padding-left property to indent operations relative to a resource.
     *
     * @param indent The computed indentation of the parent resource.
     * @returns The value for the left padding of the endpoint menu item.
     */
    computeOperationPaddingValue(indent?: number): string;
    /**
     * Computes operation list item left padding from CSS variables.
     */
    computeOperationPaddingLeft(): number;
    /**
     * A handler for the click event on a menu list item.
     * Makes a selection from the target.
     */
    protected itemClickHandler(e: MouseEvent): void;
    /**
     * A handler for the click event on endpoints toggle button.
     */
    protected endpointToggleClickHandler(e: MouseEvent): void;
    /**
     * Toggles operations visibility for an endpoint.
     * @param graphId The Endpoint graph id.
     */
    toggleEndpoint(graphId: string): void;
    /**
     * A handler for the click event on a section item. Toggles the clicked section.
     */
    protected toggleSectionClickHandler(e: MouseEvent): void;
    protected toggleSectionKeydownHandler(): void;
    /**
     * Toggles a section of the menu represented by the element (section list item).
     */
    toggleSectionElement(element: HTMLElement): void;
    /**
     * @returns The list of documentation items filtered by the current query.
     */
    getFilteredDocumentations(): ApiDefinitions.IDocumentationItem[];
    /**
     * @returns The list of schemas items filtered by the current query.
     */
    getFilteredSchemas(): ApiDefinitions.INodeShapeItem[];
    /**
     * @returns The list of security items filtered by the current query.
     */
    getFilteredSecurity(): ApiDefinitions.ISecurityItem[];
    /**
     * A handler for the focus event on this element.
     */
    protected focusHandler(e: FocusEvent): void;
    /**
     * Sets a list item focused
     */
    focusItem(item: HTMLElement): void;
    /**
     * Handler for the keydown event.
     */
    protected keydownHandler(e: KeyboardEvent): void;
    /**
     * Handler that is called when the down key is pressed.
     */
    keyDownAction(e: KeyboardEvent): void;
    /**
     * Handler that is called when the up key is pressed.
     */
    keyUpAction(e: KeyboardEvent): void;
    /**
     * Handles shift+tab keypress on the menu.
     */
    keyShiftTabAction(): void;
    /**
     * Handler that is called when the esc key is pressed.
     */
    keyEscAction(): void;
    /**
     * A handler for the space bar key down.
     */
    keySpaceAction(e: KeyboardEvent): void;
    /**
     * A handler for the key right down. Opens operations when needed.
     */
    keyArrowRightAction(e: KeyboardEvent): void;
    /**
     * A handler for the key left down. Closes operations when needed.
     */
    keyArrowLeftAction(e: KeyboardEvent): void;
    /**
     * Focuses on the previous item in the navigation.
     */
    focusPrevious(): void;
    /**
     * Focuses on the next item in the navigation.
     */
    focusNext(): void;
    /**
     * Selects an item in the navigation.
     * Note, this dispatches the navigation action event.
     */
    select(id?: string): void;
    /**
     * Lists all HTML elements that are currently rendered in the view.
     * @returns Currently rendered items.
     */
    listActiveItems(): HTMLElement[];
    /**
     * @param selector The prefix for the query selector
     * @returns Nodes returned from query function.
     */
    listSectionActiveNodes(selector: string): HTMLElement[];
    /**
     * Selects an item in the menu.
     *
     * @param id The domain id of the node to be selected
     * @param type The selected type of the item.
     */
    makeSelection(id: string, type: SelectionType): void;
    /**
     * Selects an item.
     * @param id The domain id of the menu item.
     * @param type The type of the data.
     */
    selectItem(id: string, type: SelectionType): void;
    /**
     * Removes all selections from an item.
     * @param id The domain id of the menu item.
     * @param type The type of the data.
     */
    deselectItem(id: string, type: SelectionType): void;
    /**
     * Finds a selectable item by its id and type.
     * @param id The domain id of the menu item.
     * @param type The type of the data.
     */
    findSelectable(id: string, type: SelectionType): SelectableMenuItem | undefined;
    /**
     * @param value The new query. Empty or null to clear the query
     */
    processQuery(value?: string): void;
    /**
     * A handler for the search event from the filter input.
     */
    searchHandler(e: Event): void;
    /**
     * Opens all sections of the menu and all endpoints.
     */
    expandAll(): void;
    /**
     * Closes all sections of the menu and all endpoints.
     */
    collapseAll(): void;
    /**
     * Opens all endpoints exposing all operations
     */
    expandAllEndpoints(): void;
    /**
     * Hides all operations and collapses all endpoints.
     */
    collapseAllEndpoints(): void;
    /**
     * Triggers a flow when the user can define a new endpoint in the navigation.
     * This renders an input in the view (in the endpoints list) where the user can enter the path name.
     */
    addEndpoint(): Promise<void>;
    /**
     * Triggers a flow when the user can define a new documentation document.
     * This renders an input in the view (in the documentation list) where the user can enter the name.
     * @param isExternal Whether the documentation is a link to a www document.
     */
    addDocumentation(isExternal?: boolean): Promise<void>;
    /**
     * Triggers a flow when the user can define a new schema in the navigation.
     * This renders an input in the view (in the schema list) where the user can enter the schema name.
     * @param type The type of the schema to add. Default to `object`.
     */
    addSchema(type?: SchemaAddType): Promise<void>;
    /**
     * Resets all tabindex attributes to the appropriate value based on the
     * current selection state. The appropriate value is `0` (focusable) for
     * the default selected item, and `-1` (not keyboard focusable) for all
     * other items. Also sets the correct initial values for aria-selected
     * attribute, true for default selected item and false for others.
     */
    resetTabindices(): void;
    /**
     * Dispatches the navigation event.
     * @param id The domain id of the selected node
     * @param type The domain type.
     */
    notifyNavigation(id: string, type: SelectionType): void;
    /**
     * Event handler for the keydown event of the add endpoint input.
     */
    addEndpointKeydownHandler(e: KeyboardEvent): void;
    /**
     * Event handler for the keydown event of the add documentation input.
     */
    addDocumentationKeydownHandler(e: KeyboardEvent): void;
    /**
     * Event handler for the keydown event of the add schema input.
     */
    addSchemaKeydownHandler(e: KeyboardEvent): void;
    commitNewEndpoint(): Promise<void>;
    cancelNewEndpoint(): Promise<void>;
    /**
     * @param value The title of the documentation.
     */
    commitNewDocumentation(value?: string): Promise<void>;
    /**
     * @param value The name of the schema.
     */
    commitNewSchema(value?: string): Promise<void>;
    /**
     * Triggers a rename action for the menu item identified by the `id`.
     * @param id The domain id of the item to edit.
     */
    renameAction(id: string): Promise<void>;
    /**
     * @param id The domain id of the item to find.
     */
    findViewModelItem(id: string): SelectableMenuItem & EditableMenuItem | null;
    /**
     * A key down event handler on the rename input
     */
    protected renameKeydownHandler(e: KeyboardEvent): Promise<void>;
    /**
     * A blur event handler on the rename input
     */
    protected renameBlurHandler(e: Event): Promise<void>;
    /**
     * Updates the name or the display name of the menu object
     * @param id The id of the domain object to update
     * @param value The new value.
     * @param type The object type
     * @returns A promise when the update operation finish.
     */
    protected updateNameHandler(id: string, value: string, type: SelectionType): Promise<void>;
    /**
     * Click handler for the external navigation item.
     * Dispatches the external navigation event. When this event is handled (cancelled)
     * the original event is cancelled to prevent default behavior.
     */
    protected externalDocumentationHandler(e: Event): void;
    render(): TemplateResult;
    /**
     * @returns The template for the summary filed.
     */
    protected renderSummary(): TemplateResult | string;
    /**
     * @returns The template for the list of endpoints.
     */
    protected renderEndpoints(): TemplateResult | string;
    /**
     * @returns The template for an endpoint.
     */
    protected renderEndpoint(item: EndpointItem): TemplateResult;
    /**
     * @param id The domain id of the endpoint.
     * @return The template for an endpoint toggle button.
     */
    protected renderEndpointToggle(id: string): TemplateResult;
    /**
     * @param item The endpoint definition
     * @param op The operation definition.
     * @return The template for an operation list item.
     */
    protected renderOperationItem(item: EndpointItem, op: OperationItem): TemplateResult;
    /**
     * @return The template for the documentations section.
     */
    protected renderDocumentations(): TemplateResult | string;
    /**
     * @return The template for the documentation list item.
     */
    protected documentationTemplate(item: DocumentationItem): TemplateResult;
    /**
     * @return The template for the external documentation list item.
     */
    protected renderExternalDocumentation(item: DocumentationItem): TemplateResult;
    /**
     * @return The template for the types (schemas) section.
     */
    protected renderSchemas(): TemplateResult | string;
    /**
     * @return The template for the documentation list item.
     */
    protected renderSchema(item: NodeShapeItem): TemplateResult;
    /**
     * @return The template for the security section.
     */
    protected renderSecurities(): TemplateResult | string;
    /**
     * @return The template for the security list item.
     */
    protected securityTemplate(item: SecurityItem): TemplateResult;
    /**
     * @return The template for the filter input.
     */
    protected filterTemplate(): TemplateResult | string;
    /**
     * @return The template for the new endpoint input.
     */
    protected addEndpointInputTemplate(): TemplateResult;
    /**
     * @return The template for the new documentation input.
     */
    protected addDocumentationInputTemplate(): TemplateResult;
    /**
     * @return The template for the new schema input.
     */
    protected addSchemaInputTemplate(): TemplateResult;
    /**
     * @param id The domain id of the item being edited
     * @param label The current name to render.
     * @returns The template for the rename input.
     */
    protected renameInputTemplate(id: string, type: SelectionType, label?: string): TemplateResult;
}
//# sourceMappingURL=ApiNavigation.element.d.ts.map