text: /**
   * The examples provided by Facebook are for non-commercial testing and
   * evaluation purposes only.
   *
   * Facebook reserves all rights not expressly granted.
   *
   * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
   * OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
   * FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
   * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
   * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
   * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
   */
  'use strict';
  
  var React = require('react-native');
  var {
    StyleSheet,
    View
  } = React;
  
  var styles = StyleSheet.create({
    box: {
      width: 100,
      height: 100,
    },
    border1: {
      borderWidth: 10,
      borderColor: '#a52a2a',
    },
    borderRadius: {
      borderWidth: 10,
      borderRadius: 10,
      borderColor: '#00ffff',
    },
    border2: {
      borderWidth: 10,
      borderTopColor: 'red',
      borderRightColor: 'yellow',
      borderBottomColor: 'green',
      borderLeftColor: 'blue',
    },
    border3: {
      borderColor: 'purple',
      borderTopWidth: 10,
      borderRightWidth: 20,
      borderBottomWidth: 30,
      borderLeftWidth: 40,
    },
    border4: {
      borderTopWidth: 10,
      borderTopColor: 'red',
      borderRightWidth: 20,
      borderRightColor: 'yellow',
      borderBottomWidth: 30,
      borderBottomColor: 'green',
      borderLeftWidth: 40,
      borderLeftColor: 'blue',
    },
    border5: {
      borderRadius: 50,
      borderTopWidth: 10,
      borderTopColor: 'red',
      borderRightWidth: 20,
      borderRightColor: 'yellow',
      borderBottomWidth: 30,
      borderBottomColor: 'green',
      borderLeftWidth: 40,
      borderLeftColor: 'blue',
    },
    border6: {
      borderTopWidth: 10,
      borderTopColor: 'red',
      borderRightWidth: 20,
      borderRightColor: 'yellow',
      borderBottomWidth: 30,
      borderBottomColor: 'green',
      borderLeftWidth: 40,
      borderLeftColor: 'blue',
  
      borderTopLeftRadius: 100,
    },
    border7: {
      borderWidth: 10,
      borderColor: 'rgba(255,0,0,0.5)',
      borderRadius: 30,
      overflow: 'hidden',
    },
    border7_inner: {
      backgroundColor: 'blue',
      width: 100,
      height: 100
    },
  });
  
  exports.title = 'Border';
  exports.description = 'View borders';
  exports.examples = [
    {
      title: 'Equal-Width / Same-Color',
      description: 'borderWidth & borderColor',
      render() {
        return <View style={[styles.box, styles.border1]} />;
      }
    },
    {
      title: 'Equal-Width / Same-Color',
      description: 'borderWidth & borderColor & borderRadius',
      render() {
        return <View style={[styles.box, styles.borderRadius]} />;
      }
    },
    {
      title: 'Equal-Width Borders',
      description: 'borderWidth & border*Color',
      render() {
        return <View style={[styles.box, styles.border2]} />;
      }
    },
    {
      title: 'Same-Color Borders',
      description: 'border*Width & borderColor',
      render() {
        return <View style={[styles.box, styles.border3]} />;
      }
    },
    {
      title: 'Custom Borders',
      description: 'border*Width & border*Color',
      render() {
        return <View style={[styles.box, styles.border4]} />;
      }
    },
    {
      title: 'Custom Borders',
      description: 'border*Width & border*Color',
      platform: 'ios',
      render() {
        return <View style={[styles.box, styles.border5]} />;
      }
    },
    {
      title: 'Custom Borders',
      description: 'border*Width & border*Color',
      platform: 'ios',
      render() {
        return <View style={[styles.box, styles.border6]} />;
      }
    },
    {
      title: 'Custom Borders',
      description: 'borderRadius & clipping',
      platform: 'ios',
      render() {
        return (
          <View style={[styles.box, styles.border7]}>
            <View style={styles.border7_inner} />
          </View>
        );
      }
    },
  ];
  