import React from 'react';
import PropTypes from 'prop-types';
import { View, Text, StyleSheet } from 'react-native';

/**
 * Renders a cell that displays a string/number value within
 * a react-native `Text` component.
 *
 * @param {string|number} value The value to render in cell
 */
const Cell = React.memo(({ value }) => {
  console.log(`- Cell: ${value}`);
  return (
    <View style={defaultStyles.cell}>
      <Text>{value}</Text>
    </View>
  );
});

Cell.propTypes = {
  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
};

Cell.defaultProps = {
  value: '',
};

const defaultStyles = StyleSheet.create({
  cell: {
    flex: 1,
    backgroundColor: 'yellow',
    justifyContent: 'center',
  },
});

export default Cell;

@@ -1,12 +1,57 @@
+/* eslint-disable react/forbid-prop-types */%0A
 import React
@@ -155,16 +155,64 @@
 native';
+%0Aimport %7B getAdjustedStyle %7D from './utilities';
 %0A%0A/**%0A *
@@ -341,16 +341,20 @@
 %7D value 
+    
 The valu
@@ -379,269 +379,746 @@
 l%0A *
-/%0Aconst Cell = React.memo((%7B value %7D) =%3E %7B%0A  console.log(%60- Cell: $%7Bvalue%7D%60);%0A  return (%0A    %3CView style=%7BdefaultStyles.cell%7D%3E%0A      %3CText%3E%7Bvalue%7D%3C/Text%3E%0A    %3C/View%3E%0A  );%0A%7D);%0A%0ACell.propTypes = %7B%0A  value: PropTypes.oneOfType(%5BPropTypes.string, PropTypes.number%5D)
+ @param %7BObject%7D        viewStyle Style object for the containing View%0A * @param %7BObject%7D        textStyle Style object for the inner Text%0A */%0Aconst Cell = React.memo((%7B value, textStyle, viewStyle, width, isLastCell %7D) =%3E %7B%0A  console.log(%60- Cell: $%7Bvalue%7D%60);%0A%0A  const internalViewStyle = getAdjustedStyle(viewStyle, width, isLastCell);%0A%0A  return (%0A    %3CView style=%7BinternalViewStyle%7D%3E%0A      %3CText style=%7BtextStyle%7D%3E%7Bvalue%7D%3C/Text%3E%0A    %3C/View%3E%0A  );%0A%7D);%0A%0Aconst defaultStyles = StyleSheet.create(%7B%0A  viewStyle: %7B%7D,%0A  textStyle: %7B%7D,%0A%7D);%0A%0ACell.propTypes = %7B%0A  value: PropTypes.oneOfType(%5BPropTypes.string, PropTypes.number%5D),%0A  textStyle: PropTypes.object,%0A  viewStyle: PropTypes.object,%0A  width: PropTypes.number,%0A  isLastCell: PropTypes.bool
 ,%0A%7D;
@@ -1158,17 +1158,20 @@
 '',%0A
-%7D;%0A%0Aconst
+  textStyle:
  def
@@ -1184,122 +1184,88 @@
 yles
- = StyleSheet.create(%7B%0A  cell: %7B%0A    flex: 1,%0A    backgroundColor: 'yellow',%0A    justifyContent: 'center',%0A  %7D
+.textStyle,%0A  viewStyle: defaultStyles.viewStyle,%0A  width: 0,%0A  isLastCell: 0
 ,%0A%7D
-)
 ;%0A%0Ae

Add new props to Cell component