import { CustomElement } from '../../Abstracts/CustomElement'; import type { IChoiceGroupHeaderElementProps } from './IChoiceGroupHeaderElementProps'; declare const ChoiceGroupHeaderElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Choice Group Header - A semantic heading element for grouping related choice items. * * @description * The Choice Group Header component provides a labeled section header for organizing * groups of radio buttons, checkboxes, or other choice elements. It automatically assigns * to the 'header' slot and includes appropriate ARIA role='heading' for accessibility. * This component helps create clear visual and semantic groupings within forms and * choice-based interfaces, improving usability and screen reader navigation. It is * typically used within Choice Group containers to separate related options. * * @name Choice Group Header * @element mosaik-choice-group-header * @category Inputs * * @slot - The default slot for header content (text, icons, or custom markup) * * @cssprop {String} --choice-group-header-background-color - The background color of the header * @cssprop {String} --choice-group-header-border-color - The border color * @cssprop {String} --choice-group-header-border-radius - The corner rounding radius * @cssprop {String} --choice-group-header-border-style - The border line style * @cssprop {String} --choice-group-header-border-width - The border thickness * @cssprop {String} --choice-group-header-font-family - The group header font family CSS custom property. * @cssprop {String} --choice-group-header-font-letter-spacing - The group header font letter spacing CSS custom property. * @cssprop {String} --choice-group-header-font-line-height - The group header font line height CSS custom property. * @cssprop {String} --choice-group-header-font-size - The group header font size CSS custom property. * @cssprop {String} --choice-group-header-font-text-decoration - The group header font text decoration CSS custom property. * @cssprop {String} --choice-group-header-font-text-transform - The group header font text transform CSS custom property. * @cssprop {String} --choice-group-header-font-weight - The group header font weight CSS custom property. * @cssprop {String} --choice-group-header-foreground-color - The text color of the header * @cssprop {String} --choice-group-header-gap - The group header gap CSS custom property. * @cssprop {String} --choice-group-header-padding-bottom - The group header padding bottom CSS custom property. * @cssprop {String} --choice-group-header-padding-left - The group header padding left CSS custom property. * @cssprop {String} --choice-group-header-padding-right - The group header padding right CSS custom property. * @cssprop {String} --choice-group-header-padding-top - The group header padding top CSS custom property. * @cssprop {String} --choice-group-header-shadow - The drop shadow or elevation effect * @cssprop {String} --choice-group-header-shadow-blur - The group header shadow blur CSS custom property. * @cssprop {String} --choice-group-header-shadow-color - The group header shadow color CSS custom property. * @cssprop {String} --choice-group-header-shadow-offset-x - The group header shadow offset x CSS custom property. * @cssprop {String} --choice-group-header-shadow-offset-y - The group header shadow offset y CSS custom property. * @cssprop {String} --choice-group-header-shadow-spread - The group header shadow spread CSS custom property. * @cssprop {String} --choice-group-header-transition-duration - The group header transition duration CSS custom property. * @cssprop {String} --choice-group-header-transition-mode - The group header transition mode CSS custom property. * @cssprop {String} --choice-group-header-transition-property - The group header transition property CSS custom property. * @cssprop {String} --choice-group-header-translate - The group header translate CSS custom property. * * @example * Basic choice group header: * ```html * * Notification Preferences * * ``` * * @example * Header within a choice group: * ```html * * * Select your plan * * * * * ``` * * @example * Custom styled header: * ```html * * Required Settings (choose one) * * ``` * * @public */ export declare class ChoiceGroupHeaderElement extends ChoiceGroupHeaderElement_base implements IChoiceGroupHeaderElementProps { /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; } /** * @public */ export declare namespace ChoiceGroupHeaderElement { type Props = IChoiceGroupHeaderElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-choice-group-header': ChoiceGroupHeaderElement; } } export {}; //# sourceMappingURL=ChoiceGroupHeaderElement.d.ts.map