@webitel/ui-sdk 2.0.13-1 → 2.0.13-4

package/package.json

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

package/src/components/molecules/wt-select/wt-select.vue

@@ -23,7 +23,7 @@
       :allow-empty="allowEmpty"
       :disabled="disabled"
       :internal-search="!searchMethod"
-      :label="optionLabel"
+      :label="trackBy ? optionLabel : null"
       :limit="1"
       :limit-text="(count) => `+${count}`"
       :loading="false"

package/src/components/organisms/wt-player/wt-player.vue

@@ -1,5 +1,8 @@
 <template>
-  <aside class="wt-player">
+  <aside
+    class="wt-player"
+    :class="[`wt-player--position-${position}`]"
+  >
     <component
       :is="playerType"
       class="wt-player__player"
@@ -12,6 +15,7 @@
 
     <!-- The "wt-icon-btn" component is append in to "audio" element by "setCloseIcon" method-->
     <wt-icon-btn
+      v-if="closable"
       class="wt-player__close-icon"
       ref="close-icon"
       icon="close"
@@ -57,6 +61,14 @@ export default {
       type: Boolean,
       default: false,
     },
+    closable: {
+      type: Boolean,
+      default: true,
+    },
+    position: {
+      type: String,
+      default: 'sticky',
+    },
   },
   data: () => ({
     player: null,
@@ -111,7 +123,7 @@ export default {
       if (this.resetVolume) this.makeVolumeReset();
       if (this.download) this.setupDownload();
 
-      this.appendCloseIcon();
+      if (this.closable) this.appendCloseIcon();
       this.$emit('initialized', this.player);
     },
     makeVolumeReset() {
@@ -142,9 +154,21 @@ export default {
 
 .wt-player {
   @extend %typo-body-2;
-  position: sticky;
   bottom: 60px;
 
+  &--position {
+    &-sticky {
+      position: sticky;
+    }
+    &-relative {
+      position: relative;
+      bottom: unset;
+    }
+    &-static {
+      position: static;
+    }
+  }
+
   .plyr {
     max-width: 100%; // prevents <video> container overflow
     border-radius: var(--border-radius);