import React, {Component} from "react"; import {Tip} from "./Tip"; class SwitchLine extends Component { constructor(props) { super(props); // Initialize the state object with the initial values from the props this.state = { text: props.outvar in props.data ? props.data[props.outvar].text : (props.fallback ? props.fallback.text : ""), checked: props.outvar in props.data ? props.data[props.outvar].checked : (props.fallback ? props.fallback.checked : false) }; // Bind the event handler to this this.handleText = this.handleText.bind(this); this.handleCheck = this.handleCheck.bind(this); this.props.target.construct(this.props.outvar, this.state); } handleText(element) { let new_state = { ...this.state, text: element.target.value } this.setState(new_state); this.props.target.update(this.props.outvar, new_state); } handleCheck() { // Update the state object with the new value for outvar let new_state = { ...this.state, checked: !this.state.checked } this.setState(new_state); this.props.target.update(this.props.outvar, new_state); } static getDerivedStateFromProps(props, current_state) { if (current_state.checked !== props.data[props.outvar].checked || current_state.text !== props.data[props.outvar].text) { return { checked: props.data[props.outvar].checked, text: props.data[props.outvar].text, } } return null } render() { let key = this.props.id + this.props.outvar; return (
{this.props.tip && }
); } } export function SwitchLineWrapper(target, id, data, {title, fallback, outvar, icon, tip}) { return ; }