The transform style does not work in version 0.73.* about react-native-macos HOT 7 CLOSED

I don't have an ETA for a fix yet, but it is something we'd like to have fixed since it's one of the basic scenarios.

from react-native-macos.

Just a slight update, we're gonna try to pick this up in the next couple of weeks. I know that this is a pretty annoying regression in 0.73, and we recognize its importance.

from react-native-macos.

Does it work with 0.72, so the regression started with 0.73?

from react-native-macos.

Does it work with 0.72, so the regression started with 0.73?

This problem started with 0.73, 0.72 and earlier versions work fine.

from react-native-macos.

Can confirm. I got the same issue!
It seems like translate is working fine, the other transforms are not working though.
@Saadnajmi Do you think that this is something that will be fixed soon?

from react-native-macos.

我还没有修复的预计时间，但这是我们希望修复的问题，因为它是基本场景之一。

I don't know if this is the same problem. In my development, I found that when the transform property translateY is used to offset an element, the rendering is visually effective. But when I inspect the element it doesn't work, and its event triggers are kept at the position before the offset.

This problem occurs in 0.72.*.

<AnimatedContainer
            {...containerProps}
            shape="extraSmall"
            containerHeight={containerLayout.height}
            containerPageX={containerLayout.pageX}
            containerPageY={containerLayout.pageY}
            containerWidth={containerLayout.width}
            layoutHeight={height}
            layoutWidth={width}
            supportingPosition={supportingPosition}
            testID={`tooltip__supporting--${id}`}
            type={type}
            visible={visible}
            style={{
                opacity: renderOpacity,
                transform: supportingPosition?.startsWith('vertical')
                    ? [{translateX: -(width / 2)}]
                    : [{translateY: -(height / 2)}],       //➡️ Here, translateY is used
            }}>
            <Inner {...onEvent} testID={`tooltip__supportingInner--${id}`}>
                <SupportingText
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    size="small"
                    testID={`tooltip__supportingText--${id}`}
                    type="body">
                    {supportingText}
                </SupportingText>
            </Inner>
        </AnimatedContainer>

from react-native-macos.

This change from upstream appears to be the culprit: 5f40f08#diff-603b7dc6b8a6a1475051de116973331aa452b0c76cfa4f36cd413ac859e5534c

from react-native-macos.