Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@vaadin-component-factory/vcf-slider
Advanced tools
@vaadin-component-factory/vcf-slider - npm Package Compare versions
Comparing version 1.0.8 to 1.0.9
@@ -51,3 +51,3 @@ var Slider_1; | ||
| /** Minimum value. */ | ||
| this.max = 100; | ||
| this.max = 50; | ||
| this.originalKnobOffsetXY = 0; | ||
@@ -104,25 +104,27 @@ this.originalPointerXY = 0; | ||
| requestAnimationFrame(() => { | ||
| const pageXY = this.getPointerXY(e); | ||
| if (pageXY && originalPointerXY) { | ||
| let newPositionXY = originalKnobOffsetXY + (pageXY - originalPointerXY); | ||
| let startLimit = rtl ? newPositionXY >= start : newPositionXY <= start; | ||
| let endLimit = rtl ? newPositionXY <= end : newPositionXY >= end; | ||
| newPositionXY = startLimit ? start : endLimit ? end : newPositionXY; | ||
| const pointerXY = this.getPointerXY(e); | ||
| if (pointerXY && originalPointerXY) { | ||
| let newKnobPositionXY = originalKnobOffsetXY + (pointerXY - originalPointerXY); | ||
| let startLimit = rtl ? newKnobPositionXY >= start : newKnobPositionXY <= start; | ||
| let endLimit = rtl ? newKnobPositionXY <= end : newKnobPositionXY >= end; | ||
| newKnobPositionXY = startLimit ? start : endLimit ? end : newKnobPositionXY; | ||
| // Calculate new value | ||
| let multiplier = 0; | ||
| let { min, max, step, values } = this; | ||
| const length = max - min; | ||
| const pct = (newPositionXY + knobSize / 2) / lineSize; | ||
| let value = pct * length + min; | ||
| let length = max - min; | ||
| const pct = (newKnobPositionXY + knobSize / 2) / lineSize; | ||
| let value = pct * length; | ||
| // RTL | ||
| if (rtl) | ||
| value = max - value; | ||
| value = length - value; | ||
| // Multiplier | ||
| if (this.decimalCount) { | ||
| // Round to number of decimal places as step | ||
| // Round to same number of decimal places as step | ||
| value = this.round(value); | ||
| // To avoid problems with decimal math, multiplying to operate with integers. | ||
| // To avoid problems with decimal math, multiply to operate with integers | ||
| multiplier = Math.max(this.getMultiplier(value), this.getMultiplier(step), this.getMultiplier(min)); | ||
| values[i] = Math.round(values[i] * multiplier); | ||
| value = Math.round(value * multiplier); | ||
| step *= multiplier; | ||
| min *= multiplier; | ||
| length *= multiplier; | ||
| } | ||
@@ -133,12 +135,20 @@ else { | ||
| // Step | ||
| if (value === min || (value > min && Math.abs(value) % step === 0)) { | ||
| // Set new value & knob position | ||
| if (values[i] !== value) { | ||
| if (this.decimalCount) | ||
| value /= multiplier; | ||
| values[i] = value; | ||
| this.value = this.knobs === 1 ? value : [...values]; | ||
| this.setKnobPostion(i); | ||
| } | ||
| if (value >= length) { | ||
| // Limit to max value | ||
| value = length; | ||
| } | ||
| else if (!(value === min || (value > min && Math.abs(value) % step === 0))) { | ||
| // Round to step | ||
| value = Math.round(value / step) * step; | ||
| } | ||
| // Adjust value relative to min after step calculations | ||
| value += min; | ||
| // Remove multiplier | ||
| if (this.decimalCount) | ||
| value /= multiplier; | ||
| // Set new value | ||
| if (values[i] !== value) { | ||
| values[i] = value; | ||
| this.value = this.knobs === 1 ? value : [...values]; | ||
| } | ||
| } | ||
@@ -153,3 +163,3 @@ }); | ||
| static get version() { | ||
| return '1.0.8'; | ||
| return '1.0.9'; | ||
| } | ||
@@ -364,2 +374,3 @@ get xy() { | ||
| if (props.has('step')) { | ||
| this.step = this.step < 0 ? 1 : this.step; | ||
| this.decimalCount = this.getDecimalCount(step); | ||
@@ -366,0 +377,0 @@ } |
| { | ||
| "name": "@vaadin-component-factory/vcf-slider", | ||
| "version": "1.0.8", | ||
| "version": "1.0.9", | ||
| "description": "Range slider web component for the Vaadin platform.", | ||
@@ -5,0 +5,0 @@ "main": "out-tsc/vcf-slider.js", |
@@ -56,3 +56,3 @@ import { html, css, PropertyValues, LitElement, render, TemplateResult } from 'lit'; | ||
| /** Minimum value. */ | ||
| @property({ type: Number }) max = 100; | ||
| @property({ type: Number }) max = 50; | ||
@@ -68,3 +68,3 @@ @query('#knobs') private knobsContainer?: HTMLElement; | ||
| protected static get version() { | ||
| return '1.0.8'; | ||
| return '1.0.9'; | ||
| } | ||
@@ -294,2 +294,3 @@ | ||
| if (props.has('step')) { | ||
| this.step = this.step < 0 ? 1 : this.step; | ||
| this.decimalCount = this.getDecimalCount(step); | ||
@@ -575,8 +576,8 @@ } | ||
| requestAnimationFrame(() => { | ||
| const pageXY = this.getPointerXY(e); | ||
| if (pageXY && originalPointerXY) { | ||
| let newPositionXY = originalKnobOffsetXY + (pageXY - originalPointerXY); | ||
| let startLimit = rtl ? newPositionXY >= start : newPositionXY <= start; | ||
| let endLimit = rtl ? newPositionXY <= end : newPositionXY >= end; | ||
| newPositionXY = startLimit ? start : endLimit ? end : newPositionXY; | ||
| const pointerXY = this.getPointerXY(e); | ||
| if (pointerXY && originalPointerXY) { | ||
| let newKnobPositionXY = originalKnobOffsetXY + (pointerXY - originalPointerXY); | ||
| let startLimit = rtl ? newKnobPositionXY >= start : newKnobPositionXY <= start; | ||
| let endLimit = rtl ? newKnobPositionXY <= end : newKnobPositionXY >= end; | ||
| newKnobPositionXY = startLimit ? start : endLimit ? end : newKnobPositionXY; | ||
@@ -586,18 +587,19 @@ // Calculate new value | ||
| let { min, max, step, values } = this; | ||
| const length = max - min; | ||
| const pct = (newPositionXY + knobSize / 2) / lineSize; | ||
| let value = pct * length + min; | ||
| let length = max - min; | ||
| const pct = (newKnobPositionXY + knobSize / 2) / lineSize; | ||
| let value = pct * length; | ||
| if (rtl) value = max - value; | ||
| // RTL | ||
| if (rtl) value = length - value; | ||
| // Multiplier | ||
| if (this.decimalCount) { | ||
| // Round to number of decimal places as step | ||
| // Round to same number of decimal places as step | ||
| value = this.round(value); | ||
| // To avoid problems with decimal math, multiplying to operate with integers. | ||
| // To avoid problems with decimal math, multiply to operate with integers | ||
| multiplier = Math.max(this.getMultiplier(value), this.getMultiplier(step), this.getMultiplier(min)); | ||
| values[i] = Math.round(values[i] * multiplier); | ||
| value = Math.round(value * multiplier); | ||
| step *= multiplier; | ||
| min *= multiplier; | ||
| length *= multiplier; | ||
| } else { | ||
@@ -608,11 +610,21 @@ value = Math.round(value); | ||
| // Step | ||
| if (value === min || (value > min && Math.abs(value) % step === 0)) { | ||
| // Set new value & knob position | ||
| if (values[i] !== value) { | ||
| if (this.decimalCount) value /= multiplier; | ||
| values[i] = value; | ||
| this.value = this.knobs === 1 ? value : [...values]; | ||
| this.setKnobPostion(i); | ||
| } | ||
| if (value >= length) { | ||
| // Limit to max value | ||
| value = length; | ||
| } else if (!(value === min || (value > min && Math.abs(value) % step === 0))) { | ||
| // Round to step | ||
| value = Math.round(value / step) * step; | ||
| } | ||
| // Adjust value relative to min after step calculations | ||
| value += min; | ||
| // Remove multiplier | ||
| if (this.decimalCount) value /= multiplier; | ||
| // Set new value | ||
| if (values[i] !== value) { | ||
| values[i] = value; | ||
| this.value = this.knobs === 1 ? value : [...values]; | ||
| } | ||
| } | ||
@@ -619,0 +631,0 @@ }); |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.68%
211661
- Lines of code
- increased by0.9%
2356
No dependency changes