dnd_kit_jaspr 0.3.0-dev.0 copy "dnd_kit_jaspr: ^0.3.0-dev.0" to clipboard
dnd_kit_jaspr: ^0.3.0-dev.0 copied to clipboard

Jaspr (web) adapter for the dnd_kit drag-and-drop family, built on the shared dnd_kit engine.

example/example.md

dnd_kit_jaspr Example #

This package-local example gives pub.dev a compact, illustrative sample. The full runnable Jaspr browser app lives in the repository-level examples/jaspr_basic_drag_drop directory.

import 'package:dnd_kit_jaspr/dnd_kit_jaspr.dart';
import 'package:jaspr/dom.dart';
import 'package:jaspr/jaspr.dart';

class TaskBoard extends StatelessComponent {
  const TaskBoard({super.key});

  @override
  Component build(BuildContext context) {
    return DndScope(
      child: Component.fragment([
        DndDroppable(
          id: const DndId('done'),
          builder: (context, details, child) {
            return div(
              classes: details.isOver ? 'lane lane--active' : 'lane',
              [child ?? text('Drop here')],
            );
          },
          child: div([text('Done')]),
        ),
        DndDraggable(
          id: const DndId('task-1'),
          label: 'Task 1',
          child: div(classes: 'card', [text('Task 1')]),
        ),
        const DndLiveRegion(),
      ]),
    );
  }
}

More complete examples:

3
likes
0
points
489
downloads

Publisher

unverified uploader

Weekly Downloads

Jaspr (web) adapter for the dnd_kit drag-and-drop family, built on the shared dnd_kit engine.

Homepage
Repository (GitHub)
View/report issues

Topics

#drag-and-drop #dnd #jaspr #web

License

unknown (license)

Dependencies

dnd_kit, jaspr, universal_web

More

Packages that depend on dnd_kit_jaspr