React Resizable Hook
A React hook to make any element resizable. It has no dependencies (except React) and is very lightweight.
This site is a collection of examples, all of which you can find on CodeSandbox here. For simplicity the examples are using TailwindCSS, but you can use any CSS framework or none at all - it's all up to you.
Basic
This section outlines some basic examples of what the useResizable hook can be used for.
Multiple handles
The hook is very flexible and can be used to create any kind of resizable element. This example shows how to create a resizable element with multiple handles. The implementation has two normal handles and two reverse handles (the reverse handles are used to resize the element in the opposite direction and offset the position of the element).
Layout
Notice
This example is just to show how the hook can be used, and is not necessarily a good way to create a layout.
This example shows how to use the hook to create a resizable layout. The layout is made up of a footer, a sidebar on either side and a content area. The sidebars and footer are resizable and the content area is fixed.