@djangocfg/ui-core 2.1.580 → 2.1.582

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/ui-core",
-  "version": "2.1.580",
+  "version": "2.1.582",
   "description": "Pure React UI component library without Next.js dependencies - for Electron, Vite, CRA apps",
   "keywords": [
     "ui-components",
@@ -130,7 +130,7 @@
     "check:contrast": "node scripts/check-preset-contrast.mjs"
   },
   "peerDependencies": {
-    "@djangocfg/i18n": "^2.1.580",
+    "@djangocfg/i18n": "^2.1.582",
     "consola": "^3.4.2",
     "lucide-react": "^0.545.0",
     "moment": "^2.30.1",
@@ -206,9 +206,9 @@
     "vaul": "1.1.2"
   },
   "devDependencies": {
-    "@djangocfg/eslint-config": "^2.1.580",
-    "@djangocfg/i18n": "^2.1.580",
-    "@djangocfg/typescript-config": "^2.1.580",
+    "@djangocfg/eslint-config": "^2.1.582",
+    "@djangocfg/i18n": "^2.1.582",
+    "@djangocfg/typescript-config": "^2.1.582",
     "@storybook/react-vite": "^10.5.0",
     "@types/node": "^24.13.3",
     "@types/react": "19.2.15",

package/src/components/specialized/copy/index.tsx

@@ -4,6 +4,7 @@ import { Check, Copy } from 'lucide-react';
 import * as React from 'react';
 
 import { useAppT } from '@djangocfg/i18n';
+import { copyText } from '../../../lib/clipboard';
 import { cn } from '../../../lib/utils';
 import { Button } from '../../forms/button';
 
@@ -44,14 +45,10 @@ const CopyButton = React.forwardRef<HTMLButtonElement, CopyButtonProps>(
     const [copied, setCopied] = React.useState(false)
 
     const handleCopy = async () => {
-      try {
-        await navigator.clipboard.writeText(value)
-        setCopied(true)
-        onCopy?.(value)
-        setTimeout(() => setCopied(false), successDuration)
-      } catch (err) {
-        console.error('Failed to copy:', err)
-      }
+      if (!(await copyText(value))) return
+      setCopied(true)
+      onCopy?.(value)
+      setTimeout(() => setCopied(false), successDuration)
     }
 
     const hasLabel = !!children

package/src/hooks/dom/useCopy.ts

@@ -2,6 +2,7 @@
 
 import { useCallback } from 'react';
 
+import { copyText } from '../../lib/clipboard';
 import { useToast } from '../feedback/useToast';
 
 interface UseCopyOptions {
@@ -18,15 +19,10 @@ export const useCopy = (options: UseCopyOptions = {}) => {
     } = options;
 
     const copyToClipboard = useCallback(async (text: string, customSuccessMessage?: string) => {
-        try {
-            await navigator.clipboard.writeText(text);
-            toast.success(customSuccessMessage || successMessage);
-            return true;
-        } catch (error) {
-            console.error('Failed to copy:', error);
-            toast.error(errorMessage);
-            return false;
-        }
+        const copied = await copyText(text);
+        if (copied) toast.success(customSuccessMessage || successMessage);
+        else toast.error(errorMessage);
+        return copied;
     }, [toast, successMessage, errorMessage]);
 
     return { copyToClipboard };

package/src/lib/clipboard.ts

@@ -0,0 +1,35 @@
+/**
+ * Copy text from a click handler. Returns whether it landed.
+ *
+ * The Clipboard API first. When it is refused — an embedded browser that
+ * denies `clipboard-write`, a plain-http page, a document without focus — a
+ * hidden textarea and `execCommand('copy')`, which those browsers still honour
+ * within the same user gesture. Measured in the Claude desktop browser pane:
+ * `writeText` rejects with "Write permission denied", the fallback succeeds.
+ */
+export async function copyText(text: string): Promise<boolean> {
+  try {
+    await navigator.clipboard.writeText(text);
+    return true;
+  } catch {
+    return copyWithTextarea(text);
+  }
+}
+
+function copyWithTextarea(text: string): boolean {
+  if (typeof document === 'undefined') return false;
+  const area = document.createElement('textarea');
+  area.value = text;
+  area.setAttribute('readonly', '');
+  area.style.position = 'fixed';
+  area.style.opacity = '0';
+  document.body.appendChild(area);
+  area.select();
+  try {
+    return document.execCommand('copy');
+  } catch {
+    return false;
+  } finally {
+    area.remove();
+  }
+}

package/src/lib/index.ts

@@ -15,5 +15,6 @@ export * from "./styles";
 export * from "./compose-refs";
 export * from "./get-element-ref";
 export * from "./compose-event-handlers";
+export { copyText } from "./clipboard";
 export { createContext } from "./create-context";
 export { getIntensity } from "./intensity";