import { StateBaseElement } from '../Abstracts/StateBaseElement'; import { IEmptyStateElementProps } from './IEmptyStateElementProps'; declare const EmptyStateElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof StateBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * EmptyState - A user-friendly placeholder component for displaying when no content or data is available. * * @description * The EmptyState component provides informative messaging and optional call-to-action elements when * lists, searches, or data sets return no results. It helps guide users with clear messaging and * actionable next steps to improve user experience during empty content scenarios. The component * features customizable icons, header and content text, and action buttons to direct users toward * productive alternatives. It's particularly useful for empty search results, first-time experiences, * cleared notifications, and any scenario where data absence needs clear communication. * * @name EmptyState * @element mosaik-empty-state * @category States * * @slot - Default content area for additional empty state information or custom elements * @slot actions - Action buttons or links for user guidance and next steps * * @csspart icon - The icon container for visual empty state representation * @csspart header - The header text container for primary messaging * @csspart content - The content text container for detailed explanation * @csspart innerStack - The internal stack container for action slot elements * * @cssprop {String} --empty-state-foreground-color - The text color for empty state content * @cssprop {String} --empty-state-gap - The spacing between icon, text, and action elements * @cssprop {String} --empty-state-header-font-family - The font family for header text * @cssprop {String} --empty-state-header-font-size - The font size for header text * @cssprop {String} --empty-state-header-font-line-height - The line height for header text * @cssprop {String} --empty-state-header-font-weight - The font weight for header text * @cssprop {String} --empty-state-header-font-letter-spacing - The letter spacing for header text * @cssprop {String} --empty-state-header-font-text-decoration - The text decoration style for header text * @cssprop {String} --empty-state-header-font-text-transform - The text transformation style for header text * @cssprop {String} --empty-state-padding-top - The top padding inside the empty state container * @cssprop {String} --empty-state-padding-right - The right padding inside the empty state container * @cssprop {String} --empty-state-padding-bottom - The bottom padding inside the empty state container * @cssprop {String} --empty-state-padding-left - The left padding inside the empty state container * * @dependency {IconElement} - For displaying empty state icons and visual indicators * @dependency {TextElement} - For rendering header and content text messages * @dependency {StackElement} - For layout management and content arrangement * * @example * No search results: * ```html * * Clear Search * * ``` * * @example * Empty inbox: * ```html * * ``` * * @example * Empty cart with action: * ```html * * * Browse Products * * * ``` * * @example * State with icon and content set via JavaScript: * ```html * * * ``` * * @public */ export declare class EmptyStateElement extends EmptyStateElement_base implements IEmptyStateElementProps { private _header; private _icon; /** * Constructs a new instance of the `EmptyStateElement` class. * * @public */ constructor(); /** * Returns the `is` property. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the `icon` property. * The icon SVG path data for the empty state visual indicator. * The default value is an empty string, which displays a default glasses icon. * * @public */ get icon(): string; set icon(value: string); /** * Gets or sets the `header` property. * The primary message displayed to users in the empty state. * The default value is an empty string, which means no header is displayed. * * @public * @attr */ get header(): string; set header(value: string); } /** * @public */ export declare namespace EmptyStateElement { type Props = IEmptyStateElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-empty-state': EmptyStateElement; } } export {}; //# sourceMappingURL=EmptyStateElement.d.ts.map