import React, { CSSProperties, ReactNode } from 'react'; import PropTypes from 'prop-types'; import { ResizableFoundation, ResizableAdapter } from '@douyinfe/semi-foundation/lib/cjs/resizable/foundation'; import { Direction, Size, Enable, ResizeStartCallback, ResizeCallback, HandleClassName } from '@douyinfe/semi-foundation/lib/cjs/resizable/types'; import BaseComponent from '../../_base/baseComponent'; import '@douyinfe/semi-foundation/lib/cjs/resizable/resizable.css'; export interface HandleComponent { top?: ReactNode; right?: ReactNode; bottom?: ReactNode; left?: ReactNode; topRight?: ReactNode; bottomRight?: ReactNode; bottomLeft?: ReactNode; topLeft?: ReactNode; } export interface HandleStyle { top?: CSSProperties; right?: CSSProperties; bottom?: CSSProperties; left?: CSSProperties; topRight?: CSSProperties; bottomRight?: CSSProperties; bottomLeft?: CSSProperties; topLeft?: CSSProperties; } export interface ResizableProps { style?: React.CSSProperties; className?: string; grid?: [number, number]; snap?: { x?: number[]; y?: number[]; }; snapGap?: number; boundElement?: 'parent' | 'window' | HTMLElement; boundsByDirection?: boolean; size?: Size; minWidth?: string | number; minHeight?: string | number; maxWidth?: string | number; maxHeight?: string | number; lockAspectRatio?: boolean | number; lockAspectRatioExtraWidth?: number; lockAspectRatioExtraHeight?: number; enable?: Enable | false; handleStyle?: HandleStyle; handleClass?: HandleClassName; handleWrapperStyle?: React.CSSProperties; handleWrapperClass?: string; handleNode?: HandleComponent; children?: React.ReactNode; onResizeStart?: ResizeStartCallback; onChange?: ResizeCallback; onResizeEnd?: ResizeCallback; defaultSize?: Size; scale?: number; ratio?: number | [number, number]; } export interface ResizableState { isResizing: boolean; direction: Direction; original: { x: number; y: number; width: number; height: number; }; width: number | string; height: number | string; backgroundStyle: React.CSSProperties; flexBasis?: string | number; } declare class Resizable extends BaseComponent { static propTypes: { style: PropTypes.Requireable; className: PropTypes.Requireable; grid: PropTypes.Requireable; snap: PropTypes.Requireable; y: PropTypes.Requireable; }>>; snapGap: PropTypes.Requireable; bounds: PropTypes.Requireable>; boundsByDirection: PropTypes.Requireable; size: PropTypes.Requireable; minWidth: PropTypes.Requireable>; minHeight: PropTypes.Requireable>; maxWidth: PropTypes.Requireable>; maxHeight: PropTypes.Requireable>; lockAspectRatio: PropTypes.Requireable>; lockAspectRatioExtraWidth: PropTypes.Requireable; lockAspectRatioExtraHeight: PropTypes.Requireable; enable: PropTypes.Requireable; handleStyle: PropTypes.Requireable; handleClass: PropTypes.Requireable; handleWrapperStyle: PropTypes.Requireable; handleWrapperClass: PropTypes.Requireable; handleNode: PropTypes.Requireable; children: PropTypes.Requireable; onResizeStart: PropTypes.Requireable<(...args: any[]) => any>; onChange: PropTypes.Requireable<(...args: any[]) => any>; onResizeEnd: PropTypes.Requireable<(...args: any[]) => any>; defaultSize: PropTypes.Requireable; scale: PropTypes.Requireable; ratio: PropTypes.Requireable>; }; static defaultProps: Partial; foundation: ResizableFoundation; resizableRef: React.RefObject; constructor(props: ResizableProps); componentDidMount(): void; componentDidUpdate(_prevProps: ResizableProps): void; componentWillUnmount(): void; getResizable: () => HTMLDivElement; get adapter(): ResizableAdapter; renderResizeHandler: () => React.JSX.Element; render(): React.JSX.Element; } export default Resizable;