From 7cd2ab404a7a58fc36ff9748cc68a658bf558b29 Mon Sep 17 00:00:00 2001
From: Reyo <vatsalharkhani5911@gmail.com>
Date: Sat, 22 Aug 2026 16:12:21 +0530
Subject: [PATCH] docs: fix default dropzone classes in Droppable and
 SortAnimation module example

---
 .changeset/fix-droppable-class-documentation.md | 5 +++++
 src/Droppable/README.md                         | 4 ++--
 src/Plugins/SortAnimation/README.md             | 4 ++--
 3 files changed, 9 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/fix-droppable-class-documentation.md

diff --git a/.changeset/fix-droppable-class-documentation.md b/.changeset/fix-droppable-class-documentation.md
new file mode 100644
index 00000000..d1789ccf
--- /dev/null
+++ b/.changeset/fix-droppable-class-documentation.md
@@ -0,0 +1,5 @@
+---
+'@shopify/draggable': patch
+---
+
+Fix default dropzone class names in Droppable documentation and corrected SortAnimation browser module example.
diff --git a/src/Droppable/README.md b/src/Droppable/README.md
index 0903fc6e..ec93f3ca 100644
--- a/src/Droppable/README.md
+++ b/src/Droppable/README.md
@@ -82,8 +82,8 @@ Check out [Draggable class identifiers](../Draggable#classes) for the base class
 
 | Name                 | Description                                                              | Default                         |
 | -------------------- | ------------------------------------------------------------------------ | ------------------------------- |
-| `droppable:active`   | Class added to the unoccupied dropzone elements when drag starts         | `draggable-droppable--active`   |
-| `droppable:occupied` | Class added to the dropzone element when it contains a draggable element | `draggable-droppable--occupied` |
+| `droppable:active`   | Class added to the unoccupied dropzone elements when drag starts         | `draggable-dropzone--active`    |
+| `droppable:occupied` | Class added to the dropzone element when it contains a draggable element | `draggable-dropzone--occupied`  |
 
 ### Example
 
diff --git a/src/Plugins/SortAnimation/README.md b/src/Plugins/SortAnimation/README.md
index 09936afb..f02ff63a 100644
--- a/src/Plugins/SortAnimation/README.md
+++ b/src/Plugins/SortAnimation/README.md
@@ -35,7 +35,7 @@ const sortable = new Sortable(document.querySelectorAll('ul'), {
 ```html
 <script type="module">
   import Sortable from 'https://cdn.jsdelivr.net/npm/@shopify/draggable/build/esm/Sortable/Sortable.mjs';
-  import Snappable from 'https://cdn.jsdelivr.net/npm/@shopify/draggable/build/esm/Plugins/Snappable.mjs';
+  import SortAnimation from 'https://cdn.jsdelivr.net/npm/@shopify/draggable/build/esm/Plugins/SortAnimation.mjs';
 
   const sortable = new Sortable(document.querySelectorAll('ul'), {
     draggable: 'li',
@@ -43,7 +43,7 @@ const sortable = new Sortable(document.querySelectorAll('ul'), {
       duration: 200,
       easingFunction: 'ease-in-out',
     },
-    plugins: [Snappable],
+    plugins: [SortAnimation],
   });
 </script>
 ```