@itwin/core-react/lib/core-react/elementseparator/ElementSeparator.d.ts

A react component library of iTwin.js UI general purpose components

/** @packageDocumentation
 * @module ElementSeparator
 */
import "./ElementSeparator.scss";
import * as React from "react";
import { Orientation } from "../enums/Orientation.js";
import type { CommonProps } from "../utils/Props.js";
/** Results returned by onRatioChanged callback for determining new ratio and whether the ratio was updated.
 * @public
 * @deprecated in 4.12.0. Interface used in a deprecated component {@link ElementSeparator}.
 */
export interface RatioChangeResult {
    ratio: number;
}
/** Properties of [[ElementSeparator]] React component
 * @public
 * @deprecated in 4.12.0. Props of deprecated component {@link ElementSeparator}.
 */
export interface ElementSeparatorProps extends CommonProps {
    /** Separator orientation */
    orientation: Orientation;
    /** Ratio between left cell and right cell */
    ratio: number;
    /** Area width or height (depending on orientation) in pixels */
    movableArea?: number;
    /** Separator width or height in pixels. 30 by default */
    separatorSize?: number;
    /** Callback to ratio changed event */
    onRatioChanged?: (ratio: number) => void | RatioChangeResult;
    /** Is resize handle hovered */
    isResizeHandleHovered?: boolean;
    /** Callback to hover event change */
    onResizeHandleHoverChanged?: (isHovered: boolean) => void;
    /** Is resize handle being dragged */
    isResizeHandleBeingDragged?: boolean;
    /** Callback to drag event change */
    onResizeHandleDragChanged?: (isDragStarted: boolean) => void;
}
/** A movable button, which allows to change the ratio between left element and right element
 * @public
 * @deprecated in 4.12.0. Basic components that need to be user-resized support this out of the box. Use {@link https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent pointer events} API to implement a custom resizer.
 */
export declare const ElementSeparator: (props: ElementSeparatorProps) => React.JSX.Element;
//# sourceMappingURL=ElementSeparator.d.ts.map