@fe6/water-pro/es/_util/hooks/use-sortable.js

An enterprise-class UI design language and Vue-based implementation

import _regeneratorRuntime from "@babel/runtime/regenerator";

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

/** @format */
import { __awaiter } from "tslib";
import { nextTick, unref } from 'vue';
export function useSortable(el, options) {
  function initSortable() {
    var _this = this;

    nextTick(function () {
      return __awaiter(_this, void 0, void 0, /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
        var Sortable;
        return _regeneratorRuntime.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                if (el) {
                  _context.next = 2;
                  break;
                }

                return _context.abrupt("return");

              case 2:
                _context.next = 4;
                return import('sortablejs');

              case 4:
                Sortable = _context.sent.default;
                Sortable.create(unref(el), _extends({
                  animation: 500,
                  delay: 400,
                  delayOnTouchOnly: true
                }, options));

              case 6:
              case "end":
                return _context.stop();
            }
          }
        }, _callee);
      }));
    });
  }

  return {
    initSortable: initSortable
  };
}