Re: [polymer-dev] Child html within lit-html

2018-04-30 Thread fredygomez1981 
Justin

What if my project does not use shadowdom because it is too intrusive in 
FF. I guess slots are useless. How can I still achieve child projection?


Regards,

Fredy A Gomez

On Monday, February 19, 2018 at 8:27:00 AM UTC-8, Justin Fagnani wrote:
>
> For projecting child content, you need to use s: 
> https://developers.google.com/web/fundamentals/web-components/shadowdom#slots
>
> class MyButton extends LitElement {
>   constructor(...args) {
> super();
>   }
>
>   render() {
> return html`
>   
> 
>   
> `;
>   }
> }
>
> On Mon, Feb 19, 2018 at 8:18 AM, Ronn Ross  > wrote:
>
>> I have a simple button component. 
>>
>>
>> I trying to get the child content and pass it through to the button. Here 
>> is an example:
>>
>> 
>> this is some content
>> 
>>
>> I can't figure out how MyButton can pass along the children
>>
>> class MyButton extends LitElement {
>> constructor(...args) {
>> super();
>> }
>>
>> render({children}) {
>> return html`
>> 
>> ${children}
>> 
>> `
>> }
>> }
>>
>>
>> I tried capturing all the args pass into render and the constructor, but 
>> found nothing that I can use to capture the content. Can someone point me 
>> in the right direction?
>>
>> Thanks!
>>
>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>> --- 
>> You received this message because you are subscribed to the Google Groups 
>> "Polymer" group.
>> To unsubscribe from this group and stop receiving emails from it, send an 
>> email to polymer-dev...@googlegroups.com .
>> To view this discussion on the web visit 
>> https://groups.google.com/d/msgid/polymer-dev/c25cc110-144d-46a2-9aff-0eae71de366c%40googlegroups.com
>>  
>> 
>> .
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/084ac0c9-4bc3-4cf5-add4-a62dc7d62052%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Re: [polymer-dev] Child html within lit-html

2018-02-19 Thread 'Justin Fagnani' via Polymer 
Safari and Opera support Shadow DOM, Firefox has it under development. The
polyfills work, and lit-html has ShadyCSS integration as of 0.9.0.

On Feb 19, 2018 10:26 AM, "Ronn Ross"  wrote:

> Thanks everyone. I also read about slot on MDN and it makes sense. I saw
> that chrome only supports this, so will this be covered by the polyfill in
> other browsers?
>
> On Monday, February 19, 2018 at 11:27:00 AM UTC-5, Justin Fagnani wrote:
>>
>> For projecting child content, you need to use s:
>> https://developers.google.com/web/fundamentals/web-
>> components/shadowdom#slots
>>
>> class MyButton extends LitElement {
>>   constructor(...args) {
>> super();
>>   }
>>
>>   render() {
>> return html`
>>   
>> 
>>   
>> `;
>>   }
>> }
>>
>> On Mon, Feb 19, 2018 at 8:18 AM, Ronn Ross  wrote:
>>
>>> I have a simple button component.
>>>
>>>
>>> I trying to get the child content and pass it through to the button.
>>> Here is an example:
>>>
>>> 
>>> this is some content
>>> 
>>>
>>> I can't figure out how MyButton can pass along the children
>>>
>>> class MyButton extends LitElement {
>>> constructor(...args) {
>>> super();
>>> }
>>>
>>> render({children}) {
>>> return html`
>>> 
>>> ${children}
>>> 
>>> `
>>> }
>>> }
>>>
>>>
>>> I tried capturing all the args pass into render and the constructor, but
>>> found nothing that I can use to capture the content. Can someone point me
>>> in the right direction?
>>>
>>> Thanks!
>>>
>>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>>> ---
>>> You received this message because you are subscribed to the Google
>>> Groups "Polymer" group.
>>> To unsubscribe from this group and stop receiving emails from it, send
>>> an email to polymer-dev...@googlegroups.com.
>>> To view this discussion on the web visit https://groups.google.com/d/ms
>>> gid/polymer-dev/c25cc110-144d-46a2-9aff-0eae71de366c%40googlegroups.com
>>> 
>>> .
>>> For more options, visit https://groups.google.com/d/optout.
>>>
>>
>> Follow Polymer on Google+: plus.google.com/107187849809354688692
> ---
> You received this message because you are subscribed to the Google Groups
> "Polymer" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/e8a356c2-75db-4f40-a9ea-ca1ca67693a5%40googlegroups.com
> 
> .
> For more options, visit https://groups.google.com/d/optout.
>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDUZTZF3fRTL9xwadymoxVXjRNzEk2x2ppFy5GnyVLphQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Re: [polymer-dev] Child html within lit-html

2018-02-19 Thread Ronn Ross 
Thanks everyone. I also read about slot on MDN and it makes sense. I saw 
that chrome only supports this, so will this be covered by the polyfill in 
other browsers? 

On Monday, February 19, 2018 at 11:27:00 AM UTC-5, Justin Fagnani wrote:
>
> For projecting child content, you need to use s: 
> https://developers.google.com/web/fundamentals/web-components/shadowdom#slots
>
> class MyButton extends LitElement {
>   constructor(...args) {
> super();
>   }
>
>   render() {
> return html`
>   
> 
>   
> `;
>   }
> }
>
> On Mon, Feb 19, 2018 at 8:18 AM, Ronn Ross  > wrote:
>
>> I have a simple button component. 
>>
>>
>> I trying to get the child content and pass it through to the button. Here 
>> is an example:
>>
>> 
>> this is some content
>> 
>>
>> I can't figure out how MyButton can pass along the children
>>
>> class MyButton extends LitElement {
>> constructor(...args) {
>> super();
>> }
>>
>> render({children}) {
>> return html`
>> 
>> ${children}
>> 
>> `
>> }
>> }
>>
>>
>> I tried capturing all the args pass into render and the constructor, but 
>> found nothing that I can use to capture the content. Can someone point me 
>> in the right direction?
>>
>> Thanks!
>>
>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>> --- 
>> You received this message because you are subscribed to the Google Groups 
>> "Polymer" group.
>> To unsubscribe from this group and stop receiving emails from it, send an 
>> email to polymer-dev...@googlegroups.com .
>> To view this discussion on the web visit 
>> https://groups.google.com/d/msgid/polymer-dev/c25cc110-144d-46a2-9aff-0eae71de366c%40googlegroups.com
>>  
>> 
>> .
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/e8a356c2-75db-4f40-a9ea-ca1ca67693a5%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Re: [polymer-dev] Child html within lit-html

2018-02-19 Thread 'Justin Fagnani' via Polymer 
For projecting child content, you need to use s:
https://developers.google.com/web/fundamentals/web-components/shadowdom#slots

class MyButton extends LitElement {
  constructor(...args) {
super();
  }

  render() {
return html`
  

  
`;
  }
}

On Mon, Feb 19, 2018 at 8:18 AM, Ronn Ross  wrote:

> I have a simple button component.
>
>
> I trying to get the child content and pass it through to the button. Here
> is an example:
>
> 
> this is some content
> 
>
> I can't figure out how MyButton can pass along the children
>
> class MyButton extends LitElement {
> constructor(...args) {
> super();
> }
>
> render({children}) {
> return html`
> 
> ${children}
> 
> `
> }
> }
>
>
> I tried capturing all the args pass into render and the constructor, but
> found nothing that I can use to capture the content. Can someone point me
> in the right direction?
>
> Thanks!
>
> Follow Polymer on Google+: plus.google.com/107187849809354688692
> ---
> You received this message because you are subscribed to the Google Groups
> "Polymer" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/c25cc110-144d-46a2-9aff-0eae71de366c%40googlegroups.com
> 
> .
> For more options, visit https://groups.google.com/d/optout.
>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAFqkbu3O%2BbUZaU2h5ZOn12JbCB%2BuNQD0yDgeJdwqPhzg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

[polymer-dev] Child html within lit-html

2018-02-19 Thread Ronn Ross 
I have a simple button component. 


I trying to get the child content and pass it through to the button. Here 
is an example:


this is some content


I can't figure out how MyButton can pass along the children

class MyButton extends LitElement {
constructor(...args) {
super();
}

render({children}) {
return html`

${children}

`
}
}


I tried capturing all the args pass into render and the constructor, but 
found nothing that I can use to capture the content. Can someone point me 
in the right direction?

Thanks!

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/c25cc110-144d-46a2-9aff-0eae71de366c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.