Add new email components: Content and Header

Two new functionalities for email templates have been introduced. A 'content' component which provides a container complete with border and padding specifications, and a 'header' component which simply encapsulates its child items. Both use the '@react-email/components' container for layout.

packages/email-templates/src/components/content.tsx

@@ -0,0 +1,19 @@
+import { Container } from '@react-email/components';
+import * as React from 'react';
+
+export function EmailContent(
+  props: React.PropsWithChildren<{
+    className?: string;
+  }>,
+) {
+  return (
+    <Container
+      className={
+        'rounded-xl my-[8px] px-[24px] py-[12px] mx-auto border border-solid border-[#eeeeee] ' +
+          props.className || ''
+      }
+    >
+      {props.children}
+    </Container>
+  );
+}

packages/email-templates/src/components/header.tsx

@@ -0,0 +1,10 @@
+import { Container } from '@react-email/components';
+import * as React from 'react';
+
+export function EmailHeader(props: React.PropsWithChildren) {
+  return (
+    <Container>
+      {props.children}
+    </Container>
+  );
+}