feat: add explicit psd text color switch buttons
Some checks failed
Lint / build (20) (push) Has been cancelled
Playwright Tests / test (push) Has been cancelled

This commit is contained in:
Your Name 2026-04-03 12:28:30 +08:00
parent 1cf1ba6bb6
commit d7d33ebc4a

View File

@ -2209,7 +2209,7 @@ export function AgentPsdTemplateEditorDialog({
<div>
<div className="font-medium text-sm">文字颜色</div>
<div className="text-muted-foreground text-xs">
当前模板允许在两种系统预设颜色之间切换。
选中文字后,可直接点击下面按钮切换品牌预设文字颜色。
</div>
</div>
<div
@ -2217,6 +2217,43 @@ export function AgentPsdTemplateEditorDialog({
style={{ backgroundColor: selectedTextColor }}
/>
</div>
<div className="grid grid-cols-2 gap-2">
{textColorConfig.colors.map((color, index) => {
const isActive =
getResolvedTextLayerColor(
selectedTextLayer,
color
) ===
getResolvedTextLayerColor(
selectedTextLayer,
selectedTextColor
);
return (
<Button
className={`h-11 justify-start gap-2.5 rounded-xl border px-3 text-left ${
isActive
? "border-emerald-400/60 bg-emerald-500/[0.14] text-white hover:bg-emerald-500/[0.18]"
: "border-white/10 bg-white/[0.02] text-white/80 hover:bg-white/[0.06]"
}`}
key={`text-color-button-${index + 1}`}
onClick={() =>
setTextColorAssignments((current) => ({
...current,
[selectedTextLayer.id]: color,
}))
}
type="button"
variant="ghost"
>
<span
className="h-5 w-5 shrink-0 rounded-full border border-white/20"
style={{ backgroundColor: color }}
/>
<span className="min-w-0 flex-1 truncate font-medium text-sm">{`切换为颜色 ${index + 1}`}</span>
</Button>
);
})}
</div>
<div className="grid grid-cols-2 gap-2">
{textColorConfig.colors.map((color, index) => {
const isActive =