Skip to content

Conversation

MatiPl01
Copy link
Member

@MatiPl01 MatiPl01 commented Jun 24, 2025

Summary

This PR removes the entire CPP logic of JS props handling and keeps this logic only on the JS side. In the new approach, instead of marking props as JS props for all components with the same native component name, we can easily decide, which props are JS props, separately for each component instance, which is more flexible and safer behavior than before.

The new approach allows these 2 possible ways to declare js props:

  1. Via the static getJSProps method declared on the component class or function component declaration
static get jsProps() {
  return ['x', 'y'];
}

or

function FunctionComponent() { ... }

FunctionComponent.jsProps = ['x', 'y']
  1. By passing prop names array using the options parameter on the createAnimatedComponent function:
const AnimatedG = Animated.createAnimatedComponent(G, {
  jsProps: ['x', 'y'],
});

If the component has jsProps static getter or jsProps public field already declared and jsProps were provided in options at the same time, jsProps from the options argument take precedence over ones declared on the component.

@MatiPl01 MatiPl01 self-assigned this Jun 24, 2025
@MatiPl01 MatiPl01 force-pushed the @matipl01/remove-js-props-passing-to-cpp branch from d9285b2 to 5660d44 Compare June 24, 2025 17:01
@MatiPl01 MatiPl01 requested a review from tomekzaw June 24, 2025 17:45
@MatiPl01 MatiPl01 marked this pull request as ready for review June 24, 2025 17:45
@MatiPl01
Copy link
Member Author

Update

I adjusted the old invalid JS Props example name and implementation. I also added the proper JS props example to the ThirdPartyComponentsExample screen.

old JS Props new JS Props (last example)
Simulator.Screen.Recording.-.iPhone.16.Pro.-.2025-06-25.at.10.48.43.mp4
Simulator.Screen.Recording.-.iPhone.16.Pro.-.2025-06-25.at.10.44.44.mp4

Copy link
Member

@tomekzaw tomekzaw left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall looks good to me. I've noticed that sometimes it's jsProp and sometimes it's jsProps, perhaps we should unify the identifiers to plural everywhere, i.e. jsPropsNames instead of jsPropNames.

@MatiPl01
Copy link
Member Author

MatiPl01 commented Jun 25, 2025

Overall looks good to me. I've noticed that sometimes it's jsProp and sometimes it's jsProps, perhaps we should unify the identifiers to plural everywhere, i.e. jsPropsNames instead of jsPropNames.

I think it's quite common to add s at the end of the word in english without adding it in twice, so the jsPropNames is more correct in this case. Nevertheless, I will rename all usages of jsPropNames to jsProps as it is shorter and understandable.

@tomekzaw tomekzaw changed the title chore: Remove js props updating via cpp chore: Remove JS props updating via C++ Jun 26, 2025
@MatiPl01 MatiPl01 added this pull request to the merge queue Jun 26, 2025
Merged via the queue into main with commit 9572259 Jun 26, 2025
17 checks passed
@MatiPl01 MatiPl01 deleted the @matipl01/remove-js-props-passing-to-cpp branch June 26, 2025 10:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants