Feliz: Não é possível definir atributos IFrame e SVG

Criado em 29 abr. 2020 · 6Comentários · Fonte: Zaid-Ajaj/Feliz

Tentando implementar vídeos do Youtube e SVGs em um site, mas não consigo definir algumas propriedades:

            Html.iframe [ 
              prop.className "videostream"
              prop.src v.url
              prop.allowFullScreen true // Missing Feature in Feliz?
              prop.scrolling "no" // Missing Feature in Feliz?
              prop.frameBorder 0 // Missing Feature in Feliz?

                  Html.svg [ 
                    prop.className "fill-current h-3 w-3" ; 
                    Html.svg.viewBox "0 0 20 20" // Missing Feature in Feliz?
                    Html.svg.xmlns "http://www.w3.org/2000/svg" // Missing Feature in Feliz?
                    prop.children [ 
                      Html.path [ 
                        Html.d "M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" // Missing Feature in Feliz?
                      ]
                    ]
                  ]

Feliz enhancement good first issue

Fonte

heimeshoff

Todos 6 comentários

Olá @heimeshoff ,

Os atributos iframe não foram incluídos por estes motivos:

allowFullScreen - atributo legacy, use allow="fullscreen" , parece que allow está faltando, vou enviar um PR para aquele.
frameBorder - API obsoleta
rolagem - API obsoleta

Quanto aos itens svg, parece que estão faltando.

Shmew em 29 abr. 2020

Oi @heimeshoff , na verdade, parece que as propriedades svg ainda não são suportadas com Feliz. Até que estejam disponíveis, você pode usar a função prop.custom que torna as propriedades desejadas:

Html.svg [
  prop.className "fill-current h-3 w-3"
  prop.custom("viewBox", "0 0 20 20")
  prop.custom("xmlns", "http://www.w3.org/2000/svg")
  prop.children [
    Html.path [ 
        prop.custom("d", "M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z") 
    ]
  ]
]