Guest User

Untitled

a guest
Apr 25th, 2019
119
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React, { Component } from 'react';
  2. import Checkbox from '@material-ui/core/Checkbox';
  3.  
  4. /**
  5. * Tri-state wrapper for material-ui checkbox
  6. * @prop {boolean | null} checked - the state of the checkbox
  7. * true means checked
  8. * false means unchecked
  9. * null (or undefined) means indeterminate
  10. * @prop {(event, checked: boolean | null) => void} onChange
  11. * called whenever the state of the checkbox changes
  12. * note that `event.target.checked` cannot be relied on
  13. * as it can with Checkbox
  14. * This component also passes all other props to the underlying
  15. * Checkbox *except* for `indeterminate`
  16. */
  17. export default class TriStateCheckbox extends Component {
  18.  
  19. static getDerivedStateFromProps ({ checked }) {
  20. return { checked };
  21. }
  22.  
  23. constructor() {
  24. super();
  25. this.state = { checked: null };
  26. }
  27.  
  28. onTouch = (e) => {
  29. let { checked } = this.state;
  30. // ... -> null -> false -> true -> ...
  31. if (checked === false) {
  32. checked = true;
  33. } else if (checked === true) {
  34. checked = null;
  35. } else {
  36. checked = false;
  37. }
  38. this.setState({ checked }, () => this.props.onChange(e, checked));
  39. }
  40.  
  41. render() {
  42. // prevent some props from being passed
  43. let { checked: c, indeterminate: i, onChange: oc, ...rest } = this.props;
  44. let { checked } = this.state;
  45. let indeterminate = false;
  46. if (checked == null) { // deliberate ==, undefined or null is fine
  47. indeterminate = true; // shows - in box, overriding checked
  48. checked = false; // if indeterminate, F means gray, T means color
  49. }
  50.  
  51. return <Checkbox
  52. checked={checked}
  53. indeterminate={indeterminate}
  54. onChange={this.onTouch}
  55. { ...rest }
  56. />
  57. }
  58. }
RAW Paste Data

Adblocker detected! Please consider disabling it...

We've detected AdBlock Plus or some other adblocking software preventing Pastebin.com from fully loading.

We don't have any obnoxious sound, or popup ads, we actively block these annoying types of ads!

Please add Pastebin.com to your ad blocker whitelist or disable your adblocking software.

×