Commit ⋅ react-component/slider

Showing 3 of 5 files from the diff.

93.33% 71.43% -1.30%

src/common/createSlider.tsx changed.

75.45% 80.00% -0.67%

src/Range.tsx changed.

92.71% 100.00% +0.24%

src/Slider.tsx changed.

Other files ignored by Codecov

tests/common/SliderTooltip.test.js has changed.

tests/common/createSlider.test.js has changed.

@@ -232,19 +232,19 @@

    }

    focus() {
      if (!this.props.disabled) {
        this.handlesRefs[0].focus();
      if (this.props.disabled) {
        return;
      }
      this.handlesRefs[0]?.focus();
    }

    blur() {
      if (!this.props.disabled) {
        Object.keys(this.handlesRefs).forEach(key => {
          if (this.handlesRefs[key] && this.handlesRefs[key].blur) {
            this.handlesRefs[key].blur();
          }
        });
      if (this.props.disabled) {
        return;
      }
      Object.keys(this.handlesRefs).forEach(key => {
        this.handlesRefs[key]?.blur?.();
      });
    }

    calcValue(offset: number) {

@@ -1,6 +1,5 @@

import React from 'react';
import classNames from 'classnames';
import shallowEqual from 'shallowequal';
import Track from './common/Track';
import createSlider from './common/createSlider';
import * as utils from './utils';

@@ -132,7 +131,9 @@

  }

  static getDerivedStateFromProps(props, state) {
    if (!('value' in props || 'min' in props || 'max' in props)) return null;
    if (!('value' in props || 'min' in props || 'max' in props)) {
      return null;
    }

    const value = props.value || state.bounds;
    let nextBounds = value.map((v, i) =>

@@ -165,17 +166,13 @@

  }

  componentDidUpdate(prevProps, prevState) {
    if (!('value' in this.props || 'min' in this.props || 'max' in this.props)) {
    const { onChange, value, min, max } = this.props;
    if (!('min' in this.props || 'max' in this.props)) {
      return;
    }
    if (
      this.props.min === prevProps.min &&
      this.props.max === prevProps.max &&
      shallowEqual(this.props.value, prevProps.value)
    ) {
    if (min === prevProps.min && max === prevProps.max) {
      return;
    }
    const { onChange, value } = this.props;
    const currentValue = value || prevState.bounds;
    if (currentValue.some(v => utils.isValueOutOfRange(v, this.props))) {
      const newValues = currentValue.map(v => utils.ensureValueInRange(v, this.props));

@@ -98,19 +98,23 @@


  prevMovedHandleIndex: number;

  componentDidUpdate(_: SliderProps, prevState: SliderState) {
    if (!('value' in this.props || 'min' in this.props || 'max' in this.props)) {
  componentDidUpdate(prevProps: SliderProps, prevState: SliderState) {
    const { min, max, value, onChange } = this.props;
    if (!('min' in this.props || 'max' in this.props)) {
      return;
    }
    const { value, onChange } = this.props;
    const theValue = value !== undefined ? value : prevState.value;
    const nextValue = this.trimAlignValue(theValue, this.props);
    if (nextValue !== prevState.value) {
      // eslint-disable-next-line
      this.setState({ value: nextValue });
      if (utils.isValueOutOfRange(theValue, this.props)) {
        onChange(nextValue);
      }
    if (nextValue === prevState.value) {
      return;
    }
    // eslint-disable-next-line
    this.setState({ value: nextValue });
    if (
      !(min === prevProps.min && max === prevProps.max) &&
      utils.isValueOutOfRange(theValue, this.props)
    ) {
      onChange(nextValue);
    }
  }


Files		•	•	•	Coverage
src	711	627	0	84	88.19%
Project Totals (11 files)	711	627	0	84	88.19%

View CI Build Download

No yaml found.

Create your codecov.yml to customize your Codecov experience

Read the docs

Interact now

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.

SVG

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.

SVG

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.

SVG

Learn more about the coverage sunburst graph

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) {

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	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	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

Navigation	Overlay
`t` Navigate files	`h` Toggle hits
`y` Change url to tip of branch	`m` Toggle misses
`b / v` Jump to prev/next hit line	`p` Toggle partial
`z / x` Jump to prev/next missed or partial line	`1..9` Toggle flags
`shift + o` Open current page in GitHub	`a` Toggle all on
`/ or ?` Show keyboard shortcuts dialog	`c` Toggle context lines or commits

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';

Updating our web app

No yaml found.