react-native/Examples/UIExplorer/js/UIExplorerSettingSwitchRow.js

55 lines
1.6 KiB
JavaScript

/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule UIExplorerSettingSwitchRow
* @flow
*/
'use strict';
const React = require('React');
const StyleSheet = require('StyleSheet');
const Switch = require('Switch');
const Text = require('Text');
const UIExplorerStatePersister = require('./UIExplorerStatePersister');
const View = require('View');
class UIExplorerSettingSwitchRow extends React.Component {
componentWillReceiveProps(newProps) {
const {onEnable, onDisable, persister} = this.props;
if (newProps.persister.state !== persister.state) {
newProps.persister.state ? onEnable() : onDisable();
}
}
render() {
const {label, persister} = this.props;
return (
<View style={styles.row}>
<Text>{label}</Text>
<Switch
value={persister.state}
onValueChange={(value) => {
persister.setState(() => value);
}}
/>
</View>
);
}
}
const styles = StyleSheet.create({
row: {
padding: 10,
flexDirection: 'row',
justifyContent: 'space-between',
},
});
UIExplorerSettingSwitchRow = UIExplorerStatePersister.createContainer(UIExplorerSettingSwitchRow, {
cacheKeySuffix: ({label}) => 'Switch:' + label,
getInitialState: ({initialValue}) => initialValue,
});
module.exports = UIExplorerSettingSwitchRow;