1.0.2 • Published 8 months ago

@exmg/exm-sortable v1.0.2

Weekly downloads
-
License
MIT
Repository
github
Last release
8 months ago

<exm-sortable> Published on npm

@exmg/exm-sortable

Enables drag and drop sorting of items in a list or table

!!! You should always handle @dom-order-change to update your local .items property to update sorted list properly

Installation

npm install @exmg/exm-sortable

Example Usage

Standard

<exm-sortable item-selector="div.box" @dom-order-change="${this.orderChange}">
  <div class="boxes">
    ${this.users.map((user) => { return html`
    <div class="box">${user.firstName}</div>
    `; })}
  </div>
</exm-sortable>

API

Slots

NameDescription
defaultElements to sort

Properties/Attributes

NameTypeDefaultDescription
handleSelectorstringNoneSelector of the 'handle' to sort
itemSelectorstringliSelector of the items
animationEnabledbooleanfalseThe value that gets copied and displayed
clonedClassstringNoneClass of the cloned element
draggedClassstringNoneClass of the dragged element
animationTimingobject{duration: 200, easing: 'ease-out'}The timing of the animation
orientationstringNoneWhether or not to display the sortable element horizontally or vertically

Methods

None

Styling

None

Additional references

1.0.2

8 months ago

1.0.1

1 year ago

1.0.0

1 year ago