-
Notifications
You must be signed in to change notification settings - Fork 2
/
text.ts
115 lines (98 loc) · 3.08 KB
/
text.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
import type { Color } from './colors.ts';
/**
* Deprecated. Use `TextSpan` instead.
*/
export type Text = string | TextSpan | TextSpan[];
/**
* A span of text with optional text properties. Nested spans can be
* used to apply different text properties to different parts of a
* text.
*/
export type TextSpan = { text: string | TextSpan | (string | TextSpan)[] } & TextProps;
/**
* Creates a span of text with the given text and properties.
*
* @param text The text to display in this span.
* @param props Optional properties for the span.
*/
export function span(text: string | TextSpan | (string | TextSpan)[], props?: TextProps): TextSpan {
const unwrappedText = Array.isArray(text) && text.length === 1 ? text[0] : text;
if (typeof unwrappedText === 'string' || Array.isArray(unwrappedText)) {
return { ...props, text: unwrappedText };
}
return { ...props, ...unwrappedText };
}
/**
* The font weight is an integer between 0 and 1000. The keywords
* `normal` (400) and `bold` (700) are also supported.
*/
export type FontWeight = number | 'normal' | 'bold';
/**
* The font style selects a normal, italic, or oblique font face from
* the font family. Italic fonts are usually cursive in nature and
* oblique fonts are usually sloped versions of the regular font.
*/
export type FontStyle = 'normal' | 'italic' | 'oblique';
/**
* @deprecated Use `TextProps` instead.
*/
export type TextAttrs = TextProps;
/**
* Text properties that can be applied to a text.
*/
export type TextProps = {
/**
* The name of the font to use. If not specified, the first font
* registered in the document definition that matches the other font
* properties will be used.
*/
fontFamily?: string;
/**
* The font style to use.
*/
fontStyle?: FontStyle;
/**
* The font weight to use.
*/
fontWeight?: FontWeight;
/**
* The font size in pt.
*/
fontSize?: number;
/**
* The line height as a multiple of the font size. Defaults to `1.2`.
*/
lineHeight?: number;
/**
* Whether to use a bold variant of the selected font.
* @deprecated Use `fontWeight: 'bold'` instead.
*/
bold?: boolean;
/**
* Whether to use an italic variant of the selected font.
* @deprecated Use `fontStyle: 'italic'` instead.
*/
italic?: boolean;
/**
* The text color.
*/
color?: Color;
/**
* A link target. When this property is present, the corresponding text will be rendered as a
* link to the given target. The target can either be a URL or a reference to an anchor in the
* document. An internal reference starts with a hash sign (`#`), followed by the `id` of an
* element in the document.
*/
link?: string;
/**
* A vertical offset in pt that shifts the text baseline up (if the value is positive) or down
* (if negative). Shifting the baseline can be useful for superscripts and subscripts.
* This setting does not affect the line height.
*/
rise?: number;
/**
* The character spacing in pt. Positive values increase the space between characters, negative
* values decrease it.
*/
letterSpacing?: number;
};