0.6.13 • Published 9 months ago

@dxos/react-ui-mosaic v0.6.13

Weekly downloads
-
License
MIT
Repository
-
Last release
9 months ago

Mosaic

Mosaic is a drag-and-drop layout system for building responsive, multi-column layouts. It is built on top of dnd kit and DXOS UI.

Taxonomy

ItemDescription
Mosaic.ProviderA Root container and React context that routes events between Containers.
Mosaic.OverlayA DOM portal managed by the Mosaic context that renders a Container's Component while dragging.
Mosaic.ContainerA complex React component that manages the layout of a collection of tiles (e.g., Grid, Kanban, Stack, Table, Tree).
Mosaic.TileA Draggable wrapper managed by its parent container.
ComponentA pure React component that is rendered within the layout via the container's Tile or the root Mosaic's Overlay.
ItemA datum represented by a Tile.

Design principles

  • Extends dnd-kit without obfuscation or wrapping; for example, mosaic provides additional hooks in the same manner as dnd-kit's own useSortable`.
  • Mosaics consist of containers and pure components that can be laid out and rearranged by the user
  • DXOS UI components are pure tailwind-styled Radix components that expose small parts (List, ListItem, ListItem.Header, etc.)
  • Mosaic Containers define their own data model and assemble Radix-style DXOS UI components.
  • Containers implement specific layouts of Tiles, which may reuse common components, such as DXOS UI Cards.
  • Container Models facilitate pure React components, but are easily mapped to data structures (e.g., Graph) and ECHO data sets without the need to wrap/map the underlying reactive objects (e.g., via signals).

Issues

0.6.13

9 months ago

0.6.12

9 months ago

0.5.4

1 year ago

0.5.3

1 year ago

0.5.6

1 year ago

0.5.5

1 year ago

0.6.12-main.78ddbdf

10 months ago

0.6.8-main.3be982f

11 months ago

0.6.10-main.e92b5eb

11 months ago

0.6.8-main.046e6cf

11 months ago

0.6.12-main.15a606f

10 months ago

0.6.12-main.5a87ad5

10 months ago

0.6.12-main.7907542

10 months ago

0.6.12-main.5cc132e

10 months ago

0.6.3-main.7853476

12 months ago

0.6.3-main.0308ae2

12 months ago

0.5.8

1 year ago

0.5.7

1 year ago

0.6.3-main.0dc8689

12 months ago

0.6.12-main.568932b

10 months ago

0.6.3-next.4424131

12 months ago

0.6.12-main.ed7cda7

10 months ago

0.6.10-main.48c066e

10 months ago

0.6.10-main.3cfcc89

10 months ago

0.6.3-main.d1c1553

12 months ago

0.6.12-main.89e9959

10 months ago

0.6.10-main.bbdfaa4

10 months ago

0.6.6-main.e1a6e1f

11 months ago

0.6.12-main.c4a728f

10 months ago

0.6.3-main.d16c079

12 months ago

0.6.12-main.f9d0246

10 months ago

0.6.3-next.1b3691b

12 months ago

0.6.7

11 months ago

0.6.6

11 months ago

0.6.9

11 months ago

0.6.8

11 months ago

0.6.3

12 months ago

0.6.2

1 year ago

0.6.5

11 months ago

0.6.4

12 months ago

0.6.1

1 year ago

0.6.0

1 year ago

0.6.3-main.a95c491

12 months ago

0.6.10

10 months ago

0.6.11

10 months ago

0.6.3-main.8eec022

12 months ago

0.6.12-main.c974201

10 months ago

0.5.2

1 year ago

0.5.0

1 year ago

0.4.9

1 year ago

0.4.8

1 year ago

0.4.7

1 year ago

0.4.6

1 year ago

0.4.5

1 year ago

0.4.4

1 year ago

0.4.3

1 year ago

0.4.2

1 year ago

0.4.1

1 year ago

0.4.0

1 year ago

0.3.10

2 years ago

0.3.9

2 years ago

0.3.8

2 years ago

0.3.7

2 years ago

0.3.6

2 years ago

0.3.5

2 years ago

0.3.4

2 years ago

0.3.3

2 years ago