import { type IDropDownable } from '../../../Behaviors/DropDownable'; import { ButtonBaseElement } from '../Abstracts/ButtonBaseElement'; import type { ISplitButtonElementProps } from './ISplitButtonElementProps'; declare const SplitButtonElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Reversible").IReversibleProps) & (abstract new (...args: Array) => import("../../../Behaviors/Orientable").IOrientableProps) & (abstract new (...args: Array) => import("../../../Behaviors/ContentAlignable").IContentAlignableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Fitable").IFitableProps) & (abstract new (...args: Array) => import("../../../Behaviors/DropDownable").IDropDownableProps & IDropDownable) & (abstract new (...args: Array) => import("../../../Behaviors/Busyable").IBusyableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Labelable").ILabelableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Iconable").IIconableProps) & typeof ButtonBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Split Button - A user interface element that combines a regular button with a dropdown menu. * * @description * The Split Button is a versatile user interface component that merges the functionality of a standard button * with that of a dropdown menu. It typically consists of a visible button element and an attached dropdown menu. * When users click the button, it triggers a default action, while clicking the arrow or a designated part of the * button reveals a dropdown menu with additional options or actions. Split Buttons are commonly used for providing * both a primary action and a set of related secondary actions in applications. * * @name Split Button * @element mosaik-split-button * @category Buttons * * @slot icon - The icon slot. * @slot label - The label slot. * @slot overlay - The overlay slot (useful for badge). * @slot - The default dropdown content slot. * * @csspart button - The button part of the split button. * @csspart button split - The split button part. * @csspart focusRing - The focus ring part of the split button. * @csspart ripple - The ripple part of the split button. * @csspart icon - The icon part of the split button. * @csspart label - The label part of the split button. * @csspart progressRing - The progress ring part of the split button. * @csspart popup - The popup part of the split button. * @csspart menu - The menu part of the split button. * @csspart buttonSplit - The part of the button responsible for splitting the button from the dropdown. * @csspart iconCaret - The caret icon part used for dropdown indication. * * @cssprop {String} --split-button-font-family - The font family of the split button. * @cssprop {String} --split-button-font-size - The font size of the split button. * @cssprop {String} --split-button-font-line-height - The font line height of the split button. * @cssprop {String} --split-button-font-weight - The font weight of the split button. * @cssprop {String} --split-button-font-letter-spacing - The font letter spacing of the split button. * @cssprop {String} --split-button-font-text-decoration - The font text decoration of the split button. * @cssprop {String} --split-button-font-text-transform - The font text transform of the split button. * @cssprop {String} --split-button-padding-top - The padding top of the split button. * @cssprop {String} --split-button-padding-right - The padding right of the split button. * @cssprop {String} --split-button-padding-bottom - The padding bottom of the split button. * @cssprop {String} --split-button-padding-left - The padding left of the split button. * @cssprop {String} --split-button-gap - The gap between elements of the split button. * @cssprop {String} --split-button-transition-duration - The transition duration for the split button. * @cssprop {String} --split-button-transition-mode - The transition mode for the split button. * @cssprop {String} --split-button-transition-property - The transition property for the split button. * @cssprop {Color} --split-button-background-color - The background color of the split button. * @cssprop {Color} --split-button-border-color - The border color of the split button. * @cssprop {Color} --split-button-foreground-color - The foreground color of the split button. * @cssprop {String} --split-button-border-width - The border width of the split button. * @cssprop {String} --split-button-border-radius - The border radius of the split button. * @cssprop {String} --split-button-border-style - The border style of the split button. * @cssprop {String} --split-button-shadow - The shadow of the split button. * @cssprop {String} --focus-ring-outward-offset - The outward offset of the focus ring. * @cssprop {String} --split-button-line-height - The line height of the split button text. * * @dependency {StackElement} mosaik-stack - The Stack component, used for layout management. * @dependency {IconElement} mosaik-icon - The Icon component, used for displaying the icon. * @dependency {RippleElement} mosaik-ripple - The Ripple component, used for the ripple effect. * @dependency {FocusRingElement} mosaik-focus-ring - The Focus Ring component, used for focus indication. * @dependency {TextElement} mosaik-text - The Text component, used for displaying the label text. * @dependency {ProgressRingElement} mosaik-progress-ring - The Progress Ring component, used for progress indication. * @dependency {FloatingElement} mosaik-floating - The Floating component, used for floating behavior. * @dependency {MenuElement} mosaik-menu - The Menu component, used for dropdown menu functionality. * * @example * Basic split button: * ```html * * * * * * * ``` * * @example * Split button with variant: * ```html * * * * * * * ``` * * @public */ export declare class SplitButtonElement extends SplitButtonElement_base implements ISplitButtonElementProps, IDropDownable { private readonly _clickOutsideController; private readonly _projectionController; /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; /** * @protected */ protected onIsDropDownOpenPropertyChanged(_prev?: boolean, next?: boolean): void; protected onIsBusyPropertyChanged(_prev?: boolean, next?: boolean): void; onSplit(e: MouseEvent): void; /** * @private */ private onClickedOutside; } /** * @public */ export declare namespace SplitButtonElement { type Props = ISplitButtonElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-split-button': SplitButtonElement; } } export {}; //# sourceMappingURL=SplitButtonElement.d.ts.map