Release 0.2.0
martinpengellyphillips
released this
12 Jul 21:03
·
149 commits
to main
since this release
Update to work with Solid 1.0 and streamline the interface with new directives.
Added
- Update
createDraggable
,createDroppable
andcreateSortable
to provide
a custom directive. These can be used with the Soliduse:___
syntactic sugar
for common usage setup - no need to pass refs and props around:
const MyComponent = (props) => {
const draggable = createDraggable({ id: props.id });
return <div use:draggable>Drag me!</div>;
};
If finer control needed, the underlying primitives are accessible by property
lookup on the directive::
const MyComponent = (props) => {
const draggable = createDraggable({ id: props.id });
return (
<div ref={draggable.ref}>
<div {...draggable.dragActivators}>Drag Handle</div>
Drag me!
</div>
);
};
- Automatically detect and register usage of
DragOverlay
. Add to
DragDropContext
state ausingDragOverlay
property that can be checked. - Return a new function
displace
as part of theDragDropContext
that can be
used to set the transform for a droppable or draggable. See usage in
createSortable
for example.
Changed
- Update to work with Solid 1.0! This is a breaking change that requires
updating peer dependency of Solid to 1.0 or greater. - Refactor
isActiveDraggable
andisActiveDroppable
to appear as resolved
properties rather than functions to call (this is more consistent with the
rest of interface). E.g.draggable.isActiveDraggable()
->draggable.isActivateDraggable
. - Refactor sensor interface to use event type rather than handler name. For
example, makecreatePointerSensor
usepointerdown
rather than
onPointerDown
for activation. As part of this, add aasHandlers
option to
draggableActivators
to control whether to return object withon___
form or
not (default isfalse
). - Rename occurrences of
translate
totransform
, which feels a more
appropriate name. E.g.translateStyle
should now betransformStyle
and the
translate
property returned fromcreate___
calls should be called
transform
. - Assume valid
transform
value is always present. In particular,
transformStyle
no longer checks for anull
transform value. - Improve vertical sort algorithm to better handle arbitrary gaps (such as those
created by the CSS gap property on flexbox). As part of this, remove the now
redundantouterHeight
andouterWidth
properties from the layout data
returned byelementLayout
. - Update
README.md
to reflect simpler directive interface for draggables and
droppables.
Removed
- Remove support for explicitly managing droppable
disabled
state. The current
implementation feels limiting and potentially confusing. For example, it
prevents detecting when a draggable is over a disabled droppable and styling
it appropriately. Note that a similar effect todisabled
can be achieved by
determining drop suitability inonDragEnd
.