NoRedInk / noredink-ui / Nri.Ui.Highlightable.V3

A Highlightable represents a span of text, typically a word, and its state.

Highlightable is the unit by which text-wrapping happens. Depending on how the Highlighter is initialized, it's very possible for a Highlightable to consist of just a single whitespace.

Patch

Changes from V2

Types


type alias Highlightable marker =
{ text : String
, customAttributes : List (Html.Styled.Attribute Basics.Never)
, marked : List (Nri.Ui.HighlighterTool.V1.MarkerModel marker)
, index : Basics.Int
, type_ : Type 
}

A Highlightable comes in two flavors:


type Type
    = Interactive
    | Static

Initializers

initStatic : List (Nri.Ui.HighlighterTool.V1.MarkerModel marker) -> Basics.Int -> String -> Highlightable marker

initInteractive : List (Nri.Ui.HighlighterTool.V1.MarkerModel marker) -> Basics.Int -> String -> Highlightable marker

initFragments : String -> List (Highlightable marker)

Initialize highlightables from a string.

Note that we're transforming all whitespace to spaces, so newlines are not preserved as me move to and from fragments. Spaces will be treated as static elements. Words will be interactive.

fromMarkdown : String -> List (Highlightable ())

Initialize highlightables from a markdown string. This will get all nri-highlight tags into markded elements, you can add a specific color using the color attribute. The default color is yellow.

fromMarkdown "for example, <nri-highlight>this phrase</nri-highlight> will show as highlighted"

will result in a list of highlightables where "this phrase" is marked with the default marker.

fromMarkdown "for example, <nri-highlight color=" cyan ">this phrase</nri-highlight> will show as highlighted"

will result in a list of highlightables where "this phrase" is marked with the cyan marker.

The available highlight colors are listed in the Nri.Colors docs, which are the following:

There is also the empty url syntax, which is currently being deprecated:

fromMarkdown "for example, [this phrase]() will show as highlighted"

will result in a list of highlightables where "this phrase" is marked with the default marker.

fromMarkdownInlines : List (Markdown.Inline.Inline i) -> List (Highlightable ())

Same as fromMarkdown, but receives a list of inlines parsed markdown instead of a string.

You might want to use this if you are parsing highlightables out of lists or in other block contexts that fromMarkdown does not support.

UIState and marker

set : Maybe (Nri.Ui.HighlighterTool.V1.MarkerModel marker) -> Highlightable marker -> Highlightable marker

joinAdjacentInteractiveHighlights : Sorter m -> List (Highlightable m) -> List (Highlightable m)

Getters

asFragmentTuples : List (Highlightable marker) -> List ( List marker, String )

Get a list of fragment texts and whether or not they are marked. Useful for encoding answers.

usedMarkers : Sorter marker -> List (Highlightable marker) -> Sort.Set.Set marker

Get unique markers that have been used. Note: ignores marks on whitespace.

text : List (Highlightable marker) -> String

Fetch the text from a series of highlightables.

byId : Basics.Int -> List (Highlightable kind) -> Maybe (Highlightable kind)

Get the highlightable matching the passed-in ID, if any.