From 4e280cbdd7fe0e8c44bf65e4bc22a18e759b1342 Mon Sep 17 00:00:00 2001 From: Alex Lende Date: Mon, 7 Oct 2024 07:46:03 -0700 Subject: [PATCH] Fix DropZone class names on drop (#65798) Co-authored-by: ajlende Co-authored-by: jeryj Co-authored-by: tyxla --- packages/components/CHANGELOG.md | 1 + packages/components/src/drop-zone/index.tsx | 3 +-- packages/components/src/drop-zone/style.scss | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index f7f22160c2187b..0bf9776d01a5de 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -18,6 +18,7 @@ - `ToggleGroupControl`: indicator doesn't jump around when the layout around it changes ([#65175](https://github.com/WordPress/gutenberg/pull/65175)). - `Composite`: fix legacy support for the store prop ([#65821](https://github.com/WordPress/gutenberg/pull/65821)). - `Composite`: make items tabbable if active element gets removed ([#65720](https://github.com/WordPress/gutenberg/pull/65720)). +- `DropZone`: fix class names on drop ([#65798](https://github.com/WordPress/gutenberg/pull/65798)). ### Deprecations diff --git a/packages/components/src/drop-zone/index.tsx b/packages/components/src/drop-zone/index.tsx index d0aef35b09d4d6..b1bd0199e877d8 100644 --- a/packages/components/src/drop-zone/index.tsx +++ b/packages/components/src/drop-zone/index.tsx @@ -99,6 +99,7 @@ export function DropZoneComponent( { setType( _type ); }, onDragEnd() { + setIsDraggingOverElement( false ); setIsDraggingOverDocument( false ); setType( undefined ); }, @@ -116,8 +117,6 @@ export function DropZoneComponent( { ( ( type === 'file' && onFilesDrop ) || ( type === 'html' && onHTMLDrop ) || ( type === 'default' && onDrop ) ), - 'has-dragged-out': ! isDraggingOverElement, - // Keeping the following classnames for legacy purposes 'is-dragging-over-document': isDraggingOverDocument, 'is-dragging-over-element': isDraggingOverElement, [ `is-dragging-${ type }` ]: !! type, diff --git a/packages/components/src/drop-zone/style.scss b/packages/components/src/drop-zone/style.scss index d3cd18a75b1f8f..d66eaee87b8a1f 100644 --- a/packages/components/src/drop-zone/style.scss +++ b/packages/components/src/drop-zone/style.scss @@ -42,7 +42,7 @@ transform: scale(0.9); } - &.is-active:not(.has-dragged-out) { + &.is-active.is-dragging-over-element { .components-drop-zone__content { opacity: 1;