react-grid-layout-enhancement

A draggable and resizable grid layout with responsive breakpoints, for React.

Usage no npm install needed!

<script type="module">
  import reactGridLayoutEnhancement from 'https://cdn.skypack.dev/react-grid-layout-enhancement';
</script>

README

React-Grid-Layout-Enhancement

React-Grid-Layout-Enhancement is a grid layout system modified by React-Grid-Layout, for React.

change log:

1.add layout change reason

add ChangeReason in utils.js:
export const ChangeReason = {
  didMount: "didMount",
  didUpdate: "didUpdate",
  dropItem: "dropItem",
  containerWidthChange: "containerWidthChange",
  itemMove: "itemMove",
  itemResize: "itemResize"
};

modify onLayoutChange func:
onLayoutChange(changeReason, layout, newLayouts)

so that developer can know the reason why onLayoutChange fired
  1. lock width and height radio for ResponsiveReactGridLayout when window size changed
u can add isLockWidthAndHeightRadio={false} props to ResponsiveReactGridLayout to disable this function