@haruhimemoe/ui 0.11.1 → 0.11.2

package/CHANGELOG.md

@@ -6,6 +6,12 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 
 ## [Unreleased]
 
+## [0.11.2] - 2026-10-04
+
+### Fixed
+
+- `CopyMarkdownButton` copies on Safari and iOS: where `ClipboardItem` exists, the clipboard write starts inside the click with the fetched Markdown as a promised Blob, instead of after an awaited fetch that loses the user activation. Other browsers keep the fetch-then-`writeText` path.
+
 ## [0.11.1] - 2026-10-04
 
 ### Fixed
@@ -159,7 +165,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 - `className` on every component, and the extras passed to `buttonClasses` and `fieldClasses`, merge with tailwind-merge: a caller's class replaces a built-in one that sets the same property (`fieldClasses("w-auto")` drops `w-full`).
 - Shell: `SiteHeader` (brand slot, nav links as data with `aria-current`, actions slot), `NavLinks`, `SiteFooter` (link columns as data, fine print, the haruhime.moe wordmark and a GitHub link) and `PageShell` (skip link, header, main, footer).
 
-[unreleased]: https://github.com/haruhimemoe/ui/compare/v0.11.1...HEAD
+[unreleased]: https://github.com/haruhimemoe/ui/compare/v0.11.2...HEAD
+[0.11.2]: https://github.com/haruhimemoe/ui/compare/v0.11.1...v0.11.2
 [0.11.1]: https://github.com/haruhimemoe/ui/compare/v0.11.0...v0.11.1
 [0.11.0]: https://github.com/haruhimemoe/ui/compare/v0.10.0...v0.11.0
 [0.10.0]: https://github.com/haruhimemoe/ui/compare/v0.9.0...v0.10.0

package/dist/components/content/CopyMarkdownButton.d.ts

@@ -2,7 +2,9 @@
  * @file src/components/content/CopyMarkdownButton.tsx
  * @desc A button that fetches a page's raw Markdown and copies it to the clipboard, reporting the
  *       result in an `<output>` beside it (a polite live region), for a doc page's "Copy as
- *       Markdown" action. Any failure (the fetch rejects, the response isn't ok, or the clipboard
+ *       Markdown" action. Where `ClipboardItem` exists, the clipboard write starts inside the click
+ *       with the fetch as a promised Blob, since Safari rejects a write that starts after an
+ *       awaited fetch; elsewhere it fetches, then calls `writeText`. Any failure (the fetch rejects, the response isn't ok, or the clipboard
  *       refuses) announces the same failure message; the button never throws. Its own client file
  *       with finished class strings (no `cx`), so tailwind-merge stays out of the browser bundle
  *       for `ContentPage`, the Server Component that renders it. Not a wrapper around

package/dist/components/content/CopyMarkdownButton.js

@@ -2,7 +2,9 @@
  * @file src/components/content/CopyMarkdownButton.tsx
  * @desc A button that fetches a page's raw Markdown and copies it to the clipboard, reporting the
  *       result in an `<output>` beside it (a polite live region), for a doc page's "Copy as
- *       Markdown" action. Any failure (the fetch rejects, the response isn't ok, or the clipboard
+ *       Markdown" action. Where `ClipboardItem` exists, the clipboard write starts inside the click
+ *       with the fetch as a promised Blob, since Safari rejects a write that starts after an
+ *       awaited fetch; elsewhere it fetches, then calls `writeText`. Any failure (the fetch rejects, the response isn't ok, or the clipboard
  *       refuses) announces the same failure message; the button never throws. Its own client file
  *       with finished class strings (no `cx`), so tailwind-merge stays out of the browser bundle
  *       for `ContentPage`, the Server Component that renders it. Not a wrapper around
@@ -28,11 +30,23 @@ export function CopyMarkdownButton({ href, label = "Copy as Markdown", copiedLab
     const copy = async () => {
         const run = start();
         try {
-            const response = await fetch(href);
-            if (!response.ok)
-                throw new Error(String(response.status));
-            const text = await response.text();
-            await navigator.clipboard.writeText(text);
+            if (typeof ClipboardItem !== "undefined" && navigator.clipboard?.write) {
+                // Started synchronously in the click so Safari keeps the user activation.
+                const blob = fetch(href).then(async (response) => {
+                    if (!response.ok)
+                        throw new Error(String(response.status));
+                    return new Blob([await response.text()], { type: "text/plain" });
+                });
+                // If the write is refused before reading the blob, its own rejection stays handled.
+                blob.catch(() => undefined);
+                await navigator.clipboard.write([new ClipboardItem({ "text/plain": blob })]);
+            }
+            else {
+                const response = await fetch(href);
+                if (!response.ok)
+                    throw new Error(String(response.status));
+                await navigator.clipboard.writeText(await response.text());
+            }
             settle(run, "copied");
         }
         catch {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haruhimemoe/ui",
-  "version": "0.11.1",
+  "version": "0.11.2",
   "description": "React components for the haruhime.moe osu! tools on Next.js: the osu!-web-style palette as a Tailwind theme, buttons, cards, form fields and confirms, filter controls, tables, osu! beatmap display pieces and player cards, a command palette, content section tooling, brand pages and the site header and footer.",
   "keywords": [
     "osu",