type-of-html icon indicating copy to clipboard operation
type-of-html copied to clipboard

How do I deal with inline Svg with type-of-html?

Open tonyalaribe opened this issue 3 years ago • 8 comments

It seems there are no svg elements or attributes defined. Is there any recommended workaround?

I also tried creating custom attributes, but couldn't get it to work. It just says the bool constructors are not in scope: image

tonyalaribe avatar May 14 '21 07:05 tonyalaribe

Well, it seams you don't have the Prelude imported. You can import Data.Bool if you wish to avoid the Prelude, Data.Type.Bool isn't needed in this snippet. Please make also sure, that you use the DataKinds language pragma. Just as you tried, you can define your custom attributes and your custom elements just fine. For custom elements, you'll need probably as well TypeOperators language pragma.

Please report if this works for you. Perhaps I'll add natively svg stuff in the coming weeks (pr welcome). Greets

knupfer avatar May 15 '21 09:05 knupfer

That's true. Simply importing the Prelude fixed it. Thanks!!! I'm still new to haskell, so I was mostly following the examples from the repository. But it seems to work now. Or at least, I get a different set of errors now. Mostly related to the custom elements which I will try.

About Svg, I'm happy to make a PR for that. Thanks!

tonyalaribe avatar May 15 '21 14:05 tonyalaribe

Just on the topic of making a pr for Svg support, How would you recommend implementing this? I feel Svg would be better in a different file/namespace. Then we could do something like import Html.Svg or something similar, because the Svg elements and attributes list is quite large as well, so maybe we can benefit from keeping it separate from HTML?

Also, I imagine just doing this via Custom elements (CustomElement and CustomA) is not really clean, or what do you think? How can I extend the attributes and elements list from a different module?

-- | 4 The elements of HTML
data Element (name :: Symbol) (categories :: [ContentCategory]) (contentModel :: ContentCategory) (contentAttributes :: [Symbol]) where

  DOCTYPE
    :: Element
    "!DOCTYPE html"
    '[]
    None
    '[]

  -- | \ 4.1 The document element
  --     4.1.1
  Html
    :: Element
    "html"
    '[]
    -- A head element followed by a body element.
    (Elements ["head", "body"])
    (ManifestA & '[])

Sorry I'm really new to haskell, so I don't have a good grasp of type level things. But if you point me in the right direction, this should be doable. The bulk of the work is mostly the manual work of listing out the elements and the attributes.

https://developer.mozilla.org/en-US/docs/Web/SVG/Element https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute

tonyalaribe avatar May 15 '21 14:05 tonyalaribe

Hi, gentle reminder about this. I know this issue is closed, but it would be nice to get a heads-up, which will help me work on the svg support or. :)

tonyalaribe avatar May 29 '21 14:05 tonyalaribe

Hi, sorry for the late answer. There are at least some options to implement this.

Just put it all into data Element and export everything, or put everything into data Element and make a handcrafted exportlist of constructors. The second option is a headache for maintenance, but allows for an Html.SVG module...

I'll think a bit more, but it seems to me, that svg is widely used and therefore well put into data Element.

knupfer avatar Jun 07 '21 17:06 knupfer

Thinking more about it, perhaps a data family would be a good extensible fit...

knupfer avatar Jun 07 '21 17:06 knupfer

Could you give a little code example?

On Mon, 7 Jun 2021 at 19:32, quxbar @.***> wrote:

Thinking more about it, perhaps a data family would be a good extensible fit...

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/knupfer/type-of-html/issues/5#issuecomment-856125004, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABSCVAXM2RVWU46BCCDOPCTTRT7BDANCNFSM4436SGGA .

tonyalaribe avatar Jun 07 '21 18:06 tonyalaribe

Just pushed a new version to github, look at the Html.Aria module for examples for attributes and at the Html.Obsolete module for examples for elements. If your stuck, just write a message

knupfer avatar Jun 09 '21 17:06 knupfer