react-native-highlight-text-view 0.1.5 → 0.1.6
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/ios/HighlightTextView.h +1 -0
- package/ios/HighlightTextView.mm +48 -1
- package/lib/module/HighlightTextViewNativeComponent.ts +2 -0
- package/lib/typescript/src/HighlightTextViewNativeComponent.d.ts +2 -0
- package/lib/typescript/src/HighlightTextViewNativeComponent.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/HighlightTextViewNativeComponent.ts +2 -0
package/ios/HighlightTextView.h
CHANGED
|
@@ -14,6 +14,7 @@ NS_ASSUME_NONNULL_BEGIN
|
|
|
14
14
|
@property (nonatomic, assign) CGFloat paddingTop;
|
|
15
15
|
@property (nonatomic, assign) CGFloat paddingBottom;
|
|
16
16
|
@property (nonatomic, assign) CGFloat cornerRadius;
|
|
17
|
+
@property (nonatomic, assign) CGFloat highlightBorderRadius;
|
|
17
18
|
@end
|
|
18
19
|
|
|
19
20
|
@interface HighlightTextView : RCTViewComponentView
|
package/ios/HighlightTextView.mm
CHANGED
|
@@ -11,6 +11,8 @@ using namespace facebook::react;
|
|
|
11
11
|
|
|
12
12
|
@implementation RoundedBackgroundLayoutManager
|
|
13
13
|
|
|
14
|
+
@synthesize backgroundColor, padding, paddingLeft, paddingRight, paddingTop, paddingBottom, cornerRadius, highlightBorderRadius;
|
|
15
|
+
|
|
14
16
|
- (void)drawBackgroundForGlyphRange:(NSRange)glyphsToShow atPoint:(CGPoint)origin {
|
|
15
17
|
NSTextStorage *textStorage = self.textStorage;
|
|
16
18
|
NSTextContainer *textContainer = self.textContainers.firstObject;
|
|
@@ -45,7 +47,9 @@ using namespace facebook::react;
|
|
|
45
47
|
boundingRect.size.width += self.paddingLeft + self.paddingRight;
|
|
46
48
|
boundingRect.size.height += self.paddingTop + self.paddingBottom;
|
|
47
49
|
|
|
48
|
-
|
|
50
|
+
// Use highlightBorderRadius if specified, otherwise use cornerRadius
|
|
51
|
+
CGFloat radius = self.highlightBorderRadius > 0 ? self.highlightBorderRadius : self.cornerRadius;
|
|
52
|
+
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:boundingRect cornerRadius:radius];
|
|
49
53
|
[self.backgroundColor setFill];
|
|
50
54
|
[path fill];
|
|
51
55
|
}
|
|
@@ -73,6 +77,8 @@ using namespace facebook::react;
|
|
|
73
77
|
CGFloat _paddingTop;
|
|
74
78
|
CGFloat _paddingBottom;
|
|
75
79
|
CGFloat _cornerRadius;
|
|
80
|
+
CGFloat _highlightBorderRadius;
|
|
81
|
+
CGFloat _lineHeight;
|
|
76
82
|
BOOL _isUpdatingText;
|
|
77
83
|
NSString * _currentVerticalAlignment;
|
|
78
84
|
NSTextAlignment _currentHorizontalAlignment;
|
|
@@ -96,6 +102,8 @@ using namespace facebook::react;
|
|
|
96
102
|
_paddingTop = 4.0;
|
|
97
103
|
_paddingBottom = 4.0;
|
|
98
104
|
_cornerRadius = 4.0;
|
|
105
|
+
_highlightBorderRadius = 0.0;
|
|
106
|
+
_lineHeight = 0.0; // 0 means use default line height
|
|
99
107
|
_currentVerticalAlignment = nil;
|
|
100
108
|
_currentHorizontalAlignment = NSTextAlignmentCenter;
|
|
101
109
|
|
|
@@ -109,6 +117,7 @@ using namespace facebook::react;
|
|
|
109
117
|
_layoutManager.paddingTop = _paddingTop;
|
|
110
118
|
_layoutManager.paddingBottom = _paddingBottom;
|
|
111
119
|
_layoutManager.cornerRadius = _cornerRadius;
|
|
120
|
+
_layoutManager.highlightBorderRadius = _highlightBorderRadius;
|
|
112
121
|
|
|
113
122
|
[textStorage addLayoutManager:_layoutManager];
|
|
114
123
|
|
|
@@ -251,6 +260,26 @@ using namespace facebook::react;
|
|
|
251
260
|
if (fontSize > 0) {
|
|
252
261
|
NSString *fontFamily = _textView.font.familyName;
|
|
253
262
|
_textView.font = [UIFont fontWithName:fontFamily size:fontSize] ?: [UIFont systemFontOfSize:fontSize];
|
|
263
|
+
[self applyCharacterBackgrounds]; // Reapply to update font
|
|
264
|
+
}
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
if (oldViewProps.lineHeight != newViewProps.lineHeight) {
|
|
268
|
+
NSString *lineHeightStr = [[NSString alloc] initWithUTF8String: newViewProps.lineHeight.c_str()];
|
|
269
|
+
CGFloat lineHeight = [lineHeightStr floatValue];
|
|
270
|
+
if (lineHeight >= 0) {
|
|
271
|
+
_lineHeight = lineHeight;
|
|
272
|
+
[self applyCharacterBackgrounds]; // Reapply to update line height
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
if (oldViewProps.highlightBorderRadius != newViewProps.highlightBorderRadius) {
|
|
277
|
+
NSString *radiusStr = [[NSString alloc] initWithUTF8String: newViewProps.highlightBorderRadius.c_str()];
|
|
278
|
+
CGFloat radius = [radiusStr floatValue];
|
|
279
|
+
if (radius >= 0) {
|
|
280
|
+
_highlightBorderRadius = radius;
|
|
281
|
+
_layoutManager.highlightBorderRadius = _highlightBorderRadius;
|
|
282
|
+
[self applyCharacterBackgrounds]; // Reapply to update highlight border radius
|
|
254
283
|
}
|
|
255
284
|
}
|
|
256
285
|
|
|
@@ -388,6 +417,24 @@ Class<RCTComponentViewProtocol> HighlightTextViewCls(void)
|
|
|
388
417
|
|
|
389
418
|
NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
|
|
390
419
|
paragraphStyle.alignment = _textView.textAlignment;
|
|
420
|
+
|
|
421
|
+
// Apply line height if specified
|
|
422
|
+
if (_lineHeight > 0) {
|
|
423
|
+
CGFloat fontSize = _textView.font.pointSize;
|
|
424
|
+
|
|
425
|
+
// If lineHeight is smaller than fontSize, use lineHeightMultiple for better centering
|
|
426
|
+
if (_lineHeight < fontSize) {
|
|
427
|
+
paragraphStyle.lineHeightMultiple = _lineHeight / fontSize;
|
|
428
|
+
paragraphStyle.minimumLineHeight = 0;
|
|
429
|
+
paragraphStyle.maximumLineHeight = 0;
|
|
430
|
+
} else {
|
|
431
|
+
// For larger line heights, use absolute values
|
|
432
|
+
paragraphStyle.minimumLineHeight = _lineHeight;
|
|
433
|
+
paragraphStyle.maximumLineHeight = _lineHeight;
|
|
434
|
+
paragraphStyle.lineHeightMultiple = 0;
|
|
435
|
+
}
|
|
436
|
+
}
|
|
437
|
+
|
|
391
438
|
[attributedString addAttribute:NSParagraphStyleAttributeName
|
|
392
439
|
value:paragraphStyle
|
|
393
440
|
range:NSMakeRange(0, text.length)];
|
|
@@ -46,6 +46,8 @@ export interface HighlightTextViewProps extends ViewProps {
|
|
|
46
46
|
verticalAlign?: string;
|
|
47
47
|
fontFamily?: string;
|
|
48
48
|
fontSize?: string;
|
|
49
|
+
lineHeight?: string;
|
|
50
|
+
highlightBorderRadius?: string;
|
|
49
51
|
padding?: string;
|
|
50
52
|
paddingLeft?: string;
|
|
51
53
|
paddingRight?: string;
|
|
@@ -28,6 +28,8 @@ export interface HighlightTextViewProps extends ViewProps {
|
|
|
28
28
|
verticalAlign?: string;
|
|
29
29
|
fontFamily?: string;
|
|
30
30
|
fontSize?: string;
|
|
31
|
+
lineHeight?: string;
|
|
32
|
+
highlightBorderRadius?: string;
|
|
31
33
|
padding?: string;
|
|
32
34
|
paddingLeft?: string;
|
|
33
35
|
paddingRight?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HighlightTextViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/HighlightTextViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AAEtF,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,aAAa,GACrB,MAAM,GACN,QAAQ,GACR,OAAO,GACP,SAAS,GACT,YAAY,GACZ,UAAU,GACV,KAAK,GACL,QAAQ,GACR,UAAU,GACV,YAAY,GACZ,WAAW,GACX,aAAa,GACb,eAAe,GACf,cAAc,CAAC;AAEnB,MAAM,WAAW,sBAAuB,SAAQ,SAAS;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;CACpD;;AAED,wBAEE"}
|
|
1
|
+
{"version":3,"file":"HighlightTextViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/HighlightTextViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AAEtF,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,aAAa,GACrB,MAAM,GACN,QAAQ,GACR,OAAO,GACP,SAAS,GACT,YAAY,GACZ,UAAU,GACV,KAAK,GACL,QAAQ,GACR,UAAU,GACV,YAAY,GACZ,WAAW,GACX,aAAa,GACb,eAAe,GACf,cAAc,CAAC;AAEnB,MAAM,WAAW,sBAAuB,SAAQ,SAAS;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;CACpD;;AAED,wBAEE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-highlight-text-view",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.6",
|
|
4
4
|
"description": "A native text input for React Native that supports inline text highlighting",
|
|
5
5
|
"main": "./lib/module/index.js",
|
|
6
6
|
"types": "./lib/typescript/src/index.d.ts",
|
|
@@ -46,6 +46,8 @@ export interface HighlightTextViewProps extends ViewProps {
|
|
|
46
46
|
verticalAlign?: string;
|
|
47
47
|
fontFamily?: string;
|
|
48
48
|
fontSize?: string;
|
|
49
|
+
lineHeight?: string;
|
|
50
|
+
highlightBorderRadius?: string;
|
|
49
51
|
padding?: string;
|
|
50
52
|
paddingLeft?: string;
|
|
51
53
|
paddingRight?: string;
|