x

apps/spa/src/components/DynamicText.tsx

@@ -0,0 +1,31 @@
+import type { TextSectionPayload } from '@homaroma/types';
+
+interface DynamicTextProps {
+  payload: TextSectionPayload;
+}
+
+export default function DynamicText({ payload }: DynamicTextProps) {
+  const { title, content, textAlign = 'left' } = payload;
+
+  const alignClass = {
+    left: 'text-left',
+    center: 'text-center',
+    right: 'text-right',
+  }[textAlign] || 'text-left';
+
+  return (
+    <section className="py-16 px-6 bg-white relative">
+      <div className={`max-w-4xl mx-auto space-y-6 ${alignClass}`}>
+        {title && (
+          <h2 className="text-3xl md:text-4xl font-serif text-spa-forest font-semibold">
+            {title}
+          </h2>
+        )}
+        <div 
+          className="text-gray-600 leading-relaxed text-base md:text-lg font-light whitespace-pre-wrap"
+          dangerouslySetInnerHTML={{ __html: content }}
+        />
+      </div>
+    </section>
+  );
+}