Email Types Data
General TypeScript definitions and data that can be used when building emails.
yarn add @email-types/data
Category | Description | Exports |
---|
css | Email specific data about the different features of the CSS language. | • data-types |
html | Email specific data about the different features of the HTML language. | • doctypes |
mso | Data about the different features of the MSO language. | • properties • syntaxes • operators • versions |
CSS
Examples
Email specific data about the different features of the CSS language. All CSS
data is generated using mdn-data
during the build pipeline,
exposing only what's relevant to reduce the overall package size.
import * as css from '@email-types/data/css';
DataTypes
CSS basic data types, such as <string>
, <number>
, and <length>
.
HTML
Examples
Email specific data about the different features of the HTML language.
import * as html from '@email-types/data/html';
Doctypes
HTML Document Type Definition (DTD) data that can be used in emails.
It does not include unsupported or deprecated doctype versions.
Checkout [email-doctype] for an example using this data.
MSO
Examples
Data about the different features of the Microsoft Office ("MSO") language.
import * as mso from '@email-types/data/mso';
Properties
MSO style property data, including data for the mso-
CSS vendor prefix. When
using this data, you should consider the following:
css alternatives
- Properties that end with an -alt
postfix that are
direct alternatives to a standard CSS property.
office only
- Properties that do not end with an -alt
postfix and have
no CSS equivalent. Instead, they correspond to a Microsoft Office feature.
However, since some versions of Microsoft Outlook use Microsoft Word as it's
rendering engine, these properties may or may not have an effect on your email.
- todo: Test each of these properties to understand how they effect
rendering of emails. Then document it all.
Syntaxes
MSO syntax is value definitions used for the formal syntax of MSO properties.
For example, the mso-border-alt
property allows for <border-style>
values.
This is referring to a syntax defined in syntaxes.ts
.
{
'mso-border-alt': {
syntax: '<border-style>',
}
}
{
'border-style': {
syntax: 'dashed | dotted | <string>';
}
}
Operators
MSO operator syntax that can be used to create MSO conditional expressions,
comments.
Versions
MSO version vectors that map to specific Outlook clients. This is commonly
used—in combination with an operator
—to target specific versions
of Outlook when creating conditional expressions, comments.
Upcoming
Clients
Data about the different email clients—which will include applications
and
webmail
.