<turbo-stream action="append" target="posts_list"><template>    <div class="postbit" id="322558" data-post-id="322558">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="slouchpie" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/slouchpie/120/34819_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  slouchpie
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>JS world changes so quickly! Thanks for this, I will move with the herd (pack together strong) and switch to this “Dragdoll” lib.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="322558" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/whats-a-great-modern-drag-and-drop-javascript-library-you-recommend/60806/22">Post #21</a>
	                </div>
	            </div>
              <div id="likers-container-322558" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="322558"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #21"></div>
  </section>
</div>
    <div class="postbit" id="322603" data-post-id="322603">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="sodapopcan" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/sodapopcan/120/34668_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  sodapopcan
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>That <em>is</em> really nice.  Muuri is also really nice but more general.</p>
<p>I’m just doing some drag and drop work now and I’m doubling down on Dragula.  For the use-case of simply moving things <em>within and between lists</em>, it works super well.  It’s also considerably smaller than Sortable (14k v. 44k).  Even though it “strongly recommends” using npm, I just throw the dist files in <code>assets/vendor</code>.</p>
<p>Oddly enough it was updated two weeks ago for the first time in four years.  It was only the README and examples that got touched, but maybe that means the author has taken interest again?  I dunno.  In any event, it still works great, which is a refreshing thing in the JS space <img src="https://forum.elixirforum.com/images/emoji/apple/slight_smile.png?v=15" title=":slight_smile:" class="emoji" alt=":slight_smile:" loading="lazy" width="20" height="20"></p>
<p>Quite unfortunately, it does not have keyboard events.  That’s obviously a non-starter for some.</p>
<p>EDIT: I misspoke—while it does not come out of the box, the API allows for rolling your own keyboard shortcuts with relative ease if you’re at all comfy with JS.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="322603" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/whats-a-great-modern-drag-and-drop-javascript-library-you-recommend/60806/23">Post #22</a>
	                </div>
	            </div>
              <div id="likers-container-322603" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="322603"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #22"></div>
  </section>
</div>
    <div class="postbit" id="322645" data-post-id="322645">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="sevenseacat" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/sevenseacat/120/23153_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  sevenseacat
                  </h3>
		          </div>
						
			          <div class="user-title">
									<span>Author of Ash Framework</span>
			          </div>
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>The documentation for Pragmatic Drag and Drop <em>looks</em> really nice, but is actually not that great - all the examples are tons of verbose React, a bunch of the links are broken, and there’s no actual API docs that I can see.</p>
<p>I’ve been trying to get it working nicely like their examples in a Phoenix app, and so far it’s not going too well.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="322645" data-batch-url="/posts/batch_likers">
                        2
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/whats-a-great-modern-drag-and-drop-javascript-library-you-recommend/60806/24">Post #23</a>
	                </div>
	            </div>
              <div id="likers-container-322645" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="322645"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #23"></div>
  </section>
</div>
    <div class="postbit" id="322662" data-post-id="322662">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="slouchpie" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/slouchpie/120/34819_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  slouchpie
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I was unable to get <code>dragdoll</code> to work in Phoenix. I tried many different approaches and kept hitting the same error. I actually made an issue for it.</p>
<p><a href="https://github.com/niklasramo/dragdoll/issues/10" class="onebox" target="_blank" rel="noopener nofollow ugc">https://github.com/niklasramo/dragdoll/issues/10</a></p>
<p>Personally, I find <code>dragdoll</code> to be unusable in Phoenix right now. If somebody reading this gets dragdoll working with Phoenix, please share your code.</p>
<p>I am sticking with Muuri for my drag-n-drop stuff.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="322662" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/whats-a-great-modern-drag-and-drop-javascript-library-you-recommend/60806/25">Post #24</a>
	                </div>
	            </div>
              <div id="likers-container-322662" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="322662"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #24"></div>
  </section>
</div>
    <div class="postbit" id="329869" data-post-id="329869">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="slouchpie" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/slouchpie/120/34819_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  slouchpie
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I must reply to myself.</p>
<p>The dragdoll issue was a very easy “fix”</p>
<p><a href="https://github.com/niklasramo/dragdoll/issues/10" class="onebox" target="_blank" rel="noopener nofollow ugc">https://github.com/niklasramo/dragdoll/issues/10</a></p>
<p>So <strong>dragdoll does work with Phoenix LiveView</strong>.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="329869" data-batch-url="/posts/batch_likers">
                        2
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/whats-a-great-modern-drag-and-drop-javascript-library-you-recommend/60806/26">Post #25</a>
	                </div>
	            </div>
              <div id="likers-container-329869" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="329869"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-last-post cat-last-post" title="Last post!"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <span class="all-loaded">— All posts loaded —</span>
</div></template></turbo-stream>