Appearance

Drag and drop

DesignA11yAPIExampleChangelog

[3.31.0] - 2024-04-22 ​

Fixed ​

  • Focus ring styles.
  • Dropzone was draggable by keyboard.
  • Screen readers were announcing wrong items' position.
  • There were a visual glitch right after item drop.

Changed ​

  • Removed additional padding that was added to the draggable element.
  • Keyboard arrows navigation better works with built-in arrows navigation of base components and better works with items grid placement.

[3.30.2] - 2024-04-22 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.29.1 ~> 5.29.2], @semcore/utils [4.23.1 ~> 4.23.2], @semcore/core [2.20.1 ~> 2.20.2]).

[3.30.1] - 2024-04-16 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.29.0 ~> 5.29.1], @semcore/utils [4.23.0 ~> 4.23.1], @semcore/core [2.20.0 ~> 2.20.1]).

[3.30.0] - 2024-04-15 ​

Changed ​

  • Version minor update due to children dependencies update (@semcore/card [5.28.3 ~> 5.29.0], @semcore/utils [4.22.2 ~> 4.23.0], @semcore/core [2.19.2 ~> 2.20.0]).

[3.29.3] - 2024-04-10 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.28.2 ~> 5.28.3], @semcore/utils [4.22.1 ~> 4.22.2], @semcore/core [2.19.1 ~> 2.19.2]).

[3.29.2] - 2024-04-09 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.28.1 ~> 5.28.2], @semcore/utils [4.22.0 ~> 4.22.1], @semcore/core [2.19.0 ~> 2.19.1]).

[3.29.1] - 2024-03-27 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.28.0 ~> 5.28.1]).

[3.29.0] - 2024-03-27 ​

Changed ​

  • Version minor update due to children dependencies update (@semcore/card [5.27.3 ~> 5.28.0], @semcore/utils [4.21.1 ~> 4.22.0], @semcore/core [2.18.1 ~> 2.19.0]).

[3.28.3] - 2024-03-26 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.27.2 ~> 5.27.3], @semcore/utils [4.21.0 ~> 4.21.1], @semcore/core [2.18.0 ~> 2.18.1]).

[3.28.2] - 2024-03-22 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.27.1 ~> 5.27.2]).

[3.28.1] - 2024-03-19 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.27.0 ~> 5.27.1]).

[3.28.0] - 2024-03-15 ​

Changed ​

  • Version minor update due to children dependencies update (@semcore/card [5.26.1 ~> 5.27.0], @semcore/utils [4.20.5 ~> 4.21.0], @semcore/core [2.17.5 ~> 2.18.0]).

[3.27.4] - 2024-03-06 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.26.0 ~> 5.26.1], @semcore/utils [4.20.4 ~> 4.20.5], @semcore/core [2.17.4 ~> 2.17.5]).

[3.27.3] - 2024-03-01 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.25.2 ~> 5.26.0], @semcore/utils [4.20.3 ~> 4.20.4], @semcore/core [2.17.3 ~> 2.17.4]).

[3.27.2] - 2024-02-21 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.25.1 ~> 5.25.2], @semcore/utils [4.20.2 ~> 4.20.3], @semcore/core [2.17.2 ~> 2.17.3]).

[3.27.1] - 2024-02-21 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.25.0 ~> 5.25.1]).

[3.27.0] - 2024-02-14 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.24.2 ~> 5.25.0]).

[3.26.2] - 2024-02-09 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.24.1 ~> 5.24.2], @semcore/utils [4.20.1 ~> 4.20.2], @semcore/core [2.17.1 ~> 2.17.2]).

[3.26.1] - 2024-02-06 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.24.0 ~> 5.24.1], @semcore/flex-box [5.18.0 ~> 5.19.0], @semcore/utils [4.20.0 ~> 4.20.1], @semcore/core [2.17.0 ~> 2.17.1]).

[3.26.0] - 2024-02-01 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.23.1 ~> 5.24.0], @semcore/utils [4.19.1 ~> 4.20.0], @semcore/core [2.16.1 ~> 2.17.0]).

[3.25.1] - 2024-02-01 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.23.0 ~> 5.23.1], @semcore/utils [4.19.0 ~> 4.19.1], @semcore/core [2.16.0 ~> 2.16.1]).

[3.25.0] - 2024-01-23 ​

Changed ​

  • A11Y hint in component - added name for d-n-d groups.

[3.24.0] - 2024-01-19 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.21.0 ~> 5.22.0], @semcore/utils [4.17.0 ~> 4.18.0], @semcore/core [2.14.0 ~> 2.15.0]).

[3.23.0] - 2024-01-19 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.20.3 ~> 5.21.0], @semcore/core [2.13.1 ~> 2.14.0]).

[3.22.3] - 2024-01-15 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.20.2 ~> 5.20.3]).

[3.22.2] - 2024-01-10 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.20.1 ~> 5.20.2], @semcore/utils [4.16.0 ~> 4.16.2], @semcore/core [2.13.0 ~> 2.13.1]).

[3.22.1] - 2024-01-04 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.20.0 ~> 5.20.1]).

[3.22.0] - 2023-12-22 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.19.2 ~> 5.20.0], @semcore/utils [4.15.1 ~> 4.16.0], @semcore/core [2.12.1 ~> 2.13.0]).

[3.21.2] - 2023-12-19 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.19.1 ~> 5.19.2], @semcore/utils [4.15.0 ~> 4.15.1], @semcore/core [2.12.0 ~> 2.12.1]).

[3.21.1] - 2023-12-12 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.19.0 ~> 5.19.1]).

[3.21.0] - 2023-12-06 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.18.0 ~> 5.19.0], @semcore/core [2.11.0 ~> 2.12.0]).

[3.20.0] - 2023-12-04 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.17.2 ~> 5.18.0], @semcore/utils [4.13.0 ~> 4.14.0], @semcore/core [2.10.0 ~> 2.11.0]).

[3.19.2] - 2023-11-24 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.17.1 ~> 5.17.2], @semcore/utils [4.10.3 ~> 4.13.0], @semcore/core [2.9.2 ~> 2.10.0]).

[3.19.1] - 2023-11-21 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.17.0 ~> 5.17.1], @semcore/utils [4.10.2 ~> 4.10.3], @semcore/core [2.9.1 ~> 2.9.2]).

[3.19.0] - 2023-11-13 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.16.0 ~> 5.17.0]).

[3.18.0] - 2023-11-10 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.15.1 ~> 5.16.0]).

[3.17.1] - 2023-11-09 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.15.0 ~> 5.15.1], @semcore/utils [4.10.1 ~> 4.10.2], @semcore/core [2.9.0 ~> 2.9.1]).

[3.17.0] - 2023-11-06 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.14.0 ~> 5.15.0], @semcore/utils [4.9.0 ~> 4.10.1], @semcore/core [2.8.0 ~> 2.9.0]).

[3.16.0] - 2023-10-27 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.13.0 ~> 5.14.0], @semcore/utils [4.8.4 ~> 4.9.0], @semcore/core [2.7.7 ~> 2.8.0]).

[3.15.0] - 2023-10-26 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.12.2 ~> 5.13.0]).

[3.14.2] - 2023-10-24 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.12.1 ~> 5.12.2], @semcore/utils [4.8.3 ~> 4.8.4], @semcore/core [2.7.6 ~> 2.7.7]).

[3.14.1] - 2023-10-16 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.12.0 ~> 5.12.1], @semcore/utils [4.8.2 ~> 4.8.3], @semcore/core [2.7.5 ~> 2.7.6]).

[3.14.0] - 2023-10-10 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.11.5 ~> 5.12.0], @semcore/flex-box [5.7.5 ~> 5.8.0]).

[3.13.0] - 2023-10-09 ​

Added ​

  • nl locale support.

[3.12.5] - 2023-10-06 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.11.4 ~> 5.11.5], @semcore/utils [4.8.1 ~> 4.8.2], @semcore/core [2.7.4 ~> 2.7.5]).

[3.12.4] - 2023-10-03 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.11.3 ~> 5.11.4], @semcore/utils [4.8.0 ~> 4.8.1], @semcore/core [2.7.3 ~> 2.7.4]).

[3.12.3] - 2023-10-02 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.11.2 ~> 5.11.3], @semcore/utils [4.7.2 ~> 4.8.0], @semcore/core [2.7.2 ~> 2.7.3]).

[3.12.2] - 2023-09-20 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.11.1 ~> 5.11.2], @semcore/core [2.7.1 ~> 2.7.2]).

[3.12.1] - 2023-09-20 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.11.0 ~> 5.11.1], @semcore/utils [4.7.0 ~> 4.7.1], @semcore/core [2.7.0 ~> 2.7.1]).

[3.12.0] - 2023-09-19 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.10.0 ~> 5.11.0]).

[3.11.0] - 2023-09-15 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.9.3 ~> 5.10.0]).

[3.10.3] - 2023-09-13 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.9.2 ~> 5.9.3], @semcore/utils [4.6.3 ~> 4.7.0], @semcore/core [2.6.3 ~> 2.7.0]).

[3.10.2] - 2023-09-12 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.9.1 ~> 5.9.2], @semcore/core [2.6.2 ~> 2.6.3]).

[3.10.1] - 2023-09-08 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.9.0 ~> 5.9.1], @semcore/utils [4.6.1 ~> 4.6.2], @semcore/core [2.6.1 ~> 2.6.2]).

[3.10.0] - 2023-09-05 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.8.1 ~> 5.9.0]).

[3.9.0] - 2023-09-05 ​

Added ​

  • Added customFocus prop that allows keyboard users to use drag and drops without moving actual browser focus. Especially useful for comboboxes and selects that allows to reorder items.

[3.8.0] - 2023-09-04 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.7.0 ~> 5.8.0], @semcore/core [2.5.0 ~> 2.6.0]).

[3.7.0] - 2023-08-28 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.6.0 ~> 5.7.0], @semcore/utils [4.4.1 ~> 4.5.0], @semcore/core [2.4.1 ~> 2.5.0]).

[3.6.0] - 2023-08-24 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.5.1 ~> 5.6.0]).

[3.5.1] - 2023-08-24 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.5.0 ~> 5.5.1], @semcore/utils [4.4.0 ~> 4.4.1], @semcore/core [2.4.0 ~> 2.4.1]).

[3.5.0] - 2023-08-23 ​

Changed ​

  • Moved default props value from deprecated FCComponent.defaultProps to function default arguments.

[3.4.1] - 2023-08-21 ​

Fixed ​

  • Broken keyboard drag-and-drop handling.

[3.4.0] - 2023-08-18 ​

Changed ​

  • Version preminor update due to children dependencies update (@semcore/card [5.3.1 ~> 5.4.0], @semcore/utils [4.2.0 ~> 4.3.0], @semcore/core [2.2.1 ~> 2.3.0]).

[3.3.1] - 2023-08-16 ​

Changed ​

  • Version prepatch update due to children dependencies update (@semcore/card [5.3.0 ~> 5.3.1], @semcore/flex-box [5.2.0 ~> 5.2.1], @semcore/utils [4.1.0 ~> 4.2.0], @semcore/core [2.2.0 ~> 2.2.1]).

[3.3.0] - 2023-08-07 ​

Changed ​

  • Version minor update due to children dependencies update (@semcore/card [5.2.0 ~> 5.3.0], @semcore/utils [4.0.0 ~> 4.1.0]).

[3.2.0] - 2023-08-01 ​

Changed ​

  • Version minor update due to children dependencies update (@semcore/card [5.1.0 ~> 5.2.0], @semcore/flex-box [5.0.0 ~> 5.1.0]).

[3.1.0] - 2023-07-27 ​

Changed ​

  • Use event.key instead of event.code for better support of non QWERTY keyboard layouts.

[3.0.1] - 2023-07-18 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [5.0.0 ~> 5.0.1]).

[3.0.0] - 2023-07-17 ​

Break ​

  • Strict, backward incompatible typings.

[2.6.4] - 2023-06-30 ​

[2.6.3] - 2023-06-28 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.26 ~> 4.3.27]).

[2.6.2] - 2023-06-27 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.25 ~> 4.3.26], @semcore/utils [3.53.4 ~> 3.54.0]).

[2.6.1] - 2023-06-14 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.24 ~> 4.3.25], @semcore/utils [3.53.3 ~> 3.53.4]).

[2.6.0] - 2023-06-12 ​

Added ​

  • Swedish (sv) locale support.

[2.5.2] - 2023-06-12 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.23 ~> 4.3.24], @semcore/utils [3.53.2 ~> 3.53.3]).

[2.5.1] - 2023-06-09 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.22 ~> 4.3.23], @semcore/utils [3.53.1 ~> 3.53.2]).

[2.5.0] - 2023-06-09 ​

Added ​

  • Polish (pl) locale support.

[2.4.45] - 2023-06-07 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.21 ~> 4.3.22], @semcore/utils [3.53.0 ~> 3.53.1]).

[2.4.44] - 2023-05-31 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.20 ~> 4.3.21], @semcore/utils [3.52.0 ~> 3.53.0]).

[2.4.43] - 2023-05-25 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.19 ~> 4.3.20], @semcore/utils [3.51.1 ~> 3.52.0]).

[2.4.42] - 2023-05-24 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.18 ~> 4.3.19], @semcore/utils [3.51.0 ~> 3.51.1]).

[2.4.41] - 2023-05-22 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.17 ~> 4.3.18], @semcore/utils [3.50.7 ~> 3.51.0]).

[2.4.40] - 2023-05-11 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.16 ~> 4.3.17], @semcore/utils [3.50.6 ~> 3.50.7]).

[2.4.39] - 2023-05-10 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.15 ~> 4.3.16]).

[2.4.37] - 2023-05-04 ​

Changed ​

  • Made draggable elements dragging pattern more contrast.

[2.4.36] - 2023-05-03 ​

Changed ​

  • During SSR all useLayoutEffect are called as useEffect to resolve React SSR warnings.

[2.4.35] - 2023-04-27 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/grid [4.3.20 ~> 4.3.21]).

[2.4.31] - 2023-04-03 ​

Fixed ​

  • Fixed screen reader annotation of visually untitled items.

[2.4.30] - 2023-03-28 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.3.8 ~> 4.3.9]).

[2.4.17] - 2023-03-01 ​

[2.4.16] - 2023-02-24 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.2.17 ~> 4.2.18]).

[2.4.15] - 2023-02-22 ​

[2.4.14] - 2023-02-21 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.2.15 ~> 4.2.16], @semcore/utils [3.47.0 ~> 3.47.1]).

[2.4.11] - 2023-02-13 ​

[2.4.10] - 2023-02-09 ​

Changed ​

  • Renamed rounding design token (--intergalactic-rounded-large -> --intergalactic-surface-rounded).

[2.4.9] - 2023-01-20 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.2.10 ~> 4.2.11], @semcore/utils [3.45.0 ~> 3.46.0]).

[2.4.6] - 2023-01-11 ​

[2.4.5] - 2023-01-10 ​

[2.4.4] - 2023-01-09 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.2.5 ~> 4.2.6], @semcore/utils [3.44.1 ~> 3.44.2]).

[2.4.0] - 2022-12-14 ​

Added ​

  • Added internationalization of aria attributes.

[2.3.1] - 2022-12-13 ​

Changed ​

  • Added react-dom to peer dependencies.

[2.3.0] - 2022-12-12 ​

Added ​

  • Design tokens based theming.

[2.2.0] - 2022-11-28 ​

Changed ​

  • Component was fully rebuilt internally. Backward capability mostly preserved, legacy apis was marked as deprecated.

[2.1.7] - 2022-11-14 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.1.6 ~> 4.1.7]).

[2.1.0] - 2022-10-10 ​

Changed ​

  • Added support for React 18 🔥

[2.0.22] - 2022-10-06 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/card [4.0.22 ~> 4.0.23]).

[2.0.0] - 2022-05-17 ​

BREAK ​

  • Updated styles according to the library redesign policy.

[1.0.3] - 2022-03-14 ​

Changed ​

  • Version patch update due to children dependencies update (@semcore/utils [3.31.2 ~> 3.31.2]).

[1.0.2] - 2022-02-24 ​

Added ​

  • Added repository field to package.json file.

[1.0.1] - 2021-12-08 ​

Fixed ​

  • Fixed global color .dnd

[1.0.0] - 2021-11-12 ​

Changed ​

  • Up version

[1.0.0-5] - 2021-9-06 ​

Changed ​

  • Added support keydown for draggable block in droppable zone.
  • Version of dependence @semcore/core has been changed to 1.11.
  • Improved performance. Removed one component wrapper.
  • The style processing system has been changed.

[1.0.0-4] - 2021-8-26 ​

Changed ​

  • Add 'sideEffect=false' for more optimal build via webpack

[1.0.0-3] - 2020-12-17 ​

Added ​

  • Added supported react@17.

[1.0.0-2] - 2020-10-14 ​

Fixed ​

  • fixed wrong path for ES6 build

[1.0.0-1] - 2020-10-03 ​

Fixed ​

  • TS property noDrop became not requered for IDraggableProps.

[1.0.0-prerelease.10] - 2020-09-09 ​

Added ​

  • Initial release

Released under the MIT License.

Copyright © 2023-present Powered by Semrush. All rights reserved.

Released under the MIT License.

Copyright © 2023-present Powered by Semrush. All rights reserved.