Editor, toolbar, and button components with the lib they share, consumed by the mission briefing section and side-op dialogs. Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
39 lines
911 B
TypeScript
39 lines
911 B
TypeScript
import type { ReactNode } from "react";
|
|
import type { LucideIcon } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
export function LexicalRichTextToolbarButton({
|
|
active = false,
|
|
children,
|
|
disabled,
|
|
icon: Icon,
|
|
label,
|
|
onClick,
|
|
pressed = active,
|
|
}: {
|
|
active?: boolean;
|
|
children?: ReactNode;
|
|
disabled: boolean;
|
|
icon?: LucideIcon;
|
|
label: string;
|
|
onClick: () => void;
|
|
pressed?: boolean;
|
|
}) {
|
|
return (
|
|
<Button
|
|
type="button"
|
|
size="sm"
|
|
variant={active ? "secondary" : "outline"}
|
|
className={Icon ? "size-8 p-0" : "px-2.5"}
|
|
aria-label={label}
|
|
aria-pressed={pressed}
|
|
title={label}
|
|
disabled={disabled}
|
|
onMouseDown={(event) => event.preventDefault()}
|
|
onClick={onClick}
|
|
>
|
|
{Icon ? <Icon aria-hidden="true" /> : children}
|
|
{Icon && <span className="sr-only">{label}</span>}
|
|
</Button>
|
|
);
|
|
}
|