Update RichTextEditor.tsx

This commit is contained in:
fcarraUniSa
2025-12-11 14:10:25 +01:00
committed by GitHub
parent 74d18e9dd5
commit 6e35efb065

View File

@@ -76,11 +76,11 @@ const RichTextEditor: React.FC<Props> = ({ value, onChange, placeholder, classNa
e.preventDefault(); // Prevent default button behavior e.preventDefault(); // Prevent default button behavior
e.stopPropagation(); e.stopPropagation();
const varName = prompt("Enter variable name (without brackets):", "variable_name"); const varName = prompt("Inserisci nome variabile (senza parentesi):", "nome_variabile");
if (varName) { if (varName) {
if (isSourceMode) { if (isSourceMode) {
alert("Switch to Visual mode to use the inserter, or type {{name}} manually."); alert("Passa alla modalità Visuale per usare l'inseritore, oppure scrivi {{nome}} manualmente.");
} else { } else {
restoreSelection(); restoreSelection();
const text = `{{${varName}}}`; const text = `{{${varName}}}`;
@@ -136,24 +136,24 @@ const RichTextEditor: React.FC<Props> = ({ value, onChange, placeholder, classNa
onClick={() => setIsSourceMode(!isSourceMode)} onClick={() => setIsSourceMode(!isSourceMode)}
className={`flex items-center gap-1 px-2 py-1.5 rounded text-xs font-medium transition-colors ${isSourceMode ? 'bg-slate-800 text-white' : 'hover:bg-slate-200 text-slate-600'}`} className={`flex items-center gap-1 px-2 py-1.5 rounded text-xs font-medium transition-colors ${isSourceMode ? 'bg-slate-800 text-white' : 'hover:bg-slate-200 text-slate-600'}`}
> >
{isSourceMode ? <><Type size={14} /> Visual</> : <><Code size={14} /> Source</>} {isSourceMode ? <><Type size={14} /> Visuale</> : <><Code size={14} /> Sorgente</>}
</button> </button>
</div> </div>
{!isSourceMode && ( {!isSourceMode && (
<> <>
<ToolbarButton icon={Bold} command="bold" title="Bold" /> <ToolbarButton icon={Bold} command="bold" title="Grassetto" />
<ToolbarButton icon={Italic} command="italic" title="Italic" /> <ToolbarButton icon={Italic} command="italic" title="Corsivo" />
<ToolbarButton icon={Underline} command="underline" title="Underline" /> <ToolbarButton icon={Underline} command="underline" title="Sottolineato" />
<div className="w-px h-4 bg-slate-300 mx-1" /> <div className="w-px h-4 bg-slate-300 mx-1" />
<ToolbarButton icon={AlignLeft} command="justifyLeft" title="Align Left" /> <ToolbarButton icon={AlignLeft} command="justifyLeft" title="Allinea Sinistra" />
<ToolbarButton icon={AlignCenter} command="justifyCenter" title="Align Center" /> <ToolbarButton icon={AlignCenter} command="justifyCenter" title="Allinea Centro" />
<ToolbarButton icon={AlignRight} command="justifyRight" title="Align Right" /> <ToolbarButton icon={AlignRight} command="justifyRight" title="Allinea Destra" />
<div className="w-px h-4 bg-slate-300 mx-1" /> <div className="w-px h-4 bg-slate-300 mx-1" />
<ToolbarButton icon={List} command="insertUnorderedList" title="Bullet List" /> <ToolbarButton icon={List} command="insertUnorderedList" title="Elenco Puntato" />
<ToolbarButton icon={ListOrdered} command="insertOrderedList" title="Numbered List" /> <ToolbarButton icon={ListOrdered} command="insertOrderedList" title="Elenco Numerato" />
<div className="w-px h-4 bg-slate-300 mx-1" /> <div className="w-px h-4 bg-slate-300 mx-1" />
<ToolbarButton icon={Eraser} command="removeFormat" title="Clear Formatting" /> <ToolbarButton icon={Eraser} command="removeFormat" title="Rimuovi Formattazione" />
<div className="flex-1" /> <div className="flex-1" />
@@ -161,10 +161,10 @@ const RichTextEditor: React.FC<Props> = ({ value, onChange, placeholder, classNa
type="button" type="button"
onClick={insertVariable} onClick={insertVariable}
className="flex items-center gap-1 px-2 py-1.5 rounded bg-brand-50 text-brand-600 hover:bg-brand-100 text-xs font-medium border border-brand-200" className="flex items-center gap-1 px-2 py-1.5 rounded bg-brand-50 text-brand-600 hover:bg-brand-100 text-xs font-medium border border-brand-200"
title="Insert Variable Placeholder" title="Inserisci Variabile"
> >
<Braces size={14} /> <Braces size={14} />
Variable Variabile
</button> </button>
</> </>
)} )}
@@ -195,7 +195,7 @@ const RichTextEditor: React.FC<Props> = ({ value, onChange, placeholder, classNa
{!value && !isSourceMode && ( {!value && !isSourceMode && (
<div className="absolute top-4 left-4 text-slate-400 pointer-events-none select-none"> <div className="absolute top-4 left-4 text-slate-400 pointer-events-none select-none">
{placeholder || "Start typing..."} {placeholder || "Inizia a scrivere..."}
</div> </div>
)} )}
</div> </div>