import { ICloseable, type ICloseableEvents } from '../../../Behaviors/Closeable'; import { IOpenable, type IOpenableEvents } from '../../../Behaviors/Openable'; import { ISlottable } from '../../../Behaviors/Slottable'; import { Appearance } from '../../../Types/Appearance'; import type { FlowDirection } from '../../../Types/FlowDirection'; import { Size } from '../../../Types/Size'; import { Variant } from '../../../Types/Variant'; import { CustomElement } from '../../Abstracts/CustomElement'; import type { IBannerElementProps } from './IBannerElementProps'; declare const BannerElement_base: (abstract new (...args: Array) => import("../../../../Controls/Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => IOpenable & IOpenableEvents) & (abstract new (...args: Array) => import("../../../Behaviors/Closeable").ICloseableProps & ICloseableEvents & ICloseable) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Fitable").IFitableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Elevatable").IElevatableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Orientable").IOrientableProps) & (abstract new (...args: Array) => import("../../../Behaviors/ContentAlignable").IContentAlignableProps) & (abstract new (...args: Array) => import("../../../Behaviors/TextFormattable").ITextFormattableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Slottable").ISlottableProps & ISlottable) & typeof CustomElement & import("../../../../Controls/Behaviors/Themeable").IThemeableCtor; /** * Banner - A flexible and customizable component for displaying prominent messages or actions. * * @description * The `Banner` component is designed for presenting important messages or actions within an application. * It supports customizable styles, headers, subheaders, and actions, making it suitable for notifications, * announcements, or alerts. The component is fully customizable with CSS parts and properties, ensuring seamless * integration into various designs. * * @name Banner * @element mosaik-banner * @category Notifications * * @fires closed {ClosedEvent} - Fired when the banner is closed. * * @slot header - Slot for the banner header content. * @slot subHeader - Slot for the banner subheader content. * @slot close - Slot for the close button or icon. * @slot actions - Slot for additional actions inside the banner. * * @csspart root - The root part of the banner. * @csspart heading - The heading part of the banner. * @csspart icon - The icon part of the banner. * @csspart text - The text part of the banner. * @csspart header - The header container part of the banner. * @csspart subHeader - The subheader container part of the banner. * @csspart close - The close button or icon part of the banner. * @csspart actions - The actions container part of the banner. * @csspart elevation - The elevation part of the banner. * * @cssprop {String} --banner-font-family - The font family for the banner. * @cssprop {String} --banner-font-size - The font size for the banner. * @cssprop {String} --banner-font-weight - The font weight for the banner. * @cssprop {Color} --banner-background-color - The background color for the banner. * @cssprop {Color} --banner-border-color - The border color for the banner. * @cssprop {Color} --banner-foreground-color - The foreground color for the banner. * @cssprop {String} --banner-border-width - The border width for the banner. * @cssprop {String} --banner-border-radius - The border radius for the banner. * @cssprop {String} --banner-border-style - The border style for the banner. * @cssprop {String} --banner-transition-duration - The transition duration for the banner. * @cssprop {String} --banner-transition-mode - The transition mode for the banner. * @cssprop {String} --banner-transition-property - The transition property for the banner. * @cssprop {String} --banner-shadow - The shadow effect for the banner. * @cssprop {String} --banner-padding-top - The top padding for the banner. * @cssprop {String} --banner-padding-left - The left padding for the banner. * @cssprop {String} --banner-padding-bottom - The bottom padding for the banner. * @cssprop {String} --banner-padding-right - The right padding for the banner. * @cssprop {String} --banner-gap - The gap between elements within the banner. * * @dependency {IconElement} - The Icon element. * @dependency {TextElement} - The Text element. * @dependency {BannerHeaderElement} - The Banner Header element. * @dependency {BannerSubHeaderElement} - The Banner Sub Header element. * @dependency {StackElement} - The Stack element. * @dependency {DismissElement} - The Dismiss element for closing the banner. * * @example * Basic banner with header and sub-header: * ```html * * * * * * ``` * * @example * Warning banner with close action: * ```html * * * * * * * ``` * * @public */ export declare class BannerElement extends BannerElement_base implements IBannerElementProps, ICloseableEvents, IOpenableEvents, IOpenable, ICloseable, ISlottable { private readonly _inheritance; private _actionElements; private _icon; private _iconSize; private _header; private _subHeader; private _isOpen; /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; /** * @public * @override */ get disabled(): boolean; set disabled(value: boolean); /** * @public * @override */ get dir(): FlowDirection; set dir(value: FlowDirection); /** * Gets or sets the `icon` property. * * @public */ get icon(): string; set icon(value: string); /** * Gets or sets the `iconSize` property. * * @public * @attr */ get iconSize(): Size | null; set iconSize(value: Size | null); /** * Gets or sets the `header` property. * * @public */ get header(): string; set header(value: string); /** * Gets or sets the `subHeader` property. * * @public */ get subHeader(): string; set subHeader(value: string); /** * Gets or sets the `isOpen` property that allows you to show or hide the `BannerComponent`. * * @public * @attr */ get isOpen(): boolean; set isOpen(value: boolean); /** * Opens the `BannerElement`. * * @public * @override */ open(): Promise; /** * Closes the `BannerElement`. * * @public * @override */ close(): Promise; /** * Toggles the `BannerElement`. * If the `BannerElement` is open, it will close it. If it is closed, it will open it. * * @public */ toggle(): Promise; /** * @protected * @override */ protected onApplyTemplate(): void; protected onDisabledPropertyChanged(_prev?: boolean, next?: boolean): void; protected onVariantPropertyChanged(_prev?: Variant, next?: Variant): void; protected onAppearancePropertyChanged(_prev?: Appearance, next?: Appearance): void; } /** * @public */ export declare namespace BannerElement { type Props = IBannerElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-banner': BannerElement; } } export {}; //# sourceMappingURL=BannerElement.d.ts.map