ResizableHandle

Draggable and keyboard-resizable separator between two panels.

Import

import { ResizableHandle } from "@jcsoftdev/ui/containers";

Single-component entry points tree-shake to just this component: @jcsoftdev/ui/containers/resizable.

Usage

export const Default: Story = { render: () => <Demo direction="horizontal" /> };

Source of the Storybook story.

Props

Prop	Type	Default	Description
label	string		Accessible name; the default describes the two neighbouring panels.

* marks a required prop.

It also accepts the native props of the element or primitive it renders (for example className, id, aria-* and event handlers).

Storybook stories

• Default
• Vertical
• Narrow
• Brutal Preset

Source

packages/ui/src/containers/resizable/resizable.tsx