Stencil: compiler: allow anonymous functional components to render within VDom

[Hotell]

I'm submitting a ...
[ ] bug report
[x] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://stencil-worldwide.slack.com

Current behavior:

currently, it is not possible to create anonymous functional components and leverage them across various web components for better reusability

Expected behavior:

enable Functional Components support

Related code:

following is not possible:

const Caffe = ({flavour}) => {
  return <div>Hello Caffe addict! Looks like you love {flavour} flavour of coffe</div>
}

@Component({...})
class MyCmp {
  @Prop() flavour = ''
  render(){
     return <div>
          Lorem Ipsum: <Caffe flavour={this.flavour} /> 
    </div>
  }
}

[jthoms1]

This is something we have talked about adding. Not exactly sure the best way to implement. Since every component becomes a web component.

So likely this should not be a web component but probably just a util function, but my problem is about how to properly communicate this to devs. Thoughts?

[dkundel]

Basically you would only have to highlight in the documentation that only classes that use the @Component decorator will be exported as web components. Functional components can only be used inside other components but are not available after compiling.

Does this make sense?

[Hotell]

what @dkundel said ;)

I mean you're using hybrid snabdom + preact VDOM, so my guess was it should have this already baked in. Functional component is nothing else just a function which is called with h(Coffe, props, children). no big deal

[jthoms1]

I am very familiar with functional components and have wanted them in Stencil for awhile. I think that for now I will implement it (should be an easy change), but avoiding the training topic and it will just be available for those who know how to use them.

[Hotell]

sorry if my comment sounded offensive or so @jthoms1 , I didn't mean to say you don't know what FC is ofc.
peace ✌️:)

[jthoms1]

no worries, Just wanted to let you know I want this as well. 😄