function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import React, { PureComponent } from "react";
import { StyleSheet, Text as TextNative } from "react-native";
import { TEXT_DARKEST, COLOUR_RED } from "../colours";

/**
 * A wrapper around the react-native Text component that applies a
 * maximum font size multiplier (1.2) to prevent layout breaking.
 *
 * * @typedef {Object} TextProps
 * @property {'pageHeading' | 'heading' | 'label' | 'detailLabel' | 'input' | 'error'} [type] - The style preset to apply.
 * * @example
 * <Text type="pageHeading" className="myClass">Welcome</Text>
 */

class Text extends PureComponent {
  render() {
    return /*#__PURE__*/React.createElement(TextNative, _extends({}, this.props, {
      style: [styles[this.props.type], this.props.style],
      maxFontSizeMultiplier: this.props.maxFontSizeMultiplier || 1.2
    }), this.props.children);
  }
}
const styles = StyleSheet.create({
  pageHeading: {
    fontFamily: "sf-bold",
    fontSize: 24,
    color: TEXT_DARKEST
  },
  body: {
    fontFamily: "sf-regular",
    fontSize: 14,
    color: TEXT_DARKEST
  },
  label: {
    fontFamily: "sf-semibold",
    color: TEXT_DARKEST,
    fontSize: 16
  },
  detailLabel: {
    fontFamily: "sf-bold",
    color: TEXT_DARKEST,
    fontSize: 16
  },
  input: {
    color: TEXT_DARKEST,
    fontFamily: "sf-regular",
    fontSize: 16
  },
  error: {
    fontFamily: "sf-bold",
    color: COLOUR_RED,
    fontSize: 16
  }
});
export { Text };
//# sourceMappingURL=Text.js.map