Bot releases are hidden (Show)
Published by darthtrevino over 2 years ago
The utility packages @react-dnd/invariant
, @react-dnd/shallowequal
, and @react-dnd/asap
(which are forks of popular libraries) have been included in the monorepo and built using the same output mechanisms as the react-dnd
core packages (dual EJS/CSM).
@react-dnd/asap
has been simplified to remove the node variant, which relied on deprecated APIs
Published by darthtrevino over 2 years ago
pkg.exports
Published by darthtrevino over 2 years ago
This release uses output from swc using the 'es2017' target instead of using output from 'tsc' using the 'ESNext' target.
Published by darthtrevino over 2 years ago
This release fixes issues with the ESM-only structure of v15.0.0. All packages are now in their prior CommonJS/ESM format.
Published by darthtrevino over 2 years ago
The react-dnd packages are now published as ESM-only with type: module
. See this FAQ by sindresorhus: https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c
The Decorators API has been removed and fully replaced by the Hooks API. The Decorators API was difficult to develop & type correctly, and this improves its maintainability.
The builds no longer use babel & preset-env. The library is transpiled using SWC into the "es2017" target, which assumes async/await is available. This should reduce bundle sizes by removing polyfills and support-code which may be unnecessary in your target.
canDrag
is true (#3187)Published by darthtrevino about 3 years ago
react-dnd: 14.0.3
react-dnd-html5-backend: 14.0.1
react-dnd-touch-backend: 14.1.0
Published by darthtrevino over 3 years ago
This PR will throw a developer exception if a user specifies a useDrag::spec.begin
method.
Published by darthtrevino over 3 years ago
Update internal hook useDragType()
to align with updated typings. Check 14.0.0 release for API changes
Published by darthtrevino over 3 years ago
This release addresses a handful of nagging liveness and ergonomic issues with the hooks API.
The liveness issues affect all hooks, and were discovered on deeper inspection of certain stress tests in the documentation. The internal useCollector()
hook is used to collect props from the DnD system when things change. Prior to this update, we subscribed to updates from the DnD monitor to trigger prop collection. However, state on the react side was only accounted for on the first render. This release improves that liveness by collecting props whenever react state changes.
The ergonomics of the useDrag
have been refactored. In short:
spec.type
is requiredspec.item
can be a function or static object.spec.item
replaces spec.begin
Since the release of the hooks API, we packed type
under spec.item
. However, this led to nonintuitive situations where an item
field was required to be specified even though items are created in the begin
method.
Additionally, in the original React-DnD design, beginDrag()
was optional and the type of the draggables had to be defined. If no explicit DragObject was created, an implicit object was created by the system..
The change we've made here decouples type
from item
, and collapses begin
into item
.
// Pre-v14
useDrag({
// item defined here to get a type
item: { type: BOX } },
// ...but the actual item is created here
begin: () => ({ id })
})
// v14
useDrag({
type: BOX,
item: () => ({id})
})
e.g. useDrag({ item: { type: BOX }})
=> useDrag({ type: 'BOX' })
We've also added the ability to cancel drag operations in the hooks API by returning null from begin
.
// new API
useDrag({
type: BOX,
item: () => shouldNotDrag ? null : {id},
})
Published by darthtrevino over 3 years ago
item.type
changesHTML5Context
, HTML5BackendOptions
interfacesPublished by darthtrevino over 3 years ago
TLDR: useDrag
and useDrop
support both a memo pattern and a spec object now.
useDrag(() => spec) // good
useDrag(spec) // also good
In v13, we've tried to address some errors that were pervading with the react-dnd hooks API. Generally, making sure DragSource/DropTargets were up-to-date and that the system wasn't leaking handles was a precarious balancing act. Moving to a memo API pattern (e.g. useDrag(() => spec)) fixed this problem in our tests.
However, as we dug further into handler leakage issues, it became clear that anything using the hooks would reattach and receive a new handler ID whenever the spec changed at all. This was in contrast to the Decorator API's behavior of keeping stable handler IDs as the incoming props changed.
To fix the Hooks API to stop leaking handlers, we found a pretty simple solution: a classical class with a public setter for the spec
object that's updated via a useEffect
hook. This neatly avoids the mutating DragSource/DropTargets on every spec change. This had two effects: identifiers have been stabilized, and spec objects were usable again because changing them didn't cause DragSource/DropTarget instances to be regenerated and reattached.
In retrospect, this undoes the necessity of the major cut that happened with v13, but the Hooks API is much sturdier now. We hope that you find the improved memory stability in the hooks API to be useful in your projects.
Published by darthtrevino over 3 years ago
Published by darthtrevino over 3 years ago
v12 was largely structural and organizational, but some issues were discovered shortly after release that warranted changing the hooks API.
useDrag
, useDrop
hooks accept functions that create spec objects instead of spec objects directly. Clients can think about the API to useDrag() and useDrop() as being analogous to useMemo(). This allows clients to have direct control over when their DnD specifications are re-generated (which internally reattaches them to the DnD system).rootElement
component in the HTML5Backend options to localize where DnD will process events in the client app.Published by darthtrevino over 4 years ago
Update .npmignore files so that tsbuildinfo files are not included in publication. This reduces package sizes.
Published by darthtrevino over 4 years ago
TouchBackend bug fix with _getDropTargetId
(#2507)
Published by darthtrevino over 4 years ago
getDecoratedComponent()
method to wrapInTestContext
imperative API. (#2488)wrapInTestContext
(#2486)react-dnd
(#2491)Published by darthtrevino over 4 years ago
Update Backends to use named exports for BackendFactory functions instead of default exports.
e.g.
import HTML5Backend from 'react-dnd-html5-backend
👇
import { HTML5Backend } from 'react-dnd-html5-backend
In general, throughout the app we've minimized the usage of default exports as well. They interfere with type correctness and screw with UMD builds (e.g. having to scrape a .default
property off of a UMD global).
useDragDropManager
at top levelPublished by darthtrevino almost 5 years ago
dnd-core: Use updated version @react-dnd/asap
with browser variant support, this allows us to drop syntheticDefaultImports in dnd-core.
Published by darthtrevino almost 5 years ago
Fix UMD builds - our fork of ASAP was being brought in with node-specific code, breaking UMD builds. Using the canonical version of ASAP until we update our fork (#1684 )