Workspace · Monolith

1import React, { useState, useEffect } from 'react'2import { EditorProps } from './types'3import { useKeyboard } from '../hooks/useKeyboard'4/**5 * Main editor component handling text input and rendering6 */7export function Editor({ content, onChange }: EditorProps) {8  const [lines, setLines] = useState<string[]>([]);9  const selection = useSelection();10 11  // Initialize content12  useEffect(() => {13    if (content) {14      setLines(content.split('\n'));15    }16  }, [content]);17  const handleInput = (e: React.ChangeEvent) => {18    const newValue = e.target.value;19    onChange(newValue);20  };21  return (22    <div className="editor-container" onInput={handleInput}>23      {lines.map((line, i) => <Line key={i} content={line} />}24    </div>25  );26}27

import React, { useState, useEffect } from 'react'
import { EditorProps } from './types'
import { useKeyboard } from '../hooks/useKeyboard'
/**
 * Main editor component handling text input and rendering
 */
export function Editor({ content, onChange }: EditorProps) {
  const [lines, setLines] = useState<string[]>([]);
  const selection = useSelection();

  // Initialize content
  useEffect(() => {
    if (content) {
      setLines(content.split('\n'));
    }
  }, [content]);
  const handleInput = (e: React.ChangeEvent) => {
    const newValue = e.target.value;
    onChange(newValue);
  };
  return (
    <div className="editor-container" onInput={handleInput}>
      {lines.map((line, i) => <Line key={i} content={line} />}
    </div>
  );
}