@jobber/components-native 0.82.1-JOB-131123-c660de8.42 → 0.82.1-JOB-131123-ed033d6.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/package.json +2 -2
- package/dist/src/Typography/Typography.js +1 -2
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types/src/Typography/Typography.d.ts +14 -1
- package/package.json +2 -2
- package/src/Heading/__snapshots__/Heading.test.tsx.snap +0 -8
- package/src/StatusLabel/__snapshots__/StatusLabel.test.tsx.snap +0 -7
- package/src/Text/__snapshots__/Text.test.tsx.snap +0 -20
- package/src/TextList/__snapshots__/TextList.test.tsx.snap +0 -4
- package/src/Typography/Typography.tsx +15 -3
- package/src/Typography/__snapshots__/Typography.test.tsx.snap +0 -31
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { StyleProp, TextProps, TextStyle } from "react-native";
|
|
3
|
-
export interface TypographyProps<T extends FontFamily>
|
|
3
|
+
export interface TypographyProps<T extends FontFamily> {
|
|
4
4
|
/**
|
|
5
5
|
* Text capitalization
|
|
6
6
|
*/
|
|
@@ -13,6 +13,12 @@ export interface TypographyProps<T extends FontFamily> extends Pick<TextProps, "
|
|
|
13
13
|
* Alignment of text
|
|
14
14
|
*/
|
|
15
15
|
readonly align?: TextAlign;
|
|
16
|
+
/**
|
|
17
|
+
* Lets the user select text, to use the native copy and paste functionality.
|
|
18
|
+
* WARNING: if true, this prevents ellipsis from being shown on Android.
|
|
19
|
+
* @default true
|
|
20
|
+
*/
|
|
21
|
+
readonly selectable?: boolean;
|
|
16
22
|
/**
|
|
17
23
|
* Font size
|
|
18
24
|
*/
|
|
@@ -24,6 +30,7 @@ export interface TypographyProps<T extends FontFamily> extends Pick<TextProps, "
|
|
|
24
30
|
/**
|
|
25
31
|
* The maximum amount of lines the text can occupy before being truncated with "...".
|
|
26
32
|
* Uses predefined string values that correspond to a doubling scale for the amount of lines.
|
|
33
|
+
* WARNING: if `selectable` is true, Android will not show an ellipsis.
|
|
27
34
|
*/
|
|
28
35
|
readonly maxLines?: TruncateLength;
|
|
29
36
|
/**
|
|
@@ -86,6 +93,12 @@ export interface TypographyProps<T extends FontFamily> extends Pick<TextProps, "
|
|
|
86
93
|
*/
|
|
87
94
|
readonly strikeThrough?: boolean;
|
|
88
95
|
readonly UNSAFE_style?: TypographyUnsafeStyle;
|
|
96
|
+
/**
|
|
97
|
+
* Callback behaves differently on iOS and Android.
|
|
98
|
+
* On iOS, it is called when the text is laid out.
|
|
99
|
+
* On Android, it is called before the text is laid out.
|
|
100
|
+
* @see https://reactnative.dev/docs/text#ontextlayout
|
|
101
|
+
*/
|
|
89
102
|
readonly onTextLayout?: OnTextLayoutEvent;
|
|
90
103
|
}
|
|
91
104
|
export interface TypographyUnsafeStyle {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jobber/components-native",
|
|
3
|
-
"version": "0.82.1-JOB-131123-
|
|
3
|
+
"version": "0.82.1-JOB-131123-ed033d6.44+ed033d62",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "React Native implementation of Atlantis",
|
|
6
6
|
"repository": {
|
|
@@ -79,5 +79,5 @@
|
|
|
79
79
|
"react-native-safe-area-context": "^5.4.0",
|
|
80
80
|
"react-native-svg": ">=12.0.0"
|
|
81
81
|
},
|
|
82
|
-
"gitHead": "
|
|
82
|
+
"gitHead": "ed033d620aaac6d0add74f60e72caf869d4bdcf5"
|
|
83
83
|
}
|
|
@@ -6,7 +6,6 @@ exports[`when Heading called with Subtitle variation should match snapshot 1`] =
|
|
|
6
6
|
adjustsFontSizeToFit={false}
|
|
7
7
|
allowFontScaling={true}
|
|
8
8
|
collapsable={false}
|
|
9
|
-
ellipsizeMode="middle"
|
|
10
9
|
maxFontSizeMultiplier={1}
|
|
11
10
|
selectable={true}
|
|
12
11
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -41,7 +40,6 @@ exports[`when Heading called with an alignment should match snapshot 1`] = `
|
|
|
41
40
|
adjustsFontSizeToFit={false}
|
|
42
41
|
allowFontScaling={true}
|
|
43
42
|
collapsable={false}
|
|
44
|
-
ellipsizeMode="middle"
|
|
45
43
|
selectable={true}
|
|
46
44
|
selectionColor="hsl(86, 100%, 46%)"
|
|
47
45
|
style={
|
|
@@ -75,7 +73,6 @@ exports[`when Heading called with maxLines should match snapshot 1`] = `
|
|
|
75
73
|
adjustsFontSizeToFit={false}
|
|
76
74
|
allowFontScaling={true}
|
|
77
75
|
collapsable={false}
|
|
78
|
-
ellipsizeMode="middle"
|
|
79
76
|
numberOfLines={1}
|
|
80
77
|
selectable={true}
|
|
81
78
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -110,7 +107,6 @@ exports[`when Heading called with reverseTheme should match snapshot 1`] = `
|
|
|
110
107
|
adjustsFontSizeToFit={false}
|
|
111
108
|
allowFontScaling={true}
|
|
112
109
|
collapsable={false}
|
|
113
|
-
ellipsizeMode="middle"
|
|
114
110
|
selectable={true}
|
|
115
111
|
selectionColor="hsl(86, 100%, 46%)"
|
|
116
112
|
style={
|
|
@@ -144,7 +140,6 @@ exports[`when Heading called with sub-heading variation and text-color should ma
|
|
|
144
140
|
adjustsFontSizeToFit={false}
|
|
145
141
|
allowFontScaling={true}
|
|
146
142
|
collapsable={false}
|
|
147
|
-
ellipsizeMode="middle"
|
|
148
143
|
maxFontSizeMultiplier={1.375}
|
|
149
144
|
selectable={true}
|
|
150
145
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -179,7 +174,6 @@ exports[`when Heading called with sub-heading variation should match snapshot 1`
|
|
|
179
174
|
adjustsFontSizeToFit={false}
|
|
180
175
|
allowFontScaling={true}
|
|
181
176
|
collapsable={false}
|
|
182
|
-
ellipsizeMode="middle"
|
|
183
177
|
maxFontSizeMultiplier={1.375}
|
|
184
178
|
selectable={true}
|
|
185
179
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -214,7 +208,6 @@ exports[`when Heading called with text as the only prop should match snapshot 1`
|
|
|
214
208
|
adjustsFontSizeToFit={false}
|
|
215
209
|
allowFontScaling={true}
|
|
216
210
|
collapsable={false}
|
|
217
|
-
ellipsizeMode="middle"
|
|
218
211
|
selectable={true}
|
|
219
212
|
selectionColor="hsl(86, 100%, 46%)"
|
|
220
213
|
style={
|
|
@@ -248,7 +241,6 @@ exports[`when Heading called with title variation should match snapshot 1`] = `
|
|
|
248
241
|
adjustsFontSizeToFit={false}
|
|
249
242
|
allowFontScaling={true}
|
|
250
243
|
collapsable={false}
|
|
251
|
-
ellipsizeMode="middle"
|
|
252
244
|
maxFontSizeMultiplier={1.0625}
|
|
253
245
|
selectable={true}
|
|
254
246
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -25,7 +25,6 @@ exports[`StatusLabel alignment when alignment prop set to "end" should match sna
|
|
|
25
25
|
adjustsFontSizeToFit={false}
|
|
26
26
|
allowFontScaling={true}
|
|
27
27
|
collapsable={false}
|
|
28
|
-
ellipsizeMode="middle"
|
|
29
28
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
30
29
|
selectable={true}
|
|
31
30
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -105,7 +104,6 @@ exports[`StatusLabel alignment when alignment prop set to default ("start") shou
|
|
|
105
104
|
adjustsFontSizeToFit={false}
|
|
106
105
|
allowFontScaling={true}
|
|
107
106
|
collapsable={false}
|
|
108
|
-
ellipsizeMode="middle"
|
|
109
107
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
110
108
|
selectable={true}
|
|
111
109
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -185,7 +183,6 @@ exports[`StatusLabel status when status prop set to "critical" should match snap
|
|
|
185
183
|
adjustsFontSizeToFit={false}
|
|
186
184
|
allowFontScaling={true}
|
|
187
185
|
collapsable={false}
|
|
188
|
-
ellipsizeMode="middle"
|
|
189
186
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
190
187
|
selectable={true}
|
|
191
188
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -265,7 +262,6 @@ exports[`StatusLabel status when status prop set to "inactive" should match snap
|
|
|
265
262
|
adjustsFontSizeToFit={false}
|
|
266
263
|
allowFontScaling={true}
|
|
267
264
|
collapsable={false}
|
|
268
|
-
ellipsizeMode="middle"
|
|
269
265
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
270
266
|
selectable={true}
|
|
271
267
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -345,7 +341,6 @@ exports[`StatusLabel status when status prop set to "informative" should match s
|
|
|
345
341
|
adjustsFontSizeToFit={false}
|
|
346
342
|
allowFontScaling={true}
|
|
347
343
|
collapsable={false}
|
|
348
|
-
ellipsizeMode="middle"
|
|
349
344
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
350
345
|
selectable={true}
|
|
351
346
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -425,7 +420,6 @@ exports[`StatusLabel status when status prop set to "warning" should match snaps
|
|
|
425
420
|
adjustsFontSizeToFit={false}
|
|
426
421
|
allowFontScaling={true}
|
|
427
422
|
collapsable={false}
|
|
428
|
-
ellipsizeMode="middle"
|
|
429
423
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
430
424
|
selectable={true}
|
|
431
425
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -505,7 +499,6 @@ exports[`StatusLabel status when status prop set to default ("success") should m
|
|
|
505
499
|
adjustsFontSizeToFit={false}
|
|
506
500
|
allowFontScaling={true}
|
|
507
501
|
collapsable={false}
|
|
508
|
-
ellipsizeMode="middle"
|
|
509
502
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
510
503
|
selectable={true}
|
|
511
504
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -6,7 +6,6 @@ exports[`renders text supporting with no additional props 1`] = `
|
|
|
6
6
|
adjustsFontSizeToFit={false}
|
|
7
7
|
allowFontScaling={true}
|
|
8
8
|
collapsable={false}
|
|
9
|
-
ellipsizeMode="middle"
|
|
10
9
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
11
10
|
selectable={true}
|
|
12
11
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -41,7 +40,6 @@ exports[`renders text supporting with variation success 1`] = `
|
|
|
41
40
|
adjustsFontSizeToFit={false}
|
|
42
41
|
allowFontScaling={true}
|
|
43
42
|
collapsable={false}
|
|
44
|
-
ellipsizeMode="middle"
|
|
45
43
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
46
44
|
selectable={true}
|
|
47
45
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -76,7 +74,6 @@ exports[`renders text supporting with variation success reverseTheme true 1`] =
|
|
|
76
74
|
adjustsFontSizeToFit={false}
|
|
77
75
|
allowFontScaling={true}
|
|
78
76
|
collapsable={false}
|
|
79
|
-
ellipsizeMode="middle"
|
|
80
77
|
maxFontSizeMultiplier={1.1428571428571428}
|
|
81
78
|
selectable={true}
|
|
82
79
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -111,7 +108,6 @@ exports[`renders text that is not scaled down with adjustsFontSize false 1`] = `
|
|
|
111
108
|
adjustsFontSizeToFit={false}
|
|
112
109
|
allowFontScaling={true}
|
|
113
110
|
collapsable={false}
|
|
114
|
-
ellipsizeMode="middle"
|
|
115
111
|
maxFontSizeMultiplier={3.125}
|
|
116
112
|
numberOfLines={4}
|
|
117
113
|
selectable={true}
|
|
@@ -147,7 +143,6 @@ exports[`renders text that is scaled down with adjustsFontSize true 1`] = `
|
|
|
147
143
|
adjustsFontSizeToFit={true}
|
|
148
144
|
allowFontScaling={true}
|
|
149
145
|
collapsable={false}
|
|
150
|
-
ellipsizeMode="middle"
|
|
151
146
|
maxFontSizeMultiplier={3.125}
|
|
152
147
|
numberOfLines={4}
|
|
153
148
|
selectable={true}
|
|
@@ -183,7 +178,6 @@ exports[`renders text with base variation 1`] = `
|
|
|
183
178
|
adjustsFontSizeToFit={false}
|
|
184
179
|
allowFontScaling={true}
|
|
185
180
|
collapsable={false}
|
|
186
|
-
ellipsizeMode="middle"
|
|
187
181
|
maxFontSizeMultiplier={3.125}
|
|
188
182
|
selectable={true}
|
|
189
183
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -218,7 +212,6 @@ exports[`renders text with center alignment 1`] = `
|
|
|
218
212
|
adjustsFontSizeToFit={false}
|
|
219
213
|
allowFontScaling={true}
|
|
220
214
|
collapsable={false}
|
|
221
|
-
ellipsizeMode="middle"
|
|
222
215
|
maxFontSizeMultiplier={3.125}
|
|
223
216
|
selectable={true}
|
|
224
217
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -253,7 +246,6 @@ exports[`renders text with error variation 1`] = `
|
|
|
253
246
|
adjustsFontSizeToFit={false}
|
|
254
247
|
allowFontScaling={true}
|
|
255
248
|
collapsable={false}
|
|
256
|
-
ellipsizeMode="middle"
|
|
257
249
|
maxFontSizeMultiplier={3.125}
|
|
258
250
|
selectable={true}
|
|
259
251
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -288,7 +280,6 @@ exports[`renders text with error variation reverseTheme true 1`] = `
|
|
|
288
280
|
adjustsFontSizeToFit={false}
|
|
289
281
|
allowFontScaling={true}
|
|
290
282
|
collapsable={false}
|
|
291
|
-
ellipsizeMode="middle"
|
|
292
283
|
maxFontSizeMultiplier={3.125}
|
|
293
284
|
selectable={true}
|
|
294
285
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -323,7 +314,6 @@ exports[`renders text with info variation 1`] = `
|
|
|
323
314
|
adjustsFontSizeToFit={false}
|
|
324
315
|
allowFontScaling={true}
|
|
325
316
|
collapsable={false}
|
|
326
|
-
ellipsizeMode="middle"
|
|
327
317
|
maxFontSizeMultiplier={3.125}
|
|
328
318
|
selectable={true}
|
|
329
319
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -358,7 +348,6 @@ exports[`renders text with left alignment 1`] = `
|
|
|
358
348
|
adjustsFontSizeToFit={false}
|
|
359
349
|
allowFontScaling={true}
|
|
360
350
|
collapsable={false}
|
|
361
|
-
ellipsizeMode="middle"
|
|
362
351
|
maxFontSizeMultiplier={3.125}
|
|
363
352
|
selectable={true}
|
|
364
353
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -393,7 +382,6 @@ exports[`renders text with no additional props 1`] = `
|
|
|
393
382
|
adjustsFontSizeToFit={false}
|
|
394
383
|
allowFontScaling={true}
|
|
395
384
|
collapsable={false}
|
|
396
|
-
ellipsizeMode="middle"
|
|
397
385
|
maxFontSizeMultiplier={3.125}
|
|
398
386
|
selectable={true}
|
|
399
387
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -428,7 +416,6 @@ exports[`renders text with right alignment 1`] = `
|
|
|
428
416
|
adjustsFontSizeToFit={false}
|
|
429
417
|
allowFontScaling={true}
|
|
430
418
|
collapsable={false}
|
|
431
|
-
ellipsizeMode="middle"
|
|
432
419
|
maxFontSizeMultiplier={3.125}
|
|
433
420
|
selectable={true}
|
|
434
421
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -463,7 +450,6 @@ exports[`renders text with subdued variation 1`] = `
|
|
|
463
450
|
adjustsFontSizeToFit={false}
|
|
464
451
|
allowFontScaling={true}
|
|
465
452
|
collapsable={false}
|
|
466
|
-
ellipsizeMode="middle"
|
|
467
453
|
maxFontSizeMultiplier={3.125}
|
|
468
454
|
selectable={true}
|
|
469
455
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -498,7 +484,6 @@ exports[`renders text with success variation 1`] = `
|
|
|
498
484
|
adjustsFontSizeToFit={false}
|
|
499
485
|
allowFontScaling={true}
|
|
500
486
|
collapsable={false}
|
|
501
|
-
ellipsizeMode="middle"
|
|
502
487
|
maxFontSizeMultiplier={3.125}
|
|
503
488
|
selectable={true}
|
|
504
489
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -533,7 +518,6 @@ exports[`renders text with success variation reverseTheme true 1`] = `
|
|
|
533
518
|
adjustsFontSizeToFit={false}
|
|
534
519
|
allowFontScaling={true}
|
|
535
520
|
collapsable={false}
|
|
536
|
-
ellipsizeMode="middle"
|
|
537
521
|
maxFontSizeMultiplier={3.125}
|
|
538
522
|
selectable={true}
|
|
539
523
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -568,7 +552,6 @@ exports[`renders text with underline styling 1`] = `
|
|
|
568
552
|
adjustsFontSizeToFit={false}
|
|
569
553
|
allowFontScaling={true}
|
|
570
554
|
collapsable={false}
|
|
571
|
-
ellipsizeMode="middle"
|
|
572
555
|
maxFontSizeMultiplier={3.125}
|
|
573
556
|
selectable={true}
|
|
574
557
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -610,7 +593,6 @@ exports[`renders text with warn variation 1`] = `
|
|
|
610
593
|
adjustsFontSizeToFit={false}
|
|
611
594
|
allowFontScaling={true}
|
|
612
595
|
collapsable={false}
|
|
613
|
-
ellipsizeMode="middle"
|
|
614
596
|
maxFontSizeMultiplier={3.125}
|
|
615
597
|
selectable={true}
|
|
616
598
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -645,7 +627,6 @@ exports[`renders with italic styling 1`] = `
|
|
|
645
627
|
adjustsFontSizeToFit={false}
|
|
646
628
|
allowFontScaling={true}
|
|
647
629
|
collapsable={false}
|
|
648
|
-
ellipsizeMode="middle"
|
|
649
630
|
maxFontSizeMultiplier={3.125}
|
|
650
631
|
selectable={true}
|
|
651
632
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -683,7 +664,6 @@ exports[`renders with strikethrough styling 1`] = `
|
|
|
683
664
|
adjustsFontSizeToFit={false}
|
|
684
665
|
allowFontScaling={true}
|
|
685
666
|
collapsable={false}
|
|
686
|
-
ellipsizeMode="middle"
|
|
687
667
|
maxFontSizeMultiplier={3.125}
|
|
688
668
|
selectable={true}
|
|
689
669
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -41,7 +41,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
|
|
|
41
41
|
adjustsFontSizeToFit={false}
|
|
42
42
|
allowFontScaling={true}
|
|
43
43
|
collapsable={false}
|
|
44
|
-
ellipsizeMode="middle"
|
|
45
44
|
maxFontSizeMultiplier={3.125}
|
|
46
45
|
selectable={true}
|
|
47
46
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -81,7 +80,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
|
|
|
81
80
|
adjustsFontSizeToFit={false}
|
|
82
81
|
allowFontScaling={true}
|
|
83
82
|
collapsable={false}
|
|
84
|
-
ellipsizeMode="middle"
|
|
85
83
|
maxFontSizeMultiplier={3.125}
|
|
86
84
|
selectable={true}
|
|
87
85
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -135,7 +133,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
|
|
|
135
133
|
adjustsFontSizeToFit={false}
|
|
136
134
|
allowFontScaling={true}
|
|
137
135
|
collapsable={false}
|
|
138
|
-
ellipsizeMode="middle"
|
|
139
136
|
maxFontSizeMultiplier={3.125}
|
|
140
137
|
selectable={true}
|
|
141
138
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -175,7 +172,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
|
|
|
175
172
|
adjustsFontSizeToFit={false}
|
|
176
173
|
allowFontScaling={true}
|
|
177
174
|
collapsable={false}
|
|
178
|
-
ellipsizeMode="middle"
|
|
179
175
|
maxFontSizeMultiplier={3.125}
|
|
180
176
|
selectable={true}
|
|
181
177
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -14,8 +14,7 @@ import { useTypographyStyles } from "./Typography.style";
|
|
|
14
14
|
import { capitalize } from "../utils/intl";
|
|
15
15
|
import { useAtlantisTheme } from "../AtlantisThemeContext";
|
|
16
16
|
|
|
17
|
-
export interface TypographyProps<T extends FontFamily>
|
|
18
|
-
extends Pick<TextProps, "selectable"> {
|
|
17
|
+
export interface TypographyProps<T extends FontFamily> {
|
|
19
18
|
/**
|
|
20
19
|
* Text capitalization
|
|
21
20
|
*/
|
|
@@ -31,6 +30,13 @@ export interface TypographyProps<T extends FontFamily>
|
|
|
31
30
|
*/
|
|
32
31
|
readonly align?: TextAlign;
|
|
33
32
|
|
|
33
|
+
/**
|
|
34
|
+
* Lets the user select text, to use the native copy and paste functionality.
|
|
35
|
+
* WARNING: if true, this prevents ellipsis from being shown on Android.
|
|
36
|
+
* @default true
|
|
37
|
+
*/
|
|
38
|
+
readonly selectable?: boolean;
|
|
39
|
+
|
|
34
40
|
/**
|
|
35
41
|
* Font size
|
|
36
42
|
*/
|
|
@@ -44,6 +50,7 @@ export interface TypographyProps<T extends FontFamily>
|
|
|
44
50
|
/**
|
|
45
51
|
* The maximum amount of lines the text can occupy before being truncated with "...".
|
|
46
52
|
* Uses predefined string values that correspond to a doubling scale for the amount of lines.
|
|
53
|
+
* WARNING: if `selectable` is true, Android will not show an ellipsis.
|
|
47
54
|
*/
|
|
48
55
|
readonly maxLines?: TruncateLength;
|
|
49
56
|
|
|
@@ -121,6 +128,12 @@ export interface TypographyProps<T extends FontFamily>
|
|
|
121
128
|
|
|
122
129
|
readonly UNSAFE_style?: TypographyUnsafeStyle;
|
|
123
130
|
|
|
131
|
+
/**
|
|
132
|
+
* Callback behaves differently on iOS and Android.
|
|
133
|
+
* On iOS, it is called when the text is laid out.
|
|
134
|
+
* On Android, it is called before the text is laid out.
|
|
135
|
+
* @see https://reactnative.dev/docs/text#ontextlayout
|
|
136
|
+
*/
|
|
124
137
|
readonly onTextLayout?: OnTextLayoutEvent;
|
|
125
138
|
}
|
|
126
139
|
|
|
@@ -212,7 +225,6 @@ function InternalTypography<T extends FontFamily = "base">({
|
|
|
212
225
|
adjustsFontSizeToFit,
|
|
213
226
|
style,
|
|
214
227
|
numberOfLines: numberOfLinesForNativeText,
|
|
215
|
-
ellipsizeMode: "middle",
|
|
216
228
|
}}
|
|
217
229
|
{...accessibilityProps}
|
|
218
230
|
maxFontSizeMultiplier={getScaleMultiplier(
|
|
@@ -6,7 +6,6 @@ exports[`renders text respecting the text direction 1`] = `
|
|
|
6
6
|
adjustsFontSizeToFit={false}
|
|
7
7
|
allowFontScaling={true}
|
|
8
8
|
collapsable={false}
|
|
9
|
-
ellipsizeMode="middle"
|
|
10
9
|
selectable={true}
|
|
11
10
|
selectionColor="hsl(86, 100%, 46%)"
|
|
12
11
|
style={
|
|
@@ -40,7 +39,6 @@ exports[`renders text using the maxLines is also passed 1`] = `
|
|
|
40
39
|
adjustsFontSizeToFit={false}
|
|
41
40
|
allowFontScaling={true}
|
|
42
41
|
collapsable={false}
|
|
43
|
-
ellipsizeMode="middle"
|
|
44
42
|
numberOfLines={2}
|
|
45
43
|
selectable={true}
|
|
46
44
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -75,7 +73,6 @@ exports[`renders text with adjustsFontSizeToFit set to true 1`] = `
|
|
|
75
73
|
adjustsFontSizeToFit={true}
|
|
76
74
|
allowFontScaling={true}
|
|
77
75
|
collapsable={false}
|
|
78
|
-
ellipsizeMode="middle"
|
|
79
76
|
numberOfLines={1}
|
|
80
77
|
selectable={true}
|
|
81
78
|
selectionColor="hsl(86, 100%, 46%)"
|
|
@@ -110,7 +107,6 @@ exports[`renders text with black style and display as fontFamily 1`] = `
|
|
|
110
107
|
adjustsFontSizeToFit={false}
|
|
111
108
|
allowFontScaling={true}
|
|
112
109
|
collapsable={false}
|
|
113
|
-
ellipsizeMode="middle"
|
|
114
110
|
selectable={true}
|
|
115
111
|
selectionColor="hsl(86, 100%, 46%)"
|
|
116
112
|
style={
|
|
@@ -144,7 +140,6 @@ exports[`renders text with bold style 1`] = `
|
|
|
144
140
|
adjustsFontSizeToFit={false}
|
|
145
141
|
allowFontScaling={true}
|
|
146
142
|
collapsable={false}
|
|
147
|
-
ellipsizeMode="middle"
|
|
148
143
|
selectable={true}
|
|
149
144
|
selectionColor="hsl(86, 100%, 46%)"
|
|
150
145
|
style={
|
|
@@ -178,7 +173,6 @@ exports[`renders text with bold style and display as fontFamily 1`] = `
|
|
|
178
173
|
adjustsFontSizeToFit={false}
|
|
179
174
|
allowFontScaling={true}
|
|
180
175
|
collapsable={false}
|
|
181
|
-
ellipsizeMode="middle"
|
|
182
176
|
selectable={true}
|
|
183
177
|
selectionColor="hsl(86, 100%, 46%)"
|
|
184
178
|
style={
|
|
@@ -212,7 +206,6 @@ exports[`renders text with bold weight and italic style 1`] = `
|
|
|
212
206
|
adjustsFontSizeToFit={false}
|
|
213
207
|
allowFontScaling={true}
|
|
214
208
|
collapsable={false}
|
|
215
|
-
ellipsizeMode="middle"
|
|
216
209
|
selectable={true}
|
|
217
210
|
selectionColor="hsl(86, 100%, 46%)"
|
|
218
211
|
style={
|
|
@@ -249,7 +242,6 @@ exports[`renders text with center align 1`] = `
|
|
|
249
242
|
adjustsFontSizeToFit={false}
|
|
250
243
|
allowFontScaling={true}
|
|
251
244
|
collapsable={false}
|
|
252
|
-
ellipsizeMode="middle"
|
|
253
245
|
selectable={true}
|
|
254
246
|
selectionColor="hsl(86, 100%, 46%)"
|
|
255
247
|
style={
|
|
@@ -283,7 +275,6 @@ exports[`renders text with default color 1`] = `
|
|
|
283
275
|
adjustsFontSizeToFit={false}
|
|
284
276
|
allowFontScaling={true}
|
|
285
277
|
collapsable={false}
|
|
286
|
-
ellipsizeMode="middle"
|
|
287
278
|
selectable={true}
|
|
288
279
|
selectionColor="hsl(86, 100%, 46%)"
|
|
289
280
|
style={
|
|
@@ -317,7 +308,6 @@ exports[`renders text with default size 1`] = `
|
|
|
317
308
|
adjustsFontSizeToFit={false}
|
|
318
309
|
allowFontScaling={true}
|
|
319
310
|
collapsable={false}
|
|
320
|
-
ellipsizeMode="middle"
|
|
321
311
|
selectable={true}
|
|
322
312
|
selectionColor="hsl(86, 100%, 46%)"
|
|
323
313
|
style={
|
|
@@ -351,7 +341,6 @@ exports[`renders text with extraBold weight and display as fontFamily 1`] = `
|
|
|
351
341
|
adjustsFontSizeToFit={false}
|
|
352
342
|
allowFontScaling={true}
|
|
353
343
|
collapsable={false}
|
|
354
|
-
ellipsizeMode="middle"
|
|
355
344
|
selectable={true}
|
|
356
345
|
selectionColor="hsl(86, 100%, 46%)"
|
|
357
346
|
style={
|
|
@@ -385,7 +374,6 @@ exports[`renders text with green color 1`] = `
|
|
|
385
374
|
adjustsFontSizeToFit={false}
|
|
386
375
|
allowFontScaling={true}
|
|
387
376
|
collapsable={false}
|
|
388
|
-
ellipsizeMode="middle"
|
|
389
377
|
selectable={true}
|
|
390
378
|
selectionColor="hsl(86, 100%, 46%)"
|
|
391
379
|
style={
|
|
@@ -419,7 +407,6 @@ exports[`renders text with italic style 1`] = `
|
|
|
419
407
|
adjustsFontSizeToFit={false}
|
|
420
408
|
allowFontScaling={true}
|
|
421
409
|
collapsable={false}
|
|
422
|
-
ellipsizeMode="middle"
|
|
423
410
|
selectable={true}
|
|
424
411
|
selectionColor="hsl(86, 100%, 46%)"
|
|
425
412
|
style={
|
|
@@ -456,7 +443,6 @@ exports[`renders text with large size 1`] = `
|
|
|
456
443
|
adjustsFontSizeToFit={false}
|
|
457
444
|
allowFontScaling={true}
|
|
458
445
|
collapsable={false}
|
|
459
|
-
ellipsizeMode="middle"
|
|
460
446
|
selectable={true}
|
|
461
447
|
selectionColor="hsl(86, 100%, 46%)"
|
|
462
448
|
style={
|
|
@@ -490,7 +476,6 @@ exports[`renders text with letter spacing 1`] = `
|
|
|
490
476
|
adjustsFontSizeToFit={false}
|
|
491
477
|
allowFontScaling={true}
|
|
492
478
|
collapsable={false}
|
|
493
|
-
ellipsizeMode="middle"
|
|
494
479
|
selectable={true}
|
|
495
480
|
selectionColor="hsl(86, 100%, 46%)"
|
|
496
481
|
style={
|
|
@@ -524,7 +509,6 @@ exports[`renders text with line height override 1`] = `
|
|
|
524
509
|
adjustsFontSizeToFit={false}
|
|
525
510
|
allowFontScaling={true}
|
|
526
511
|
collapsable={false}
|
|
527
|
-
ellipsizeMode="middle"
|
|
528
512
|
selectable={true}
|
|
529
513
|
selectionColor="hsl(86, 100%, 46%)"
|
|
530
514
|
style={
|
|
@@ -558,7 +542,6 @@ exports[`renders text with lowercase transform 1`] = `
|
|
|
558
542
|
adjustsFontSizeToFit={false}
|
|
559
543
|
allowFontScaling={true}
|
|
560
544
|
collapsable={false}
|
|
561
|
-
ellipsizeMode="middle"
|
|
562
545
|
selectable={true}
|
|
563
546
|
selectionColor="hsl(86, 100%, 46%)"
|
|
564
547
|
style={
|
|
@@ -592,7 +575,6 @@ exports[`renders text with multiple properties 1`] = `
|
|
|
592
575
|
adjustsFontSizeToFit={false}
|
|
593
576
|
allowFontScaling={true}
|
|
594
577
|
collapsable={false}
|
|
595
|
-
ellipsizeMode="middle"
|
|
596
578
|
selectable={true}
|
|
597
579
|
selectionColor="hsl(86, 100%, 46%)"
|
|
598
580
|
style={
|
|
@@ -626,7 +608,6 @@ exports[`renders text with no additional props 1`] = `
|
|
|
626
608
|
adjustsFontSizeToFit={false}
|
|
627
609
|
allowFontScaling={true}
|
|
628
610
|
collapsable={false}
|
|
629
|
-
ellipsizeMode="middle"
|
|
630
611
|
selectable={true}
|
|
631
612
|
selectionColor="hsl(86, 100%, 46%)"
|
|
632
613
|
style={
|
|
@@ -660,7 +641,6 @@ exports[`renders text with regular style 1`] = `
|
|
|
660
641
|
adjustsFontSizeToFit={false}
|
|
661
642
|
allowFontScaling={true}
|
|
662
643
|
collapsable={false}
|
|
663
|
-
ellipsizeMode="middle"
|
|
664
644
|
selectable={true}
|
|
665
645
|
selectionColor="hsl(86, 100%, 46%)"
|
|
666
646
|
style={
|
|
@@ -694,7 +674,6 @@ exports[`renders text with reverseTheme false with reversible color 1`] = `
|
|
|
694
674
|
adjustsFontSizeToFit={false}
|
|
695
675
|
allowFontScaling={true}
|
|
696
676
|
collapsable={false}
|
|
697
|
-
ellipsizeMode="middle"
|
|
698
677
|
selectable={true}
|
|
699
678
|
selectionColor="hsl(86, 100%, 46%)"
|
|
700
679
|
style={
|
|
@@ -728,7 +707,6 @@ exports[`renders text with reverseTheme true with reversible color 1`] = `
|
|
|
728
707
|
adjustsFontSizeToFit={false}
|
|
729
708
|
allowFontScaling={true}
|
|
730
709
|
collapsable={false}
|
|
731
|
-
ellipsizeMode="middle"
|
|
732
710
|
selectable={true}
|
|
733
711
|
selectionColor="hsl(86, 100%, 46%)"
|
|
734
712
|
style={
|
|
@@ -762,7 +740,6 @@ exports[`renders text with semantic color 1`] = `
|
|
|
762
740
|
adjustsFontSizeToFit={false}
|
|
763
741
|
allowFontScaling={true}
|
|
764
742
|
collapsable={false}
|
|
765
|
-
ellipsizeMode="middle"
|
|
766
743
|
selectable={true}
|
|
767
744
|
selectionColor="hsl(86, 100%, 46%)"
|
|
768
745
|
style={
|
|
@@ -796,7 +773,6 @@ exports[`renders text with small size 1`] = `
|
|
|
796
773
|
adjustsFontSizeToFit={false}
|
|
797
774
|
allowFontScaling={true}
|
|
798
775
|
collapsable={false}
|
|
799
|
-
ellipsizeMode="middle"
|
|
800
776
|
selectable={true}
|
|
801
777
|
selectionColor="hsl(86, 100%, 46%)"
|
|
802
778
|
style={
|
|
@@ -830,7 +806,6 @@ exports[`renders text with strikethough styling 1`] = `
|
|
|
830
806
|
adjustsFontSizeToFit={false}
|
|
831
807
|
allowFontScaling={true}
|
|
832
808
|
collapsable={false}
|
|
833
|
-
ellipsizeMode="middle"
|
|
834
809
|
selectable={true}
|
|
835
810
|
selectionColor="hsl(86, 100%, 46%)"
|
|
836
811
|
style={
|
|
@@ -867,7 +842,6 @@ exports[`renders text with uppercase transform 1`] = `
|
|
|
867
842
|
adjustsFontSizeToFit={false}
|
|
868
843
|
allowFontScaling={true}
|
|
869
844
|
collapsable={false}
|
|
870
|
-
ellipsizeMode="middle"
|
|
871
845
|
selectable={true}
|
|
872
846
|
selectionColor="hsl(86, 100%, 46%)"
|
|
873
847
|
style={
|
|
@@ -901,7 +875,6 @@ exports[`renders text with white color 1`] = `
|
|
|
901
875
|
adjustsFontSizeToFit={false}
|
|
902
876
|
allowFontScaling={true}
|
|
903
877
|
collapsable={false}
|
|
904
|
-
ellipsizeMode="middle"
|
|
905
878
|
selectable={true}
|
|
906
879
|
selectionColor="hsl(86, 100%, 46%)"
|
|
907
880
|
style={
|
|
@@ -935,7 +908,6 @@ exports[`underline renders text with dashed underline 1`] = `
|
|
|
935
908
|
adjustsFontSizeToFit={false}
|
|
936
909
|
allowFontScaling={true}
|
|
937
910
|
collapsable={false}
|
|
938
|
-
ellipsizeMode="middle"
|
|
939
911
|
selectable={true}
|
|
940
912
|
selectionColor="hsl(86, 100%, 46%)"
|
|
941
913
|
style={
|
|
@@ -976,7 +948,6 @@ exports[`underline renders text with dotted underline 1`] = `
|
|
|
976
948
|
adjustsFontSizeToFit={false}
|
|
977
949
|
allowFontScaling={true}
|
|
978
950
|
collapsable={false}
|
|
979
|
-
ellipsizeMode="middle"
|
|
980
951
|
selectable={true}
|
|
981
952
|
selectionColor="hsl(86, 100%, 46%)"
|
|
982
953
|
style={
|
|
@@ -1017,7 +988,6 @@ exports[`underline renders text with double underline 1`] = `
|
|
|
1017
988
|
adjustsFontSizeToFit={false}
|
|
1018
989
|
allowFontScaling={true}
|
|
1019
990
|
collapsable={false}
|
|
1020
|
-
ellipsizeMode="middle"
|
|
1021
991
|
selectable={true}
|
|
1022
992
|
selectionColor="hsl(86, 100%, 46%)"
|
|
1023
993
|
style={
|
|
@@ -1058,7 +1028,6 @@ exports[`underline renders text with solid underline 1`] = `
|
|
|
1058
1028
|
adjustsFontSizeToFit={false}
|
|
1059
1029
|
allowFontScaling={true}
|
|
1060
1030
|
collapsable={false}
|
|
1061
|
-
ellipsizeMode="middle"
|
|
1062
1031
|
selectable={true}
|
|
1063
1032
|
selectionColor="hsl(86, 100%, 46%)"
|
|
1064
1033
|
style={
|