This module contains convenience functions for econding and decoding editor nodes to and from html. Its intent is to help developers who want to import and export editor state as html.
toHtml : RichText.Config.Spec.Spec -> RichText.Model.Node.Block -> String
Converts a block to an html string.
exampleBlock : Block
exampleBlock =
block
(Element.element doc [])
(blockChildren <|
Array.fromList
[ block
(Element.element paragraph [])
(inlineChildren <|
Array.fromList
[ plainText "text"
, inlineElement (Element.element image [ StringAttribute "src" "logo.svg" ]) []
, plainText "text2"
]
)
]
)
exampleHtml : String
exampleHtml =
"<div data-rte-doc=\"true\"><p>text<img src=\"logo.svg\">text2</p></div>"
(toHtml markdown exampleBlock) == exampleHtml
--> True
toHtmlNode : RichText.Config.Spec.Spec -> RichText.Model.Node.Block -> RichText.Model.HtmlNode.HtmlNode
Converts a block to an HtmlNode.
exampleBlock : Block
exampleBlock =
block
(Element.element doc [])
(blockChildren <|
Array.fromList
[ block
(Element.element paragraph [])
(inlineChildren <|
Array.fromList
[ plainText "text"
, inlineElement (Element.element image [ StringAttribute "src" "logo.svg" ]) []
, plainText "text2"
]
)
]
)
exampleHtmlNode : HtmlNode
exampleHtmlNode =
ElementNode "div" [ ( "data-rte-doc", "true" ) ] <|
Array.fromList
[ ElementNode "p" [] <|
Array.fromList
[ TextNode "text"
, ElementNode "img" [ ( "src", "logo.svg" ) ] Array.empty
, TextNode "text2"
]
]
(toHtmlNode markdown exampleBlock) == exampleHtmlNode
--> True
fromHtml : RichText.Config.Spec.Spec -> String -> Result String (Array RichText.Node.Fragment)
Decodes an html string to an array of editor fragments, or returns an error if there was an issue decoding the html.
exampleBlock : Block
exampleBlock =
block
(Element.element doc [])
(blockChildren <|
Array.fromList
[ block
(Element.element paragraph [])
(inlineChildren <|
Array.fromList
[ plainText "text"
, inlineElement (Element.element image [ StringAttribute "src" "logo.svg" ]) []
, plainText "text2"
]
)
]
)
exampleFragment : Fragment
exampleFragment =
BlockFragment <| Array.fromList [ exampleBlock ]
exampleHtml : String
exampleHtml =
"<div data-rte-doc=\"true\"><p>text<img src=\"logo.svg\">text2</p></div>"
(Ok (Array.fromList [ exampleFragment ])) == (fromHtml markdown exampleHtml)
--> True
blockFromHtml : RichText.Config.Spec.Spec -> String -> Result String RichText.Model.Node.Block
Convenience function that parses html and returns the first editor block that was decoded, or an error if there was an issue decoding the html.
exampleBlock : Block
exampleBlock =
block
(Element.element doc [])
(blockChildren <|
Array.fromList
[ block
(Element.element paragraph [])
(inlineChildren <|
Array.fromList
[ plainText "text"
, inlineElement (Element.element image [ StringAttribute "src" "logo.svg" ]) []
, plainText "text2"
]
)
]
)
exampleHtml : String
exampleHtml =
"<div data-rte-doc=\"true\"><p>text<img src=\"logo.svg\">text2</p></div>"
(Ok exampleBlock) (blockFromHtml markdown exampleHtml)
--> True