import { type TemplateResult, nothing, type PropertyValueMap } from 'lit';
import { OmniElement } from '../core/OmniElement.js';
import type { RenderFunction, RenderResult } from '../render-element/RenderElement.js';
export type { RenderFunction, RenderResult } from '../render-element/RenderElement.js';
import '../render-element/RenderElement.js';
/**
 * Control to display modal content with optional header and footer content.
 *
 * @import
 * ```js
 * import '@capitec/omni-components/modal';
 * ```
 *
 * @example
 * ```html
 * <omni-modal header-label="Header Label" header-align="center">
 *    <span slot="header">Rich Header Content</span>
 *    <span>Body Content</span>
 *    <span slot="footer">Footer Content</span>
 * </omni-modal>
 * ```
 *
 * @element omni-modal
 *
 * Registry of all properties defined by the component.
 *
 * @fires click-outside - Dispatched when a click or touch occurs outside the modal container.
 *
 * @slot header - Content to render inside the component header.
 * @slot - Content to render inside the component body.
 * @slot footer - Content to render inside the component footer.
 *
 * @csspart dialog - Internal `HTMLDialogElement` instance.
 * @csspart backdrop - Internal `HTMLDivElement` instance for backdrop.
 * @csspart container - Internal `HTMLDivElement` instance for container.
 * @csspart header - Internal `HTMLDivElement` instance for header.
 * @csspart body - Internal `HTMLDivElement` instance for body.
 * @csspart footer - Internal `HTMLDivElement` instance for footer.
 *
 * @cssprop --omni-modal-dialog-top - Top position for wrapping `HTMLDialogElement`.
 * @cssprop --omni-modal-dialog-left - Left position for wrapping `HTMLDialogElement`.
 * @cssprop --omni-modal-dialog-right - Right position for wrapping `HTMLDialogElement`.
 * @cssprop --omni-modal-dialog-bottom - Bottom position for wrapping `HTMLDialogElement`.
 * @cssprop --omni-modal-dialog-background - Background for wrapping `HTMLDialogElement` backdrop.
 *
 * @cssprop --omni-modal-container-padding - Padding for modal content container.
 * @cssprop --omni-modal-container-box-shadow - Box shadow for modal content container.
 * @cssprop --omni-modal-max-width - Max width for modal content container.
 * @cssprop --omni-modal-min-width - Min width for modal content container.
 * @cssprop --omni-modal-max-height - Max height for modal content container.
 *
 * @cssprop --omni-modal-header-font-color - Font color for modal header.
 * @cssprop --omni-modal-header-font-family - Font family for modal header.
 * @cssprop --omni-modal-header-font-size - Font size for modal header.
 * @cssprop --omni-modal-header-font-weight - Font weight for modal header.
 * @cssprop --omni-modal-header-background - Background for modal header.
 * @cssprop --omni-modal-header-padding-left - Left padding for modal header.
 * @cssprop --omni-modal-header-padding-top - Top padding for modal header.
 * @cssprop --omni-modal-header-padding-right - Right padding for modal header.
 * @cssprop --omni-modal-header-padding-bottom - Bottom padding for modal header.
 * @cssprop --omni-modal-header-border-radius - Border radius for modal header.
 *
 * @cssprop --omni-modal-body-font-color - Font color for modal body.
 * @cssprop --omni-modal-body-font-size - Font size for modal body.
 * @cssprop --omni-modal-body-font-family - Font family for modal body.
 * @cssprop --omni-modal-body-font-weight - Font weight for modal body.
 * @cssprop --omni-modal-body-padding - Padding for modal body.
 * @cssprop --omni-modal-body-background - Background for modal body.
 * @cssprop --omni-modal-body-overflow - Overflow for modal body.
 *
 * @cssprop --omni-modal-no-header-body-border-top-radius - Top border radius for modal body when there is no header.
 * @cssprop --omni-modal-no-footer-body-border-bottom-radius - Bottom border radius for modal body when there is no footer.
 *
 * @cssprop --omni-modal-footer-text-align - Text align for modal footer.
 * @cssprop --omni-modal-footer-padding - Padding for modal footer.
 * @cssprop --omni-modal-footer-font-color - Font color for modal footer.
 * @cssprop --omni-modal-footer-font-family - Font family for modal footer.
 * @cssprop --omni-modal-footer-font-size - Font size for modal footer.
 * @cssprop --omni-modal-footer-font-weight - Font weight for modal footer.
 * @cssprop --omni-modal-footer-background - Background for modal footer.
 *
 */
export declare class Modal extends OmniElement {
    /**
     *  Title text to be displayed in header area.
     * @attr [header-label]
     */
    headerLabel: string;
    /**
     * Header text horizontal alignment:
     *  - `left` Align header to the left.
     *  - `center` Align header to the center.
     *  - `right` Align header to the right.
     * @attr [header-align]
     */
    headerAlign?: 'left' | 'center' | 'right';
    /**
     * If true, will hide the modal.
     * @attr
     */
    hide?: boolean;
    /**
     * If true, will not display the header section of the modal
     * @attr [no-header]
     */
    noHeader?: boolean;
    /**
     * If true, will not display the footer section of the modal
     * @attr [no-footer]
     */
    noFooter?: boolean;
    /**
     * If true, will not apply the modal as fullscreen on mobile viewports.
     * @attr [no-fullscreen]
     */
    noFullscreen?: boolean;
    /**
     * Internal `HTMLDialogElement` instance.
     * @no_attribute
     * @ignore
     */
    dialog: HTMLDialogElement;
    /**
     * Creates a new Modal element with the provided context and appends it to the DOM (either to document body or to provided target parent element).
     * @param init Initialisation context for Modal element that will be created.
     * @returns Modal element that was created.
     */
    static show(init: ModalInit): Modal | undefined;
    private notifyClickOutside;
    protected updated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
    static get styles(): import("lit").CSSResultGroup[];
    render(): TemplateResult;
    _renderHeader(): TemplateResult<1> | typeof nothing;
    _renderFooter(): TemplateResult<1> | typeof nothing;
}
/**
 * Context for `Modal.show` function to programmatically render a new `<omni-modal>` instance.
 */
export type ModalInit = {
    /**
     * The id to apply to the Modal element.
     */
    id?: string;
    /**
     * The container to append the Modal as child. If not provided will append to a new div element on the document body.
     */
    parent?: string | HTMLElement | DocumentFragment | null;
    /**
     * A function that returns, or an instance of content to render as modal body
     */
    body: RenderFunction | RenderResult;
    /**
     * A function that returns, or an instance of content to render in the modal header
     */
    header?: RenderFunction | RenderResult;
    /**
     * A function that returns, or an instance of content to render in the modal footer
     */
    footer?: RenderFunction | RenderResult;
    /**
     * Header text alignment:
     *  - `left` Align header to the left.
     *  - `center` Align header to the center.
     *  - `right` Align header to the right.
     */
    headerAlign?: 'left' | 'center' | 'right';
    /**
     * If true, will not display the header section of the modal
     */
    noHeader?: boolean;
    /**
     * If true, will not display the footer section of the modal
     */
    noFooter?: boolean;
    /**
     * If true will not apply the modal as fullscreen on mobile viewports.
     */
    noFullscreen?: boolean;
};
declare global {
    interface HTMLElementTagNameMap {
        'omni-modal': Modal;
    }
}
//# sourceMappingURL=Modal.d.ts.map