Skip to content

Conversation

@STRML
Copy link
Collaborator

@STRML STRML commented Sep 7, 2022

Continuation of #1188.

Original description:

Handles moving conflicting elements in a way appropriate for a sequence of elements arranged in a wrapped-paragraph style.

Handles moving conflicting elements in a way appropriate for a sequence of elements arranged in a wrapped-paragraph style.
@github-actions github-actions bot added the documentation use this label for changes in documentation label Sep 7, 2022
@lhotamir
Copy link

lhotamir commented Nov 7, 2022

Any updates on this PR?

@theninja
Copy link

Re a custom compacter function mentioned in #1188 (comment), I did partially introduce this idea in a fork: Maczuga@a3de04e. For my specific use case I allowed passing in what I called a compactor and collision resolver; both are just functions that allow customising these operations on the layout (ignoring my collisonResolver typo 😆).

Hopefully this is useful in some way as a rough starting point if anyone wants to genericise this functionality. There would obviously be work involved in untangling the existing compaction logic, tweaking places like lib/utils#compact and passing the compactor around to other parts of the codebase that use compact directly.

I didn't need to do that extra work because both the collision resolution and compacting were handled at the same time by some standalone logic (both in a custom collisionResolver), rather than as two separate steps. I just made the minimum changes necessary to inject something "RGL agnostic" (in case I swapped grid library later). IIRC I took the easy route and my compactor just returned the original layout and I set compactType to null and ensured lib/utils#compact returned the unmodified layout in that case.

@manikandanr-qapita
Copy link

Any updates on this PR?
Looking forward to seeing it merged :)

@fstivicic
Copy link

This is exactly what I am missing.

@fstivicic
Copy link

Any chance this ends up in the next release?

@Mayerkel
Copy link

Mayerkel commented Mar 5, 2023

This would make the library go from great to perfect. Please work towards having this merged.

@manikandanr-qapita
Copy link

This would make the library go from great to perfect. Please work towards having this merged.

+1

@deepak-qapita
Copy link

Any updates on this super cool PR?

@deepak-qapita
Copy link

This would make the library go from great to perfect. Please work towards having this merged.

+1

@manikandanr-qapita
Copy link

@STRML Any updates on this super cool PR? Exactly this will resolve our most of the issues

@fstivicic
Copy link

Is there any timeline for this feature?

@SkydersZ
Copy link

SkydersZ commented Apr 4, 2023

does anyone has found a workaround since this PR is not yet implemented ?

@mauriciovillam
Copy link

What else needs to be done to make this happen?

@iamalvisng
Copy link

Hi, any updates on this PR?

@das-moumita
Copy link

das-moumita commented Jun 12, 2023

@STRML Hi, Any updates on this PR?

@lhotamir
Copy link

@STRML Any upadte on this? I would love to help, but it looks pretty much done already.

@yooowassup
Copy link

@STRML when is this getting released?

@arthur-lama
Copy link

Hi, any updates on this PR? This would solve many people's issues

@syedad218
Copy link

any updates here 🙏

STRML added a commit that referenced this pull request Dec 8, 2025
This RFC proposes a comprehensive rewrite of react-grid-layout in TypeScript
with a modernized, composable API while maintaining backwards compatibility.

Key changes:
- Pure TypeScript core with no React dependencies in layout algorithms
- Composable interfaces: Compactor, PositionStrategy, DragConfig, ResizeConfig, DropConfig
- Hooks-based API (useGridLayout, useResponsiveLayout, useContainerWidth)
- Fast compaction algorithm (O(n log n) vs O(n²)) - PR #2152
- Drag threshold fix (onDragStart only fires after 3px movement) - PR #1411
- Wrap compact mode support via Compactor interface - PR #1773
- Legacy wrapper for 100% backwards compatibility
- data-grid prop isolated to legacy wrapper only

Breaking changes in v2:
1. onDragStart requires mouse movement (3px threshold)
2. Immutable callback parameters
3. data-grid prop only in legacy wrapper
4. Fast compaction algorithm by default (use legacy* for exact v1 behavior)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <[email protected]>
STRML added a commit that referenced this pull request Dec 9, 2025
Implements wrap mode compaction where items flow left-to-right and wrap
to the next row, similar to words in a paragraph. When dragging:
- Moving an item earlier shifts other items right/down
- Moving an item later shifts other items left/up

This is a v2 reimplementation of the algorithm from PR #1773 by
@JohnThomson, adapted to the new composable Compactor interface.

Usage:
```tsx
import { wrapCompactor } from 'react-grid-layout/extras';
<GridLayout compactor={wrapCompactor} ... />
```
STRML added a commit that referenced this pull request Dec 10, 2025
* feat(extras): add wrap compactor for paragraph-style layouts

Implements wrap mode compaction where items flow left-to-right and wrap
to the next row, similar to words in a paragraph. When dragging:
- Moving an item earlier shifts other items right/down
- Moving an item later shifts other items left/up

This is a v2 reimplementation of the algorithm from PR #1773 by
@JohnThomson, adapted to the new composable Compactor interface.

Usage:
```tsx
import { wrapCompactor } from 'react-grid-layout/extras';
<GridLayout compactor={wrapCompactor} ... />
```

* fix(readme): correct attribution for PR #2175

Change credit from @nicosayer to @dmj900501 who is the actual author
of the GridBackground feature PR.
@STRML STRML closed this in #2186 Dec 10, 2025
@STRML STRML deleted the compactTypeWrap branch December 10, 2025 01:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation use this label for changes in documentation enhancement

Projects

None yet

Development

Successfully merging this pull request may close these issues.