import { type IEventEmitter } from '@breadstone/mosaik-elements'; import { type IAttachable } from '../../../Behaviors/Attachable'; import type { IResizeEndEventDetail, IResizeStartEventDetail, IResizingEventDetail } from '../../../events'; import { ResizeDirection } from '../../../Types/ResizeDirection'; import { CustomElement } from '../../Abstracts/CustomElement'; import type { IResizeThumbElementProps } from './IResizeThumbElementProps'; declare const ResizeThumbElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array) => IAttachable) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * ResizeThumb - A primitive element that provides resize handle functionality. * * @description * The ResizeThumb element is a low-level primitive that signals resizing capability * in a specific direction. It handles user interactions (mouse/touch) and automatically * resizes the attached control element. * * The element uses the Attachable behavior to connect to its target element, either * through the `for` attribute referencing an element ID, or by automatically attaching * to its parent element. * * Internally, this element uses a `ResizeThumbController` for all resize logic. * For programmatic usage without a visual thumb, use the controller directly. * * This element has minimal visual appearance by design - parent components like Dialog, * Sheet, or Panel are expected to style the thumb appropriately for their context. * * @name ResizeThumb * @element mosaik-resize-thumb * @category Primitive * * @slot - Default slot for custom thumb content. * * @csspart thumb - The main thumb element. * * @fires resizeStart {ResizeStartEvent} - Fired when a resize operation begins. * @fires resizing {ResizingEvent} - Fired continuously during a resize operation. * @fires resizeEnd {ResizeEndEvent} - Fired when a resize operation ends. * * @example * ```html * * * * * * *
* Content *
* * * * * * * * * * ``` * * @see `ResizeThumbController` for programmatic usage without visual element. * * @public */ export declare class ResizeThumbElement extends ResizeThumbElement_base implements IResizeThumbElementProps, IAttachable { private readonly _resizeStart; private readonly _resizing; private readonly _resizeEnd; private _direction; private _allowedDirections; private _minWidth; private _minHeight; private _maxWidth; private _maxHeight; private _autoApply; private _controller; private _mouseDownSubscription; private _touchStartSubscription; /** * @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 resize `direction`. * * Determines which direction this resize thumb represents. * The cursor style is automatically updated based on this direction. * * @attr * @public */ get direction(): ResizeDirection; set direction(value: ResizeDirection); /** * Gets or sets the `allowedDirections` array. * * When set, only the specified directions are permitted for resizing. * If the current direction is not in the allowed list, resize operations * will be blocked. * * @attr * @public */ get allowedDirections(): ReadonlyArray; set allowedDirections(value: ReadonlyArray); /** * Gets or sets the minimum width the control can be resized to. * * @attr min-width * @public */ get minWidth(): number; set minWidth(value: number); /** * Gets or sets the minimum height the control can be resized to. * * @attr min-height * @public */ get minHeight(): number; set minHeight(value: number); /** * Gets or sets the maximum width the control can be resized to. * * @attr max-width * @public */ get maxWidth(): number; set maxWidth(value: number); /** * Gets or sets the maximum height the control can be resized to. * * @attr max-height * @public */ get maxHeight(): number; set maxHeight(value: number); /** * Gets or sets whether resize changes are automatically applied to the control element. * If false, only events are emitted and the control is responsible for applying changes. * Defaults to true. * * @attr auto-apply * @public */ get autoApply(): boolean; set autoApply(value: boolean); /** * Gets whether a resize operation is currently in progress. * * @public * @readonly */ get isResizing(): boolean; /** * Called when a resize operation starts. * Provides reference to `IResizeStartEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get resizeStart(): IEventEmitter; /** * Called during a resize operation. * Provides reference to `IResizingEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get resizing(): IEventEmitter; /** * Called when a resize operation ends. * Provides reference to `IResizeEndEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get resizeEnd(): IEventEmitter; /** * @public * @override */ connectedCallback(): void; /** * @public * @override */ disconnectedCallback(): void; /** * @protected * @override */ protected onApplyTemplate(): void; /** * Checks if the current direction is allowed. * * @protected * @returns True if the direction is in the allowed list, false otherwise. */ protected isDirectionAllowed(): boolean; /** * Handles the start of a pointer (mouse or touch) interaction. * * @protected */ protected onPointerStart(clientX: number, clientY: number, event: MouseEvent | TouchEvent): void; /** * Initializes or re-initializes the controller with the current control element. * * @private */ private initializeController; } /** * @public */ export declare namespace ResizeThumbElement { type Props = IResizeThumbElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-resize-thumb': ResizeThumbElement; } } export {}; //# sourceMappingURL=ResizeThumbElement.d.ts.map