mirror of
https://github.com/RooVetGit/Roo-Code.git
synced 2026-10-07 02:58:15 +00:00
dfcf8fe760
* add mermaid buttons * feat: Add Modal, TabButton, and ZoomControls components * feat: Add error handling messages for image operations and file opening * mermaid: Add drag functionality and support contious zooming * add active color for tabbutton * refactor zoom controls * refactor: Remove unused svgToPng prop and simplify handleCopy function * Move zoom to constants and increase max zoom * feat: add save image functionality and refactor image handling * feat: add translations --------- Co-authored-by: Daniel Riccio <ricciodaniel98@gmail.com> Co-authored-by: Matt Rubens <mrubens@users.noreply.github.com>
26 lines
884 B
TypeScript
26 lines
884 B
TypeScript
interface TabButtonProps {
|
|
icon: string
|
|
label: string
|
|
isActive: boolean
|
|
onClick: () => void
|
|
}
|
|
|
|
export function TabButton({ icon, label, isActive, onClick }: TabButtonProps) {
|
|
const activeClasses =
|
|
"bg-vscode-editor-background border-b-2 border-vscode-focusBorder text-vscode-editor-foreground"
|
|
const inactiveClasses =
|
|
"bg-transparent border-b-2 border-transparent text-vscode-descriptionForeground hover:text-vscode-editor-foreground hover:bg-vscode-toolbar-hoverBackground"
|
|
|
|
return (
|
|
<button
|
|
className={`px-4 py-2 border-none cursor-pointer flex items-center gap-1.5 text-[13px] transition-all duration-200 ease-in-out ${
|
|
isActive ? activeClasses : inactiveClasses
|
|
}`}
|
|
onClick={onClick}>
|
|
<span
|
|
className={`codicon codicon-${icon} text-sm`}
|
|
style={isActive ? { color: "var(--vscode-focusBorder)" } : undefined}></span>
|
|
{label}
|
|
</button>
|
|
)
|
|
}
|