From dadb3c111bf39ab5a7f9d203654c50860e2e650e Mon Sep 17 00:00:00 2001
From: hailey <hailey@interparktriple.com>
Date: Thu, 26 Dec 2024 15:21:11 +0900
Subject: [PATCH] =?UTF-8?q?heading=20=ED=83=80=EC=9E=85=20email=20element?=
 =?UTF-8?q?=EC=97=90=20id=EA=B0=92=20=EC=A3=BC=EC=9E=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/elements/heading.tsx                     | 16 ++++++++++++----
 .../triple-email-document/src/elements/index.ts  |  1 +
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/packages/triple-email-document/src/elements/heading.tsx b/packages/triple-email-document/src/elements/heading.tsx
index b84aebe390..8a7b18f5e8 100644
--- a/packages/triple-email-document/src/elements/heading.tsx
+++ b/packages/triple-email-document/src/elements/heading.tsx
@@ -70,12 +70,14 @@ const H4Container = styled.h4`
 `
 
 export function Heading1View({
+  id,
   value: { text, headline },
 }: {
+  id?: string
   value: Heading1Document['value']
 }) {
   return (
-    <FluidTable>
+    <FluidTable id={id}>
       <tbody>
         <tr>
           <Box padding={{ top: 25, bottom: 20, left: 30, right: 30 }}>
@@ -89,12 +91,14 @@ export function Heading1View({
 }
 
 export function Heading2View({
+  id,
   value: { text },
 }: {
+  id?: string
   value: Heading2Document['value']
 }) {
   return (
-    <FluidTable>
+    <FluidTable id={id}>
       <tbody>
         <tr>
           <Box padding={{ top: 20, bottom: 20, left: 30, right: 30 }}>
@@ -107,12 +111,14 @@ export function Heading2View({
 }
 
 export function Heading3View({
+  id,
   value: { text },
 }: {
+  id?: string
   value: Heading3Document['value']
 }) {
   return (
-    <FluidTable>
+    <FluidTable id={id}>
       <tbody>
         <tr>
           <Box padding={{ top: 20, left: 30, right: 30 }}>
@@ -125,12 +131,14 @@ export function Heading3View({
 }
 
 export function Heading4View({
+  id,
   value: { text },
 }: {
+  id?: string
   value: Heading4Document['value']
 }) {
   return (
-    <FluidTable>
+    <FluidTable id={id}>
       <tbody>
         <tr>
           <Box padding={{ top: 20, left: 30, right: 30 }}>
diff --git a/packages/triple-email-document/src/elements/index.ts b/packages/triple-email-document/src/elements/index.ts
index 5f33f5ee39..ee7f9dff2b 100644
--- a/packages/triple-email-document/src/elements/index.ts
+++ b/packages/triple-email-document/src/elements/index.ts
@@ -57,6 +57,7 @@ export type GetValue<Key extends TripleEmailElementType> = Extract<
 
 const ELEMENTS: {
   [key in TripleEmailElementType]: ComponentType<{
+    id?: string
     value: GetValue<key>
   }>
 } = {