@whetware/react-native-stroke-text 0.0.5 → 0.0.6

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @whetware/react-native-stroke-text
 
+## 0.0.6
+
+### Patch Changes
+
+- [`f8a9483`](https://github.com/whetware/react-native-stroke-text/commit/f8a9483d80eebe2149b84a47da7a2178341c5c9f) Thanks [@evelant](https://github.com/evelant)! - Fix layout on Android
+
 ## 0.0.5
 
 ### Patch Changes

package/lib/StrokeText.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { I18nManager, StyleSheet, Text, View } from 'react-native';
+import { StyleSheet, Text, View } from 'react-native';
 import { callback, getHostComponent } from 'react-native-nitro-modules';
 import StrokeTextViewConfig from '../nitrogen/generated/shared/json/StrokeTextViewConfig.json';
 const NativeStrokeTextView = getHostComponent('StrokeTextView', () => StrokeTextViewConfig);
@@ -71,24 +71,6 @@ export function StrokeText({ text, children, style, hybridRef, ...rest }) {
     const baseRight = firstNumber(paddingRight, stylePaddingRight, paddingHorizontal, stylePaddingHorizontal, padding, stylePadding) ?? 0;
     const baseBottom = firstNumber(paddingBottom, stylePaddingBottom, paddingVertical, stylePaddingVertical, padding, stylePadding) ?? 0;
     const baseLeft = firstNumber(paddingLeft, stylePaddingLeft, paddingHorizontal, stylePaddingHorizontal, padding, stylePadding) ?? 0;
-    const baseMarginTop = firstNumber(containerStyle.marginTop, containerStyle.marginVertical, containerStyle.margin) ?? 0;
-    const baseMarginRight = firstNumber(containerStyle.marginRight, I18nManager.isRTL ? containerStyle.marginStart : containerStyle.marginEnd, containerStyle.marginHorizontal, containerStyle.margin) ?? 0;
-    const baseMarginBottom = firstNumber(containerStyle.marginBottom, containerStyle.marginVertical, containerStyle.margin) ?? 0;
-    const baseMarginLeft = firstNumber(containerStyle.marginLeft, I18nManager.isRTL ? containerStyle.marginEnd : containerStyle.marginStart, containerStyle.marginHorizontal, containerStyle.margin) ?? 0;
-    const baseMarginStart = toNumber(containerStyle.marginStart);
-    const baseMarginEnd = toNumber(containerStyle.marginEnd);
-    const strokeInsetMarginStyle = strokeInset === 0
-        ? null
-        : {
-            marginTop: baseMarginTop - strokeInset,
-            marginRight: baseMarginRight - strokeInset,
-            marginBottom: baseMarginBottom - strokeInset,
-            marginLeft: baseMarginLeft - strokeInset,
-            ...(baseMarginStart == null
-                ? {}
-                : { marginStart: baseMarginStart - strokeInset }),
-            ...(baseMarginEnd == null ? {} : { marginEnd: baseMarginEnd - strokeInset }),
-        };
     const effectiveNumberOfLines = nativeProps.numberOfLines != null && nativeProps.numberOfLines > 0
         ? nativeProps.numberOfLines
         : undefined;
@@ -140,18 +122,28 @@ export function StrokeText({ text, children, style, hybridRef, ...rest }) {
         effectiveTextTransform,
         effectiveIncludeFontPadding,
     ]);
-    return (React.createElement(View, { style: [styles.container, containerStyle, strokeInsetMarginStyle] },
+    return (React.createElement(View, { style: [styles.container, containerStyle] },
         React.createElement(Text, { accessible: false, pointerEvents: "none", numberOfLines: effectiveNumberOfLines, ellipsizeMode: effectiveEllipsizeMode, allowFontScaling: nativeProps.allowFontScaling, maxFontSizeMultiplier: nativeProps.maxFontSizeMultiplier, style: [
                 measurerTextStyle,
                 {
-                    paddingTop: baseTop + strokeInset,
-                    paddingRight: baseRight + strokeInset,
-                    paddingBottom: baseBottom + strokeInset,
-                    paddingLeft: baseLeft + strokeInset,
+                    paddingTop: baseTop,
+                    paddingRight: baseRight,
+                    paddingBottom: baseBottom,
+                    paddingLeft: baseLeft,
                 },
                 styles.hiddenText,
             ] }, resolvedText),
-        React.createElement(NativeStrokeTextView, { ...nativeProps, text: resolvedText, color: effectiveColor, fontSize: effectiveFontSize, fontWeight: effectiveFontWeight, fontFamily: effectiveFontFamily, fontStyle: effectiveFontStyle, lineHeight: effectiveLineHeight, letterSpacing: effectiveLetterSpacing, textAlign: effectiveTextAlign, textAlignVertical: effectiveTextAlignVertical, textDecorationLine: effectiveTextDecorationLine, textTransform: effectiveTextTransform, opacity: nativeProps.opacity ?? toNumber(styleOpacity), includeFontPadding: effectiveIncludeFontPadding, numberOfLines: nativeProps.numberOfLines, ellipsizeMode: effectiveEllipsizeMode, paddingTop: baseTop, paddingRight: baseRight, paddingBottom: baseBottom, paddingLeft: baseLeft, hybridRef: wrappedHybridRef, pointerEvents: "none", style: styles.overlay })));
+        React.createElement(NativeStrokeTextView, { ...nativeProps, text: resolvedText, color: effectiveColor, fontSize: effectiveFontSize, fontWeight: effectiveFontWeight, fontFamily: effectiveFontFamily, fontStyle: effectiveFontStyle, lineHeight: effectiveLineHeight, letterSpacing: effectiveLetterSpacing, textAlign: effectiveTextAlign, textAlignVertical: effectiveTextAlignVertical, textDecorationLine: effectiveTextDecorationLine, textTransform: effectiveTextTransform, opacity: nativeProps.opacity ?? toNumber(styleOpacity), includeFontPadding: effectiveIncludeFontPadding, numberOfLines: nativeProps.numberOfLines, ellipsizeMode: effectiveEllipsizeMode, paddingTop: baseTop, paddingRight: baseRight, paddingBottom: baseBottom, paddingLeft: baseLeft, hybridRef: wrappedHybridRef, pointerEvents: "none", style: [
+                styles.overlay,
+                strokeInset === 0
+                    ? null
+                    : {
+                        top: -strokeInset,
+                        right: -strokeInset,
+                        bottom: -strokeInset,
+                        left: -strokeInset,
+                    },
+            ] })));
 }
 const styles = StyleSheet.create({
     container: {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whetware/react-native-stroke-text",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Stroke/outline text for React Native (New Architecture) on iOS, Android, and Web.",
   "type": "module",
   "main": "./lib/index.js",