Introduces Tick & TickList components

components/chart/tick.js

@@ -0,0 +1,29 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+import AppText from '../app-text'
+
+import styles from './styles'
+
+const Tick = ({ yPosition, isBold, shouldShowLabel, label }) => {
+  // this eyeballing is sadly necessary because RN does not
+  // support percentage values for transforms, which we'd need
+  // to reliably place the label vertically centered to the grid
+  const topPosition = yPosition - 8
+  const style = [
+    styles.yAxisLabels.tempScale,
+    {top: topPosition},
+    isBold && styles.boldTick
+  ]
+
+  return <AppText style={style}>{shouldShowLabel && label}</AppText>
+}
+
+Tick.propTypes = {
+  yPosition: PropTypes.number,
+  isBold: PropTypes.bool,
+  shouldShowLabel: PropTypes.bool,
+  label: PropTypes.string,
+}
+
+export default Tick