https://github.com/tqwewe/leptos_drag_reorder

Leptos hook for draggable panels which can be rearranged.
https://github.com/tqwewe/leptos_drag_reorder

Last synced: 15 days ago
JSON representation

Leptos hook for draggable panels which can be rearranged.

• Host: GitHub
• URL: https://github.com/tqwewe/leptos_drag_reorder
• Owner: tqwewe
• Created: 2024-11-09T11:35:28.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-11-18T12:40:07.000Z (2 months ago)
• Last Synced: 2024-12-19T03:36:33.893Z (about 1 month ago)
• Language: Rust
• Homepage: https://docs.rs/leptos_drag_reorder
• Size: 6.52 MB
• Stars: 8
• Watchers: 1
• Forks: 2
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-leptos - leptos_drag_reorder

README

        
# Leptos Drag Reorder

Leptos hook for draggable panels which can be rearranged.

This library uses the browsers drag APIs, so it should be very stable.

**Only supports Leptos 0.7**

![Preview GIF](https://github.com/tqwewe/leptos_drag_reorder/blob/main/preview.gif?raw=true)

### Example

Provide drag order context.

```rust

let panel_order = [

    // Column 1

    RwSignal::new(vec!["1".into(), "3".into()]),

    // Column 2

    RwSignal::new(vec!["2".into()]),

];

let column_refs = provide_drag_reorder(panel_order);

```

Use drag reorder in panel component.

```rust

let UseDragReorderReturn {

    node_ref,

    draggable,

    set_draggable,

    hover_position,

    on_dragstart,

    on_dragend,

    ..

} = use_drag_reorder(id.to_string());

// apply node ref, on_dragstart/end, etc.

```

A full example is available in the example directory.