12:[["$","main",null,{"children":[["$","$L5",null,{"maxW":"100%","children":[["$","$L20","div-0",{"code":"import { Text } from 'welcome-ui/Text'\n\nconst Example = () => {\n return (\n <>\n \n Heading (h0)\n \n \n Heading (h1)\n \n \n Heading (h2)\n \n \n Heading (h3)\n \n \n Heading (h4)\n \n \n Heading (h5)\n \n \n Heading (h6)\n \n \n Text (lg)\n \n \n Text (md)\n \n \n Text (sm)\n \n \n Text (xs)\n \n \n Subtitle (md)\n \n \n Subtitle (sm)\n \n \n )\n}\n\nexport default Example\n","isOverview":true,"mt":0,"name":"Text","pathToFile":"/Text/docs/examples/overview.tsx","withCodeEditor":true}]]}],["$","$L5",null,{"maxW":"100%","children":[["$","$Lf","h2-0",{"alignItems":"center","as":"h2","borderBottom":"1px solid","borderBottomColor":"neutral-30","display":"flex","id":"examples","mt":"3xl","pb":"sm","style":{"scrollMarginTop":170},"variant":"h3","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#examples","textDecoration":{"hover":"underline"},"children":"Examples"}]}]]}],["$","$L5",null,{"maxW":"100%","children":[["$","$Lf","h3-0",{"as":"h3","id":"overwrite-tag","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#overwrite-tag","textDecoration":{"hover":"underline"},"children":"Overwrite tag"}]}],"\n",["$","$L21","p-0",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"You can pass a tag name with ","position":{"start":{"line":4,"column":1,"offset":20},"end":{"line":4,"column":30,"offset":49}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"as","position":{"start":{"line":4,"column":30,"offset":49},"end":{"line":4,"column":34,"offset":53}}}],"position":{"start":{"line":4,"column":30,"offset":49},"end":{"line":4,"column":34,"offset":53}}},{"type":"text","value":" to use that tag type with the styling from another tag. For example…","position":{"start":{"line":4,"column":34,"offset":53},"end":{"line":4,"column":103,"offset":122}}}],"position":{"start":{"line":4,"column":1,"offset":20},"end":{"line":4,"column":103,"offset":122}}},"children":["You can pass a tag name with ",["$","$L5","code-0",{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"as"}]," to use that tag type with the styling from another tag. For example…"]}],"\n",["$","$L20","div-0",{"code":"import { Text } from 'welcome-ui/Text'\n\nconst Example = () => {\n return (\n <>\n \n p tag styled as an H3\n \n \n H1 tag styled as a sm\n \n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Text","pathToFile":"/Text/docs/examples/overwrite.tsx","withCodeEditor":true}],"\n",["$","$Lf","h3-1",{"as":"h3","id":"truncation","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#truncation","textDecoration":{"hover":"underline"},"children":"Truncation"}]}],"\n",["$","$L21","p-1",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Set the number of lines you want to display with ","position":{"start":{"line":10,"column":1,"offset":207},"end":{"line":10,"column":50,"offset":256}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"lines","position":{"start":{"line":10,"column":50,"offset":256},"end":{"line":10,"column":57,"offset":263}}}],"position":{"start":{"line":10,"column":50,"offset":256},"end":{"line":10,"column":57,"offset":263}}},{"type":"text","value":". Your text will be displayed truncated with an ellipsis (","position":{"start":{"line":10,"column":57,"offset":263},"end":{"line":10,"column":115,"offset":321}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"...","position":{"start":{"line":10,"column":115,"offset":321},"end":{"line":10,"column":120,"offset":326}}}],"position":{"start":{"line":10,"column":115,"offset":321},"end":{"line":10,"column":120,"offset":326}}},{"type":"text","value":") at the end (if necessary).","position":{"start":{"line":10,"column":120,"offset":326},"end":{"line":10,"column":148,"offset":354}}}],"position":{"start":{"line":10,"column":1,"offset":207},"end":{"line":10,"column":148,"offset":354}}},"children":["Set the number of lines you want to display with ",["$","$L5","code-0",{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"lines"}],". Your text will be displayed truncated with an ellipsis (",["$","$L5","code-1",{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"..."}],") at the end (if necessary)."]}],"\n",["$","$L20","div-1",{"code":"$22","isOverview":false,"mt":"$undefined","name":"Text","pathToFile":"/Text/docs/examples/truncation.tsx","withCodeEditor":true}],"\n",["$","$Lf","h3-2",{"as":"h3","id":"with-dash","mb":"lg","mt":"xxl","style":{"scrollMarginTop":170},"variant":"h4","children":["$","$L5",null,{"as":"a","color":"inherit","href":"#with-dash","textDecoration":{"hover":"underline"},"children":"withDash"}]}],"\n",["$","$L21","p-2",{"node":{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"With the ","position":{"start":{"line":16,"column":1,"offset":438},"end":{"line":16,"column":10,"offset":447}}},{"type":"element","tagName":"code","properties":{},"children":[{"type":"text","value":"withDash","position":{"start":{"line":16,"column":10,"offset":447},"end":{"line":16,"column":20,"offset":457}}}],"position":{"start":{"line":16,"column":10,"offset":447},"end":{"line":16,"column":20,"offset":457}}},{"type":"text","value":" property, a dash is added before the text in headings ","position":{"start":{"line":16,"column":20,"offset":457},"end":{"line":16,"column":75,"offset":512}}},{"type":"element","tagName":"em","properties":{},"children":[{"type":"text","value":"(h0 to h6)","position":{"start":{"line":16,"column":76,"offset":513},"end":{"line":16,"column":86,"offset":523}}}],"position":{"start":{"line":16,"column":75,"offset":512},"end":{"line":16,"column":87,"offset":524}}},{"type":"text","value":".","position":{"start":{"line":16,"column":87,"offset":524},"end":{"line":16,"column":88,"offset":525}}}],"position":{"start":{"line":16,"column":1,"offset":438},"end":{"line":16,"column":88,"offset":525}}},"children":["With the ",["$","$L5","code-0",{"alignItems":"center","as":"code","backgroundColor":"neutral-30","borderRadius":"md","color":"neutral-90","display":"inline-flex","px":"sm","py":"xxs","text":"sm","whiteSpace":"break-spaces","children":"withDash"}]," property, a dash is added before the text in headings ",["$","em","em-0",{"children":"(h0 to h6)"}],"."]}],"\n",["$","$L20","div-2",{"code":"import { Text } from 'welcome-ui/Text'\n\nconst Example = () => {\n return (\n \n Heading with a dash\n \n )\n}\n\nexport default Example\n","isOverview":false,"mt":"$undefined","name":"Text","pathToFile":"/Text/docs/examples/withDash.tsx","withCodeEditor":true}]]}]]}],["$","$L23",null,{"isSubPage":true,"tree":[{"href":"#","id":"definition","title":"Definition"},{"href":"#installation","id":"installation","title":"Installation"},{"href":"#examples","id":"examples","title":"Examples","children":[{"href":"#overwrite-tag","id":"overwrite-tag","title":"Overwrite tag"},{"href":"#truncation","id":"truncation","title":"Truncation"},{"href":"#with-dash","id":"with-dash","title":"withDash"}]}]}]]