import { ThumbEdge } from '../../../Types/ThumbEdge'; import { CustomElement } from '../../Abstracts/CustomElement'; import { IThumbElementProps } from './IThumbElementProps'; declare const ThumbElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Thumb - A draggable handle used in slider, scrollbar, and range control components. * * @description * The Thumb element represents the draggable handle in slider controls, range inputs, scrollbars, * and similar interactive components. It provides visual feedback for the current value position * and can be styled to indicate different states (normal, hover, active, disabled). The edge * property controls positioning behavior at the extremes of the range. This is a low-level * primitive typically used as a building block in more complex slider components. * * @name Thumb * @element mosaik-thumb * @category Primitives * * @cssprop {String} --thumb-background-color - Background color of the thumb handle * @cssprop {String} --thumb-border-color - Border color of the thumb * @cssprop {String} --thumb-border-radius - Border radius for rounded corners * @cssprop {String} --thumb-border-style - Border style (solid, dashed, etc.) * @cssprop {String} --thumb-border-width - Border width of the thumb * @cssprop {String} --thumb-font-family - The font family CSS custom property. * @cssprop {String} --thumb-font-letter-spacing - The font letter spacing CSS custom property. * @cssprop {String} --thumb-font-line-height - The font line height CSS custom property. * @cssprop {String} --thumb-font-size - The font size CSS custom property. * @cssprop {String} --thumb-font-text-decoration - The font text decoration CSS custom property. * @cssprop {String} --thumb-font-text-transform - The font text transform CSS custom property. * @cssprop {String} --thumb-font-weight - The font weight CSS custom property. * @cssprop {String} --thumb-gap - The gap CSS custom property. * @cssprop {String} --thumb-padding-bottom - The padding bottom CSS custom property. * @cssprop {String} --thumb-padding-left - The padding left CSS custom property. * @cssprop {String} --thumb-padding-right - The padding right CSS custom property. * @cssprop {String} --thumb-padding-top - The padding top CSS custom property. * @cssprop {String} --thumb-shadow - The shadow CSS custom property. * @cssprop {String} --thumb-shadow-blur - The shadow blur CSS custom property. * @cssprop {String} --thumb-shadow-color - The shadow color CSS custom property. * @cssprop {String} --thumb-shadow-offset-x - The shadow offset x CSS custom property. * @cssprop {String} --thumb-shadow-offset-y - The shadow offset y CSS custom property. * @cssprop {String} --thumb-shadow-spread - The shadow spread CSS custom property. * @cssprop {String} --thumb-transition-duration - Duration of state transitions * @cssprop {String} --thumb-transition-mode - Timing function for animations * @cssprop {Array} --thumb-transition-property - CSS properties to animate * @cssprop {String} --thumb-translate - The translate CSS custom property. * * @example * Basic thumb for a slider: * ```html *
* *
* * * ``` * * @example * Thumb at minimum edge: * ```html * * ``` * * @example * Disabled thumb: * ```html * * ``` * * @public */ export declare class ThumbElement extends ThumbElement_base implements IThumbElementProps { private _edge; /** * @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 `edge` property. * * @public * @attr */ get edge(): ThumbEdge; set edge(value: ThumbEdge); } /** * @public */ export declare namespace ThumbElement { type Props = IThumbElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-thumb': ThumbElement; } } export {}; //# sourceMappingURL=ThumbElement.d.ts.map