react-component / slider

@@ -232,19 +232,19 @@
Loading
232 232
    }
233 233
234 234
    focus() {
235 -
      if (!this.props.disabled) {
236 -
        this.handlesRefs[0].focus();
235 +
      if (this.props.disabled) {
236 +
        return;
237 237
      }
238 +
      this.handlesRefs[0]?.focus();
238 239
    }
239 240
240 241
    blur() {
241 -
      if (!this.props.disabled) {
242 -
        Object.keys(this.handlesRefs).forEach(key => {
243 -
          if (this.handlesRefs[key] && this.handlesRefs[key].blur) {
244 -
            this.handlesRefs[key].blur();
245 -
          }
246 -
        });
242 +
      if (this.props.disabled) {
243 +
        return;
247 244
      }
245 +
      Object.keys(this.handlesRefs).forEach(key => {
246 +
        this.handlesRefs[key]?.blur?.();
247 +
      });
248 248
    }
249 249
250 250
    calcValue(offset: number) {

@@ -1,6 +1,5 @@
Loading
1 1
import React from 'react';
2 2
import classNames from 'classnames';
3 -
import shallowEqual from 'shallowequal';
4 3
import Track from './common/Track';
5 4
import createSlider from './common/createSlider';
6 5
import * as utils from './utils';
@@ -132,7 +131,9 @@
Loading
132 131
  }
133 132
134 133
  static getDerivedStateFromProps(props, state) {
135 -
    if (!('value' in props || 'min' in props || 'max' in props)) return null;
134 +
    if (!('value' in props || 'min' in props || 'max' in props)) {
135 +
      return null;
136 +
    }
136 137
137 138
    const value = props.value || state.bounds;
138 139
    let nextBounds = value.map((v, i) =>
@@ -165,17 +166,13 @@
Loading
165 166
  }
166 167
167 168
  componentDidUpdate(prevProps, prevState) {
168 -
    if (!('value' in this.props || 'min' in this.props || 'max' in this.props)) {
169 +
    const { onChange, value, min, max } = this.props;
170 +
    if (!('min' in this.props || 'max' in this.props)) {
169 171
      return;
170 172
    }
171 -
    if (
172 -
      this.props.min === prevProps.min &&
173 -
      this.props.max === prevProps.max &&
174 -
      shallowEqual(this.props.value, prevProps.value)
175 -
    ) {
173 +
    if (min === prevProps.min && max === prevProps.max) {
176 174
      return;
177 175
    }
178 -
    const { onChange, value } = this.props;
179 176
    const currentValue = value || prevState.bounds;
180 177
    if (currentValue.some(v => utils.isValueOutOfRange(v, this.props))) {
181 178
      const newValues = currentValue.map(v => utils.ensureValueInRange(v, this.props));

@@ -98,19 +98,23 @@
Loading
98 98
99 99
  prevMovedHandleIndex: number;
100 100
101 -
  componentDidUpdate(_: SliderProps, prevState: SliderState) {
102 -
    if (!('value' in this.props || 'min' in this.props || 'max' in this.props)) {
101 +
  componentDidUpdate(prevProps: SliderProps, prevState: SliderState) {
102 +
    const { min, max, value, onChange } = this.props;
103 +
    if (!('min' in this.props || 'max' in this.props)) {
103 104
      return;
104 105
    }
105 -
    const { value, onChange } = this.props;
106 106
    const theValue = value !== undefined ? value : prevState.value;
107 107
    const nextValue = this.trimAlignValue(theValue, this.props);
108 -
    if (nextValue !== prevState.value) {
109 -
      // eslint-disable-next-line
110 -
      this.setState({ value: nextValue });
111 -
      if (utils.isValueOutOfRange(theValue, this.props)) {
112 -
        onChange(nextValue);
113 -
      }
108 +
    if (nextValue === prevState.value) {
109 +
      return;
110 +
    }
111 +
    // eslint-disable-next-line
112 +
    this.setState({ value: nextValue });
113 +
    if (
114 +
      !(min === prevProps.min && max === prevProps.max) &&
115 +
      utils.isValueOutOfRange(theValue, this.props)
116 +
    ) {
117 +
      onChange(nextValue);
114 118
    }
115 119
  }
116 120
Files Coverage
src 88.19%
Project Totals (11 files) 88.19%

No yaml found.

Create your codecov.yml to customize your Codecov experience

Sunburst
The inner-most circle is the entire project, moving away from the center are folders then, finally, a single file. The size and color of each slice is representing the number of statements and the coverage, respectively.
Icicle
The top section represents the entire project. Proceeding with folders and finally individual files. The size and color of each slice is representing the number of statements and the coverage, respectively.
Grid
Each block represents a single file in the project. The size and color of each block is represented by the number of statements and the coverage, respectively.
Loading