From 061f79c473c68764235b793f63e6fdb9c4998313 Mon Sep 17 00:00:00 2001
From: Pabloader <pabloader@pabloader.ru>
Date: Thu, 19 Mar 2026 16:21:54 +0000
Subject: [PATCH] ContentEditable fixes

---
 src/common/components/ContentEditable.tsx      |  1 -
 src/games/storywriter/assets/editor.module.css | 10 +++++++---
 src/games/storywriter/components/editor.tsx    |  2 +-
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/common/components/ContentEditable.tsx b/src/common/components/ContentEditable.tsx
index 1f61fde..8a79cc4 100644
--- a/src/common/components/ContentEditable.tsx
+++ b/src/common/components/ContentEditable.tsx
@@ -98,7 +98,6 @@ export const ContentEditable = ({ value, onInput, ...props }: Props) => {
         <div
             ref={ref}
             contentEditable
-            style="white-space: pre"
             onKeyDown={handleKeyDown}
             onInput={onInput}
             {...props}
diff --git a/src/games/storywriter/assets/editor.module.css b/src/games/storywriter/assets/editor.module.css
index c2987c9..15a9632 100644
--- a/src/games/storywriter/assets/editor.module.css
+++ b/src/games/storywriter/assets/editor.module.css
@@ -3,16 +3,17 @@
     display: flex;
     flex-direction: column;
     height: 100%;
-    overflow: hidden;
+    overflow-y: auto;
     background: var(--bg);
+    padding: 36px 0;
 }
 
 .editable {
     flex: 1;
     width: 100%;
-    height: 100%;
+    min-height: 100%;
     resize: none;
-    padding: 48px 72px;
+    padding: 0 72px;
     font-family: 'Georgia', serif;
     font-size: 17px;
     line-height: 1.9;
@@ -21,6 +22,9 @@
     border: none;
     outline: none;
     box-sizing: border-box;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
 
     &::placeholder {
         color: var(--text-muted);
diff --git a/src/games/storywriter/components/editor.tsx b/src/games/storywriter/components/editor.tsx
index 101344c..d3bd164 100644
--- a/src/games/storywriter/components/editor.tsx
+++ b/src/games/storywriter/components/editor.tsx
@@ -12,7 +12,7 @@ export const Editor = () => {
     }
 
     const handleInput = (e: Event) => {
-        const text = (e.target as HTMLElement).textContent;
+        const text = (e.target as HTMLElement).textContent || '';
         dispatch({
             type: 'EDIT_STORY',
             id: currentStory.id,