@webitel/ui-sdk 3.2.87 → 3.2.88

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "3.2.87",
+  "version": "3.2.88",
   "private": false,
   "scripts": {
     "serve-lib": "vue-cli-service serve",

package/src/modules/AuditForm/components/__tests__/audit-form.spec.js

@@ -2,12 +2,11 @@ import { mount } from '@vue/test-utils';
 import { ref } from 'vue';
 import AuditForm from '../audit-form.vue';
 import { generateQuestionSchema } from '../../schemas/AuditFormQuestionSchema';
-
 import {
   useDestroyableSortable,
-} from '../../composables/useDestroyableSortable';
+} from '../../../../composables/useDestroyableSortable/useDestroyableSortable';
 
-jest.mock('../../composables/useDestroyableSortable');
+jest.mock('../../../../composables/useDestroyableSortable/useDestroyableSortable');
 
 useDestroyableSortable.mockImplementation(() => ({ reloadSortable: ref(false) }));
 

package/src/modules/AuditForm/components/audit-form.vue

@@ -37,7 +37,7 @@ import {
   reactive, nextTick,
 } from 'vue';
 import { useVuelidate } from '@vuelidate/core';
-import { useDestroyableSortable } from '../composables/useDestroyableSortable';
+import { useDestroyableSortable } from '../../../composables/useDestroyableSortable/useDestroyableSortable';
 import AuditFormQuestion from './audit-form-question.vue';
 import WtButton from '../../../components/atoms/wt-button/wt-button.vue';
 import { generateQuestionSchema } from '../schemas/AuditFormQuestionSchema';

package/src/modules/AuditForm/composables/useDestroyableSortable.js

@@ -1,66 +0,0 @@
-import Sortable from 'sortablejs';
-import {
-  ref,
-  nextTick,
-  onMounted,
-  onUnmounted,
-} from 'vue';
-
-/**
- * @param elRef
- * @param options
- * @returns {{reloadSortable: Ref<UnwrapRef<boolean>>}}
- *
- * @description initializes Sortable on passed element ref and reinitializes it after each reorder
- *
- * WHY TO REINITIALIZE SORTABLE AFTER EACH ARRAY REORDER?
- * Sortable and Vue both changing DOM so that there are collisions
- * because both Vue and Sortable try to put element to the position. So element is put incorrectly.
- *
- * There are 2 vue packages for sortable (vue 2 and vue 3), but I had encountered issues when tried to use them.
- * Also, it seems to me that they aren't supported now :(
- *
- * So that I decided to reinitialize Sortable each time order changes to represent it correctly.
- * Bad decision, but I haven't come up with a better one
- */
-
-// eslint-disable-next-line import/prefer-default-export
-export function useDestroyableSortable(elRef, options) {
-  let sortable = null;
-
-  const reloadSortable = ref(false);
-
-  function destroySortable() {
-    return sortable.destroy();
-  }
-
-  function initSortable() {
-    const replaceSortable = async () => {
-      if (!sortable) return;
-      destroySortable();
-      reloadSortable.value = true;
-      await nextTick();
-      reloadSortable.value = false;
-      await nextTick();
-      initSortable();
-    };
-
-    sortable = Sortable.create(elRef.value, {
-      ...options,
-      onEnd: async (e) => {
-        if (options.onEnd) options.onEnd(e);
-        await replaceSortable();
-      },
-    });
-  }
-
-  onMounted(() => {
-    initSortable();
-  });
-
-  onUnmounted(() => {
-    destroySortable();
-  });
-
-  return { reloadSortable };
-}