@dataloop-ai/components 0.20.17 → 0.20.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dataloop-ai/components",
-  "version": "0.20.17",
+  "version": "0.20.18",
   "exports": {
     ".": "./index.ts",
     "./models": "./models.ts",

package/src/components/compound/DlSlider/components/DlSliderBase.vue

@@ -13,26 +13,15 @@
             data-test="track-container"
             v-on="trackContainerEvents"
         >
-            <div
-                class="track"
-                :style="trackStyle"
-                data-test="track"
-            >
-                <div
-                    class="selection"
-                    :style="selectionBarStyle"
-                />
-                <div
-                    class="thumb"
-                    :style="thumbStyle"
-                    data-test="thumb"
-                >
+            <div class="track" :style="trackStyle" data-test="track">
+                <div class="selection" :style="selectionBarStyle" />
+                <div class="thumb" :style="thumbStyle" data-test="thumb">
                     <input
                         v-if="name !== null && disabled !== true"
                         type="hidden"
                         :name="name"
                         :value="model"
-                    >
+                    />
                 </div>
             </div>
         </div>
@@ -48,7 +37,8 @@ import {
     stopAndPrevent,
     position,
     keyCodes,
-    between
+    between,
+    isMobileOrTablet
 } from '../../../../utils'
 import touchPanDirective from '../../../../directives/TouchPan'
 
@@ -131,7 +121,7 @@ export default defineComponent({
     },
     computed: {
         isMobile(): boolean {
-            return 'ontouchstart' in window
+            return isMobileOrTablet()
         },
         modelRatio(): number {
             return this.convertModelToRatio(this.model)
@@ -324,6 +314,7 @@ export default defineComponent({
             return between(val, this.minRation, this.maxRatio)
         },
         onActivate(evt: MouseEvent) {
+            console.log('hiihihihihihih')
             this.updatePosition(evt, this.getDragging(evt))
             this.updateValue()
 

package/src/components/compound/DlSlider/components/DlSliderInput.vue

@@ -67,7 +67,9 @@ export default defineComponent({
             emit('update:model-value', value)
 
             if (isUpdated) {
-                if (sliderInput.value) sliderInput.value.value = value
+                if (sliderInput.value) {
+                    sliderInput.value.value = String(value)
+                }
             }
         }
 

package/src/components/compound/DlSlider/utils.ts

@@ -3,5 +3,5 @@ export const getInputValue = (value: string, min: number, max: number) => {
     const clampedValue = Math.max(min, Math.min(numericValue, max))
     const isUpdated = numericValue !== clampedValue
 
-    return { value: clampedValue.toString(), isUpdated }
+    return { value: clampedValue, isUpdated }
 }

package/src/utils/selection.ts

@@ -1,3 +1,5 @@
+import { isMobileOrTablet } from '.'
+
 export function clearSelection() {
     if (window.getSelection) {
         const selection = window.getSelection()
@@ -7,7 +9,7 @@ export function clearSelection() {
             selection.empty()
         } else if (selection.removeAllRanges) {
             selection.removeAllRanges()
-            if ('ontouchstart' in window) {
+            if (isMobileOrTablet()) {
                 selection.addRange(document.createRange())
             }
         }