layout-manager-react: Highly Customizable React Layout Manager

#javascript #webdev #react #opensource

I built layout-manager-react for React apps that need flexible, real-time, and resizable layouts — perfect for dashboards, trading platforms, and IDEs.

✨ Key Features

Flexbox-based layout system for responsive panels
Drag & drop with 4 drop zones (center, left, right, top/bottom)
Resizable tabsets with splitters
RTL/LTR direction support
Persistent state with localStorage and debouncing
Tab closing, restoration, and reordering
Custom close icons for tabs
Component restoration system
Tab selection and direction switching
Storage management (clear or reset layout)
Min/max width/height constraints
Highly customizable to fit your app’s needs

`import { Layout, createLayoutModel, createTab, createTabSet } from 'layout-manager-react';
import 'layout-manager-react/dist/style.css';

const model = createLayoutModel(
createTabSet('tabs', [
createTab('tab1', 'dashboard', 'Dashboard'),
createTab('tab2', 'analytics', 'Analytics'),
])
);

🔗 Links
GitHub: github.com/hrashkan/layout-manager-react
npm: npm install layout-manager-react

Why You’ll Love It: