@webitel/ui-sdk 24.10.32 → 24.10.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "24.10.32",
+  "version": "24.10.34",
   "private": false,
   "scripts": {
     "dev": "vite",

package/src/components/wt-divider/_variables.scss

@@ -1,7 +1,7 @@
 
 :root {
   --divider-border: 1px solid;
-  --divider-border-color: var(--grey-lighten-5);
+  --divider-border-color: var(--grey-lighten-4);
 }
 
 :root.theme--dark {

package/src/components/wt-intersection-observer/__tests__/WtIntersectionObserver.spec.js

@@ -0,0 +1,12 @@
+import { shallowMount } from '@vue/test-utils';
+import WtIntersectionObserver from '../wt-intersection-observer.vue';
+
+describe('WtIntersectionObserver', () => {
+  const next = () => true;
+  it('renders a component', () => {
+    const wrapper = shallowMount(WtIntersectionObserver, {
+      props: { next }
+    });
+    expect(wrapper.exists()).toBe(true);
+  });
+});

package/src/components/wt-intersection-observer/wt-intersection-observer.vue

@@ -0,0 +1,56 @@
+<template>
+  <wt-loader
+    v-if="loading"
+    size="sm"
+  />
+  <div ref="intersectionTarget" />
+</template>
+
+<script setup>
+import { useIntersectionObserver } from '@vueuse/core';
+import { onMounted, onUnmounted, ref } from 'vue';
+
+const props = defineProps({
+  next: {
+    type: Function,
+    required: true,
+  },
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+});
+
+const emit = defineEmits([
+  'next',
+]);
+
+const intersectionTarget = ref(null);
+
+let stopObs;
+
+onMounted(() => {
+  /**
+   *
+   * Note, observer triggers at init, so it should be used also as init function
+   * however, current filters module version is initializing list by itself, so we need to refactor filters ASAP
+   */
+  const { stop } = useIntersectionObserver(intersectionTarget.value, ([{ isIntersecting }]) => {
+    if (isIntersecting && props.next) {
+      emit('next');
+    }
+  });
+
+  stopObs = stop;
+});
+
+onUnmounted(() => {
+  stopObs();
+});
+</script>
+
+<style scoped lang="scss">
+.wt-loader {
+  margin: var(--spacing-lg) auto;
+}
+</style>

package/src/modules/Filters/classes/BaseFilterSchema.js

@@ -1,6 +1,17 @@
-import { localStorageGetter, queryGetter, valueGetter } from '../scripts/getters/index.js';
-import { localStorageRestore, queryRestore } from '../scripts/restores/index.js';
-import { localStorageSetter, querySetter, valueSetter } from '../scripts/setters/index.js';
+import {
+  localStorageGetter,
+  queryGetter,
+  valueGetter,
+} from '../scripts/getters/index.js';
+import {
+  localStorageRestore,
+  queryRestore,
+} from '../scripts/restores/index.js';
+import {
+  localStorageSetter,
+  querySetter,
+  valueSetter,
+} from '../scripts/setters/index.js';
 
 const convertGetterArray = (context) => (getters) => {
   const availableGetters = ['value', 'query', 'localStorage'];

package/src/modules/Filters/components/filter-select.vue

@@ -3,9 +3,9 @@
     :close-on-select="!filterSchema.multiple"
     :multiple="filterSchema.multiple"
     :options="options"
+    :search-method="search"
     :track-by="trackBy"
     :value="value"
-    :search-method="search"
     v-bind="attrs"
     @input="setValue"
   />
@@ -13,7 +13,7 @@
 
 <script setup>
 
-import { computed, reactive, ref, useAttrs, watch } from 'vue';
+import { computed, reactive, useAttrs } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useStore } from 'vuex';
 import isEmpty from '../../../scripts/isEmpty.js';

package/src/modules/Filters/store/FiltersStoreModule.js

@@ -166,7 +166,10 @@ export default class FiltersStoreModule extends BaseStoreModule {
       const wildcardListeners = context.state._emitter.all.get('*');
       const eventListeners = context.state._emitter.all.get(event);
 
-      const listeners = [...(wildcardListeners || []), ...(eventListeners || [])];
+      const listeners = [
+        ...(wildcardListeners || []),
+        ...(eventListeners || []),
+      ];
 
       if (!listeners) {
         console.info(`No listeners for ${event} event`);

package/dist/img/sprite/goto.svg

@@ -1,4 +0,0 @@
-<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-<path d="M16.3642 2.30205C15.9615 2.70478 15.9615 3.35773 16.3642 3.76047C16.7537 4.14997 17.3041 4.34133 17.7459 4.44528C17.9783 4.49995 18.224 4.54015 18.4744 4.56708L12.5 10.5416C12.0973 10.9443 12.0973 11.5973 12.5 12C12.9027 12.4027 13.5557 12.4027 13.9584 12L19.9329 6.0255C19.9598 6.2759 20 6.52162 20.0547 6.75398C20.1586 7.19577 20.35 7.74621 20.7395 8.13572C21.1422 8.53845 21.7952 8.53845 22.1979 8.13572C22.6007 7.73299 22.6007 7.08003 22.1979 6.6773C22.2041 6.68348 22.2037 6.68273 22.1984 6.67302C22.1823 6.6436 22.1213 6.53194 22.0624 6.28159C21.9931 5.98696 21.9531 5.61261 21.9531 5.21888C21.9531 4.82515 21.9931 4.4508 22.0624 4.15618C22.1213 3.90584 22.1823 3.79417 22.1984 3.76475C22.2037 3.75504 22.2041 3.75428 22.1979 3.76047C22.6006 3.35773 22.6006 2.70481 22.1979 2.3021C21.7952 1.89939 21.1422 1.89937 20.7395 2.30205C20.7457 2.29587 20.7449 2.29628 20.7352 2.30159C20.7058 2.31767 20.5941 2.37869 20.3438 2.43759C20.0492 2.50692 19.6748 2.54691 19.2811 2.54691C18.8873 2.54691 18.513 2.50692 18.2183 2.43759C17.968 2.37869 17.8563 2.31766 17.8269 2.30159C17.8172 2.29628 17.8165 2.29587 17.8226 2.30205C17.4199 1.89932 16.7669 1.89932 16.3642 2.30205Z" />
-<path d="M6.5 7C6.5 6.44772 6.94772 6 7.5 6H12.5C13.0523 6 13.5 5.55228 13.5 5C13.5 4.44772 13.0523 4 12.5 4H7.5C5.84315 4 4.5 5.34315 4.5 7V17C4.5 18.6569 5.84315 20 7.5 20H17.5C19.1569 20 20.5 18.6569 20.5 17V12C20.5 11.4477 20.0523 11 19.5 11C18.9477 11 18.5 11.4477 18.5 12V17C18.5 17.5523 18.0523 18 17.5 18H7.5C6.94772 18 6.5 17.5523 6.5 17V7Z" fill="currentColor"/>
-</svg>