Documentation

Installation

npm install @twenty3/markup-traverser

import { populateText } from "@twenty3/markup-traverser"

Using populateText

Compulsory parameters:

{
  template,
  querySelectors,
  data,
}

template

• a string of HTML/SVG
• e.g. '<div class="entityType-instance-nested_one-nested_two-uuid">I wanna be populated</div>'

querySelectors:

• an array of element types to be traversed and populated with data
• e.g. [foreignObject div]

data

• a JSON object containing the data that you want the markup to be populated with

  {
    some_info: "I'm some information that will be ignored by the HTML template snippet",
    nested_one: {
      nested_two: "I will populate the div!"
    }
  }

Optional parameters

{
  dataAttr,
}

datatAttr

• the attribute that is used to collect the key used for data population with getAttribute
• default: class
• e.g. [data-custom-key]