@dxos/react-ui-mosaic 0.6.4 → 0.6.5-staging.435ed25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/browser/index.mjs +58 -22
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/types/src/mosaic/Container.d.ts +25 -11
- package/dist/types/src/mosaic/Container.d.ts.map +1 -1
- package/dist/types/src/mosaic/DragOverlay.d.ts.map +1 -1
- package/dist/types/src/mosaic/Mosaic.d.ts +4 -3
- package/dist/types/src/mosaic/Mosaic.d.ts.map +1 -1
- package/dist/types/src/mosaic/Root.d.ts +4 -0
- package/dist/types/src/mosaic/Root.d.ts.map +1 -1
- package/dist/types/src/mosaic/SortableContext.d.ts.map +1 -1
- package/dist/types/src/mosaic/Tile.d.ts.map +1 -1
- package/package.json +29 -23
- package/src/mosaic/Container.tsx +41 -11
- package/src/mosaic/DragOverlay.tsx +8 -3
- package/src/mosaic/Mosaic.ts +14 -3
- package/src/mosaic/Root.tsx +80 -20
- package/src/mosaic/SortableContext.tsx +1 -0
- package/src/mosaic/Tile.tsx +3 -1
- package/src/mosaic/hooks/useItemsWithPreview.ts +1 -1
- package/src/mosaic/util/path.ts +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx":{"bytes":10051,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useContainer.ts":{"bytes":1302,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"../Container"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx":{"bytes":2137,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/data.ts":{"bytes":2069,"imports":[{"path":"@dxos/util","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/path.ts":{"bytes":3475,"imports":[],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/props.ts":{"bytes":2160,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"../Container"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/styles.ts":{"bytes":1504,"imports":[{"path":"@dnd-kit/utilities","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts":{"bytes":750,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/data.ts","kind":"import-statement","original":"./data"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/path.ts","kind":"import-statement","original":"./path"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/props.ts","kind":"import-statement","original":"./props"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/styles.ts","kind":"import-statement","original":"./styles"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx":{"bytes":2962,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-card","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx":{"bytes":26336,"imports":[{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"lodash.pick","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"./Container"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx","kind":"import-statement","original":"./Debug"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts":{"bytes":1223,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx","kind":"import-statement","original":"../Root"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithPreview.ts":{"bytes":9262,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts","kind":"import-statement","original":"./useMosaic"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"../util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithOrigin.ts":{"bytes":3714,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts","kind":"import-statement","original":"./useMosaic"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"../util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts":{"bytes":850,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useContainer.ts","kind":"import-statement","original":"./useContainer"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithPreview.ts","kind":"import-statement","original":"./useItemsWithPreview"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithOrigin.ts","kind":"import-statement","original":"./useItemsWithOrigin"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts","kind":"import-statement","original":"./useMosaic"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/types.ts":{"bytes":1072,"imports":[],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/DragOverlay.tsx":{"bytes":15772,"imports":[{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/SortableContext.tsx":{"bytes":6921,"imports":[{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Tile.tsx":{"bytes":18544,"imports":[{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"./Container"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Mosaic.ts":{"bytes":6280,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"./Container"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx","kind":"import-statement","original":"./Debug"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DragOverlay.tsx","kind":"import-statement","original":"./DragOverlay"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx","kind":"import-statement","original":"./Root"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/SortableContext.tsx","kind":"import-statement","original":"./SortableContext"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Tile.tsx","kind":"import-statement","original":"./Tile"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/index.ts":{"bytes":750,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/types.ts","kind":"import-statement","original":"./types"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Mosaic.ts","kind":"import-statement","original":"./Mosaic"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/index.ts":{"bytes":493,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/index.ts","kind":"import-statement","original":"./mosaic"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-mosaic/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":58479},"packages/ui/react-ui-mosaic/dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true},{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"lodash.pick","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-card","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"@dnd-kit/utilities","kind":"import-statement","external":true},{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["Mosaic","Path","getTransformCSS","isTileComponentProps","isTileProps","swapItems","useContainer","useItemsWithOrigin","useItemsWithPreview","useMosaic"],"entryPoint":"packages/ui/react-ui-mosaic/src/index.ts","inputs":{"packages/ui/react-ui-mosaic/src/mosaic/hooks/useContainer.ts":{"bytesInOutput":97},"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx":{"bytesInOutput":1160},"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithPreview.ts":{"bytesInOutput":2023},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts":{"bytesInOutput":183},"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx":{"bytesInOutput":5547},"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx":{"bytesInOutput":442},"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx":{"bytesInOutput":661},"packages/ui/react-ui-mosaic/src/mosaic/util/data.ts":{"bytesInOutput":306},"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-mosaic/src/mosaic/util/path.ts":{"bytesInOutput":678},"packages/ui/react-ui-mosaic/src/mosaic/util/props.ts":{"bytesInOutput":318},"packages/ui/react-ui-mosaic/src/mosaic/util/styles.ts":{"bytesInOutput":180},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithOrigin.ts":{"bytesInOutput":594},"packages/ui/react-ui-mosaic/src/mosaic/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-mosaic/src/mosaic/DragOverlay.tsx":{"bytesInOutput":3587},"packages/ui/react-ui-mosaic/src/mosaic/SortableContext.tsx":{"bytesInOutput":1191},"packages/ui/react-ui-mosaic/src/mosaic/Tile.tsx":{"bytesInOutput":3480},"packages/ui/react-ui-mosaic/src/mosaic/Mosaic.ts":{"bytesInOutput":383},"packages/ui/react-ui-mosaic/src/index.ts":{"bytesInOutput":0}},"bytes":22303}}}
|
|
1
|
+
{"inputs":{"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx":{"bytes":11553,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useContainer.ts":{"bytes":1302,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"../Container"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx":{"bytes":2137,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/data.ts":{"bytes":2069,"imports":[{"path":"@dxos/util","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/path.ts":{"bytes":3475,"imports":[],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/props.ts":{"bytes":2160,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"../Container"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/styles.ts":{"bytes":1504,"imports":[{"path":"@dnd-kit/utilities","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts":{"bytes":750,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/data.ts","kind":"import-statement","original":"./data"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/path.ts","kind":"import-statement","original":"./path"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/props.ts","kind":"import-statement","original":"./props"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/styles.ts","kind":"import-statement","original":"./styles"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx":{"bytes":2962,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-card","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx":{"bytes":31434,"imports":[{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"lodash.pick","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"./Container"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx","kind":"import-statement","original":"./Debug"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts":{"bytes":1223,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx","kind":"import-statement","original":"../Root"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithPreview.ts":{"bytes":9345,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts","kind":"import-statement","original":"./useMosaic"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"../util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithOrigin.ts":{"bytes":3714,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts","kind":"import-statement","original":"./useMosaic"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"../util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts":{"bytes":850,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useContainer.ts","kind":"import-statement","original":"./useContainer"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithPreview.ts","kind":"import-statement","original":"./useItemsWithPreview"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithOrigin.ts","kind":"import-statement","original":"./useItemsWithOrigin"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts","kind":"import-statement","original":"./useMosaic"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/types.ts":{"bytes":1072,"imports":[],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/DragOverlay.tsx":{"bytes":16045,"imports":[{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/SortableContext.tsx":{"bytes":6994,"imports":[{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Tile.tsx":{"bytes":18759,"imports":[{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"./Container"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/Mosaic.ts":{"bytes":6732,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx","kind":"import-statement","original":"./Container"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx","kind":"import-statement","original":"./Debug"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx","kind":"import-statement","original":"./DefaultComponent"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/DragOverlay.tsx","kind":"import-statement","original":"./DragOverlay"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx","kind":"import-statement","original":"./Root"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/SortableContext.tsx","kind":"import-statement","original":"./SortableContext"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Tile.tsx","kind":"import-statement","original":"./Tile"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/mosaic/index.ts":{"bytes":750,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/types.ts","kind":"import-statement","original":"./types"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts","kind":"import-statement","original":"./util"},{"path":"packages/ui/react-ui-mosaic/src/mosaic/Mosaic.ts","kind":"import-statement","original":"./Mosaic"}],"format":"esm"},"packages/ui/react-ui-mosaic/src/index.ts":{"bytes":493,"imports":[{"path":"packages/ui/react-ui-mosaic/src/mosaic/index.ts","kind":"import-statement","original":"./mosaic"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-mosaic/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":62995},"packages/ui/react-ui-mosaic/dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/debug","kind":"import-statement","external":true},{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"lodash.pick","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-dom","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-card","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"@dnd-kit/utilities","kind":"import-statement","external":true},{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dnd-kit/core","kind":"import-statement","external":true},{"path":"@dnd-kit/sortable","kind":"import-statement","external":true},{"path":"@radix-ui/react-compose-refs","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["Mosaic","Path","getTransformCSS","isTileComponentProps","isTileProps","swapItems","useContainer","useItemsWithOrigin","useItemsWithPreview","useMosaic"],"entryPoint":"packages/ui/react-ui-mosaic/src/index.ts","inputs":{"packages/ui/react-ui-mosaic/src/mosaic/hooks/useContainer.ts":{"bytesInOutput":97},"packages/ui/react-ui-mosaic/src/mosaic/Container.tsx":{"bytesInOutput":1206},"packages/ui/react-ui-mosaic/src/mosaic/hooks/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithPreview.ts":{"bytesInOutput":2042},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useMosaic.ts":{"bytesInOutput":183},"packages/ui/react-ui-mosaic/src/mosaic/Root.tsx":{"bytesInOutput":6812},"packages/ui/react-ui-mosaic/src/mosaic/Debug.tsx":{"bytesInOutput":442},"packages/ui/react-ui-mosaic/src/mosaic/DefaultComponent.tsx":{"bytesInOutput":661},"packages/ui/react-ui-mosaic/src/mosaic/util/data.ts":{"bytesInOutput":306},"packages/ui/react-ui-mosaic/src/mosaic/util/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-mosaic/src/mosaic/util/path.ts":{"bytesInOutput":678},"packages/ui/react-ui-mosaic/src/mosaic/util/props.ts":{"bytesInOutput":318},"packages/ui/react-ui-mosaic/src/mosaic/util/styles.ts":{"bytesInOutput":180},"packages/ui/react-ui-mosaic/src/mosaic/hooks/useItemsWithOrigin.ts":{"bytesInOutput":594},"packages/ui/react-ui-mosaic/src/mosaic/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-mosaic/src/mosaic/DragOverlay.tsx":{"bytesInOutput":3623},"packages/ui/react-ui-mosaic/src/mosaic/SortableContext.tsx":{"bytesInOutput":1208},"packages/ui/react-ui-mosaic/src/mosaic/Tile.tsx":{"bytesInOutput":3535},"packages/ui/react-ui-mosaic/src/mosaic/Mosaic.ts":{"bytesInOutput":383},"packages/ui/react-ui-mosaic/src/index.ts":{"bytesInOutput":0}},"bytes":23741}}}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { type Modifier } from '@dnd-kit/core';
|
|
1
|
+
import { type Modifier, type DragEndEvent, type DragMoveEvent } from '@dnd-kit/core';
|
|
2
2
|
import React, { type CSSProperties, type HTMLAttributes, type PropsWithChildren } from 'react';
|
|
3
3
|
import { type ThemedClassName } from '@dxos/react-ui';
|
|
4
|
+
import { type MosaicDropAnimation } from './Root';
|
|
4
5
|
import { type MosaicTileComponent } from './Tile';
|
|
5
6
|
import { type MosaicDataItem, type MosaicDraggedItem } from './types';
|
|
6
7
|
type WithRequiredProperty<Type, Key extends keyof Type> = Type & {
|
|
@@ -8,7 +9,7 @@ type WithRequiredProperty<Type, Key extends keyof Type> = Type & {
|
|
|
8
9
|
};
|
|
9
10
|
export declare const DEFAULT_TRANSITION = 200;
|
|
10
11
|
export declare const DEFAULT_TYPE = "unknown";
|
|
11
|
-
export declare const DEFAULT_COMPONENT:
|
|
12
|
+
export declare const DEFAULT_COMPONENT: MosaicTileComponent;
|
|
12
13
|
export type MosaicTileOverlayProps = {
|
|
13
14
|
grow?: boolean;
|
|
14
15
|
debug?: boolean;
|
|
@@ -23,20 +24,22 @@ export type MosaicTileOverlayProps = {
|
|
|
23
24
|
*/
|
|
24
25
|
export declare const MosaicOperations: readonly ["transfer", "copy", "rearrange", "reject"];
|
|
25
26
|
export type MosaicOperation = (typeof MosaicOperations)[number];
|
|
26
|
-
export type
|
|
27
|
+
export type DefaultMoveDetails = Pick<DragMoveEvent, 'delta'>;
|
|
28
|
+
export type MosaicMoveEvent<TPosition = unknown, TMoveDetails = DefaultMoveDetails> = {
|
|
27
29
|
active: MosaicDraggedItem<TPosition>;
|
|
28
30
|
over: MosaicDraggedItem<TPosition>;
|
|
31
|
+
details?: TMoveDetails;
|
|
29
32
|
};
|
|
30
|
-
export type MosaicDropEvent<TPosition = unknown> = MosaicMoveEvent<TPosition> & {
|
|
33
|
+
export type MosaicDropEvent<TPosition = unknown, TMoveDetails = DefaultMoveDetails> = MosaicMoveEvent<TPosition, TMoveDetails> & {
|
|
31
34
|
operation: MosaicOperation;
|
|
32
35
|
};
|
|
33
|
-
export type MosaicContainerProps<TData extends MosaicDataItem = MosaicDataItem, TPosition = unknown> = ThemedClassName<Omit<HTMLAttributes<
|
|
36
|
+
export type MosaicContainerProps<TData extends MosaicDataItem = MosaicDataItem, TPosition = unknown, TMoveDetails = DefaultMoveDetails, TTileElement extends HTMLElement = HTMLDivElement, TTileProps = {}> = ThemedClassName<Omit<HTMLAttributes<TTileElement>, 'onDrop' | 'onSelect'>> & PropsWithChildren<{
|
|
34
37
|
id: string;
|
|
35
38
|
debug?: boolean;
|
|
36
39
|
/**
|
|
37
40
|
* Default component used to render tiles.
|
|
38
41
|
*/
|
|
39
|
-
Component?: MosaicTileComponent<TData,
|
|
42
|
+
Component?: MosaicTileComponent<TData, TTileElement, TTileProps>;
|
|
40
43
|
/**
|
|
41
44
|
* Default type of tiles.
|
|
42
45
|
*/
|
|
@@ -64,17 +67,28 @@ export type MosaicContainerProps<TData extends MosaicDataItem = MosaicDataItem,
|
|
|
64
67
|
* Called when a tile is dragged over the container.
|
|
65
68
|
* Returns true if the tile can be dropped.
|
|
66
69
|
*/
|
|
67
|
-
onOver?: (event: MosaicMoveEvent<TPosition>) => MosaicOperation;
|
|
70
|
+
onOver?: (event: MosaicMoveEvent<TPosition, TMoveDetails>) => MosaicOperation;
|
|
68
71
|
/**
|
|
69
72
|
* Called when a tile is dropped on the container.
|
|
70
73
|
*/
|
|
71
|
-
onDrop?: (event: MosaicDropEvent<TPosition>) =>
|
|
74
|
+
onDrop?: (event: MosaicDropEvent<TPosition, TMoveDetails>) => MosaicDropAnimation;
|
|
75
|
+
/**
|
|
76
|
+
* Always called when drag ends, no matter what, unlike the other handlers which are only called when relevant.
|
|
77
|
+
*/
|
|
78
|
+
onDragEnd?: (event: DragEndEvent) => void;
|
|
79
|
+
/**
|
|
80
|
+
* Called on `dragmove` when over the container.
|
|
81
|
+
*/
|
|
82
|
+
onMove?: (event: MosaicMoveEvent<TPosition, TMoveDetails>) => {
|
|
83
|
+
operation: MosaicOperation;
|
|
84
|
+
details?: TMoveDetails;
|
|
85
|
+
};
|
|
72
86
|
}>;
|
|
73
|
-
export type MosaicContainerContextType<TData extends MosaicDataItem = MosaicDataItem, TPosition = unknown> = WithRequiredProperty<Omit<MosaicContainerProps<TData, TPosition>, 'children'>, 'type' | 'Component'>;
|
|
74
|
-
export declare const MosaicContainerContext: React.Context<MosaicContainerContextType<any, unknown>>;
|
|
87
|
+
export type MosaicContainerContextType<TData extends MosaicDataItem = MosaicDataItem, TPosition = unknown, TMoveDetails = DefaultMoveDetails> = WithRequiredProperty<Omit<MosaicContainerProps<TData, TPosition, TMoveDetails>, 'children'>, 'type' | 'Component'>;
|
|
88
|
+
export declare const MosaicContainerContext: React.Context<MosaicContainerContextType<any, unknown, DefaultMoveDetails>>;
|
|
75
89
|
/**
|
|
76
90
|
* Root Container that manages the layout of tiles.
|
|
77
91
|
*/
|
|
78
|
-
export declare const MosaicContainer: ({ children, id, debug, type, Component, transitionDuration, modifier, getOverlayProps, getOverlayStyle, onOver, onDrop, }: MosaicContainerProps) => JSX.Element;
|
|
92
|
+
export declare const MosaicContainer: ({ children, id, debug, type, Component, transitionDuration, modifier, getOverlayProps, getOverlayStyle, onOver, onDrop, onMove, onDragEnd, }: MosaicContainerProps) => JSX.Element;
|
|
79
93
|
export {};
|
|
80
94
|
//# sourceMappingURL=Container.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Container.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Container.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,YAAY,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AACrF,OAAO,KAAK,EAAE,EAGZ,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,iBAAiB,EAEvB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAClD,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAElD,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGtE,KAAK,oBAAoB,CAAC,IAAI,EAAE,GAAG,SAAS,MAAM,IAAI,IAAI,IAAI,GAAG;KAC9D,QAAQ,IAAI,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,kBAAkB,MAAM,CAAC;AACtC,eAAO,MAAM,YAAY,YAAY,CAAC;AACtC,eAAO,MAAM,iBAAiB,EAAE,mBAA8D,CAAC;AAE/F,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACvC,CAAC;AAEF;;;;;;GAMG;AAEH,eAAO,MAAM,gBAAgB,sDAAuD,CAAC;AACrF,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;AAGhE,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;AAE9D,MAAM,MAAM,eAAe,CAAC,SAAS,GAAG,OAAO,EAAE,YAAY,GAAG,kBAAkB,IAAI;IACpF,MAAM,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;IACrC,IAAI,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;IACnC,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,SAAS,GAAG,OAAO,EAAE,YAAY,GAAG,kBAAkB,IAAI,eAAe,CACnG,SAAS,EACT,YAAY,CACb,GAAG;IACF,SAAS,EAAE,eAAe,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,oBAAoB,CAC9B,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,SAAS,GAAG,OAAO,EACnB,YAAY,GAAG,kBAAkB,EACjC,YAAY,SAAS,WAAW,GAAG,cAAc,EACjD,UAAU,GAAG,EAAE,IACb,eAAe,CAAC,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC,CAAC,GAC5E,iBAAiB,CAAC;IAChB,EAAE,EAAE,MAAM,CAAC;IAGX,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,SAAS,CAAC,EAAE,mBAAmB,CAAC,KAAK,EAAE,YAAY,EAAE,UAAU,CAAC,CAAC;IAEjE;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,iBAAiB,EAAE,GAAG,YAAY,EAAE,UAAU,CAAC,QAAQ,CAAC,KAAK,UAAU,CAAC,QAAQ,CAAC,CAAC;IAE1G;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,sBAAsB,CAAC;IAE/C;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,aAAa,CAAC;IAEtC;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,SAAS,EAAE,YAAY,CAAC,KAAK,eAAe,CAAC;IAE9E;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,SAAS,EAAE,YAAY,CAAC,KAAK,mBAAmB,CAAC;IAElF;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAE1C;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,SAAS,EAAE,YAAY,CAAC,KAAK;QAC5D,SAAS,EAAE,eAAe,CAAC;QAC3B,OAAO,CAAC,EAAE,YAAY,CAAC;KACxB,CAAC;CACH,CAAC,CAAC;AAEL,MAAM,MAAM,0BAA0B,CACpC,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,SAAS,GAAG,OAAO,EACnB,YAAY,GAAG,kBAAkB,IAC/B,oBAAoB,CAAC,IAAI,CAAC,oBAAoB,CAAC,KAAK,EAAE,SAAS,EAAE,YAAY,CAAC,EAAE,UAAU,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC,CAAC;AAEvH,eAAO,MAAM,sBAAsB,6EAIjC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,eAAe,iJAczB,oBAAoB,gBA0BtB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DragOverlay.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/DragOverlay.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,
|
|
1
|
+
{"version":3,"file":"DragOverlay.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/DragOverlay.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAsB,MAAM,eAAe,CAAC;AAChE,OAAc,EAEZ,KAAK,cAAc,EAMpB,MAAM,OAAO,CAAC;AAUf,MAAM,MAAM,sBAAsB,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,IAAI,CAC7E,cAAc,CAAC,OAAO,WAAW,CAAC,EAClC,UAAU,CACX,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,sCAAqD,sBAAsB,gBAuFxG,CAAC"}
|
|
@@ -6,6 +6,7 @@ import { type MosaicRootProps as NaturalMosaicRootProps } from './Root';
|
|
|
6
6
|
import { type MosaicSortableProps as NaturalMosaicSortableProps } from './SortableContext';
|
|
7
7
|
import { type MosaicTileAction as NaturalMosaicTileAction, type MosaicTileProps as NaturalMosaicTileProps, type MosaicTileComponent as NaturalMosaicTileComponent, type MosaicActiveType as NaturalMosaicActiveType, type MosaicTileComponentProps as NaturalMosaicTileComponentProps } from './Tile';
|
|
8
8
|
import { type MosaicDataItem } from './types';
|
|
9
|
+
export { type DefaultMoveDetails } from './Container';
|
|
9
10
|
export declare const Mosaic: {
|
|
10
11
|
Root: FC<MosaicRootProps>;
|
|
11
12
|
Container: FC<MosaicContainerProps<any, any>>;
|
|
@@ -18,15 +19,15 @@ export declare const Mosaic: {
|
|
|
18
19
|
Debug: FC<MosaicDebugProps>;
|
|
19
20
|
};
|
|
20
21
|
export type MosaicRootProps = NaturalMosaicRootProps;
|
|
21
|
-
export type MosaicContainerProps<TData extends MosaicDataItem = MosaicDataItem, TPosition = unknown> = NaturalMosaicContainerProps<TData, TPosition>;
|
|
22
|
+
export type MosaicContainerProps<TData extends MosaicDataItem = MosaicDataItem, TPosition = unknown, TMoveDetails = Record<string, unknown>, TTileElement extends HTMLElement = HTMLDivElement, TTileProps = {}> = NaturalMosaicContainerProps<TData, TPosition, TMoveDetails, TTileElement, TTileProps>;
|
|
22
23
|
export type MosaicOverlayProps = MosaicDragOverlayProps;
|
|
23
24
|
export type MosaicSortableProps = NaturalMosaicSortableProps;
|
|
24
25
|
export type MosaicTileAction = NaturalMosaicTileAction;
|
|
25
26
|
export type MosaicTileProps<TData extends MosaicDataItem = MosaicDataItem, TPosition = unknown> = NaturalMosaicTileProps<TData, TPosition>;
|
|
26
27
|
export type MosaicTileComponent<TData extends MosaicDataItem = MosaicDataItem, TElement extends HTMLElement = HTMLDivElement, TProps = {}> = NaturalMosaicTileComponent<TData, TElement, TProps>;
|
|
27
28
|
export type MosaicTileComponentProps<TData extends MosaicDataItem = MosaicDataItem> = NaturalMosaicTileComponentProps<TData>;
|
|
28
|
-
export type MosaicMoveEvent<TPosition = unknown
|
|
29
|
-
export type MosaicDropEvent<TPosition = unknown
|
|
29
|
+
export type MosaicMoveEvent<TPosition = unknown, TMoveDetails = Record<string, unknown>> = NaturalMosaicMoveEvent<TPosition, TMoveDetails>;
|
|
30
|
+
export type MosaicDropEvent<TPosition = unknown, TMoveDetails = Record<string, unknown>> = NaturalMosaicDropEvent<TPosition, TMoveDetails>;
|
|
30
31
|
export type MosaicOperation = NaturalMosaicOperation;
|
|
31
32
|
export type MosaicActiveType = NaturalMosaicActiveType;
|
|
32
33
|
export type MosaicDebugProps = DebugProps;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Mosaic.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Mosaic.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAEL,KAAK,oBAAoB,IAAI,2BAA2B,EACxD,KAAK,eAAe,IAAI,sBAAsB,EAC9C,KAAK,eAAe,IAAI,sBAAsB,EAC9C,KAAK,eAAe,IAAI,sBAAsB,EAC/C,MAAM,aAAa,CAAC;AACrB,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEjD,OAAO,EAAqB,KAAK,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EAAc,KAAK,eAAe,IAAI,sBAAsB,EAAE,MAAM,QAAQ,CAAC;AACpF,OAAO,EAAyB,KAAK,mBAAmB,IAAI,0BAA0B,EAAE,MAAM,mBAAmB,CAAC;AAClH,OAAO,EAIL,KAAK,gBAAgB,IAAI,uBAAuB,EAChD,KAAK,eAAe,IAAI,sBAAsB,EAC9C,KAAK,mBAAmB,IAAI,0BAA0B,EACtD,KAAK,gBAAgB,IAAI,uBAAuB,EAChD,KAAK,wBAAwB,IAAI,+BAA+B,EACjE,MAAM,QAAQ,CAAC;AAChB,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,eAAO,MAAM,MAAM;UAcX,GAAG,eAAe,CAAC;eACd,GAAG,qBAAqB,GAAG,EAAE,GAAG,CAAC,CAAC;iBAChC,GAAG,kBAAkB,CAAC;qBAClB,GAAG,mBAAmB,CAAC;mBACzB,GAAG,gBAAgB,GAAG,EAAE,GAAG,CAAC,CAAC;mBAC7B,GAAG,cAAc,cAAc,CAAC,GAAG,gBAAgB,GAAG,EAAE,GAAG,CAAC,CAAC;kBAC9D,GAAG,gBAAgB,GAAG,EAAE,MAAM,CAAC,CAAC;;WAGvC,GAAG,gBAAgB,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,sBAAsB,CAAC;AAErD,MAAM,MAAM,oBAAoB,CAC9B,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,SAAS,GAAG,OAAO,
|
|
1
|
+
{"version":3,"file":"Mosaic.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Mosaic.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,13 +1,17 @@
|
|
|
1
|
+
import { type DropAnimation } from '@dnd-kit/core';
|
|
1
2
|
import React, { type FC, type PropsWithChildren } from 'react';
|
|
2
3
|
import { type MosaicContainerProps, type MosaicOperation } from './Container';
|
|
3
4
|
import { type MosaicTileComponent } from './Tile';
|
|
4
5
|
import { type MosaicDraggedItem } from './types';
|
|
6
|
+
export type MosaicDropAnimation = DropAnimation | null | undefined | void;
|
|
5
7
|
export type MosaicContextType = {
|
|
6
8
|
containers: Record<string, MosaicContainerProps<any> | undefined>;
|
|
7
9
|
setContainer: (id: string, container?: MosaicContainerProps<any>) => void;
|
|
8
10
|
activeItem: MosaicDraggedItem | undefined;
|
|
9
11
|
overItem: MosaicDraggedItem | undefined;
|
|
10
12
|
operation: MosaicOperation;
|
|
13
|
+
moveDetails?: Record<string, unknown>;
|
|
14
|
+
dropAnimation?: MosaicDropAnimation;
|
|
11
15
|
};
|
|
12
16
|
export declare const MosaicContext: React.Context<MosaicContextType | undefined>;
|
|
13
17
|
export type MosaicRootProps = PropsWithChildren<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Root.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Root.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Root.tsx"],"names":[],"mappings":"AAIA,OAAO,EAUL,KAAK,aAAa,EAOnB,MAAM,eAAe,CAAC;AAGvB,OAAO,KAAK,EAAE,EAAiB,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAY,MAAM,OAAO,CAAC;AAGxF,OAAO,EAGL,KAAK,oBAAoB,EACzB,KAAK,eAAe,EACrB,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAClD,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAKjD,MAAM,MAAM,mBAAmB,GAAG,aAAa,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC;AAE1E,MAAM,MAAM,iBAAiB,GAAG;IAC9B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,CAAC;IAClE,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,oBAAoB,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;IAC1E,UAAU,EAAE,iBAAiB,GAAG,SAAS,CAAC;IAC1C,QAAQ,EAAE,iBAAiB,GAAG,SAAS,CAAC;IACxC,SAAS,EAAE,eAAe,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,aAAa,CAAC,EAAE,mBAAmB,CAAC;CACrC,CAAC;AAEF,eAAO,MAAM,aAAa,8CAA0D,CAAC;AAErF,MAAM,MAAM,eAAe,GAAG,iBAAiB,CAAC;IAC9C;;OAEG;IACH,SAAS,CAAC,EAAE,mBAAmB,CAAC,GAAG,CAAC,CAAC;IACrC,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC,CAAC;AAIH;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAwN1C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SortableContext.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/SortableContext.tsx"],"names":[],"mappings":"AAKA,OAAc,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAG9C,KAAK,SAAS,GAAG,YAAY,GAAG,UAAU,CAAC;AAE3C,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,cAAc,GAAG,cAAc,IAAI,iBAAiB,CAAC;IACjG,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC;IAChB,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,CAAC,CAAC;AAEH;;GAEG;AAGH,eAAO,MAAM,qBAAqB,uCAA0D,mBAAmB,
|
|
1
|
+
{"version":3,"file":"SortableContext.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/SortableContext.tsx"],"names":[],"mappings":"AAKA,OAAc,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAG9C,KAAK,SAAS,GAAG,YAAY,GAAG,UAAU,CAAC;AAE3C,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,cAAc,GAAG,cAAc,IAAI,iBAAiB,CAAC;IACjG,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC;IAChB,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,CAAC,CAAC;AAEH;;GAEG;AAGH,eAAO,MAAM,qBAAqB,uCAA0D,mBAAmB,gBAwB9G,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Tile.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,mBAAmB,EAA8B,MAAM,eAAe,CAAC;AAGrF,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,aAAa,EAAE,yBAAyB,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAErG,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAgB,KAAK,eAAe,EAAE,KAAK,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAG9F,OAAO,KAAK,EAAE,cAAc,EAAqB,MAAM,SAAS,CAAC;AAGjE,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,aAAa,CAAC;AAGlF,MAAM,MAAM,gBAAgB,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,GAAG,CAAA;CAAE,CAAC;AAE1E;;GAEG;AACH,MAAM,MAAM,eAAe,CAAC,KAAK,SAAS,cAAc,GAAG,cAAc,EAAE,SAAS,GAAG,OAAO,IAAI,eAAe,CAAC,EAAE,CAAC,GACnH,sBAAsB,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,KAAK,CAAC;IACZ,SAAS,CAAC,EAAE,mBAAmB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IAC5C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAG1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,cAAc,CAAC,EAAE,mBAAmB,GAElC,cAAc,CAAC,WAAW,CAAC,CAAC;IAG9B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,wBAAwB,CAAC,KAAK,SAAS,cAAc,GAAG,cAAc,IAAI,IAAI,CACxF,eAAe,CAAC,KAAK,CAAC,EACtB,WAAW,GAAG,WAAW,CAC1B,GAAG;IAAE,SAAS,EAAE,eAAe,CAAA;CAAE,CAAC;AAEnC;;GAEG;AACH,MAAM,MAAM,mBAAmB,CAC7B,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,QAAQ,SAAS,WAAW,GAAG,cAAc,EAC7C,MAAM,GAAG,EAAE,IACT,yBAAyB,CAAC,aAAa,CAAC,QAAQ,CAAC,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,CAAC;AAElG;;GAEG;AACH,eAAO,MAAM,aAAa,oFAQvB,gBAAgB,GAAG,CAAC,gBA0BtB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa;;;UAjFhB,MAAM;;;;;;;;;;;sBAiBK,IAAI;yBACD,OAAO,KAAK,IAAI;wBACjB,IAAI;yBACH,IAAI;wBACL,IAAI;yBACH,gBAAgB,KAAK,IAAI;+CAsFhD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,YAAY,uGAQtB,gBAAgB,GAAG,EAAE,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"Tile.d.ts","sourceRoot":"","sources":["../../../../src/mosaic/Tile.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,mBAAmB,EAA8B,MAAM,eAAe,CAAC;AAGrF,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,aAAa,EAAE,yBAAyB,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAErG,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAgB,KAAK,eAAe,EAAE,KAAK,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAG9F,OAAO,KAAK,EAAE,cAAc,EAAqB,MAAM,SAAS,CAAC;AAGjE,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,aAAa,CAAC;AAGlF,MAAM,MAAM,gBAAgB,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,GAAG,CAAA;CAAE,CAAC;AAE1E;;GAEG;AACH,MAAM,MAAM,eAAe,CAAC,KAAK,SAAS,cAAc,GAAG,cAAc,EAAE,SAAS,GAAG,OAAO,IAAI,eAAe,CAAC,EAAE,CAAC,GACnH,sBAAsB,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,KAAK,CAAC;IACZ,SAAS,CAAC,EAAE,mBAAmB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IAC5C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAG1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,cAAc,CAAC,EAAE,mBAAmB,GAElC,cAAc,CAAC,WAAW,CAAC,CAAC;IAG9B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,wBAAwB,CAAC,KAAK,SAAS,cAAc,GAAG,cAAc,IAAI,IAAI,CACxF,eAAe,CAAC,KAAK,CAAC,EACtB,WAAW,GAAG,WAAW,CAC1B,GAAG;IAAE,SAAS,EAAE,eAAe,CAAA;CAAE,CAAC;AAEnC;;GAEG;AACH,MAAM,MAAM,mBAAmB,CAC7B,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,QAAQ,SAAS,WAAW,GAAG,cAAc,EAC7C,MAAM,GAAG,EAAE,IACT,yBAAyB,CAAC,aAAa,CAAC,QAAQ,CAAC,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,CAAC;AAElG;;GAEG;AACH,eAAO,MAAM,aAAa,oFAQvB,gBAAgB,GAAG,CAAC,gBA0BtB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa;;;UAjFhB,MAAM;;;;;;;;;;;sBAiBK,IAAI;yBACD,OAAO,KAAK,IAAI;wBACjB,IAAI;yBACH,IAAI;wBACL,IAAI;yBACH,gBAAgB,KAAK,IAAI;+CAsFhD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,YAAY,uGAQtB,gBAAgB,GAAG,EAAE,MAAM,CAAC,gBAyD9B,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,15 +1,21 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dxos/react-ui-mosaic",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.5-staging.435ed25",
|
|
4
4
|
"description": "An intermediate interface for drag-and-drop interactions.",
|
|
5
5
|
"homepage": "https://dxos.org",
|
|
6
6
|
"bugs": "https://github.com/dxos/dxos/issues",
|
|
7
7
|
"license": "MIT",
|
|
8
8
|
"author": "DXOS.org",
|
|
9
9
|
"exports": {
|
|
10
|
-
".":
|
|
10
|
+
".": {
|
|
11
|
+
"browser": "./dist/lib/browser/index.mjs",
|
|
12
|
+
"types": "./dist/types/src/index.d.ts"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"types": "dist/types/src/index.d.ts",
|
|
16
|
+
"typesVersions": {
|
|
17
|
+
"*": {}
|
|
11
18
|
},
|
|
12
|
-
"types": "./dist/types/src/index.d.ts",
|
|
13
19
|
"files": [
|
|
14
20
|
"dist",
|
|
15
21
|
"src"
|
|
@@ -23,16 +29,16 @@
|
|
|
23
29
|
"@radix-ui/react-compose-refs": "^1.0.0",
|
|
24
30
|
"lodash.defaultsdeep": "^4.6.1",
|
|
25
31
|
"lodash.pick": "^4.4.0",
|
|
26
|
-
"react-resize-detector": "^
|
|
27
|
-
"@dxos/
|
|
28
|
-
"@dxos/
|
|
29
|
-
"@dxos/
|
|
30
|
-
"@dxos/react-ui": "0.6.
|
|
31
|
-
"@dxos/react-ui-card": "0.6.
|
|
32
|
-
"@dxos/
|
|
33
|
-
"@dxos/react-ui-
|
|
34
|
-
"@dxos/
|
|
35
|
-
"@dxos/
|
|
32
|
+
"react-resize-detector": "^11.0.1",
|
|
33
|
+
"@dxos/debug": "0.6.5-staging.435ed25",
|
|
34
|
+
"@dxos/log": "0.6.5-staging.435ed25",
|
|
35
|
+
"@dxos/keys": "0.6.5-staging.435ed25",
|
|
36
|
+
"@dxos/react-ui": "0.6.5-staging.435ed25",
|
|
37
|
+
"@dxos/react-ui-card": "0.6.5-staging.435ed25",
|
|
38
|
+
"@dxos/react-ui-theme": "0.6.5-staging.435ed25",
|
|
39
|
+
"@dxos/react-ui-types": "0.6.5-staging.435ed25",
|
|
40
|
+
"@dxos/util": "0.6.5-staging.435ed25",
|
|
41
|
+
"@dxos/invariant": "0.6.5-staging.435ed25"
|
|
36
42
|
},
|
|
37
43
|
"devDependencies": {
|
|
38
44
|
"@phosphor-icons/react": "^2.1.5",
|
|
@@ -42,20 +48,20 @@
|
|
|
42
48
|
"@types/react": "^18.0.21",
|
|
43
49
|
"@types/react-dom": "^18.0.6",
|
|
44
50
|
"d3": "^7.9.0",
|
|
45
|
-
"react": "
|
|
46
|
-
"react-dom": "
|
|
51
|
+
"react": "~18.2.0",
|
|
52
|
+
"react-dom": "~18.2.0",
|
|
47
53
|
"vite": "^5.3.4",
|
|
48
|
-
"@dxos/
|
|
49
|
-
"@dxos/
|
|
50
|
-
"@dxos/gem-core": "0.6.
|
|
51
|
-
"@dxos/random": "0.6.
|
|
52
|
-
"@dxos/storybook-utils": "0.6.
|
|
53
|
-
"@dxos/react-client": "0.6.
|
|
54
|
+
"@dxos/echo-schema": "0.6.5-staging.435ed25",
|
|
55
|
+
"@dxos/app-graph": "0.6.5-staging.435ed25",
|
|
56
|
+
"@dxos/gem-core": "0.6.5-staging.435ed25",
|
|
57
|
+
"@dxos/random": "0.6.5-staging.435ed25",
|
|
58
|
+
"@dxos/storybook-utils": "0.6.5-staging.435ed25",
|
|
59
|
+
"@dxos/react-client": "0.6.5-staging.435ed25"
|
|
54
60
|
},
|
|
55
61
|
"peerDependencies": {
|
|
56
62
|
"@phosphor-icons/react": "^2.1.5",
|
|
57
|
-
"react": "
|
|
58
|
-
"react-dom": "
|
|
63
|
+
"react": "~18.2.0",
|
|
64
|
+
"react-dom": "~18.2.0"
|
|
59
65
|
},
|
|
60
66
|
"publishConfig": {
|
|
61
67
|
"access": "public"
|
package/src/mosaic/Container.tsx
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
// Copyright 2023 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import { type Modifier } from '@dnd-kit/core';
|
|
5
|
+
import { type Modifier, type DragEndEvent, type DragMoveEvent } from '@dnd-kit/core';
|
|
6
6
|
import React, {
|
|
7
7
|
createContext,
|
|
8
8
|
useEffect,
|
|
@@ -14,6 +14,7 @@ import React, {
|
|
|
14
14
|
|
|
15
15
|
import { type ThemedClassName } from '@dxos/react-ui';
|
|
16
16
|
|
|
17
|
+
import { type MosaicDropAnimation } from './Root';
|
|
17
18
|
import { type MosaicTileComponent } from './Tile';
|
|
18
19
|
import { useMosaic } from './hooks';
|
|
19
20
|
import { type MosaicDataItem, type MosaicDraggedItem } from './types';
|
|
@@ -25,7 +26,7 @@ type WithRequiredProperty<Type, Key extends keyof Type> = Type & {
|
|
|
25
26
|
|
|
26
27
|
export const DEFAULT_TRANSITION = 200;
|
|
27
28
|
export const DEFAULT_TYPE = 'unknown';
|
|
28
|
-
export const DEFAULT_COMPONENT = forwardRef(() => <>missing component</>);
|
|
29
|
+
export const DEFAULT_COMPONENT: MosaicTileComponent = forwardRef(() => <>missing component</>);
|
|
29
30
|
|
|
30
31
|
export type MosaicTileOverlayProps = {
|
|
31
32
|
grow?: boolean;
|
|
@@ -44,18 +45,29 @@ export type MosaicTileOverlayProps = {
|
|
|
44
45
|
export const MosaicOperations = ['transfer', 'copy', 'rearrange', 'reject'] as const;
|
|
45
46
|
export type MosaicOperation = (typeof MosaicOperations)[number];
|
|
46
47
|
|
|
47
|
-
|
|
48
|
+
// TODO(wittjosiah): Unify w/ Position.
|
|
49
|
+
export type DefaultMoveDetails = Pick<DragMoveEvent, 'delta'>;
|
|
50
|
+
|
|
51
|
+
export type MosaicMoveEvent<TPosition = unknown, TMoveDetails = DefaultMoveDetails> = {
|
|
48
52
|
active: MosaicDraggedItem<TPosition>;
|
|
49
53
|
over: MosaicDraggedItem<TPosition>;
|
|
54
|
+
details?: TMoveDetails;
|
|
50
55
|
};
|
|
51
56
|
|
|
52
|
-
export type MosaicDropEvent<TPosition = unknown> = MosaicMoveEvent<
|
|
57
|
+
export type MosaicDropEvent<TPosition = unknown, TMoveDetails = DefaultMoveDetails> = MosaicMoveEvent<
|
|
58
|
+
TPosition,
|
|
59
|
+
TMoveDetails
|
|
60
|
+
> & {
|
|
53
61
|
operation: MosaicOperation;
|
|
54
62
|
};
|
|
55
63
|
|
|
56
|
-
export type MosaicContainerProps<
|
|
57
|
-
|
|
58
|
-
|
|
64
|
+
export type MosaicContainerProps<
|
|
65
|
+
TData extends MosaicDataItem = MosaicDataItem,
|
|
66
|
+
TPosition = unknown,
|
|
67
|
+
TMoveDetails = DefaultMoveDetails,
|
|
68
|
+
TTileElement extends HTMLElement = HTMLDivElement,
|
|
69
|
+
TTileProps = {},
|
|
70
|
+
> = ThemedClassName<Omit<HTMLAttributes<TTileElement>, 'onDrop' | 'onSelect'>> &
|
|
59
71
|
PropsWithChildren<{
|
|
60
72
|
id: string;
|
|
61
73
|
|
|
@@ -65,7 +77,7 @@ export type MosaicContainerProps<TData extends MosaicDataItem = MosaicDataItem,
|
|
|
65
77
|
/**
|
|
66
78
|
* Default component used to render tiles.
|
|
67
79
|
*/
|
|
68
|
-
Component?: MosaicTileComponent<TData,
|
|
80
|
+
Component?: MosaicTileComponent<TData, TTileElement, TTileProps>;
|
|
69
81
|
|
|
70
82
|
/**
|
|
71
83
|
* Default type of tiles.
|
|
@@ -99,18 +111,32 @@ export type MosaicContainerProps<TData extends MosaicDataItem = MosaicDataItem,
|
|
|
99
111
|
* Called when a tile is dragged over the container.
|
|
100
112
|
* Returns true if the tile can be dropped.
|
|
101
113
|
*/
|
|
102
|
-
onOver?: (event: MosaicMoveEvent<TPosition>) => MosaicOperation;
|
|
114
|
+
onOver?: (event: MosaicMoveEvent<TPosition, TMoveDetails>) => MosaicOperation;
|
|
103
115
|
|
|
104
116
|
/**
|
|
105
117
|
* Called when a tile is dropped on the container.
|
|
106
118
|
*/
|
|
107
|
-
onDrop?: (event: MosaicDropEvent<TPosition>) =>
|
|
119
|
+
onDrop?: (event: MosaicDropEvent<TPosition, TMoveDetails>) => MosaicDropAnimation;
|
|
120
|
+
|
|
121
|
+
/**
|
|
122
|
+
* Always called when drag ends, no matter what, unlike the other handlers which are only called when relevant.
|
|
123
|
+
*/
|
|
124
|
+
onDragEnd?: (event: DragEndEvent) => void;
|
|
125
|
+
|
|
126
|
+
/**
|
|
127
|
+
* Called on `dragmove` when over the container.
|
|
128
|
+
*/
|
|
129
|
+
onMove?: (event: MosaicMoveEvent<TPosition, TMoveDetails>) => {
|
|
130
|
+
operation: MosaicOperation;
|
|
131
|
+
details?: TMoveDetails;
|
|
132
|
+
};
|
|
108
133
|
}>;
|
|
109
134
|
|
|
110
135
|
export type MosaicContainerContextType<
|
|
111
136
|
TData extends MosaicDataItem = MosaicDataItem,
|
|
112
137
|
TPosition = unknown,
|
|
113
|
-
|
|
138
|
+
TMoveDetails = DefaultMoveDetails,
|
|
139
|
+
> = WithRequiredProperty<Omit<MosaicContainerProps<TData, TPosition, TMoveDetails>, 'children'>, 'type' | 'Component'>;
|
|
114
140
|
|
|
115
141
|
export const MosaicContainerContext = createContext<MosaicContainerContextType<any>>({
|
|
116
142
|
id: 'never',
|
|
@@ -133,6 +159,8 @@ export const MosaicContainer = ({
|
|
|
133
159
|
getOverlayStyle,
|
|
134
160
|
onOver,
|
|
135
161
|
onDrop,
|
|
162
|
+
onMove,
|
|
163
|
+
onDragEnd,
|
|
136
164
|
}: MosaicContainerProps) => {
|
|
137
165
|
const mosaic = useMosaic();
|
|
138
166
|
const container = {
|
|
@@ -146,6 +174,8 @@ export const MosaicContainer = ({
|
|
|
146
174
|
getOverlayStyle,
|
|
147
175
|
onOver,
|
|
148
176
|
onDrop,
|
|
177
|
+
onMove,
|
|
178
|
+
onDragEnd,
|
|
149
179
|
};
|
|
150
180
|
|
|
151
181
|
useEffect(() => {
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
// Copyright 2023 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import { DragOverlay } from '@dnd-kit/core';
|
|
5
|
+
import { DragOverlay, type DropAnimation } from '@dnd-kit/core';
|
|
6
6
|
import React, {
|
|
7
7
|
Component,
|
|
8
8
|
type ComponentProps,
|
|
@@ -30,7 +30,7 @@ export type MosaicDragOverlayProps = { delay?: number; debug?: boolean } & Omit<
|
|
|
30
30
|
* Render the currently dragged item of the Mosaic.
|
|
31
31
|
*/
|
|
32
32
|
export const MosaicDragOverlay = ({ delay = 200, debug = false, ...overlayProps }: MosaicDragOverlayProps) => {
|
|
33
|
-
const { containers, operation, activeItem, overItem } = useMosaic();
|
|
33
|
+
const { containers, operation, activeItem, overItem, dropAnimation } = useMosaic();
|
|
34
34
|
|
|
35
35
|
// Get the overlay component from the over container, otherwise default to the original.
|
|
36
36
|
const [state, setState] = useState<{
|
|
@@ -73,7 +73,12 @@ export const MosaicDragOverlay = ({ delay = 200, debug = false, ...overlayProps
|
|
|
73
73
|
// NOTE: The DragOverlay wrapper element must always be mounted to support animations. Conditionally render the content.
|
|
74
74
|
return (
|
|
75
75
|
// TODO(burdon): Set custom animations (e.g., in/out/around).
|
|
76
|
-
<DragOverlay
|
|
76
|
+
<DragOverlay
|
|
77
|
+
adjustScale={false}
|
|
78
|
+
{...overlayProps}
|
|
79
|
+
dropAnimation={dropAnimation as DropAnimation}
|
|
80
|
+
style={{ ...container?.getOverlayStyle?.() }}
|
|
81
|
+
>
|
|
77
82
|
{/* TODO(burdon): Configure density via getOverlayProps. */}
|
|
78
83
|
{activeItem?.path && container && OverlayComponent && (
|
|
79
84
|
<OverlayErrorBoundary
|
package/src/mosaic/Mosaic.ts
CHANGED
|
@@ -28,6 +28,8 @@ import {
|
|
|
28
28
|
} from './Tile';
|
|
29
29
|
import { type MosaicDataItem } from './types';
|
|
30
30
|
|
|
31
|
+
export { type DefaultMoveDetails } from './Container';
|
|
32
|
+
|
|
31
33
|
export const Mosaic = {
|
|
32
34
|
Root: MosaicRoot,
|
|
33
35
|
Container: MosaicContainer,
|
|
@@ -59,7 +61,10 @@ export type MosaicRootProps = NaturalMosaicRootProps;
|
|
|
59
61
|
export type MosaicContainerProps<
|
|
60
62
|
TData extends MosaicDataItem = MosaicDataItem,
|
|
61
63
|
TPosition = unknown,
|
|
62
|
-
|
|
64
|
+
TMoveDetails = Record<string, unknown>,
|
|
65
|
+
TTileElement extends HTMLElement = HTMLDivElement,
|
|
66
|
+
TTileProps = {},
|
|
67
|
+
> = NaturalMosaicContainerProps<TData, TPosition, TMoveDetails, TTileElement, TTileProps>;
|
|
63
68
|
|
|
64
69
|
export type MosaicOverlayProps = MosaicDragOverlayProps;
|
|
65
70
|
|
|
@@ -81,8 +86,14 @@ export type MosaicTileComponent<
|
|
|
81
86
|
export type MosaicTileComponentProps<TData extends MosaicDataItem = MosaicDataItem> =
|
|
82
87
|
NaturalMosaicTileComponentProps<TData>;
|
|
83
88
|
|
|
84
|
-
export type MosaicMoveEvent<TPosition = unknown
|
|
85
|
-
|
|
89
|
+
export type MosaicMoveEvent<TPosition = unknown, TMoveDetails = Record<string, unknown>> = NaturalMosaicMoveEvent<
|
|
90
|
+
TPosition,
|
|
91
|
+
TMoveDetails
|
|
92
|
+
>;
|
|
93
|
+
export type MosaicDropEvent<TPosition = unknown, TMoveDetails = Record<string, unknown>> = NaturalMosaicDropEvent<
|
|
94
|
+
TPosition,
|
|
95
|
+
TMoveDetails
|
|
96
|
+
>;
|
|
86
97
|
export type MosaicOperation = NaturalMosaicOperation;
|
|
87
98
|
export type MosaicActiveType = NaturalMosaicActiveType;
|
|
88
99
|
|