@peektravel/app-utilities 0.2.5 → 0.2.7

package/dist/ui/index.d.cts

@@ -939,9 +939,15 @@ declare class OdyTabs extends OdyElement {
 }
 
 /**
- * `<ody-copy-button>` — a button that copies its `value` to the clipboard via
- * `navigator.clipboard.writeText`, showing a transient success (or error) state.
- * Dispatches a `copy` CustomEvent with `{ value, ok }`.
+ * `<ody-copy-button>` — a button that copies its `value` to the clipboard,
+ * showing a transient success (or error) state. Dispatches a `copy`
+ * CustomEvent with `{ value, ok }`.
+ *
+ * The copy uses a synchronous `document.execCommand('copy')` as the source of
+ * truth so it works inside cross-origin iframes (where the async Clipboard API
+ * is blocked by default) and legacy contexts. The async
+ * `navigator.clipboard.writeText` is used only as a best-effort enhancement
+ * when the synchronous path can't run.
  *
  * Attributes:
  * - `value` — the text copied to the clipboard.

package/dist/ui/index.d.ts

@@ -939,9 +939,15 @@ declare class OdyTabs extends OdyElement {
 }
 
 /**
- * `<ody-copy-button>` — a button that copies its `value` to the clipboard via
- * `navigator.clipboard.writeText`, showing a transient success (or error) state.
- * Dispatches a `copy` CustomEvent with `{ value, ok }`.
+ * `<ody-copy-button>` — a button that copies its `value` to the clipboard,
+ * showing a transient success (or error) state. Dispatches a `copy`
+ * CustomEvent with `{ value, ok }`.
+ *
+ * The copy uses a synchronous `document.execCommand('copy')` as the source of
+ * truth so it works inside cross-origin iframes (where the async Clipboard API
+ * is blocked by default) and legacy contexts. The async
+ * `navigator.clipboard.writeText` is used only as a best-effort enhancement
+ * when the synchronous path can't run.
  *
  * Attributes:
  * - `value` — the text copied to the clipboard.

package/dist/ui/index.js

@@ -2149,16 +2149,47 @@ var OdyCopyButton = class extends OdyElement {
   }
   #onClick = () => {
     const value = this.attr("value");
-    const clipboard = typeof navigator !== "undefined" ? navigator.clipboard : void 0;
-    if (!clipboard || typeof clipboard.writeText !== "function") {
-      this.#feedback("error", value);
-      return;
+    const ok = this.#execCopy(value);
+    if (!ok) {
+      const clipboard = typeof navigator !== "undefined" ? navigator.clipboard : void 0;
+      if (clipboard && typeof clipboard.writeText === "function") {
+        void clipboard.writeText(value).then(
+          () => void 0,
+          () => void 0
+        );
+      }
     }
-    void clipboard.writeText(value).then(
-      () => this.#feedback("success", value),
-      () => this.#feedback("error", value)
-    );
+    this.#feedback(ok ? "success" : "error", value);
   };
+  /**
+   * Synchronous clipboard write. Must be called within the user-gesture window
+   * (i.e. directly from the click handler, not from an async continuation).
+   * Works in cross-origin iframes and legacy contexts where the async Clipboard
+   * API is unavailable or blocked.
+   */
+  #execCopy(value) {
+    if (!value || typeof document === "undefined") return false;
+    const el = document.createElement("textarea");
+    el.value = value;
+    el.setAttribute("readonly", "");
+    el.style.position = "fixed";
+    el.style.top = "0";
+    el.style.left = "0";
+    el.style.opacity = "0";
+    document.body.appendChild(el);
+    el.select();
+    try {
+      el.setSelectionRange(0, value.length);
+    } catch {
+    }
+    let ok = false;
+    try {
+      ok = document.execCommand("copy");
+    } catch {
+    }
+    document.body.removeChild(el);
+    return ok;
+  }
   #feedback(state, value) {
     this.#state = state;
     this.render();