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

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,23 +122,33 @@ 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: {},
     overlay: {
-        ...StyleSheet.absoluteFillObject,
+        ...StyleSheet.absoluteFill,
     },
     hiddenText: {
         opacity: 0,

package/lib/StrokeText.web.js

@@ -92,7 +92,7 @@ export function StrokeText({ text, children, style, ...rest }) {
 const styles = StyleSheet.create({
     container: {},
     overlay: {
-        ...StyleSheet.absoluteFillObject,
+        ...StyleSheet.absoluteFill,
     },
     hiddenText: {
         opacity: 0,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whetware/react-native-stroke-text",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "Stroke/outline text for React Native (New Architecture) on iOS, Android, and Web.",
   "type": "module",
   "main": "./lib/index.js",
@@ -28,6 +28,19 @@
     "CHANGELOG.md",
     "README.md"
   ],
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "clean": "rm -rf android/build node_modules/**/android/build lib",
+    "lint": "eslint \"**/*.{js,ts,tsx}\" --fix",
+    "lint-ci": "eslint \"**/*.{js,ts,tsx}\"",
+    "typescript": "tsc",
+    "prepare": "npm run prepack",
+    "prepack": "tsc",
+    "changeset": "changeset",
+    "version-packages": "changeset version",
+    "release": "changeset publish",
+    "specs": "tsc --noEmit false && nitrogen --logLevel=\"debug\""
+  },
   "keywords": [
     "react-native",
     "nitro",
@@ -107,16 +120,5 @@
     "trailingComma": "es5",
     "useTabs": false,
     "semi": false
-  },
-  "scripts": {
-    "typecheck": "tsc --noEmit",
-    "clean": "rm -rf android/build node_modules/**/android/build lib",
-    "lint": "eslint \"**/*.{js,ts,tsx}\" --fix",
-    "lint-ci": "eslint \"**/*.{js,ts,tsx}\"",
-    "typescript": "tsc",
-    "changeset": "changeset",
-    "version-packages": "changeset version",
-    "release": "changeset publish",
-    "specs": "tsc --noEmit false && nitrogen --logLevel=\"debug\""
   }
 }