diff --git a/src/TouchableCell.js b/src/TouchableCell.js
new file mode 100644
index 0000000..79e1f89
--- /dev/null
+++ b/src/TouchableCell.js
@@ -0,0 +1,103 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { Text, TouchableOpacity, TouchableOpacityPropTypes } from 'react-native'
+
+import TouchableNoFeedback from './TouchableNoFeedback'
+
+import { getAdjustedStyle } from './utilities'
+
+/**
+ * Renders a cell with value (or renderChildren) that is touchable
+ *
+ * @param {string|number} value The value to render in cell
+ * @param {string|number} rowKey Unique key associated to row cell is in
+ * @param {string|number} columnKey Unique key associated to column cell is in
+ * @param {func} onPressAction Action creator for handling focusing of this cell.
+ * `(rowKey, columnKey) => {...}`
+ * @param {func} dispatch Reducer dispatch callback for handling actions
+ * @param {func} renderChildren Reducer dispatch callback for handling actions
+ * @param {func} TouchableComponent Override containing element of TouchableCell
+ * Additional props spread into TouchableComponent
+ * @param {object} containerStyle Style object for the containing Touchable component
+ * @param {object} textStyle Style object for the inner Text component
+ * @param {Number} width Optional flex property to inject into styles.
+ * @param {Bool} isLastCell Indicator for if this cell is the last
+ * in a row. Removing the borderRight if true.
+ */
+const TouchableCell = React.memo(
+ ({
+ value,
+ rowKey,
+ columnKey,
+ onPressAction,
+ dispatch,
+ renderChildren,
+ TouchableComponent,
+ containerStyle,
+ width,
+ textStyle,
+ isLastCell,
+ debug,
+ isDisabled,
+ ...otherProps
+ }) => {
+ if (debug) console.log(`- TouchableCell: ${rowKey},${columnKey}`)
+
+ const onPress = () => dispatch(onPressAction(rowKey, columnKey))
+
+ const internalContainerStyle = getAdjustedStyle(
+ containerStyle,
+ width,
+ isLastCell
+ )
+ const Container = isDisabled
+ ? TouchableNoFeedback
+ : TouchableComponent || TouchableOpacity
+ const content = renderChildren ? (
+ renderChildren(value)
+ ) : (
+ {value}
+ )
+
+ return (
+
+ {content}
+
+ )
+ }
+)
+
+TouchableCell.propTypes = {
+ ...TouchableOpacityPropTypes,
+ value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+ rowKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+ columnKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+ .isRequired,
+ onPressAction: PropTypes.func.isRequired,
+ dispatch: PropTypes.func.isRequired,
+ renderChildren: PropTypes.func.isRequired,
+ TouchableComponent: PropTypes.node,
+ containerStyle: PropTypes.object,
+ textStyle: PropTypes.object,
+ isLastCell: PropTypes.bool,
+ width: PropTypes.number,
+ debug: PropTypes.bool,
+ isDisabled: PropTypes.bool,
+}
+
+TouchableCell.defaultProps = {
+ value: '',
+ containerStyle: {},
+ textStyle: {},
+ TouchableComponent: null,
+ isLastCell: false,
+ width: 0,
+ debug: false,
+ isDisabled: false,
+}
+
+export default TouchableCell