@emailux/text

Text component for emails.

Installation

# pnpm
pnpm add @emailux/text

# npm
npm install @emailux/text

# yarn
yarn add @emailux/text

Quick start

import { Text } from "@emailux/text";

export default function EmailTemplate() {
  return <Text spacingBottom='10px' fontWeight='400' fontFamily='Arial' fontSize='20px'>
  Hello world!
  </Text>;
}

Props

| Name | Type | Required | Default | Description | | -------- | --------------- | -------- | ------- | ----------- | | children | React.ReactNode | Yes | — | Content of the email document | | dir | "ltr" | "rtl" | No | Comes from wrapping Html component's dir context prop which is ltr | Text direction for the wrapper cell | | spacing | string | No | Comes from wrapping Html component's defaultSpacing context prop which is 20px | Spacing bottom, by default comes from Html defaultSpacing prop | | color | string | No | — | #000 | | fontSize | string | No | — | | | lineHeight | string | No | — | | | fontWeight | string | No | — | | | className | string | No | — | | | plain | boolean | No | false | Used when you don't want to use table or margin bottom just a paragraph without spacing | | letterSpacing | string | No | — | | | inline | boolean | No | false | Used when you want to write something in one line inside another component without spacing | | href | string | No | - | If you want to convert the text to link | | padding | CSS padding style string | No | "" | Only works if its either inline or plain and you can add a css string |

All other standard attributes for the <text> element are supported.

License

MIT © iClasser