react-native/Libraries/Text/TextPropTypes.js

136 lines
4.1 KiB
JavaScript
Raw Normal View History

/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
* @format
*/
'use strict';
const ColorPropType = require('ColorPropType');
const EdgeInsetsPropType = require('EdgeInsetsPropType');
const PropTypes = require('prop-types');
const StyleSheetPropType = require('StyleSheetPropType');
const TextStylePropTypes = require('TextStylePropTypes');
const stylePropType = StyleSheetPropType(TextStylePropTypes);
module.exports = {
/**
* When `numberOfLines` is set, this prop defines how text will be
* truncated.
*
* See https://facebook.github.io/react-native/docs/text.html#ellipsizemode
*/
ellipsizeMode: PropTypes.oneOf(['head', 'middle', 'tail', 'clip']),
/**
* Used to truncate the text with an ellipsis.
*
* See https://facebook.github.io/react-native/docs/text.html#numberoflines
*/
numberOfLines: PropTypes.number,
/**
* Set text break strategy on Android.
*
* See https://facebook.github.io/react-native/docs/text.html#textbreakstrategy
*/
textBreakStrategy: PropTypes.oneOf(['simple', 'highQuality', 'balanced']),
/**
* Invoked on mount and layout changes.
*
* See https://facebook.github.io/react-native/docs/text.html#onlayout
*/
onLayout: PropTypes.func,
/**
* This function is called on press.
*
* See https://facebook.github.io/react-native/docs/text.html#onpress
*/
onPress: PropTypes.func,
/**
* This function is called on long press.
*
* See https://facebook.github.io/react-native/docs/text.html#onlongpress
*/
onLongPress: PropTypes.func,
/**
* Defines how far your touch may move off of the button, before
* deactivating the button.
*
* See https://facebook.github.io/react-native/docs/text.html#pressretentionoffset
*/
pressRetentionOffset: EdgeInsetsPropType,
/**
* Lets the user select text.
*
* See https://facebook.github.io/react-native/docs/text.html#selectable
*/
selectable: PropTypes.bool,
/**
* The highlight color of the text.
*
* See https://facebook.github.io/react-native/docs/text.html#selectioncolor
*/
selectionColor: ColorPropType,
/**
* When `true`, no visual change is made when text is pressed down.
*
* See https://facebook.github.io/react-native/docs/text.html#supperhighlighting
*/
suppressHighlighting: PropTypes.bool,
style: stylePropType,
/**
* Used to locate this view in end-to-end tests.
*
* See https://facebook.github.io/react-native/docs/text.html#testid
*/
testID: PropTypes.string,
/**
* Used to locate this view from native code.
*
* See https://facebook.github.io/react-native/docs/text.html#nativeid
*/
nativeID: PropTypes.string,
/**
* Whether fonts should scale to respect Text Size accessibility settings.
*
* See https://facebook.github.io/react-native/docs/text.html#allowfontscaling
*/
allowFontScaling: PropTypes.bool,
iOS: Add a maxFontSizeMultiplier prop to <Text> and <TextInput> (#20915) Summary: **Motivation** Whenever a user changes the system font size to its maximum allowable setting, React Native apps that allow font scaling can become unusable because the text gets too big. Experimenting with a native app like iMessage on iOS, the font size used for non-body text (e.g. header, navigational elements) is capped while the body text (e.g. text in the message bubbles) is allowed to grow. This PR introduces a new prop on `<Text>` and `<TextInput>` called `maxFontSizeMultiplier`. This enables devs to set the maximum allowed text scale factor on a Text/TextInput. The default is 0 which means no limit. Another PR will add this feature to Android. **Test Plan** I created a test app which utilizes all categories of values of `maxFontSizeMultiplier`: - `undefined`: inherit from parent - `0`: no limit - `1`, `1.2`: fixed limits I tried this with `Text`, `TextInput` with `value`, and `TextInput` with children. For `Text`, I also verified that nesting works properly (if a child `Text` doesn't specify `maxFontSizeMultiplier`, it inherits it from its parent). Lastly, we've been using a version of this in Skype for several months. **Release Notes** [GENERAL] [ENHANCEMENT] [Text/TextInput] - Added maxFontSizeMultiplier prop to prevent some text from getting unusably large as user increases OS's font scale setting (iOS) Adam Comella Microsoft Corp. Pull Request resolved: https://github.com/facebook/react-native/pull/20915 Differential Revision: D9646739 Pulled By: shergin fbshipit-source-id: c823f59c1e342c22d6297b88b2cb11c5a1f10310
2018-09-05 00:33:06 +00:00
/**
* Specifies largest possible scale a font can reach when `allowFontScaling` is enabled.
* Possible values:
* `null/undefined` (default): inherit from the parent node or the global default (0)
* `0`: no max, ignore parent/global default
* `>= 1`: sets the maxFontSizeMultiplier of this node to this value
*/
maxFontSizeMultiplier: PropTypes.number,
/**
* Indicates whether the view is an accessibility element.
*
* See https://facebook.github.io/react-native/docs/text.html#accessible
*/
accessible: PropTypes.bool,
/**
* Whether font should be scaled down automatically.
*
* See https://facebook.github.io/react-native/docs/text.html#adjustsfontsizetofit
*/
adjustsFontSizeToFit: PropTypes.bool,
/**
* Smallest possible scale a font can reach.
*
* See https://facebook.github.io/react-native/docs/text.html#minimumfontscale
*/
minimumFontScale: PropTypes.number,
/**
* Specifies the disabled state of the text view for testing purposes.
*
* See https://facebook.github.io/react-native/docs/text.html#disabled
*/
disabled: PropTypes.bool,
};