ResizableHandle

Draggable handle for resizing panels

Example

resizable

Loading preview…

Draggable handle for resizing panels

Source: packages/appkit-ui/src/react/ui/resizable.tsx

Prop	Type	Default	Description
`disabled`	`boolean`	-	-
`hitAreaMargins`	`PointerHitAreaMargins`	-	-
`id`	`string \| null`	-	-
`onBlur`	`(() => void)`	-	-
`onClick`	`(() => void)`	-	-
`onDragging`	`PanelResizeHandleOnDragging`	-	-
`onFocus`	`(() => void)`	-	-
`onPointerDown`	`(() => void)`	-	-
`onPointerUp`	`(() => void)`	-	-
`tagName`	`enum`	-	-
`withHandle`	`boolean`	-	-

import { ResizableHandle } from '@databricks/appkit-ui';

<ResizableHandle /* props */ />

Individual resizable panel within a panel group

Source: packages/appkit-ui/src/react/ui/resizable.tsx

Prop	Type	Default	Description
`collapsedSize`	`number`	-	-
`collapsible`	`boolean`	-	-
`defaultSize`	`number`	-	-
`id`	`string`	-	-
`maxSize`	`number`	-	-
`minSize`	`number`	-	-
`onCollapse`	`PanelOnCollapse`	-	-
`onExpand`	`PanelOnExpand`	-	-
`onResize`	`PanelOnResize`	-	-
`order`	`number`	-	-
`tagName`	`enum`	-	-

import { ResizablePanel } from '@databricks/appkit-ui';

<ResizablePanel /* props */ />

Container for resizable panel layout

Source: packages/appkit-ui/src/react/ui/resizable.tsx

Prop	Type	Required	Default	Description
`autoSaveId`	`string \| null`		-	-
`direction`	`enum`	✓	-	-
`id`	`string \| null`		-	-
`keyboardResizeBy`	`number \| null`		-	-
`onLayout`	`PanelGroupOnLayout \| null`		-	-
`storage`	`PanelGroupStorage`		-	-
`tagName`	`enum`		-	-

import { ResizablePanelGroup } from '@databricks/appkit-ui';

<ResizablePanelGroup /* props */ />