BuilderIO / mitosis

Write components once, run everywhere. Compiles to React, Vue, Qwik, Solid, Angular, Svelte, and more.
https://mitosis.builder.io
MIT License
11.84k stars 513 forks source link

core: add MitosisComponent.props #469

Open PatrickJS opened 2 years ago

PatrickJS commented 2 years ago

I think the code will be a lot simpler in the generators if we provide more metadata on the props. For example in angular we want to know if it's a function and if it's being invoked. or in React if it's going used in ref binding.

I was something something like

type PropType = 
  | 'function'
  | 'string'
  | 'boolean'
  | 'undefined'
  | 'null';

// metadata on how it's being used
type PropUsed = 
  | 'binding'
  | 'invoked'
  | 'binding.ref' // forwardRef
  | 'function'
  | 'onMount'
  | 'onInit'
  | 'onUnMount'
  | 'onUpdate'
  | 'onUpdate.dep';

interface MitosisProp {
  type: PropType;
  used: PropUsed[];
  code: string;
}
decadef20 commented 2 years ago

Can you please provide a detailed example of how we use MitosisComponent.props

samijaber commented 2 years ago

@PatrickJS Debating whether we can keep this logic in generators for now, until we see enough need for it to be permanently embedded in the JSON schema. That way, we can gather more use-cases from more generators about what info we need to store, and the schema will be more accurate.

Unless doing it in the generators is a lot harder or hacky than in the babel transform of the JSX parser, in which case it makes sense to move it there earlier.

My main concern is not crowding up the component JSON and having data in there that can easily be derived from other parts of the JSON (by inspecting both the props and the lifecycle hooks code for example)