- adds `nriDescription` and `testId` helpers
- adds `maybe` helper
Extras for working with Html.Attributes.
This is the new version of Nri.Ui.Html.Attributes.Extra.
none : Html.Styled.Attribute msg
Represents an attribute with no semantic meaning, useful for conditionals.
This is implemented such that whenever Html.Attributes.Extra.none is encountered by VirtualDom it will set a meaningless property on the element object itself to null:
domNode['Html.Attributes.Extra.none'] = null
It's totally safe and lets us clean up conditional and maybe attributes
includeIf : Basics.Bool -> Html.Styled.Attribute msg -> Html.Styled.Attribute msg
conditionally include an attribute. Useful for CSS classes generated with
UniqueClass
!
maybe : (v -> Html.Styled.Attribute msg) -> Maybe v -> Html.Styled.Attribute msg
Transform a maybe value to an attribute or attach none
targetBlank : List (Html.Styled.Attribute msg)
Use this list of attributes instead of applying Attributes.target "_blank"
directly. This prevents an exploits like "tabnabbing", among other things.
See these resources:
nriDescription : String -> Html.Styled.Attribute msg
nriDescriptionSelector : String -> List Css.Style -> Css.Global.Snippet
Note: this does not handle html escaping the description before building the query
testId : String -> Html.Styled.Attribute msg
See Cypress best practices: https://docs.cypress.io/guides/references/best-practices.html#Selecting-Elements
safeIdWithPrefix : String -> String -> String
Prepends a prefix to the result of safeId.
safeId : String -> String
Creates a lowercased string that is safe to use for HTML IDs. Removes all groups of unsafe characters and replaces each group with a dash. prepends "id-" to the result to ensure that the ID starts with a letter. (necessary for CSS selectors including getElementById) See code pen for examples: https://codepen.io/ap-nri/pen/OJENQLY