1/** 2 * Copyright (c) Meta Platforms, Inc. and affiliates. 3 * 4 * This source code is licensed under the MIT license found in the 5 * LICENSE file in the root directory of this source tree. 6 * 7 * @format 8 */ 9 10import type * as React from 'react'; 11import {Constructor} from '../../types/private/Utilities'; 12import {AccessibilityProps} from '../Components/View/ViewAccessibility'; 13import {NativeMethods} from '../../types/public/ReactNativeTypes'; 14import {ColorValue, StyleProp} from '../StyleSheet/StyleSheet'; 15import {TextStyle} from '../StyleSheet/StyleSheetTypes'; 16import { 17 GestureResponderEvent, 18 LayoutChangeEvent, 19 NativeSyntheticEvent, 20 TextLayoutEventData, 21} from '../Types/CoreEventTypes'; 22 23export interface TextPropsIOS { 24 /** 25 * Specifies whether font should be scaled down automatically to fit given style constraints. 26 */ 27 adjustsFontSizeToFit?: boolean | undefined; 28 29 /** 30 * The Dynamic Type scale ramp to apply to this element on iOS. 31 */ 32 dynamicTypeRamp?: 33 | 'caption2' 34 | 'caption1' 35 | 'footnote' 36 | 'subheadline' 37 | 'callout' 38 | 'body' 39 | 'headline' 40 | 'title3' 41 | 'title2' 42 | 'title1' 43 | 'largeTitle' 44 | undefined; 45 46 /** 47 * Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0). 48 */ 49 minimumFontScale?: number | undefined; 50 51 /** 52 * When `true`, no visual change is made when text is pressed down. By 53 * default, a gray oval highlights the text on press down. 54 */ 55 suppressHighlighting?: boolean | undefined; 56 57 /** 58 * Set line break strategy on iOS. 59 */ 60 lineBreakStrategyIOS?: 61 | 'none' 62 | 'standard' 63 | 'hangul-word' 64 | 'push-out' 65 | undefined; 66} 67 68export interface TextPropsAndroid { 69 /** 70 * Specifies the disabled state of the text view for testing purposes. 71 */ 72 disabled?: boolean | undefined; 73 74 /** 75 * Lets the user select text, to use the native copy and paste functionality. 76 */ 77 selectable?: boolean | undefined; 78 79 /** 80 * The highlight color of the text. 81 */ 82 selectionColor?: ColorValue | undefined; 83 84 /** 85 * Set text break strategy on Android API Level 23+ 86 * default is `highQuality`. 87 */ 88 textBreakStrategy?: 'simple' | 'highQuality' | 'balanced' | undefined; 89 90 /** 91 * Determines the types of data converted to clickable URLs in the text element. 92 * By default no data types are detected. 93 */ 94 dataDetectorType?: 95 | null 96 | 'phoneNumber' 97 | 'link' 98 | 'email' 99 | 'none' 100 | 'all' 101 | undefined; 102 103 /** 104 * Hyphenation strategy 105 */ 106 android_hyphenationFrequency?: 'normal' | 'none' | 'full' | undefined; 107} 108 109// https://reactnative.dev/docs/text#props 110export interface TextProps 111 extends TextPropsIOS, 112 TextPropsAndroid, 113 AccessibilityProps { 114 /** 115 * Specifies whether fonts should scale to respect Text Size accessibility settings. 116 * The default is `true`. 117 */ 118 allowFontScaling?: boolean | undefined; 119 120 children?: React.ReactNode | undefined; 121 122 /** 123 * This can be one of the following values: 124 * 125 * - `head` - The line is displayed so that the end fits in the container and the missing text 126 * at the beginning of the line is indicated by an ellipsis glyph. e.g., "...wxyz" 127 * - `middle` - The line is displayed so that the beginning and end fit in the container and the 128 * missing text in the middle is indicated by an ellipsis glyph. "ab...yz" 129 * - `tail` - The line is displayed so that the beginning fits in the container and the 130 * missing text at the end of the line is indicated by an ellipsis glyph. e.g., "abcd..." 131 * - `clip` - Lines are not drawn past the edge of the text container. 132 * 133 * The default is `tail`. 134 * 135 * `numberOfLines` must be set in conjunction with this prop. 136 * 137 * > `clip` is working only for iOS 138 */ 139 ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip' | undefined; 140 141 /** 142 * Used to reference react managed views from native code. 143 */ 144 id?: string | undefined; 145 146 /** 147 * Line Break mode. Works only with numberOfLines. 148 * clip is working only for iOS 149 */ 150 lineBreakMode?: 'head' | 'middle' | 'tail' | 'clip' | undefined; 151 152 /** 153 * Used to truncate the text with an ellipsis after computing the text 154 * layout, including line wrapping, such that the total number of lines 155 * does not exceed this number. 156 * 157 * This prop is commonly used with `ellipsizeMode`. 158 */ 159 numberOfLines?: number | undefined; 160 161 /** 162 * Invoked on mount and layout changes with 163 * 164 * {nativeEvent: { layout: {x, y, width, height}}}. 165 */ 166 onLayout?: ((event: LayoutChangeEvent) => void) | undefined; 167 168 /** 169 * Invoked on Text layout 170 */ 171 onTextLayout?: 172 | ((event: NativeSyntheticEvent<TextLayoutEventData>) => void) 173 | undefined; 174 175 /** 176 * This function is called on press. 177 * Text intrinsically supports press handling with a default highlight state (which can be disabled with suppressHighlighting). 178 */ 179 onPress?: ((event: GestureResponderEvent) => void) | undefined; 180 181 onPressIn?: ((event: GestureResponderEvent) => void) | undefined; 182 onPressOut?: ((event: GestureResponderEvent) => void) | undefined; 183 184 /** 185 * This function is called on long press. 186 * e.g., `onLongPress={this.increaseSize}>`` 187 */ 188 onLongPress?: ((event: GestureResponderEvent) => void) | undefined; 189 190 /** 191 * @see https://reactnative.dev/docs/text#style 192 */ 193 style?: StyleProp<TextStyle> | undefined; 194 195 /** 196 * Used to locate this view in end-to-end tests. 197 */ 198 testID?: string | undefined; 199 200 /** 201 * Used to reference react managed views from native code. 202 */ 203 nativeID?: string | undefined; 204 205 /** 206 * Specifies largest possible scale a font can reach when allowFontScaling is enabled. Possible values: 207 * - null/undefined (default): inherit from the parent node or the global default (0) 208 * - 0: no max, ignore parent/global default 209 * - >= 1: sets the maxFontSizeMultiplier of this node to this value 210 */ 211 maxFontSizeMultiplier?: number | null | undefined; 212} 213 214/** 215 * A React component for displaying text which supports nesting, styling, and touch handling. 216 */ 217declare class TextComponent extends React.Component<TextProps> {} 218declare const TextBase: Constructor<NativeMethods> & typeof TextComponent; 219export class Text extends TextBase {} 220