@progressive-development/pd-page/dist/pd-menu/PdMenu.d.ts

Progressive development page helper, teaser, menu, footer.

import { LitElement, CSSResultGroup } from 'lit';
import { PdMenuItem } from '../types.js';
import { ButtonData } from '@progressive-development/pd-forms';
/**
 * Application navigation menu with responsive burger menu.
 *
 * @summary Responsive navigation menu with scroll-to-section and language selector.
 *
 * @tagname pd-menu
 *
 * @event route-event - Fired when a menu item with route is clicked.
 * @event locale-change - Fired when language is changed.
 * @event section-activated - Fired when the active section changes during scroll. Detail: `{ sectionId }`.
 *
 * @slot slotLogo - Slot for application logo.
 *
 * @cssprop --pd-menu-height - Menu height. Default: `100px`.
 * @cssprop --pd-menu-bg-col - Menu background. Default: `var(--pd-default-col)`.
 * @cssprop --pd-menu-shadow - Menu shadow. Default: `var(--pd-shadow-lg)`.
 * @cssprop --pd-menu-border-radius - Menu border radius. Default: `0`.
 * @cssprop --pd-menu-max-width - Max menu container width. Default: `var(--pd-content-max-width, 1170px)`.
 * @cssprop --pd-menu-font-col - Menu text color. Default: `var(--pd-on-primary-col)` (text on primary background).
 * @cssprop --pd-menu-font-family - Menu font family. Default: `var(--pd-default-font-title-family)`.
 * @cssprop --pd-menu-font-size - Menu font size. Default: `1.2em`.
 * @cssprop --pd-menu-font-weight - Menu font weight. Default: `bold`.
 * @cssprop --pd-menu-item-padding - Menu item padding. Default: `0.6em`.
 * @cssprop --pd-menu-item-bg-hover-col - Item hover background.
 * @cssprop --pd-menu-burger-bg-col - Burger menu background. Default: `var(--pd-default-bg-col)`.
 * @cssprop --pd-menu-burger-bottomborder - Burger menu bottom border.
 * @cssprop --pd-menu-burger-top - Burger menu top offset. Default: `var(--pd-menu-height)`.
 * @cssprop --pd-menu-burger-font-col - Burger menu text color. Default: `var(--pd-default-font-link-col)`.
 * @cssprop --pd-menu-logo-maxwidth - Logo max width. Default: `8rem`.
 * @cssprop --pd-menu-logo-height - Logo height relative to menu. Default: `60%`.
 * @cssprop --pd-menu-logo-padding - Logo padding. Default: `0 1.5rem 0 0`.
 * @cssprop --pd-menu-logo-color - Logo fill color. Default: `#067394`.
 * @cssprop --pd-menu-content-offset-y - Vertical offset for logo and menu items. Useful to visually lift content when a top-menu bar sits above. Default: `0`.
 * @cssprop --pd-menu-gradient - Gradient overlay when bgImage is set. Default: `none`.
 * @cssprop --pd-menu-text-shadow - Text shadow for menu items (useful with background images). Default: `none`.
 * @cssprop --pd-menu-bg-size - CSS background-size for the bg image. Default: `cover`.
 * @cssprop --pd-menu-bg-repeat - CSS background-repeat for the bg image. Default: `no-repeat`.
 * @cssprop --pd-menu-bg-attachment - CSS background-attachment for the bg image. Default: `scroll`.
 * @cssprop --pd-menu-bg-position - CSS background-position for the bg image. Default: `center`.
 */
export declare class PdMenu extends LitElement {
    /** Currently active route for highlighting. */
    activeRoute: string;
    /** Currently selected language (value from ButtonData). */
    selectedLocale: string;
    /** Route to navigate on logo click. */
    logoRoute?: string;
    /** Available language options with text (display) and value (locale code). */
    locales: ButtonData[];
    /** Main menu entries. */
    menuItems: PdMenuItem[];
    /** Additional entries in top menu. */
    topMenuItems: PdMenuItem[];
    /** Disable responsive burger menu. */
    noBurgerMenu: boolean;
    /** Background image URL. Renders an image layer with optional gradient overlay. */
    bgImage: string;
    /**
     * Index des aktiven Inhaltsbereichs (bei Scroll)
     * @ignore */
    private _activeSecIndex;
    /**
     * Burger-Menü aktiv?
     * @ignore */
    private _activeBurgerMenu;
    /**
     * Zeige mobile Ansicht?
     * @ignore */
    private _smallScreen;
    /** @ignore */
    private _mediaQueryList?;
    /** @ignore */
    private _boundScrollHandler;
    /** @ignore */
    private _boundMediaQueryHandler;
    static styles: CSSResultGroup;
    connectedCallback(): void;
    disconnectedCallback(): void;
    private _ticking;
    private _handleScroll;
    private _handleMediaQuery;
    private _updateActiveSection;
    render(): import('lit').TemplateResult<1>;
    private _renderItems;
    /**
     * Handles keyboard events on menu items.
     */
    private _handleMenuItemKeydown;
    /**
     * Handles keyboard events on burger menu toggle.
     */
    private _handleBurgerKeydown;
    private _toggleBurgerMenu;
    /**
     * Returns the index of the currently selected locale in the locales array.
     */
    private _getSelectedLocaleIndex;
    /**
     * Returns compact locale options for mobile display.
     * Uses shortText if available, otherwise falls back to text.
     */
    private _getCompactLocales;
    /**
     * Handles locale selection change from PdButtonSelectGroup.
     */
    private _handleLocaleChange;
    private _menuItemClicked;
    private _logoClicked;
    private static _scrollToTop;
}
//# sourceMappingURL=PdMenu.d.ts.map