Skip to content

Commit

Permalink
fix: [TS] Update translateX & translateY types to support % (#4…
Browse files Browse the repository at this point in the history
…2671)

Summary:
After update to the latest `react-native` version
we discover that we are unable to use `number%` value for `translate*` props :

```tsx
StyleSheet.create({
  root: {
    transform: [
      { translateX: '-50%'  },
      // ^^^^^^ TS Error: Type string is not assignable to type AnimatableNumericValue | undefined
    ],
  }
});
```

 ---

percentage values are supported, demo: https://snack.expo.dev/retyui/test-tstransform

## Changelog:

[GENERAL] [FIXED] - Update typescript definition of `translateX` & `translateX` to be able to use percentage values

Pull Request resolved: #42671

Test Plan: `yarn tsc --noEmit`

Reviewed By: rozele, cortinico

Differential Revision: D53146046

Pulled By: NickGerleman

fbshipit-source-id: 3486e7a9b55b98c36cc96b2bca4bb27841061e80
  • Loading branch information
retyui authored and facebook-github-bot committed Jan 30, 2024
1 parent e97ba47 commit b133bf6
Showing 1 changed file with 2 additions and 2 deletions.
Expand Up @@ -155,11 +155,11 @@ interface ScaleYTransform {
}

interface TranslateXTransform {
translateX: AnimatableNumericValue;
translateX: AnimatableNumericValue | `${number}%`;
}

interface TranslateYTransform {
translateY: AnimatableNumericValue;
translateY: AnimatableNumericValue | `${number}%`;
}

interface SkewXTransform {
Expand Down

0 comments on commit b133bf6

Please sign in to comment.