All files / src/components/Editor Editor.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
10x
 
 
 
 
 
 
 
 
 
 
 
10x
40x
 
 
 
12x
 
 
 
 
 
 
 
 
 
3x
 
 
 
 
import { RichtextEditor } from './RichtextEditor'
 
export type EditorParams = {
  value: string
  onChange: (val: string) => void
  /** if true, display as a RichTextEditor, otherwise, display as a textarea */
  richtextMode?: boolean
}
 
/**
 * Text editor component that can be switched between displaying as a textarea or a RichTextEditor.
 */
export const Editor = ({ value, onChange, richtextMode = true }: EditorParams) => {
  return richtextMode ? (
    <RichtextEditor
      value={value}
      onChange={(val, delta, source) =>
        source === 'user' &&
        /* istanbul ignore next */
        onChange(val)
      }
    />
  ) : (
    <textarea
      rows={3}
      className='sqc-my-2.5 sqc-block sqc-w-full sqc-rounded-lg sqc-border sqc-border-gray-300 sqc-bg-gray-50 sqc-p-2.5 sqc-text-sm sqc-text-gray-900 focus:sqc-border-blue-500 focus:sqc-ring-blue-500'
      value={value}
      onChange={(e) => onChange(e.target.value)}
    />
  )
}