da37692485Codebase-wide sweep bringing the web client into strict compliance with the AGENTS.md TypeScript and Mantine/React conventions: ~170 inline 2+-static-prop elements extracted to named .withProps() constants across ~77 files, the AGENTS.md rule wording tightened to match (static-prop boundary + Accordion/Transition/data-*/Box exemptions), a real ScreenStage Box->Flex layout regression fixed (direction: column) with a Storybook regression guard, and an App.tsx double-cast tightened. Closes #1762.
38 lines
982 B
TypeScript
38 lines
982 B
TypeScript
import {
|
|
ActionIcon,
|
|
CopyButton as MantineCopyButton,
|
|
Tooltip,
|
|
} from "@mantine/core";
|
|
|
|
export interface CopyButtonProps {
|
|
value: string;
|
|
/**
|
|
* Drop ActionIcon padding/height so the glyph top-aligns in tight aside
|
|
* rows (e.g. beside a Code block). Icon size is unchanged.
|
|
*/
|
|
flush?: boolean;
|
|
}
|
|
|
|
const CopyActionIcon = ActionIcon.withProps({
|
|
variant: "subtle",
|
|
fz: 24,
|
|
});
|
|
|
|
export function CopyButton({ value, flush = false }: CopyButtonProps) {
|
|
return (
|
|
<MantineCopyButton value={value}>
|
|
{({ copied, copy }) => (
|
|
<Tooltip label={copied ? "Copied" : "Copy"}>
|
|
<CopyActionIcon
|
|
color={copied ? "green" : "var(--inspector-text-primary)"}
|
|
onClick={copy}
|
|
aria-label={copied ? "Copied" : "Copy"}
|
|
{...(flush && { p: 0, h: "auto", w: "auto" })}
|
|
>
|
|
{copied ? "\u2713" : "\u2398"}
|
|
</CopyActionIcon>
|
|
</Tooltip>
|
|
)}
|
|
</MantineCopyButton>
|
|
);
|
|
}
|