brookmind-emails 0.1.7

package/src/shared/components/Header.tsx

@@ -0,0 +1,56 @@
+import { Section, Img, Text } from "@react-email/components";
+
+export interface HeaderProps {
+  logoUrl: string;
+  logoAlt?: string;
+  subtitle?: string;
+}
+
+const styles = {
+  header: {
+    backgroundColor: "#000000",
+    padding: "32px 40px",
+    borderBottom: "1px solid rgba(148, 163, 184, 0.15)",
+  },
+  logoContainer: {
+    display: "flex" as const,
+    flexDirection: "column" as const,
+    alignItems: "center" as const,
+    justifyContent: "center" as const,
+    gap: "18px",
+    textAlign: "center" as const,
+  },
+  logoWrapper: {
+    display: "flex" as const,
+    alignItems: "center" as const,
+    justifyContent: "center" as const,
+    backgroundColor: "#000",
+    borderRadius: "18px",
+    padding: "16px 24px",
+  },
+  logo: {
+    display: "block" as const,
+    maxWidth: "100%",
+  },
+  subtitle: {
+    fontSize: "16px",
+    color: "rgba(255,255,255,0.8)",
+    letterSpacing: "4px",
+    textTransform: "uppercase" as const,
+    fontWeight: 500,
+    margin: 0,
+  },
+};
+
+export function Header({ logoUrl, logoAlt = "Logo", subtitle }: HeaderProps) {
+  return (
+    <Section style={styles.header}>
+      <div style={styles.logoContainer}>
+        <div style={styles.logoWrapper}>
+          <Img src={logoUrl} width="150" height="auto" alt={logoAlt} style={styles.logo} />
+        </div>
+        {subtitle && <Text style={styles.subtitle}>{subtitle}</Text>}
+      </div>
+    </Section>
+  );
+}

package/src/shared/components/index.ts

@@ -0,0 +1,3 @@
+export { Header, type HeaderProps } from "./Header.js";
+export { Footer, type FooterProps } from "./Footer.js";
+export { Button, type ButtonProps } from "./Button.js";

package/src/shared/index.ts

@@ -0,0 +1 @@
+export * from "./components/index.js";

package/tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "lib": ["ES2022"],
+    "jsx": "react-jsx",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "declaration": true,
+    "declarationMap": true,
+    "outDir": "./dist",
+    "rootDir": "./src",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": false
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist"]
+}