fix: preserve psd text appearance while editing
This commit is contained in:
parent
a8e5252241
commit
9a1c7a8f3a
@ -169,6 +169,24 @@ function getAssignedImageStyle(layer: AgentPsdTemplateImageLayerSlot): CSSProper
|
||||
};
|
||||
}
|
||||
|
||||
function hasEditedTextValue(layer: AgentPsdTemplateTextLayerSlot, value: string) {
|
||||
return String(value || "").replace(/\r\n/g, "\n") !== String(layer.defaultText || "").replace(/\r\n/g, "\n");
|
||||
}
|
||||
|
||||
function getInlineTextEditorStyle(
|
||||
layer: AgentPsdTemplateTextLayerSlot,
|
||||
preserveSourceAppearance: boolean
|
||||
): CSSProperties {
|
||||
const baseStyle = getTextLayerContentStyle(layer);
|
||||
return {
|
||||
...baseStyle,
|
||||
background: "transparent",
|
||||
color: preserveSourceAppearance ? "transparent" : layer.textColor,
|
||||
caretColor: layer.textColor,
|
||||
WebkitTextFillColor: preserveSourceAppearance ? "transparent" : layer.textColor,
|
||||
};
|
||||
}
|
||||
|
||||
export function AgentPsdTemplateEditorDialog({
|
||||
open,
|
||||
onOpenChange,
|
||||
@ -618,9 +636,7 @@ export function AgentPsdTemplateEditorDialog({
|
||||
}
|
||||
|
||||
const value = effectiveTextAssignments[layer.id] || "";
|
||||
const defaultText = String(layer.defaultText || "");
|
||||
const shouldUseEditedPreview =
|
||||
value.trim().length > 0 && value.trim() !== defaultText.trim();
|
||||
const shouldUseEditedPreview = hasEditedTextValue(layer, value);
|
||||
|
||||
if (!shouldUseEditedPreview && layer.sourceUrl) {
|
||||
return (
|
||||
@ -697,6 +713,9 @@ export function AgentPsdTemplateEditorDialog({
|
||||
{orderedEditableTextLayers.map((layer) => {
|
||||
const isSelected = selectedLayerId === layer.id;
|
||||
const frameStyle = getLayerFrameStyle(layer, isSelected);
|
||||
const currentValue = effectiveTextAssignments[layer.id] || "";
|
||||
const preserveSourceAppearance =
|
||||
!!layer.sourceUrl && !hasEditedTextValue(layer, currentValue);
|
||||
|
||||
if (isSelected) {
|
||||
return (
|
||||
@ -706,12 +725,21 @@ export function AgentPsdTemplateEditorDialog({
|
||||
style={{
|
||||
...frameStyle,
|
||||
zIndex: 40,
|
||||
background: "rgba(56,189,248,0.08)",
|
||||
background: preserveSourceAppearance
|
||||
? "transparent"
|
||||
: "rgba(56,189,248,0.08)",
|
||||
}}
|
||||
>
|
||||
{preserveSourceAppearance && layer.sourceUrl ? (
|
||||
<img
|
||||
src={layer.sourceUrl}
|
||||
alt={layer.layerName}
|
||||
className="pointer-events-none absolute inset-0 h-full w-full object-fill"
|
||||
/>
|
||||
) : null}
|
||||
<textarea
|
||||
ref={inlineTextEditorRef}
|
||||
value={effectiveTextAssignments[layer.id] || ""}
|
||||
value={currentValue}
|
||||
onChange={(event) =>
|
||||
setTextAssignments((current) => ({
|
||||
...current,
|
||||
@ -719,7 +747,7 @@ export function AgentPsdTemplateEditorDialog({
|
||||
}))
|
||||
}
|
||||
className="h-full w-full resize-none border-none bg-transparent outline-none"
|
||||
style={getTextLayerContentStyle(layer)}
|
||||
style={getInlineTextEditorStyle(layer, preserveSourceAppearance)}
|
||||
/>
|
||||
<div className="absolute left-2 top-2 rounded-full bg-black/70 px-2 py-1 text-[11px] text-white">
|
||||
{layer.layerName}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user