mirror of
https://github.com/zhigang1992/devhub.git
synced 2026-06-13 08:31:12 +08:00
2cf84ed348
So many random things stopped working.
They were mainly caused by a rerender happening in a child view while some react-spring animation was happening.
Also I could not scroll on some places anymore, so I had to add collapsable={false} to some views as seem here: https://github.com/facebook/react-native/issues/21026#issuecomment-442785268
[Web] Workaround for white edge bug on images
https://github.com/necolas/react-native-web/issues/1228
87 lines
4.1 KiB
Diff
87 lines
4.1 KiB
Diff
patch-package
|
|
--- a/node_modules/react-native-web/dist/exports/Image/index.js
|
|
+++ b/node_modules/react-native-web/dist/exports/Image/index.js
|
|
@@ -278,6 +278,8 @@ var Image = function (_Component) {
|
|
var backgroundImage = displayImageUri ? 'url("' + displayImageUri + '")' : null;
|
|
var flatStyle = Object.assign({}, StyleSheet.flatten(this.props.style));
|
|
var finalResizeMode = resizeMode || flatStyle.resizeMode || ImageResizeMode.cover;
|
|
+ var backgroundColor = flatStyle.backgroundColor
|
|
+ var borderRadius = flatStyle.borderRadius
|
|
|
|
// CSS filters
|
|
var filters = [];
|
|
@@ -307,6 +309,8 @@ var Image = function (_Component) {
|
|
// these styles are not supported on View
|
|
delete flatStyle.overlayColor;
|
|
delete flatStyle.resizeMode;
|
|
+ // these styles will be moved to the inner View (#1228)
|
|
+ delete flatStyle.backgroundColor;
|
|
|
|
// Accessibility image allows users to trigger the browser's image context menu
|
|
var hiddenImage = displayImageUri ? createElement('img', {
|
|
@@ -327,7 +331,7 @@ var Image = function (_Component) {
|
|
testID: testID
|
|
}),
|
|
React.createElement(View, {
|
|
- style: [styles.image, resizeModeStyles[finalResizeMode], this._getBackgroundSize(finalResizeMode), backgroundImage && { backgroundImage: backgroundImage }, filters.length > 0 && { filter: filters.join(' ') }]
|
|
+ style: [styles.image, resizeModeStyles[finalResizeMode], this._getBackgroundSize(finalResizeMode), backgroundImage && { backgroundImage: backgroundImage }, backgroundColor && { backgroundColor: backgroundColor }, borderRadius && { borderRadius: borderRadius }, filters.length > 0 && { filter: filters.join(' ') }]
|
|
}),
|
|
hiddenImage,
|
|
createTintColorSVG(tintColor, this._filterId)
|
|
--- a/node_modules/react-native-web/dist/exports/Text/TextStylePropTypes.js
|
|
+++ b/node_modules/react-native-web/dist/exports/Text/TextStylePropTypes.js
|
|
@@ -42,7 +42,9 @@ var TextStylePropTypes = Object.assign({}, ViewStylePropTypes, {
|
|
whiteSpace: string,
|
|
wordWrap: string,
|
|
MozOsxFontSmoothing: string,
|
|
- WebkitFontSmoothing: string
|
|
+ WebkitBoxOrient: oneOf(['vertical', 'horizontal']),
|
|
+ WebkitFontSmoothing: string,
|
|
+ WebkitLineClamp: oneOfType([string, number])
|
|
});
|
|
|
|
export default TextStylePropTypes;
|
|
\ No newline at end of file
|
|
--- a/node_modules/react-native-web/dist/exports/Text/index.js
|
|
+++ b/node_modules/react-native-web/dist/exports/Text/index.js
|
|
@@ -69,7 +69,7 @@ var Text = function (_Component) {
|
|
|
|
// allow browsers to automatically infer the language writing direction
|
|
otherProps.dir = dir !== undefined ? dir : 'auto';
|
|
- otherProps.style = [styles.initial, this.context.isInAParentText === true && styles.isInAParentText, style, selectable === false && styles.notSelectable, numberOfLines === 1 && styles.singleLineStyle, onPress && styles.pressable];
|
|
+ otherProps.style = [styles.initial, this.context.isInAParentText === true && styles.isInAParentText, style, selectable === false && styles.notSelectable, numberOfLines === 1 && styles.singleLineStyle, numberOfLines > 1 && styles.multiLineStyle, numberOfLines > 1 && { WebkitLineClamp: numberOfLines }, onPress && styles.pressable];
|
|
|
|
var component = isInAParentText ? 'span' : 'div';
|
|
|
|
@@ -139,6 +139,13 @@ var styles = StyleSheet.create({
|
|
overflow: 'hidden',
|
|
textOverflow: 'ellipsis',
|
|
whiteSpace: 'nowrap'
|
|
+ },
|
|
+ multiLineStyle: {
|
|
+ display: '-webkit-box',
|
|
+ maxWidth: '100%',
|
|
+ overflow: 'hidden',
|
|
+ textOverflow: 'ellipsis',
|
|
+ WebkitBoxOrient: 'vertical'
|
|
}
|
|
});
|
|
|
|
--- a/node_modules/react-native-web/dist/modules/ScrollResponder/index.js
|
|
+++ b/node_modules/react-native-web/dist/modules/ScrollResponder/index.js
|
|
@@ -355,9 +355,11 @@ var ScrollResponderMixin = {
|
|
animated = _ref.animated;
|
|
}
|
|
var node = this.scrollResponderGetScrollableNode();
|
|
- UIManager.updateView(node, { style: { scrollBehavior: !animated ? 'auto' : 'smooth' } }, this);
|
|
- node.scrollLeft = x || 0;
|
|
- node.scrollTop = y || 0;
|
|
+ node.scroll({
|
|
+ top: y || 0,
|
|
+ left: x || 0,
|
|
+ behavior: !animated ? 'auto' : 'smooth',
|
|
+ })
|
|
},
|
|
|
|
/**
|