import { ICheckable, ICheckableEvents } from '../../../Behaviors/Checkable'; import { IconPosition } from '../../../Types/IconPosition'; import { Size } from '../../../Types/Size'; import { ButtonBaseElement } from '../../Buttons/Abstracts/ButtonBaseElement'; import { ISegmentItemElementProps } from './ISegmentItemElementProps'; declare const SegmentItemElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Orientable").IOrientableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Checkable").ICheckableProps & ICheckableEvents & ICheckable) & (abstract new (...args: Array) => import("../../../Behaviors/Labelable").ILabelableProps) & typeof ButtonBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Segment Item - An individual selectable button within a Segment control. * * @description * The Segment Item component represents a single option within a Segment control. It can display * a label, an icon, or both, and supports checked/unchecked states managed by the parent segment. * Each segment item functions as a toggle button that automatically deselects other items in the * same segment when selected. The component supports both horizontal and vertical orientations, * icon positioning, and inherits appearance and variant from the parent segment. * * @name Segment Item * @element mosaik-segment-item * @category Selectors * * @slot icon - The icon displayed within the segment item * @slot label - The text label displayed within the segment item * * @csspart button - The main button element container * @csspart innerStack - The inner layout stack for icon and label * @csspart icon - The icon display area * @csspart label - The text label display area * * @cssprop {String} --segment-item-background-color - The background fill color * @cssprop {String} --segment-item-font-family - The font family for segment item text * @cssprop {String} --segment-item-font-size - The font size for segment item text * @cssprop {String} --segment-item-font-line-height - The line height for segment item text * @cssprop {String} --segment-item-font-weight - The font weight for segment item text * @cssprop {String} --segment-item-font-letter-spacing - The letter spacing for segment item text * @cssprop {String} --segment-item-font-text-decoration - The text decoration style * @cssprop {String} --segment-item-font-text-transform - The text transformation style * * @dependency {StackElement} - Layout container for organizing content * @dependency {IconElement} - Icon display component * @dependency {TextElement} - Text rendering component for labels * * @fires checked {CheckedEvent} - Fired when the segment item is checked * @fires unchecked {UncheckedEvent} - Fired when the segment item is unchecked * @fires connected {ConnectedEvent} - Fired when connected to the DOM * @fires changed {PropertyChangedEvent} - Fired when properties change * * @example * Basic segment item with slotted label: * ```html * Daily * ``` * * @example * Segment item with icon-position and checked state: * ```html * * Grid View * * ``` * * @example * Disabled segment item: * ```html * * Unavailable * * ``` * * @public */ export declare class SegmentItemElement extends SegmentItemElement_base implements ISegmentItemElementProps, ICheckable, ICheckableEvents { private readonly _inheritance; private _icon; private _iconPosition; private _iconSize; /** * @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 `icon` property. * * @public */ get icon(): string; set icon(value: string); /** * Gets or sets the `iconPosition` property. * * @public */ get iconPosition(): IconPosition; set iconPosition(value: IconPosition); /** * Gets or sets the `iconSize` property. * * @public */ get iconSize(): Size | null; set iconSize(value: Size | null); /** * @protected */ protected onIconPropertyChanged(prev: string, next: string): void; } /** * @public */ export declare namespace SegmentItemElement { type Props = ISegmentItemElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-segment-item': SegmentItemElement; } } export {}; //# sourceMappingURL=SegmentItemElement.d.ts.map