svelte-dnd-action 0.9.52 → 0.9.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -6,7 +6,7 @@ See full features list below. <br />
6
6
 
7
7
  ![dnd_demo2](https://user-images.githubusercontent.com/20507787/81682367-267eb780-9498-11ea-8dbc-5c9582033522.gif)
8
8
 
9
- [Play with this example in the REPL](https://svelte.dev/repl/e2ef044af75c4b16b424b8219fb31fd9?version=3).
9
+ [Play with this example in the REPL](https://svelte.dev/playground/e2ef044af75c4b16b424b8219fb31fd9?version=3).
10
10
 
11
11
  ### Current Status
12
12
 
@@ -30,7 +30,7 @@ It is being actively maintained.
30
30
  ### Why a svelte action rather than a higher order component?
31
31
 
32
32
  A custom action allows for a much more elegant API (no slot props thanks god) as well as more control. <br />
33
- If you prefer a generic dnd list component that accepts different child components as your abstraction, you can very easily wrap this library with one (see [here](https://svelte.dev/repl/028674733f67409c94bd52995d5906f1?version=3)).
33
+ If you prefer a generic dnd list component that accepts different child components as your abstraction, you can very easily wrap this library with one (see [here](https://svelte.dev/playground/028674733f67409c94bd52995d5906f1?version=3)).
34
34
 
35
35
  ### Installation
36
36
 
@@ -125,7 +125,7 @@ An options-object with the following attributes:
125
125
  The action dispatches two custom events:
126
126
 
127
127
  - `consider` - dispatched whenever the dragged element needs to make room for itself in a new position in the items list and when it leaves. The host (your component) is expected to update the items list (you can keep a copy of the original list if you need to)
128
- - `finalize` - dispatched on the target and origin dnd-zones when the dragged element is dropped into position. This is the event you want to use to [save the items to the server](https://svelte.dev/repl/964fdac31cb9496da9ded35002300abb?version=3) for example.
128
+ - `finalize` - dispatched on the target and origin dnd-zones when the dragged element is dropped into position. This is the event you want to use to [save the items to the server](https://svelte.dev/playground/964fdac31cb9496da9ded35002300abb?version=3) for example.
129
129
 
130
130
  The expectation is the same for both event handlers - update the list of items.
131
131
  In both cases the payload (within e.detail) is the same: an object with two attributes: `items` and `info`.
@@ -138,8 +138,8 @@ In both cases the payload (within e.detail) is the same: an object with two attr
138
138
 
139
139
  You have to listen for both events and update the list of items in order for this library to work correctly.
140
140
 
141
- For advanced use-cases (ex: [custom styling for the placeholder element](https://svelte.dev/repl/9c8db8b91b2142d19dcf9bc963a27838?version=3)) you might also need to import `SHADOW_ITEM_MARKER_PROPERTY_NAME`, which marks the placeholder element that is temporarily added to the list the dragged element hovers over.
142
- For use cases that have recursively nested zones (ex: [crazy nesting](https://svelte.dev/repl/fe8c9eca04f9417a94a8b6041df77139?version=3)), you might want to import `SHADOW_PLACEHOLDER_ITEM_ID` in order to filter the placeholder out when passing the items in to the nested component.
141
+ For advanced use-cases (ex: [custom styling for the placeholder element](https://svelte.dev/playground/9c8db8b91b2142d19dcf9bc963a27838?version=3)) you might also need to import `SHADOW_ITEM_MARKER_PROPERTY_NAME`, which marks the placeholder element that is temporarily added to the list the dragged element hovers over.
142
+ For use cases that have recursively nested zones (ex: [crazy nesting](https://svelte.dev/playground/fe8c9eca04f9417a94a8b6041df77139?version=3)), you might want to import `SHADOW_PLACEHOLDER_ITEM_ID` in order to filter the placeholder out when passing the items in to the nested component.
143
143
  If you need to manipulate the dragged element either dynamically (and don't want to use the `transformDraggedElement` option), or statically targeting it or its children with CSS, you can import and use `DRAGGED_ELEMENT_ID`;
144
144
 
145
145
  ### Accessibility (beta)
@@ -158,7 +158,7 @@ For example:
158
158
 
159
159
  If you don't provide the aria-labels everything will still work, but the messages to the user will be less informative.
160
160
  _Note_: in general you probably want to use semantic-html (ex: `ol` and `li` elements rather than `section` and `div`) but the library is screen readers friendly regardless (or at least that's the goal :)).
161
- If you want to implement your own custom screen-reader alerts, roles and instructions, you can use the `autoAriaDisabled` options and wire everything up yourself using markup and the `consider` and `finalize` handlers (for example: [unsortable list](https://svelte.dev/repl/e020ea1051dc4ae3ac2b697064f234bc?version=3)).
161
+ If you want to implement your own custom screen-reader alerts, roles and instructions, you can use the `autoAriaDisabled` options and wire everything up yourself using markup and the `consider` and `finalize` handlers (for example: [unsortable list](https://svelte.dev/playground/e020ea1051dc4ae3ac2b697064f234bc?version=3)).
162
162
 
163
163
  ##### Keyboard support
164
164
 
@@ -240,30 +240,30 @@ Notes:
240
240
 
241
241
  ### Examples and Recipes
242
242
 
243
- - [Super basic, single list, no animation](https://svelte.dev/repl/bbd709b1a00b453e94658392c97a018a?version=3)
244
- - [Super basic, single list, with animation](https://svelte.dev/repl/3d544791e5c24fd4aa1eb983d749f776?version=3)
245
- - [Multiple dndzones, multiple types](https://svelte.dev/repl/4d23eb3b9e184b90b58f0867010ad258?version=3)
246
- - [Board (nested zones and multiple types), scrolling containers, scrolling page](https://svelte.dev/repl/e2ef044af75c4b16b424b8219fb31fd9?version=3)
247
- - [Selectively enable/disable drag/drop](https://svelte.dev/repl/44c9229556f3456e9883c10fc0aa0ee9?version=3)
248
- - [Custom active dropzone styling](https://svelte.dev/repl/4ceecc5bae54490b811bd62d4d613e59?version=3)
249
- - [Customizing the dragged element](https://svelte.dev/repl/438fca28bb1f4eb1b34eff9dc6a728dc?version=3)
250
- - [Styling the dragged element](https://svelte.dev/repl/3d8be94b2bbd407c8a706d5054c8df6a?version=3)
251
- - [Customizing the placeholder(shadow) element](https://svelte.dev/repl/9c8db8b91b2142d19dcf9bc963a27838?version=3)
252
-
253
- - [Copy on drag, simple and Dragula like](https://svelte.dev/repl/924b4cc920524065a637fa910fe10193?version=3)
254
- - [Copy on drop and a drop area with a single slot](https://svelte.dev/repl/b4e120c45c3e48e49a0d637f0cf097d9?version=3)
255
- - [Drag handles using wrapper actions](https://svelte.dev/repl/cc1bc63be7a74830b4c97d428f62054d?version=4.2.17), for nested scenarios (same usage, it "just works"), see [here](https://svelte.dev/repl/4f7cbeb7b11b470b948e9af03b82a073?version=4.2.17) and [here](https://svelte.dev/repl/47c5f52f4c774cad8c367516395c7f99?version=4.2.17)
256
- - [Drag handles - legacy](https://svelte.dev/repl/4949485c5a8f46e7bdbeb73ed565a9c7?version=3), use before version 0.9.46, courtesy of @gleuch
257
- - [Interaction (save/get items) with an asynchronous server](https://svelte.dev/repl/964fdac31cb9496da9ded35002300abb?version=3)
258
- - [Unsortable lists with custom aria instructions](https://svelte.dev/repl/e020ea1051dc4ae3ac2b697064f234bc?version=3)
259
- - [Crazy nesting](https://svelte.dev/repl/fe8c9eca04f9417a94a8b6041df77139?version=3), courtesy of @zahachtah
260
- - [Generic List Component (Alternative to Slots)](https://svelte.dev/repl/028674733f67409c94bd52995d5906f1?version=3)
261
- - [Maitaining internal scroll poisition on scrollable dragabble](https://svelte.dev/repl/eb2f5988bd2f46488810606c1fb13392?version=3)
262
- - [Scrabble like board using over a 100 single slot dnd-zones](https://svelte.dev/repl/ed2e138417094281be6db1aef23d7859?version=3)
263
- - [Select multiple elements to drag (multi-drag) with mouse or keyboard](https://svelte.dev/repl/c4eb917bb8df42c4b17402a7dda54856?version=3)
264
-
265
- - [Fade in/out but without using Svelte transitions](https://svelte.dev/repl/3f1e68203ef140969a8240eba3475a8d?version=3)
266
- - [Nested fade in/out without using Svelte transitions](https://svelte.dev/repl/49b09aedfe0543b4bc8f575c8dbf9a53?version=3)
243
+ - [Super basic, single list, no animation](https://svelte.dev/playground/bbd709b1a00b453e94658392c97a018a?version=3)
244
+ - [Super basic, single list, with animation](https://svelte.dev/playground/3d544791e5c24fd4aa1eb983d749f776?version=3)
245
+ - [Multiple dndzones, multiple types](https://svelte.dev/playground/4d23eb3b9e184b90b58f0867010ad258?version=3)
246
+ - [Board (nested zones and multiple types), scrolling containers, scrolling page](https://svelte.dev/playground/e2ef044af75c4b16b424b8219fb31fd9?version=3)
247
+ - [Selectively enable/disable drag/drop](https://svelte.dev/playground/44c9229556f3456e9883c10fc0aa0ee9?version=3)
248
+ - [Custom active dropzone styling](https://svelte.dev/playground/4ceecc5bae54490b811bd62d4d613e59?version=3)
249
+ - [Customizing the dragged element](https://svelte.dev/playground/438fca28bb1f4eb1b34eff9dc6a728dc?version=3)
250
+ - [Styling the dragged element](https://svelte.dev/playground/3d8be94b2bbd407c8a706d5054c8df6a?version=3)
251
+ - [Customizing the placeholder(shadow) element](https://svelte.dev/playground/9c8db8b91b2142d19dcf9bc963a27838?version=3)
252
+
253
+ - [Copy on drag, simple and Dragula like](https://svelte.dev/playground/924b4cc920524065a637fa910fe10193?version=3)
254
+ - [Copy on drop and a drop area with a single slot](https://svelte.dev/playground/b4e120c45c3e48e49a0d637f0cf097d9?version=3)
255
+ - [Drag handles using wrapper actions](https://svelte.dev/playground/cc1bc63be7a74830b4c97d428f62054d?version=4.2.17), for nested scenarios (same usage, it "just works"), see [here](https://svelte.dev/playground/4f7cbeb7b11b470b948e9af03b82a073?version=4.2.17) and [here](https://svelte.dev/playground/47c5f52f4c774cad8c367516395c7f99?version=4.2.17)
256
+ - [Drag handles - legacy](https://svelte.dev/playground/4949485c5a8f46e7bdbeb73ed565a9c7?version=3), use before version 0.9.46, courtesy of @gleuch
257
+ - [Interaction (save/get items) with an asynchronous server](https://svelte.dev/playground/964fdac31cb9496da9ded35002300abb?version=3)
258
+ - [Unsortable lists with custom aria instructions](https://svelte.dev/playground/e020ea1051dc4ae3ac2b697064f234bc?version=3)
259
+ - [Crazy nesting](https://svelte.dev/playground/fe8c9eca04f9417a94a8b6041df77139?version=3), courtesy of @zahachtah
260
+ - [Generic List Component (Alternative to Slots)](https://svelte.dev/playground/028674733f67409c94bd52995d5906f1?version=3)
261
+ - [Maitaining internal scroll poisition on scrollable dragabble](https://svelte.dev/playground/eb2f5988bd2f46488810606c1fb13392?version=3)
262
+ - [Scrabble like board using over a 100 single slot dnd-zones](https://svelte.dev/playground/ed2e138417094281be6db1aef23d7859?version=3)
263
+ - [Select multiple elements to drag (multi-drag) with mouse or keyboard](https://svelte.dev/playground/c4eb917bb8df42c4b17402a7dda54856?version=3)
264
+
265
+ - [Fade in/out but without using Svelte transitions](https://svelte.dev/playground/3f1e68203ef140969a8240eba3475a8d?version=3)
266
+ - [Nested fade in/out without using Svelte transitions](https://svelte.dev/playground/49b09aedfe0543b4bc8f575c8dbf9a53?version=3)
267
267
 
268
268
  ### Rules/ assumptions to keep in mind
269
269
 
package/dist/index.js CHANGED
@@ -1432,8 +1432,11 @@
1432
1432
  _iterator2.f();
1433
1433
  }
1434
1434
  window.removeEventListener(DRAGGED_LEFT_DOCUMENT_EVENT_NAME, handleDrop$1);
1435
- multiScroller.destroy();
1436
- multiScroller = undefined;
1435
+ // ensuring multiScroller is not already destroyed before destroying
1436
+ if (multiScroller) {
1437
+ multiScroller.destroy();
1438
+ multiScroller = undefined;
1439
+ }
1437
1440
  unobserve();
1438
1441
  }
1439
1442
  function findShadowElementIdx(items) {
package/dist/index.mjs CHANGED
@@ -1426,8 +1426,11 @@ function unWatchDraggedElement() {
1426
1426
  _iterator2.f();
1427
1427
  }
1428
1428
  window.removeEventListener(DRAGGED_LEFT_DOCUMENT_EVENT_NAME, handleDrop$1);
1429
- multiScroller.destroy();
1430
- multiScroller = undefined;
1429
+ // ensuring multiScroller is not already destroyed before destroying
1430
+ if (multiScroller) {
1431
+ multiScroller.destroy();
1432
+ multiScroller = undefined;
1433
+ }
1431
1434
  unobserve();
1432
1435
  }
1433
1436
  function findShadowElementIdx(items) {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "svelte-dnd-action",
3
3
  "description": "*An awesome drag and drop library for Svelte 3 and 4 (not using the browser's built-in dnd, thanks god): Rich animations, nested containers, touch support and more *",
4
- "version": "0.9.52",
4
+ "version": "0.9.54",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "git+https://github.com/isaacHagoel/svelte-dnd-action.git"
@@ -113,8 +113,11 @@ function unWatchDraggedElement() {
113
113
  dz.removeEventListener(DRAGGED_OVER_INDEX_EVENT_NAME, handleDraggedIsOverIndex);
114
114
  }
115
115
  window.removeEventListener(DRAGGED_LEFT_DOCUMENT_EVENT_NAME, handleDrop);
116
- multiScroller.destroy();
117
- multiScroller = undefined;
116
+ // ensuring multiScroller is not already destroyed before destroying
117
+ if(multiScroller) {
118
+ multiScroller.destroy();
119
+ multiScroller = undefined;
120
+ }
118
121
  unobserve();
119
122
  }
120
123