diff --git a/.changeset/common-streets-unite.md b/.changeset/common-streets-unite.md new file mode 100644 index 00000000..ec169c18 --- /dev/null +++ b/.changeset/common-streets-unite.md @@ -0,0 +1,5 @@ +--- +"streamdown": minor +--- + +Added accessibility improvements for code block controls by adding aria labels to copy/download buttons and announcing copy success state for screen readers. diff --git a/packages/streamdown/lib/code-block/copy-button.tsx b/packages/streamdown/lib/code-block/copy-button.tsx index b254cb05..105d34a7 100644 --- a/packages/streamdown/lib/code-block/copy-button.tsx +++ b/packages/streamdown/lib/code-block/copy-button.tsx @@ -66,19 +66,27 @@ export const CodeBlockCopyButton = ({ const Icon = isCopied ? icons.CheckIcon : icons.CopyIcon; return ( - + {isCopied && ( + + {t.copied} + )} - data-streamdown="code-block-copy-button" - disabled={isAnimating} - onClick={copyToClipboard} - title={t.copyCode} - type="button" - {...props} - > - {children ?? } - + ); }; diff --git a/packages/streamdown/lib/code-block/download-button.tsx b/packages/streamdown/lib/code-block/download-button.tsx index 4a315d1f..3edbca76 100644 --- a/packages/streamdown/lib/code-block/download-button.tsx +++ b/packages/streamdown/lib/code-block/download-button.tsx @@ -356,6 +356,7 @@ export const CodeBlockDownloadButton = ({ return (