@chaindaddy/js 0.1.0 → 0.2.0

package/dist/cd.js

@@ -1,4 +1,4 @@
-"use strict";(()=>{var m="0.1.0";function f(e){let t="";for(let r of e)t+=String.fromCharCode(r);return btoa(t).replace(/\+/g,"-").replace(/\//g,"_").replace(/=+$/,"")}function u(){return f(crypto.getRandomValues(new Uint8Array(32)))}function b(e,t,r,n){let i=s=>{if(s&&typeof s=="object"&&s.type===e)try{r(s)}catch{}},c=s=>{s.origin===t&&i(s.data)};window.addEventListener("message",c);let a=null;if(n&&typeof BroadcastChannel=="function"&&t===location.origin)try{a=new BroadcastChannel(n),a.onmessage=s=>i(s.data)}catch{a=null}return()=>{window.removeEventListener("message",c),a?.close()}}var d={get(e){try{return sessionStorage.getItem(e)}catch{return null}},set(e,t){try{sessionStorage.setItem(e,t)}catch{}},remove(e){try{sessionStorage.removeItem(e)}catch{}}};var x="https://api.chaindaddy.io",_={"https://api.chaindaddy.io":"https://chaindaddy.io/_oauth/authorize","https://staging-api.chaindaddy.io":"https://staging.chaindaddy.io/_oauth/authorize"},g="cd-signin",y="cd:signin",h="cd.signin";async function U(e){let t=await crypto.subtle.digest("SHA-256",new TextEncoder().encode(e));return f(new Uint8Array(t))}function k(e="openid"){let t=e.split(/\s+/).filter(Boolean);return(t.includes("openid")?t:["openid",...t]).join(" ")}async function C(e,t,r){let n=new URLSearchParams({response_type:"code",client_id:t.clientId,redirect_uri:t.redirectUri,scope:k(e.scope),state:t.state,nonce:t.nonce,code_challenge:await U(t.verifier),code_challenge_method:"S256"});return e.claims&&n.set("claims",typeof e.claims=="string"?e.claims:JSON.stringify(e.claims)),`${r}?${n}`}function S(e,t){return{code:t,codeVerifier:e.verifier,state:e.state,nonce:e.nonce,issuer:e.issuer,clientId:e.clientId,redirectUri:e.redirectUri}}function p(e){let t=(e.issuer??x).replace(/\/$/,""),r=e.authorizeUrl??_[t];if(!r)return Promise.reject(new Error("authorizeUrl is required for this issuer"));if(!e.clientId||!e.redirectUri)return Promise.reject(new Error("clientId and redirectUri are required"));let n={state:u(),nonce:u(),verifier:u(),issuer:t,clientId:e.clientId,redirectUri:e.redirectUri};d.set(h,JSON.stringify(n));let i=window.open("",g,"popup,width=480,height=720");return(async()=>{let c=await C(e,n,r);if(!i)return location.assign(c),null;i.location.href=c;let a=new URL(e.redirectUri,location.href).origin;return new Promise((s,l)=>{let w=b(y,a,o=>{o.state===n.state&&(w(),d.remove(h),typeof o.error=="string"&&o.error?l(new Error(o.error)):o.iss!==t?l(new Error("the answer came from another issuer")):typeof o.code!="string"||!o.code?l(new Error("the answer carried no code")):s(S(n,o.code)))},g);e.signal?.addEventListener("abort",()=>{w(),l(new Error("aborted"))})})})()}async function E(){let e=new URLSearchParams(location.search),t={type:y,code:e.get("code"),state:e.get("state"),iss:e.get("iss"),error:e.get("error")};if(window.name===g){try{window.opener?.postMessage(t,location.origin)}catch{}try{let i=new BroadcastChannel(g);i.postMessage(t),i.close()}catch{}return window.close(),null}let r=d.get(h);d.remove(h);let n=r?JSON.parse(r):null;if(!n||t.state!==n.state)throw new Error("the sign-in state does not match: start again");if(t.error)throw new Error(t.error);if(t.iss!==n.issuer)throw new Error("the answer came from another issuer");if(!t.code)throw new Error("the answer carried no code");return S(n,t.code)}async function v(e){let t=await fetch(`${e.issuer}/api/v2/oauth/token`,{method:"POST",headers:{"Content-Type":"application/x-www-form-urlencoded"},body:new URLSearchParams({grant_type:"authorization_code",code:e.code,redirect_uri:e.redirectUri,client_id:e.clientId,code_verifier:e.codeVerifier})}),r=await t.json();if(!t.ok)throw new Error(`${r.error??t.status}: ${r.error_description??""}`.trim());return r}var R='<svg viewBox="0 0 24 24" fill="#FFD700" width="20" height="20" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><path d="M5 16L3 5l5.5 5L12 4l3.5 6L21 5l-2 11H5z" stroke="#B8860B" stroke-width="0.5"/><path d="M5 18h14v2H5v-2z" stroke="#B8860B" stroke-width="0.5"/></svg>',P=`
+"use strict";(()=>{var w="0.2.0";function b(t){let e="";for(let i of t)e+=String.fromCharCode(i);return btoa(e).replace(/\+/g,"-").replace(/\//g,"_").replace(/=+$/,"")}function g(){return b(crypto.getRandomValues(new Uint8Array(32)))}function v(t,e,i,s){let c=a=>{if(a&&typeof a=="object"&&a.type===t)try{i(a)}catch{}},u=a=>{a.origin===e&&c(a.data)};window.addEventListener("message",u);let d=null;if(s&&typeof BroadcastChannel=="function"&&e===location.origin)try{d=new BroadcastChannel(s),d.onmessage=a=>c(a.data)}catch{d=null}return()=>{window.removeEventListener("message",u),d?.close()}}var h={get(t){try{return sessionStorage.getItem(t)}catch{return null}},set(t,e){try{sessionStorage.setItem(t,e)}catch{}},remove(t){try{sessionStorage.removeItem(t)}catch{}}};var A="https://api.chaindaddy.io",T={"https://api.chaindaddy.io":"https://chaindaddy.io/_oauth/authorize","https://staging-api.chaindaddy.io":"https://staging.chaindaddy.io/_oauth/authorize"},p="cd-signin",E="cd:signin",m="cd.signin";async function U(t){let e=await crypto.subtle.digest("SHA-256",new TextEncoder().encode(t));return b(new Uint8Array(e))}function M(t="openid"){let e=t.split(/\s+/).filter(Boolean);return(e.includes("openid")?e:["openid",...e]).join(" ")}async function L(t,e,i){let s=new URLSearchParams({response_type:"code",client_id:e.clientId,redirect_uri:e.redirectUri,scope:M(t.scope),state:e.state,nonce:e.nonce,code_challenge:await U(e.verifier),code_challenge_method:"S256"});return t.claims&&s.set("claims",typeof t.claims=="string"?t.claims:JSON.stringify(t.claims)),`${i}?${s}`}function x(t,e){return{code:e,codeVerifier:t.verifier,state:t.state,nonce:t.nonce,issuer:t.issuer,clientId:t.clientId,redirectUri:t.redirectUri}}function f(t){let e=(t.issuer??A).replace(/\/$/,""),i=t.authorizeUrl??T[e];if(!i)return Promise.reject(new Error("authorizeUrl is required for this issuer"));if(!t.clientId||!t.redirectUri)return Promise.reject(new Error("clientId and redirectUri are required"));let s={state:g(),nonce:g(),verifier:g(),issuer:e,clientId:t.clientId,redirectUri:t.redirectUri};h.set(m,JSON.stringify(s));let c=window.open("",p,"popup,width=480,height=720");return(async()=>{let u=await L(t,s,i);if(!c)return location.assign(u),null;c.location.href=u;let d=new URL(t.redirectUri,location.href).origin;return new Promise((a,n)=>{let o=v(E,d,r=>{r.state===s.state&&(o(),h.remove(m),typeof r.error=="string"&&r.error?n(new Error(r.error)):r.iss!==e?n(new Error("the answer came from another issuer")):typeof r.code!="string"||!r.code?n(new Error("the answer carried no code")):a(x(s,r.code)))},p);t.signal?.addEventListener("abort",()=>{o(),n(new Error("aborted"))})})})()}async function S(){let t=new URLSearchParams(location.search),e={type:E,code:t.get("code"),state:t.get("state"),iss:t.get("iss"),error:t.get("error")};if(window.name===p){try{window.opener?.postMessage(e,location.origin)}catch{}try{let c=new BroadcastChannel(p);c.postMessage(e),c.close()}catch{}return window.close(),null}let i=h.get(m);h.remove(m);let s=i?JSON.parse(i):null;if(!s||e.state!==s.state)throw new Error("the sign-in state does not match: start again");if(e.error)throw new Error(e.error);if(e.iss!==s.issuer)throw new Error("the answer came from another issuer");if(!e.code)throw new Error("the answer carried no code");return x(s,e.code)}async function k(t){let e=await fetch(`${t.issuer}/api/v2/oauth/token`,{method:"POST",headers:{"Content-Type":"application/x-www-form-urlencoded"},body:new URLSearchParams({grant_type:"authorization_code",code:t.code,redirect_uri:t.redirectUri,client_id:t.clientId,code_verifier:t.codeVerifier})}),i=await e.json();if(!e.ok)throw new Error(`${i.error??e.status}: ${i.error_description??""}`.trim());return i}var O='<svg viewBox="0 0 24 24" fill="#FFD700" width="20" height="20" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><path d="M5 16L3 5l5.5 5L12 4l3.5 6L21 5l-2 11H5z" stroke="#B8860B" stroke-width="0.5"/><path d="M5 18h14v2H5v-2z" stroke="#B8860B" stroke-width="0.5"/></svg>',P=`
 :host { display: inline-block; }
 button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; box-sizing: border-box;
   min-height: 40px; padding: 0 16px; border-radius: 10px; font: 600 15px/1 system-ui, -apple-system, "Segoe UI", sans-serif;
@@ -7,4 +7,16 @@ button[data-theme="dark"] { background: #101828; color: #ffffff; border-color: #
 button:focus-visible { outline: 2px solid #f59e0b; outline-offset: 2px; }
 button:disabled { opacity: .6; cursor: default; }
 svg { flex: none; }
-`;function I(){if(typeof customElements>"u"||customElements.get("cd-signin-button"))return;class e extends HTMLElement{constructor(){super(),this.root=this.attachShadow({mode:"open"})}connectedCallback(){this.render()}attributeChangedCallback(){this.isConnected&&this.render()}render(){let r=this.getAttribute("text")==="continue"?"Continue with Chain Daddy":"Sign in with Chain Daddy",n=this.getAttribute("theme")==="dark"?"dark":"light";this.root.innerHTML=`<style>${P}</style><button type="button" part="button" data-theme="${n}">${R}<span></span></button>`;let i=this.root.querySelector("button");i.querySelector("span").textContent=r,i.addEventListener("click",()=>this.start())}start(){let r=n=>this.getAttribute(n)||void 0;p({clientId:r("client-id")??"",redirectUri:r("redirect-uri")??"",scope:r("scope"),claims:r("claims"),issuer:r("issuer"),authorizeUrl:r("authorize-url")}).then(n=>n&&this.dispatchEvent(new CustomEvent("cd-signin",{detail:n,bubbles:!0,composed:!0})),n=>this.dispatchEvent(new CustomEvent("cd-signin-error",{detail:{message:String(n?.message??n)},bubbles:!0,composed:!0})))}}e.observedAttributes=["theme","text"],customElements.define("cd-signin-button",e)}var O={version:m,signIn:p,handleCallback:E,exchangeCode:v};window.ChainDaddy=Object.assign(window.ChainDaddy??{},O);I();})();
+`;function I(){if(typeof customElements>"u"||customElements.get("cd-signin-button"))return;class t extends HTMLElement{constructor(){super(),this.root=this.attachShadow({mode:"open"})}connectedCallback(){this.render()}attributeChangedCallback(){this.isConnected&&this.render()}render(){let i=this.getAttribute("text")==="continue"?"Continue with Chain Daddy":"Sign in with Chain Daddy",s=this.getAttribute("theme")==="dark"?"dark":"light";this.root.innerHTML=`<style>${P}</style><button type="button" part="button" data-theme="${s}">${O}<span></span></button>`;let c=this.root.querySelector("button");c.querySelector("span").textContent=i,c.addEventListener("click",()=>this.start())}start(){let i=s=>this.getAttribute(s)||void 0;f({clientId:i("client-id")??"",redirectUri:i("redirect-uri")??"",scope:i("scope"),claims:i("claims"),issuer:i("issuer"),authorizeUrl:i("authorize-url")}).then(s=>s&&this.dispatchEvent(new CustomEvent("cd-signin",{detail:s,bubbles:!0,composed:!0})),s=>this.dispatchEvent(new CustomEvent("cd-signin-error",{detail:{message:String(s?.message??s)},bubbles:!0,composed:!0})))}}t.observedAttributes=["theme","text"],customElements.define("cd-signin-button",t)}var C="https://embed.chaindaddy.io",y="https://embed-staging.chaindaddy.io";var H=["--cd-accent","--cd-surface","--cd-text","--cd-text-muted","--cd-border"];function _(t){try{if(t&&new URL(t).hostname==="js.staging.chaindaddy.io")return y}catch{}return C}var D=`
+:host { display: block; }
+iframe { display: block; width: 100%; border: 0; height: 1px; opacity: 0; color-scheme: normal; }
+:host([data-cd-ready]) iframe { opacity: 1; }
+:host([data-cd-ready]) slot { display: none; }
+:host([data-cd-unavailable]) iframe { display: none; }
+`,z=`
+:host { display: inline-block; }
+button { box-sizing: border-box; min-height: 40px; padding: 0 16px; border-radius: 10px; cursor: pointer;
+  font: 600 15px/1 system-ui, -apple-system, "Segoe UI", sans-serif;
+  border: 1px solid var(--cd-border, #d0d5dd); background: var(--cd-accent, #f59e0b); color: var(--cd-text, #101828); }
+button:focus-visible { outline: 2px solid var(--cd-accent, #f59e0b); outline-offset: 2px; }
+`;function R(t={}){try{if(typeof customElements>"u"||typeof HTMLElement>"u")return;let e=t.origin===y?y:C;class i extends HTMLElement{constructor(){super(...arguments);this.kind="app";this.frame=null;this.onMessage=n=>this.receive(n)}connectedCallback(){try{this.shadowRoot||this.attachShadow({mode:"open"}),this.mount()}catch{this.unavailable()}}disconnectedCallback(){try{window.removeEventListener("message",this.onMessage),clearTimeout(this.timer)}catch{}}attributeChangedCallback(){try{this.isConnected&&this.shadowRoot&&this.mount()}catch{this.unavailable()}}src(){let n=(this.getAttribute("crown")??"").trim(),o=(this.getAttribute("chain")??"").trim(),r=(this.getAttribute("app")??"").trim();if(!/^[0-9]{1,18}$/.test(n)||!o||this.kind==="app"&&!r)return null;let l=new URLSearchParams({crown:n,chain:o});return this.kind==="app"?l.set("app",r):l.set("kind","coin"),l.set("mode",this.mode()),l.set("v","1"),`${e}/v1/frame?${l.toString()}`}mode(){let n=this.getAttribute("mode");if(n==="light"||n==="dark")return n;try{return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}catch{return"light"}}mount(){let n=this.shadowRoot;window.removeEventListener("message",this.onMessage),clearTimeout(this.timer),this.removeAttribute("data-cd-ready"),this.removeAttribute("data-cd-unavailable");let o=this.src();if(!o){n.innerHTML="<slot></slot>",this.frame=null;return}n.innerHTML=`<style>${D}</style><slot></slot>`;let r=document.createElement("iframe");r.setAttribute("loading","lazy"),r.setAttribute("referrerpolicy","strict-origin-when-cross-origin"),r.setAttribute("allow","clipboard-write; fullscreen"),r.setAttribute("title",this.kind==="coin"?"Coin on Chain Daddy":"App on Chain Daddy"),r.src=o,n.appendChild(r),this.frame=r,window.addEventListener("message",this.onMessage),this.timer=setTimeout(()=>{this.hasAttribute("data-cd-ready")||this.unavailable()},8e3)}receive(n){try{if(n.origin!==e||!this.frame||!n.source||n.source!==this.frame.contentWindow)return;let o=n.data;if(!o||typeof o!="object")return;if(o.type==="cd:ready")clearTimeout(this.timer),this.removeAttribute("data-cd-unavailable"),this.setAttribute("data-cd-ready",""),this.sendTheme(),this.dispatchEvent(new CustomEvent("cd:ready"));else if(o.type==="cd:resize"){let r=Number(o.height);Number.isFinite(r)&&(this.frame.style.height=`${Math.max(1,Math.min(4e3,Math.ceil(r)))}px`)}else o.type==="cd:unavailable"&&this.unavailable()}catch{}}sendTheme(){let n={},o=getComputedStyle(this);for(let r of H){let l=o.getPropertyValue(r).trim();l&&(n[r]=l)}this.frame?.contentWindow?.postMessage({type:"cd:theme",tokens:n},e)}unavailable(){try{if(clearTimeout(this.timer),this.removeAttribute("data-cd-ready"),this.hasAttribute("data-cd-unavailable"))return;this.setAttribute("data-cd-unavailable",""),this.dispatchEvent(new CustomEvent("cd:unavailable"))}catch{}}}i.observedAttributes=["crown","chain","app","mode"];class s extends i{}class c extends i{constructor(){super(...arguments);this.kind="coin"}}class u extends HTMLElement{connectedCallback(){try{let a=this.querySelector("a[href]"),n=a?new URL(a.getAttribute("href")??"",document.baseURI):null;if(!n||n.protocol!=="https:")return;let o=this.shadowRoot??this.attachShadow({mode:"open"});o.innerHTML=`<style>${z}</style><button type="button" part="button"></button>`;let r=o.querySelector("button");r.textContent=(a.textContent??"").trim()||"Buy on Chain Daddy",r.addEventListener("click",()=>{try{window.open(n.toString(),"cd-buy","popup,width=460,height=760")||window.location.assign(n.toString())}catch{}})}catch{}}}for(let[d,a]of[["cd-app",s],["cd-coin",c],["cd-buy",u]])customElements.get(d)||customElements.define(d,a)}catch{}}var N={version:w,signIn:f,handleCallback:S,exchangeCode:k};window.ChainDaddy=Object.assign(window.ChainDaddy??{},N);I();R({origin:_(document.currentScript?.src)});})();

package/dist/cd.js.sri

@@ -1 +1 @@
-sha384-bZAt1vfljBunvk1nBTTcEr8Ir5WYMSnmrhuWN0uMusRcqf/oMlvNzVN26tBxHL+I
+sha384-KKpjQXvfR3Rs+FsdOW+hfEJcZpfuYVXR+TcyRX0nbup+s/xRhLx102TTXL29eFE1

package/dist/embed.d.ts

@@ -0,0 +1,8 @@
+/** The embed origin for a build loaded from scriptSrc: staging's CDN frames staging, anything else prod. */
+export declare function embedOriginFor(scriptSrc?: string | null): string;
+export interface EmbedOptions {
+    /** The embed origin. Only the two Chain Daddy embed origins are taken; anything else is prod. */
+    origin?: string;
+}
+/** Defines <cd-app>, <cd-coin> and <cd-buy>, each once. cd.js calls it for you. */
+export declare function defineEmbedElements(options?: EmbedOptions): void;

package/dist/embed.js

@@ -0,0 +1,188 @@
+// src/embed.ts
+var PROD_ORIGIN = "https://embed.chaindaddy.io";
+var STAGING_ORIGIN = "https://embed-staging.chaindaddy.io";
+var READY_TIMEOUT_MS = 8e3;
+var MAX_HEIGHT = 4e3;
+var THEME_TOKENS = ["--cd-accent", "--cd-surface", "--cd-text", "--cd-text-muted", "--cd-border"];
+function embedOriginFor(scriptSrc) {
+  try {
+    if (scriptSrc && new URL(scriptSrc).hostname === "js.staging.chaindaddy.io") return STAGING_ORIGIN;
+  } catch {
+  }
+  return PROD_ORIGIN;
+}
+var STYLE = `
+:host { display: block; }
+iframe { display: block; width: 100%; border: 0; height: 1px; opacity: 0; color-scheme: normal; }
+:host([data-cd-ready]) iframe { opacity: 1; }
+:host([data-cd-ready]) slot { display: none; }
+:host([data-cd-unavailable]) iframe { display: none; }
+`;
+var BUY_STYLE = `
+:host { display: inline-block; }
+button { box-sizing: border-box; min-height: 40px; padding: 0 16px; border-radius: 10px; cursor: pointer;
+  font: 600 15px/1 system-ui, -apple-system, "Segoe UI", sans-serif;
+  border: 1px solid var(--cd-border, #d0d5dd); background: var(--cd-accent, #f59e0b); color: var(--cd-text, #101828); }
+button:focus-visible { outline: 2px solid var(--cd-accent, #f59e0b); outline-offset: 2px; }
+`;
+function defineEmbedElements(options = {}) {
+  try {
+    if (typeof customElements === "undefined" || typeof HTMLElement === "undefined") return;
+    const origin = options.origin === STAGING_ORIGIN ? STAGING_ORIGIN : PROD_ORIGIN;
+    class CdFrame extends HTMLElement {
+      constructor() {
+        super(...arguments);
+        this.kind = "app";
+        this.frame = null;
+        this.onMessage = (event) => this.receive(event);
+      }
+      connectedCallback() {
+        try {
+          if (!this.shadowRoot) this.attachShadow({ mode: "open" });
+          this.mount();
+        } catch {
+          this.unavailable();
+        }
+      }
+      disconnectedCallback() {
+        try {
+          window.removeEventListener("message", this.onMessage);
+          clearTimeout(this.timer);
+        } catch {
+        }
+      }
+      attributeChangedCallback() {
+        try {
+          if (this.isConnected && this.shadowRoot) this.mount();
+        } catch {
+          this.unavailable();
+        }
+      }
+      /** The frame's address, or null when the element does not name enough. */
+      src() {
+        const crown = (this.getAttribute("crown") ?? "").trim();
+        const chain = (this.getAttribute("chain") ?? "").trim();
+        const app = (this.getAttribute("app") ?? "").trim();
+        if (!/^[0-9]{1,18}$/.test(crown) || !chain || this.kind === "app" && !app) return null;
+        const q = new URLSearchParams({ crown, chain });
+        if (this.kind === "app") q.set("app", app);
+        else q.set("kind", "coin");
+        q.set("mode", this.mode());
+        q.set("v", "1");
+        return `${origin}/v1/frame?${q.toString()}`;
+      }
+      mode() {
+        const attr = this.getAttribute("mode");
+        if (attr === "light" || attr === "dark") return attr;
+        try {
+          return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+        } catch {
+          return "light";
+        }
+      }
+      mount() {
+        const root = this.shadowRoot;
+        window.removeEventListener("message", this.onMessage);
+        clearTimeout(this.timer);
+        this.removeAttribute("data-cd-ready");
+        this.removeAttribute("data-cd-unavailable");
+        const src = this.src();
+        if (!src) {
+          root.innerHTML = "<slot></slot>";
+          this.frame = null;
+          return;
+        }
+        root.innerHTML = `<style>${STYLE}</style><slot></slot>`;
+        const frame = document.createElement("iframe");
+        frame.setAttribute("loading", "lazy");
+        frame.setAttribute("referrerpolicy", "strict-origin-when-cross-origin");
+        frame.setAttribute("allow", "clipboard-write; fullscreen");
+        frame.setAttribute("title", this.kind === "coin" ? "Coin on Chain Daddy" : "App on Chain Daddy");
+        frame.src = src;
+        root.appendChild(frame);
+        this.frame = frame;
+        window.addEventListener("message", this.onMessage);
+        this.timer = setTimeout(() => {
+          if (!this.hasAttribute("data-cd-ready")) this.unavailable();
+        }, READY_TIMEOUT_MS);
+      }
+      receive(event) {
+        try {
+          if (event.origin !== origin || !this.frame || !event.source || event.source !== this.frame.contentWindow) return;
+          const data = event.data;
+          if (!data || typeof data !== "object") return;
+          if (data.type === "cd:ready") {
+            clearTimeout(this.timer);
+            this.removeAttribute("data-cd-unavailable");
+            this.setAttribute("data-cd-ready", "");
+            this.sendTheme();
+            this.dispatchEvent(new CustomEvent("cd:ready"));
+          } else if (data.type === "cd:resize") {
+            const h = Number(data.height);
+            if (Number.isFinite(h)) this.frame.style.height = `${Math.max(1, Math.min(MAX_HEIGHT, Math.ceil(h)))}px`;
+          } else if (data.type === "cd:unavailable") {
+            this.unavailable();
+          }
+        } catch {
+        }
+      }
+      /** The page's --cd-* colours, for an app that takes them. */
+      sendTheme() {
+        const tokens = {};
+        const style = getComputedStyle(this);
+        for (const token of THEME_TOKENS) {
+          const value = style.getPropertyValue(token).trim();
+          if (value) tokens[token] = value;
+        }
+        this.frame?.contentWindow?.postMessage({ type: "cd:theme", tokens }, origin);
+      }
+      unavailable() {
+        try {
+          clearTimeout(this.timer);
+          this.removeAttribute("data-cd-ready");
+          if (this.hasAttribute("data-cd-unavailable")) return;
+          this.setAttribute("data-cd-unavailable", "");
+          this.dispatchEvent(new CustomEvent("cd:unavailable"));
+        } catch {
+        }
+      }
+    }
+    CdFrame.observedAttributes = ["crown", "chain", "app", "mode"];
+    class CdApp extends CdFrame {
+    }
+    class CdCoin extends CdFrame {
+      constructor() {
+        super(...arguments);
+        this.kind = "coin";
+      }
+    }
+    class CdBuy extends HTMLElement {
+      connectedCallback() {
+        try {
+          const link = this.querySelector("a[href]");
+          const href = link ? new URL(link.getAttribute("href") ?? "", document.baseURI) : null;
+          if (!href || href.protocol !== "https:") return;
+          const root = this.shadowRoot ?? this.attachShadow({ mode: "open" });
+          root.innerHTML = `<style>${BUY_STYLE}</style><button type="button" part="button"></button>`;
+          const button = root.querySelector("button");
+          button.textContent = (link.textContent ?? "").trim() || "Buy on Chain Daddy";
+          button.addEventListener("click", () => {
+            try {
+              if (!window.open(href.toString(), "cd-buy", "popup,width=460,height=760")) window.location.assign(href.toString());
+            } catch {
+            }
+          });
+        } catch {
+        }
+      }
+    }
+    for (const [name, ctor] of [["cd-app", CdApp], ["cd-coin", CdCoin], ["cd-buy", CdBuy]]) {
+      if (!customElements.get(name)) customElements.define(name, ctor);
+    }
+  } catch {
+  }
+}
+export {
+  defineEmbedElements,
+  embedOriginFor
+};

package/dist/index.d.ts

@@ -2,3 +2,5 @@ export { VERSION } from './core';
 export { DEFAULT_ISSUER, challengeFor, exchangeCode, handleCallback, signIn } from './signin';
 export type { SignInOptions, SignInResult } from './signin';
 export { defineSignInButton } from './button';
+export { defineEmbedElements, embedOriginFor } from './embed';
+export type { EmbedOptions } from './embed';

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/core.ts
-var VERSION = true ? "0.1.0" : "0.0.0";
+var VERSION = true ? "0.2.0" : "0.0.0";
 function b64url(bytes) {
   let s = "";
   for (const b of bytes) s += String.fromCharCode(b);
@@ -212,11 +212,198 @@ function defineSignInButton() {
   CdSigninButton.observedAttributes = ["theme", "text"];
   customElements.define("cd-signin-button", CdSigninButton);
 }
+
+// src/embed.ts
+var PROD_ORIGIN = "https://embed.chaindaddy.io";
+var STAGING_ORIGIN = "https://embed-staging.chaindaddy.io";
+var READY_TIMEOUT_MS = 8e3;
+var MAX_HEIGHT = 4e3;
+var THEME_TOKENS = ["--cd-accent", "--cd-surface", "--cd-text", "--cd-text-muted", "--cd-border"];
+function embedOriginFor(scriptSrc) {
+  try {
+    if (scriptSrc && new URL(scriptSrc).hostname === "js.staging.chaindaddy.io") return STAGING_ORIGIN;
+  } catch {
+  }
+  return PROD_ORIGIN;
+}
+var STYLE2 = `
+:host { display: block; }
+iframe { display: block; width: 100%; border: 0; height: 1px; opacity: 0; color-scheme: normal; }
+:host([data-cd-ready]) iframe { opacity: 1; }
+:host([data-cd-ready]) slot { display: none; }
+:host([data-cd-unavailable]) iframe { display: none; }
+`;
+var BUY_STYLE = `
+:host { display: inline-block; }
+button { box-sizing: border-box; min-height: 40px; padding: 0 16px; border-radius: 10px; cursor: pointer;
+  font: 600 15px/1 system-ui, -apple-system, "Segoe UI", sans-serif;
+  border: 1px solid var(--cd-border, #d0d5dd); background: var(--cd-accent, #f59e0b); color: var(--cd-text, #101828); }
+button:focus-visible { outline: 2px solid var(--cd-accent, #f59e0b); outline-offset: 2px; }
+`;
+function defineEmbedElements(options = {}) {
+  try {
+    if (typeof customElements === "undefined" || typeof HTMLElement === "undefined") return;
+    const origin = options.origin === STAGING_ORIGIN ? STAGING_ORIGIN : PROD_ORIGIN;
+    class CdFrame extends HTMLElement {
+      constructor() {
+        super(...arguments);
+        this.kind = "app";
+        this.frame = null;
+        this.onMessage = (event) => this.receive(event);
+      }
+      connectedCallback() {
+        try {
+          if (!this.shadowRoot) this.attachShadow({ mode: "open" });
+          this.mount();
+        } catch {
+          this.unavailable();
+        }
+      }
+      disconnectedCallback() {
+        try {
+          window.removeEventListener("message", this.onMessage);
+          clearTimeout(this.timer);
+        } catch {
+        }
+      }
+      attributeChangedCallback() {
+        try {
+          if (this.isConnected && this.shadowRoot) this.mount();
+        } catch {
+          this.unavailable();
+        }
+      }
+      /** The frame's address, or null when the element does not name enough. */
+      src() {
+        const crown = (this.getAttribute("crown") ?? "").trim();
+        const chain = (this.getAttribute("chain") ?? "").trim();
+        const app = (this.getAttribute("app") ?? "").trim();
+        if (!/^[0-9]{1,18}$/.test(crown) || !chain || this.kind === "app" && !app) return null;
+        const q = new URLSearchParams({ crown, chain });
+        if (this.kind === "app") q.set("app", app);
+        else q.set("kind", "coin");
+        q.set("mode", this.mode());
+        q.set("v", "1");
+        return `${origin}/v1/frame?${q.toString()}`;
+      }
+      mode() {
+        const attr = this.getAttribute("mode");
+        if (attr === "light" || attr === "dark") return attr;
+        try {
+          return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+        } catch {
+          return "light";
+        }
+      }
+      mount() {
+        const root = this.shadowRoot;
+        window.removeEventListener("message", this.onMessage);
+        clearTimeout(this.timer);
+        this.removeAttribute("data-cd-ready");
+        this.removeAttribute("data-cd-unavailable");
+        const src = this.src();
+        if (!src) {
+          root.innerHTML = "<slot></slot>";
+          this.frame = null;
+          return;
+        }
+        root.innerHTML = `<style>${STYLE2}</style><slot></slot>`;
+        const frame = document.createElement("iframe");
+        frame.setAttribute("loading", "lazy");
+        frame.setAttribute("referrerpolicy", "strict-origin-when-cross-origin");
+        frame.setAttribute("allow", "clipboard-write; fullscreen");
+        frame.setAttribute("title", this.kind === "coin" ? "Coin on Chain Daddy" : "App on Chain Daddy");
+        frame.src = src;
+        root.appendChild(frame);
+        this.frame = frame;
+        window.addEventListener("message", this.onMessage);
+        this.timer = setTimeout(() => {
+          if (!this.hasAttribute("data-cd-ready")) this.unavailable();
+        }, READY_TIMEOUT_MS);
+      }
+      receive(event) {
+        try {
+          if (event.origin !== origin || !this.frame || !event.source || event.source !== this.frame.contentWindow) return;
+          const data = event.data;
+          if (!data || typeof data !== "object") return;
+          if (data.type === "cd:ready") {
+            clearTimeout(this.timer);
+            this.removeAttribute("data-cd-unavailable");
+            this.setAttribute("data-cd-ready", "");
+            this.sendTheme();
+            this.dispatchEvent(new CustomEvent("cd:ready"));
+          } else if (data.type === "cd:resize") {
+            const h = Number(data.height);
+            if (Number.isFinite(h)) this.frame.style.height = `${Math.max(1, Math.min(MAX_HEIGHT, Math.ceil(h)))}px`;
+          } else if (data.type === "cd:unavailable") {
+            this.unavailable();
+          }
+        } catch {
+        }
+      }
+      /** The page's --cd-* colours, for an app that takes them. */
+      sendTheme() {
+        const tokens = {};
+        const style = getComputedStyle(this);
+        for (const token of THEME_TOKENS) {
+          const value = style.getPropertyValue(token).trim();
+          if (value) tokens[token] = value;
+        }
+        this.frame?.contentWindow?.postMessage({ type: "cd:theme", tokens }, origin);
+      }
+      unavailable() {
+        try {
+          clearTimeout(this.timer);
+          this.removeAttribute("data-cd-ready");
+          if (this.hasAttribute("data-cd-unavailable")) return;
+          this.setAttribute("data-cd-unavailable", "");
+          this.dispatchEvent(new CustomEvent("cd:unavailable"));
+        } catch {
+        }
+      }
+    }
+    CdFrame.observedAttributes = ["crown", "chain", "app", "mode"];
+    class CdApp extends CdFrame {
+    }
+    class CdCoin extends CdFrame {
+      constructor() {
+        super(...arguments);
+        this.kind = "coin";
+      }
+    }
+    class CdBuy extends HTMLElement {
+      connectedCallback() {
+        try {
+          const link = this.querySelector("a[href]");
+          const href = link ? new URL(link.getAttribute("href") ?? "", document.baseURI) : null;
+          if (!href || href.protocol !== "https:") return;
+          const root = this.shadowRoot ?? this.attachShadow({ mode: "open" });
+          root.innerHTML = `<style>${BUY_STYLE}</style><button type="button" part="button"></button>`;
+          const button = root.querySelector("button");
+          button.textContent = (link.textContent ?? "").trim() || "Buy on Chain Daddy";
+          button.addEventListener("click", () => {
+            try {
+              if (!window.open(href.toString(), "cd-buy", "popup,width=460,height=760")) window.location.assign(href.toString());
+            } catch {
+            }
+          });
+        } catch {
+        }
+      }
+    }
+    for (const [name, ctor] of [["cd-app", CdApp], ["cd-coin", CdCoin], ["cd-buy", CdBuy]]) {
+      if (!customElements.get(name)) customElements.define(name, ctor);
+    }
+  } catch {
+  }
+}
 export {
   DEFAULT_ISSUER,
   VERSION,
   challengeFor,
+  defineEmbedElements,
   defineSignInButton,
+  embedOriginFor,
   exchangeCode,
   handleCallback,
   signIn

package/dist/verify.d.ts

@@ -0,0 +1,126 @@
+/**
+ * chain (CAIP-2, "eip155:8453") -> every ChainDaddyCheckout on it, lowercase.
+ * Frozen: this is the list verifyPayment checks against, and nothing in the
+ * process should be able to add to it.
+ */
+export declare const CHECKOUTS: Readonly<Record<string, readonly string[]>>;
+/**
+ * chain -> the confirmations Chain Daddy's own server waits on it before it
+ * calls an order confirmed. verifyPayment never reads shallower than this,
+ * whatever the block asks for: the block's number arrives from an API.
+ */
+export declare const MIN_CONFIRMATIONS: Readonly<Record<string, number>>;
+/** `token` of an order paid in the chain's own coin (ETH on Base, POL on Polygon). */
+export declare const NATIVE_TOKEN = "0x0000000000000000000000000000000000000000";
+export type VerifyErrorCode = 
+/** A Solana order: follow the manual recipe for now. */
+'unsupported'
+/** What you passed (options, expect) is missing or malformed. */
+ | 'bad_options'
+/** The verification block is malformed. */
+ | 'bad_verification'
+/** The block names a contract that is not a Chain Daddy checkout on that chain. */
+ | 'unknown_checkout'
+/** The block, your expectation and your RPC endpoint are not all the same chain. */
+ | 'wrong_chain'
+/** The block is not the order, asset, payout address or amount you expect. */
+ | 'expectation_mismatch'
+/** The RPC endpoint failed or answered something that is not an answer. */
+ | 'rpc_error';
+/** Every failure of verifyPayment. A payment that is simply not there yet is not an error: it resolves `paid: false`. */
+export declare class VerifyError extends Error {
+    readonly code: VerifyErrorCode;
+    constructor(code: VerifyErrorCode, message: string);
+}
+/** The Order struct the checkout contract takes, as the API prints it. */
+export interface CheckoutOrder {
+    /** "0x" + 64 hex: the order's id. */
+    orderId: string;
+    /** The ERC-20 paid in, or NATIVE_TOKEN. */
+    token: string;
+    payees: readonly string[];
+    /** Decimal strings in the asset's smallest unit; amounts[i] goes to payees[i]. */
+    amounts: readonly string[];
+    /** Unix seconds. */
+    deadline: number | string | bigint;
+}
+/** An EVM order's `verification` block (GET /api/v2/iap/orders/{id}). */
+export interface EvmVerification {
+    kind: 'evm';
+    /** CAIP-2, e.g. "eip155:8453". */
+    chainId: string;
+    checkout: string;
+    feeAddress?: string | null;
+    order: CheckoutOrder;
+    confirmations: number;
+}
+/** A Solana order's `verification` block. verifyPayment does not check these yet. */
+export interface SolanaVerification {
+    kind: 'solana';
+    cluster: string;
+    reference: string;
+    memo: string;
+}
+export type Verification = EvmVerification | SolanaVerification;
+/**
+ * What you sold, from your own records. Every field is required: the block
+ * arrives from an API, and these are what tie it to your sale.
+ */
+export interface Expectation {
+    /** The id of the order you are checking. */
+    orderId: string;
+    /** The chain you sell on: "eip155:8453" or 8453. */
+    chainId: string | number;
+    /** The asset you are paid in: an ERC-20 address, or NATIVE_TOKEN for the chain's own coin. */
+    token: string;
+    /** Your payout address. */
+    payee: string;
+    /** The least the order must send your payout address, in the asset's smallest unit. A bigint or a decimal string, never a number. */
+    amount: bigint | string;
+}
+export interface VerifyOptions {
+    expect: Expectation;
+    /** A JSON-RPC endpoint for the order's chain. Yours, not Chain Daddy's. */
+    rpcUrl?: string;
+    /** Used with rpcUrl in place of the global fetch. */
+    fetch?: typeof fetch;
+    /** Instead of rpcUrl: an EIP-1193 style request function (a viem client's `request`, an ethers provider's `send` wrapped). */
+    request?: (args: {
+        method: string;
+        params: unknown[];
+    }) => Promise<unknown>;
+    /** A deeper wait than the block's `confirmations` and the chain's MIN_CONFIRMATIONS. A smaller number is ignored: this can only raise the depth. */
+    confirmations?: number;
+    /** Aborts the RPC requests made through rpcUrl. */
+    signal?: AbortSignal;
+}
+export interface PaymentResult {
+    /** True only when the contract says this exact order was paid, `depth` blocks deep. */
+    paid: boolean;
+    /** The wallet that paid, lowercase, or null. */
+    payer: string | null;
+    /** The confirmations asked for: the largest of the block's, yours and the chain's MIN_CONFIRMATIONS. */
+    depth: number;
+    /** The checkout contract that was asked, lowercase. */
+    checkout: string;
+    /** The block the answer was read at: head - depth + 1. */
+    blockNumber: number;
+    /** The order's EIP-712 hash on that contract. */
+    orderHash: string;
+    /** CAIP-2. */
+    chainId: string;
+}
+/** Calldata for hashOrder(order) on a checkout contract. */
+export declare function encodeHashOrder(order: CheckoutOrder): string;
+/** Calldata for paidBy(orderHash). The key is hashOrder's answer, not the order id. */
+export declare function encodePaidBy(orderHash: string): string;
+/** Whether `checkout` is a ChainDaddyCheckout this package knows on `chainId`. */
+export declare function isKnownCheckout(chainId: string | number, checkout: string): boolean;
+/**
+ * Checks on chain that an order was paid. Resolves `paid: true` only when the
+ * checkout contract itself says so, for exactly the order in `verification`,
+ * at least `depth` blocks ago. Rejects with a VerifyError when the block, your
+ * expectation or the RPC endpoint cannot be trusted to answer; never resolves
+ * `paid: true` on a doubt.
+ */
+export declare function verifyPayment(verification: Verification, options: VerifyOptions): Promise<PaymentResult>;