import { type IAnimatable } from '../../../Behaviors/Animatable'; import { type IExpandableBehavior, type IExpandableEvents, type IExpandableProps } from '../../../Behaviors/Expandable'; import { ExpandDirection } from '../../../Types/ExpandDirection'; import { CustomElement } from '../../Abstracts/CustomElement'; import type { IExpandableElementProps } from './IExpandableElementProps'; declare const ExpandableElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => IExpandableProps & IExpandableEvents & IExpandableBehavior) & (abstract new (...args: Array) => import("../../../Behaviors/Animatable").IAnimatableProps & IAnimatable) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Expandable - A collapsible container that can be expanded or collapsed to reveal or hide its content. * * @description * The Expandable component provides a way to organize and display content that can be toggled to show or hide. * It typically consists of a header section that serves as a toggle button and a content section that can be expanded or collapsed. * Expandables are commonly used in UIs to manage space and provide a cleaner user experience by allowing users to focus on relevant information. * * @element mosaik-expandable * @category Layout * * @slot - The default slot. * * @csspart content - The content part. * * @cssprop {String} --expandable-font-family - The font family CSS custom property. * @cssprop {String} --expandable-font-letter-spacing - The font letter spacing CSS custom property. * @cssprop {String} --expandable-font-line-height - The font line height CSS custom property. * @cssprop {String} --expandable-font-size - The font size CSS custom property. * @cssprop {String} --expandable-font-text-decoration - The font text decoration CSS custom property. * @cssprop {String} --expandable-font-text-transform - The font text transform CSS custom property. * @cssprop {String} --expandable-font-weight - The font weight CSS custom property. * @cssprop {String} --expandable-gap - The gap CSS custom property. * @cssprop {String} --expandable-padding-bottom - The padding bottom CSS custom property. * @cssprop {String} --expandable-padding-left - The padding left CSS custom property. * @cssprop {String} --expandable-padding-right - The padding right CSS custom property. * @cssprop {String} --expandable-padding-top - The padding top CSS custom property. * @cssprop {String} --expandable-shadow - The shadow CSS custom property. * @cssprop {String} --expandable-shadow-blur - The shadow blur CSS custom property. * @cssprop {String} --expandable-shadow-color - The shadow color CSS custom property. * @cssprop {String} --expandable-shadow-offset-x - The shadow offset x CSS custom property. * @cssprop {String} --expandable-shadow-offset-y - The shadow offset y CSS custom property. * @cssprop {String} --expandable-shadow-spread - The shadow spread CSS custom property. * @cssprop {String} --expandable-transition-duration - The transition duration CSS custom property. * @cssprop {String} --expandable-transition-mode - The transition mode CSS custom property. * @cssprop {String} --expandable-transition-property - The transition property CSS custom property. * @cssprop {String} --expandable-translate - The translate CSS custom property. * * @fires expanded {ExpandedEvent} - Called when the element is expanded. * @fires collapsed {CollapsedEvent} - Called when the element is collapsed. * @fires toggled {ToggledEvent} - Called when the element is toggled. * * @example * ```html * * * * ``` * * @example * Expandable with direction: * ```html * *
Collapsible section content
*
* ``` * * @public */ export declare class ExpandableElement extends ExpandableElement_base implements IExpandableElementProps, IAnimatable, IExpandableBehavior, IExpandableProps, IExpandableEvents { private _direction; /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the `direction` property. * * @public * @attr */ get direction(): ExpandDirection; set direction(value: ExpandDirection); /** * This method is invoked when the `isExpanded` property is changed. * Handles the animation based on the expand direction. * * @param prev - The previous value of `isExpanded`. * @param next - The new value of `isExpanded`. * @public * @override */ onIsExpandedChanged(prev: boolean, next: boolean): void; } /** * @public */ export declare namespace ExpandableElement { type Props = IExpandableElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-expandable': ExpandableElement; } } export {}; //# sourceMappingURL=ExpandableElement.d.ts.map