@webitel/ui-sdk 25.4.36 → 25.4.38

package/src/modules/Filters/v2/filters/components/filter-options/assignee/assignee-filter-value-preview.vue

@@ -1,11 +1,7 @@
 <template>
   <div>
-    <p
-      v-if="props.value.unassigned"
-    >{{ t('reusable.unassigned') }}</p>
-    <ul
-      v-if="localValue"
-    >
+    <p v-if="props.value.unassigned">{{ t('reusable.unassigned') }}</p>
+    <ul v-if="localValue">
       <li
         v-for="({ name }, index) of localValue"
         :key="index"
@@ -17,24 +13,23 @@
 </template>
 
 <script lang="ts" setup>
-import {searchMethod} from './config.js';
-import {ref} from 'vue';
-import {useI18n} from "vue-i18n";
+import { searchMethod } from './config.js';
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
 
 const props = defineProps<{
   value: number[];
 }>();
 
 const localValue = ref([]);
-const {t} = useI18n();
+const { t } = useI18n();
 
 const getLocalValue = async () => {
-  const {items} = await searchMethod({id: props.value.list});
+  const { items } = await searchMethod({ id: props.value.list });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/author/author-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({id: props.value});
+  const { items } = await searchMethod({ id: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/cause/cause-filter-value-preview.vue

@@ -13,7 +13,6 @@
 const props = defineProps<{
   value: number[];
 }>();
-
 </script>
 
 <style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/close-reason-groups-case/close-reason-groups-case-filter-value-field.vue

@@ -31,11 +31,14 @@
 <script lang="ts" setup>
 import { useVuelidate } from '@vuelidate/core';
 import { required } from '@vuelidate/validators';
-import {computed, onMounted, ref, watch} from 'vue';
+import { computed, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import WtSelect from '../../../../../../../components/wt-select/wt-select.vue';
-import { caseCloseReasonsSearchMethod, caseCloseReasonsGroupsSearchMethod } from './config.js';
+import {
+  caseCloseReasonsSearchMethod,
+  caseCloseReasonsGroupsSearchMethod,
+} from './config.js';
 
 type ModelValue = {
   selection: string;
@@ -57,13 +60,13 @@ const getConditionList = (params) => {
 };
 
 const initModel = () => {
-  if(!model.value) {
+  if (!model.value) {
     model.value = {
       selection: '',
       conditions: '',
     };
   }
-}
+};
 onMounted(() => initModel());
 
 const v$ = useVuelidate(

package/src/modules/Filters/v2/filters/components/filter-options/close-reason-groups-case/close-reason-groups-case-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -11,8 +10,8 @@
 </template>
 
 <script lang="ts" setup>
-import { caseCloseReasonsSearchMethod } from './config'
-import {ref} from 'vue';
+import { caseCloseReasonsSearchMethod } from './config';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -23,12 +22,12 @@ const localValue = ref([]);
 const getLocalValue = async () => {
   const { items } = await caseCloseReasonsSearchMethod({
     parentId: props.value?.selection,
-    id: props.value?.conditions });
+    id: props.value?.conditions,
+  });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/close-reason-groups-case/config.js

@@ -1,6 +1,7 @@
 import CaseCloseReasonGroupsAPI from '../../../../../../../api/clients/caseCloseReasonGroups/caseCloseReasonGroups.js';
 import CaseCloseReasonsAPI from '../../../../../../../api/clients/caseCloseReasons/caseCloseReasons.js';
 
-export const caseCloseReasonsGroupsSearchMethod = CaseCloseReasonGroupsAPI.getLookup;
+export const caseCloseReasonsGroupsSearchMethod =
+  CaseCloseReasonGroupsAPI.getLookup;
 export const caseCloseReasonsSearchMethod = CaseCloseReasonsAPI.getLookup;
 export const localePath = '';

package/src/modules/Filters/v2/filters/components/filter-options/contact/contact-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({id: props.value});
+  const { items } = await searchMethod({ id: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/contact-group/contact-group-filter-value-preview.vue

@@ -1,11 +1,7 @@
 <template>
   <div>
-    <p
-      v-if="props.value.unassigned"
-    >{{ t('reusable.unassigned') }}</p>
-    <ul
-      v-if="localValue"
-    >
+    <p v-if="props.value.unassigned">{{ t('reusable.unassigned') }}</p>
+    <ul v-if="localValue">
       <li
         v-for="({ name }, index) of localValue"
         :key="index"
@@ -20,14 +16,14 @@
 import { ref } from 'vue';
 
 import { searchMethod } from './config.js';
-import {useI18n} from "vue-i18n";
+import { useI18n } from 'vue-i18n';
 
 const props = defineProps<{
   value: number[];
 }>();
 
 const localValue = ref([]);
-const {t} = useI18n();
+const { t } = useI18n();
 
 const getLocalValue = async () => {
   const { items } = await searchMethod({
@@ -39,5 +35,4 @@ const getLocalValue = async () => {
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/created-at-from/created-at-from-filter-value-preview.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>{{date}}</div>
+  <div>{{ date }}</div>
 </template>
 
 <script lang="ts" setup>

package/src/modules/Filters/v2/filters/components/filter-options/created-at-to/created-at-to-filter-value-preview.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>{{date}}</div>
+  <div>{{ date }}</div>
 </template>
 
 <script lang="ts" setup>

package/src/modules/Filters/v2/filters/components/filter-options/direction/direction-filter-value-preview.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts" setup>
-import { useI18n } from "vue-i18n";
+import { useI18n } from 'vue-i18n';
 
 const props = defineProps<{
   value: number[];

package/src/modules/Filters/v2/filters/components/filter-options/gateway/gateway-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({id: props.value});
+  const { items } = await searchMethod({ id: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/grantee/grantee-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({ids: props.value});
+  const { items } = await searchMethod({ ids: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/has-attachment/has-attachment-filter-value-preview.vue

@@ -14,7 +14,9 @@ const props = defineProps<{
 const { t } = useI18n();
 
 const localeValue = computed(() => {
-  const match = BooleanOptions.find((el) => el.value === props.value.toString());
+  const match = BooleanOptions.find(
+    (el) => el.value === props.value.toString(),
+  );
   return match ? t(match.locale) : '';
 });
 </script>

package/src/modules/Filters/v2/filters/components/filter-options/has-file/has-file-filter-value-field.vue

@@ -11,7 +11,7 @@ import { watch } from 'vue';
 
 import { useBooleanFilterValueValidation } from '../_shared/composables/booleanFilterToolkit';
 import HasOptionFilterValueField from '../_shared/has-options/has-option-filter-value-field.vue';
-import {BooleanFilterModelValue} from "../_shared/types/BooleanFilter";
+import { BooleanFilterModelValue } from '../_shared/types/BooleanFilter';
 
 const model = defineModel<BooleanFilterModelValue>();
 

package/src/modules/Filters/v2/filters/components/filter-options/has-file/has-file-filter-value-preview.vue

@@ -3,15 +3,13 @@
 </template>
 
 <script lang="ts" setup>
-import {usePrettifyBooleanValuePreview} from "../_shared/composables/booleanFilterToolkit";
+import { usePrettifyBooleanValuePreview } from '../_shared/composables/booleanFilterToolkit';
 
 const props = defineProps<{
   value: boolean;
 }>();
 
-const {
-  localeValue,
-} = usePrettifyBooleanValuePreview(props.value);
+const { localeValue } = usePrettifyBooleanValuePreview(props.value);
 </script>
 
 <style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/has-rating/has-rating-filter-value-field.vue

@@ -9,9 +9,9 @@
 <script lang="ts" setup>
 import { watch } from 'vue';
 
-import {useBooleanFilterValueValidation} from "../_shared/composables/booleanFilterToolkit";
+import { useBooleanFilterValueValidation } from '../_shared/composables/booleanFilterToolkit';
 import HasOptionFilterValueField from '../_shared/has-options/has-option-filter-value-field.vue';
-import {BooleanFilterModelValue} from "../_shared/types/BooleanFilter";
+import { BooleanFilterModelValue } from '../_shared/types/BooleanFilter';
 
 const model = defineModel<BooleanFilterModelValue>();
 

package/src/modules/Filters/v2/filters/components/filter-options/has-rating/has-rating-filter-value-preview.vue

@@ -3,15 +3,13 @@
 </template>
 
 <script lang="ts" setup>
-import {usePrettifyBooleanValuePreview} from "../_shared/composables/booleanFilterToolkit";
+import { usePrettifyBooleanValuePreview } from '../_shared/composables/booleanFilterToolkit';
 
 const props = defineProps<{
   value: boolean;
 }>();
 
-const {
-  localeValue,
-} = usePrettifyBooleanValuePreview(props.value);
+const { localeValue } = usePrettifyBooleanValuePreview(props.value);
 </script>
 
 <style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/has-transcription/has-transcription-filter-value-field.vue

@@ -9,15 +9,14 @@
 <script lang="ts" setup>
 import { watch } from 'vue';
 
-import {useBooleanFilterValueValidation} from "../_shared/composables/booleanFilterToolkit";
+import { useBooleanFilterValueValidation } from '../_shared/composables/booleanFilterToolkit';
 import HasOptionFilterValueField from '../_shared/has-options/has-option-filter-value-field.vue';
-import {BooleanFilterModelValue} from "../_shared/types/BooleanFilter";
+import { BooleanFilterModelValue } from '../_shared/types/BooleanFilter';
 
 const model = defineModel<BooleanFilterModelValue>();
 
 const { v$ } = useBooleanFilterValueValidation<BooleanFilterModelValue>(model);
 
-
 const emit = defineEmits<{
   'update:invalid': [boolean];
 }>();

package/src/modules/Filters/v2/filters/components/filter-options/has-transcription/has-transcription-filter-value-preview.vue

@@ -3,15 +3,13 @@
 </template>
 
 <script lang="ts" setup>
-import {usePrettifyBooleanValuePreview} from "../_shared/composables/booleanFilterToolkit";
+import { usePrettifyBooleanValuePreview } from '../_shared/composables/booleanFilterToolkit';
 
 const props = defineProps<{
   value: boolean;
 }>();
 
-const {
-  localeValue,
-} = usePrettifyBooleanValuePreview(props.value);
+const { localeValue } = usePrettifyBooleanValuePreview(props.value);
 </script>
 
 <style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/impacted/impacted-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({id: props.value});
+  const { items } = await searchMethod({ id: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/index.ts

@@ -1,4 +1,4 @@
-import type {Component} from "vue";
+import type { Component } from 'vue';
 
 import ActualReactionTimeFilter from './actual-reaction-time/actual-reaction-time-filter-value-field.vue';
 import ActualReactionTimeFilterPreview from './actual-reaction-time/actual-reaction-time-filter-value-preview.vue';
@@ -26,7 +26,7 @@ import CreatedAtToFilter from './created-at-to/created-at-to-filter-value-field.
 import CreatedAtToFilterPreview from './created-at-to/created-at-to-filter-value-preview.vue';
 import DirectionFilter from './direction/direction-filter-value-field.vue';
 import DirectionFilterPreview from './direction/direction-filter-value-preview.vue';
-import {FilterOption} from "../../enums/FilterOption";
+import { FilterOption } from '../../enums/FilterOption';
 import GatewayFilter from './gateway/gateway-filter-value-field.vue';
 import GatewayFilterPreview from './gateway/gateway-filter-value-preview.vue';
 import GranteeFilter from './grantee/grantee-filter-value-field.vue';
@@ -161,49 +161,53 @@ export {
   VariableFilterPreview,
 };
 
-export const FilterOptionToValueComponentMap: Record<FilterOption, Component> = {
-  [FilterOption.Agent]: AgentFilter,
-  [FilterOption.AmdResult]: AmdResultFilter,
-  [FilterOption.Contact]: ContactFilter,
-  [FilterOption.Direction]: DirectionFilter,
-  [FilterOption.Rated]: HasRatingFilterValueField,
-  [FilterOption.Gateway]: GatewayFilter,
-  [FilterOption.Grantee]: GranteeFilter,
-  [FilterOption.Cause]: CauseFilter,
-  [FilterOption.Queue]: QueueFilter,
-  [FilterOption.RatedBy]: RatedByFilter,
-  [FilterOption.HasFile]: HasFileFilter,
-  [FilterOption.Score]: ScoreFilter,
-  [FilterOption.Tag]: TagFilter,
-  [FilterOption.TalkDuration]: TalkDurationFilter,
-  [FilterOption.Team]: TeamFilter,
-  [FilterOption.TotalDuration]: TotalDurationFilter,
-  [FilterOption.HasTranscription]: HasTranscriptionFilter,
-  [FilterOption.User]: UserFilter,
-  [FilterOption.Variable]: VariableFilter,
-  [FilterOption.CreatedAtFrom]: CreatedAtFromFilter,
-  [FilterOption.CreatedAtTo]: CreatedAtToFilter,
-  [FilterOption.Status]: CaseStatusFilter,
-  [FilterOption.Source]: CaseSourceFilter,
-  [FilterOption.Service]: CaseServiceFilter,
-  [FilterOption.Author]: AuthorFilter,
-  [FilterOption.Reporter]: ReporterFilter,
-  [FilterOption.Impacted]: ImpactedFilter,
-  [FilterOption.Assignee]: AssigneeFilter,
-  [FilterOption.ContactGroup]: ContactGroupFilter,
-  [FilterOption.Priority]: CasePriorityFilter,
-  [FilterOption.CloseReasonGroups]: CloseReasonGroupsCaseFilter,
-  [FilterOption.Rating]: RatingFromToFilter,
-  [FilterOption.Sla]: SlaFilter,
-  [FilterOption.SlaCondition]: SlaConditionFilter,
-  [FilterOption.ReactionTime]: ReactionTimeFilter,
-  [FilterOption.ResolutionTime]: ResolutionTimeFilter,
-  [FilterOption.ActualReactionTime]: ActualReactionTimeFilter,
-  [FilterOption.ActualResolutionTime]: ActualResolutionTimeFilter,
-  [FilterOption.HasAttachment]: HasAttachmentFilter,
-};
+export const FilterOptionToValueComponentMap: Record<FilterOption, Component> =
+  {
+    [FilterOption.Agent]: AgentFilter,
+    [FilterOption.AmdResult]: AmdResultFilter,
+    [FilterOption.Contact]: ContactFilter,
+    [FilterOption.Direction]: DirectionFilter,
+    [FilterOption.Rated]: HasRatingFilterValueField,
+    [FilterOption.Gateway]: GatewayFilter,
+    [FilterOption.Grantee]: GranteeFilter,
+    [FilterOption.Cause]: CauseFilter,
+    [FilterOption.Queue]: QueueFilter,
+    [FilterOption.RatedBy]: RatedByFilter,
+    [FilterOption.HasFile]: HasFileFilter,
+    [FilterOption.Score]: ScoreFilter,
+    [FilterOption.Tag]: TagFilter,
+    [FilterOption.TalkDuration]: TalkDurationFilter,
+    [FilterOption.Team]: TeamFilter,
+    [FilterOption.TotalDuration]: TotalDurationFilter,
+    [FilterOption.HasTranscription]: HasTranscriptionFilter,
+    [FilterOption.User]: UserFilter,
+    [FilterOption.Variable]: VariableFilter,
+    [FilterOption.CreatedAtFrom]: CreatedAtFromFilter,
+    [FilterOption.CreatedAtTo]: CreatedAtToFilter,
+    [FilterOption.Status]: CaseStatusFilter,
+    [FilterOption.Source]: CaseSourceFilter,
+    [FilterOption.Service]: CaseServiceFilter,
+    [FilterOption.Author]: AuthorFilter,
+    [FilterOption.Reporter]: ReporterFilter,
+    [FilterOption.Impacted]: ImpactedFilter,
+    [FilterOption.Assignee]: AssigneeFilter,
+    [FilterOption.ContactGroup]: ContactGroupFilter,
+    [FilterOption.Priority]: CasePriorityFilter,
+    [FilterOption.CloseReasonGroups]: CloseReasonGroupsCaseFilter,
+    [FilterOption.Rating]: RatingFromToFilter,
+    [FilterOption.Sla]: SlaFilter,
+    [FilterOption.SlaCondition]: SlaConditionFilter,
+    [FilterOption.ReactionTime]: ReactionTimeFilter,
+    [FilterOption.ResolutionTime]: ResolutionTimeFilter,
+    [FilterOption.ActualReactionTime]: ActualReactionTimeFilter,
+    [FilterOption.ActualResolutionTime]: ActualResolutionTimeFilter,
+    [FilterOption.HasAttachment]: HasAttachmentFilter,
+  };
 
-export const FilterOptionToPreviewComponentMap: Record<FilterOption, Component> = {
+export const FilterOptionToPreviewComponentMap: Record<
+  FilterOption,
+  Component
+> = {
   [FilterOption.Agent]: AgentFilterPreview,
   [FilterOption.AmdResult]: AmdResultFilterPreview,
   [FilterOption.Contact]: ContactFilterPreview,

package/src/modules/Filters/v2/filters/components/filter-options/priority-case/config.js

@@ -1,5 +1,4 @@
-import CasePrioritiesAPI
-  from '../../../../../../../api/clients/casePriorities/casePriorities.js';
+import CasePrioritiesAPI from '../../../../../../../api/clients/casePriorities/casePriorities.js';
 
 export const searchMethod = CasePrioritiesAPI.getLookup;
 export const localePath = '';

package/src/modules/Filters/v2/filters/components/filter-options/priority-case/priority-case-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({id: props.value});
+  const { items } = await searchMethod({ id: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/queue/queue-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({id: props.value});
+  const { items } = await searchMethod({ id: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>