@swype-org/deposit 0.3.23 → 0.3.26

package/dist/index.d.cts

@@ -1,5 +1,5 @@
-import { D as DepositStatus, a as DepositResult, b as DepositError, c as DepositConfig, d as DepositRequest } from './types-iQf3f-_m.cjs';
-export { C as CheckoutConfig, e as CheckoutError, f as CheckoutErrorCode, g as CheckoutStatus, h as DepositErrorCode, S as SignerFunction, i as SignerRequest, j as SignerResponse, T as TransferSummary, k as getDisplayMessage } from './types-iQf3f-_m.cjs';
+import { D as DepositStatus, a as DepositResult, b as DepositError, c as DepositConfig, d as DepositRequest } from './types-BjnQ2ux2.cjs';
+export { C as CheckoutConfig, e as CheckoutError, f as CheckoutErrorCode, g as CheckoutStatus, h as DepositErrorCode, S as SignerFunction, i as SignerRequest, j as SignerResponse, T as TransferSummary, k as getDisplayMessage } from './types-BjnQ2ux2.cjs';
 
 declare const DEFAULT_WEBVIEW_BASE_URL = "https://pay.blink.cash";
 declare const SANDBOX_WEBVIEW_BASE_URL = "https://pay-sandbox.blink.cash";
@@ -94,6 +94,18 @@ declare class Deposit {
      * config, so the full widget renders only when both allow it.
      */
     private applyFullWidgetParam;
+    /**
+     * Appends `appearance=dark` (or `appearance=system`) to the hosted-flow URL.
+     * An explicit `appearance: { theme }` config always wins — including
+     * `theme: 'light'`, which pins light regardless of the merchant page. When
+     * the merchant passes no theme, the default follows the merchant page's own
+     * declared color scheme (see {@link detectMerchantColorScheme}) so the flow
+     * doesn't render a light modal on a page that says it is dark. Absence of
+     * the param means light. The hosted flow resolves `system` against the
+     * user's `prefers-color-scheme`. Applied alongside the full-widget param on
+     * every hosted/preload URL.
+     */
+    private applyAppearanceParam;
     /** Fluid is the default; `layout: 'fixed'` opts back into the legacy container. */
     private isFluidLayout;
     /**

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { D as DepositStatus, a as DepositResult, b as DepositError, c as DepositConfig, d as DepositRequest } from './types-iQf3f-_m.js';
-export { C as CheckoutConfig, e as CheckoutError, f as CheckoutErrorCode, g as CheckoutStatus, h as DepositErrorCode, S as SignerFunction, i as SignerRequest, j as SignerResponse, T as TransferSummary, k as getDisplayMessage } from './types-iQf3f-_m.js';
+import { D as DepositStatus, a as DepositResult, b as DepositError, c as DepositConfig, d as DepositRequest } from './types-BjnQ2ux2.js';
+export { C as CheckoutConfig, e as CheckoutError, f as CheckoutErrorCode, g as CheckoutStatus, h as DepositErrorCode, S as SignerFunction, i as SignerRequest, j as SignerResponse, T as TransferSummary, k as getDisplayMessage } from './types-BjnQ2ux2.js';
 
 declare const DEFAULT_WEBVIEW_BASE_URL = "https://pay.blink.cash";
 declare const SANDBOX_WEBVIEW_BASE_URL = "https://pay-sandbox.blink.cash";
@@ -94,6 +94,18 @@ declare class Deposit {
      * config, so the full widget renders only when both allow it.
      */
     private applyFullWidgetParam;
+    /**
+     * Appends `appearance=dark` (or `appearance=system`) to the hosted-flow URL.
+     * An explicit `appearance: { theme }` config always wins — including
+     * `theme: 'light'`, which pins light regardless of the merchant page. When
+     * the merchant passes no theme, the default follows the merchant page's own
+     * declared color scheme (see {@link detectMerchantColorScheme}) so the flow
+     * doesn't render a light modal on a page that says it is dark. Absence of
+     * the param means light. The hosted flow resolves `system` against the
+     * user's `prefers-color-scheme`. Applied alongside the full-widget param on
+     * every hosted/preload URL.
+     */
+    private applyAppearanceParam;
     /** Fluid is the default; `layout: 'fixed'` opts back into the legacy container. */
     private isFluidLayout;
     /**

package/dist/index.js

@@ -1,4 +1,4 @@
-export { ALLOWED_RPC_METHODS, BRIDGE_PROTOCOL_VERSION, Checkout, CheckoutError, DEFAULT_WEBVIEW_BASE_URL, Deposit, DepositError, SANDBOX_WEBVIEW_BASE_URL, attachRpcHost, createWalletDiscoverer, getDisplayMessage, parseBridgeMessage } from './chunk-JD7GTL6D.js';
+export { ALLOWED_RPC_METHODS, BRIDGE_PROTOCOL_VERSION, Checkout, CheckoutError, DEFAULT_WEBVIEW_BASE_URL, Deposit, DepositError, SANDBOX_WEBVIEW_BASE_URL, attachRpcHost, createWalletDiscoverer, getDisplayMessage, parseBridgeMessage } from './chunk-S3SPMEXQ.js';
 
 // src/index.ts
 var VERSION = "0.3.0";

package/dist/react.cjs

@@ -571,7 +571,7 @@ var STYLES = `
 [data-blink-overlay][data-blink-mobile-sheet]{align-items:flex-end;touch-action:none;overscroll-behavior:contain}
 [data-blink-container]{width:min(420px,92vw);height:min(600px,85vh);border-radius:24px;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.4);animation:blink-slide-up .25s ease-out;display:flex;flex-direction:column;background:transparent}
 [data-blink-overlay][data-blink-closing] [data-blink-container]{opacity:0;transition:opacity ${CLOSE_DURATION_MS}ms ease-in}
-[data-blink-container] iframe{width:100%;flex:1;border:none;display:block;background:transparent;color-scheme:normal;border-radius:inherit}
+[data-blink-container] iframe{width:100%;flex:1;border:none;display:block;background:transparent;color-scheme:light;border-radius:inherit}
 [data-blink-overlay][data-blink-mobile-sheet] [data-blink-container]{width:100%;max-width:100%;height:79vh;border-radius:24px 24px 0 0;box-shadow:0 -8px 40px rgba(0,0,0,.25);animation:blink-slide-up-full .35s cubic-bezier(.32,.72,0,1);padding-bottom:env(safe-area-inset-bottom,0px)}
 [data-blink-overlay][data-blink-mobile-sheet][data-blink-closing] [data-blink-container]{opacity:1;animation:blink-slide-down-full ${CLOSE_DURATION_MS}ms ease-in forwards}
 @media(max-width:${MOBILE_SHEET_MAX_VIEWPORT_PX}px){[data-blink-overlay]{align-items:flex-end;touch-action:none;overscroll-behavior:contain}[data-blink-container]{width:100%;max-width:100%;height:79vh;border-radius:24px 24px 0 0;box-shadow:0 -8px 40px rgba(0,0,0,.25);animation:blink-slide-up-full .35s cubic-bezier(.32,.72,0,1);padding-bottom:env(safe-area-inset-bottom,0px)}[data-blink-overlay][data-blink-closing] [data-blink-container]{opacity:1;animation:blink-slide-down-full ${CLOSE_DURATION_MS}ms ease-in forwards}}
@@ -1178,6 +1178,24 @@ var Deposit = class {
     if (this.config.enableFullWidget === false) {
       url.searchParams.set("enableFullWidget", "false");
     }
+    this.applyAppearanceParam(url);
+  }
+  /**
+   * Appends `appearance=dark` (or `appearance=system`) to the hosted-flow URL.
+   * An explicit `appearance: { theme }` config always wins — including
+   * `theme: 'light'`, which pins light regardless of the merchant page. When
+   * the merchant passes no theme, the default follows the merchant page's own
+   * declared color scheme (see {@link detectMerchantColorScheme}) so the flow
+   * doesn't render a light modal on a page that says it is dark. Absence of
+   * the param means light. The hosted flow resolves `system` against the
+   * user's `prefers-color-scheme`. Applied alongside the full-widget param on
+   * every hosted/preload URL.
+   */
+  applyAppearanceParam(url) {
+    const theme = this.config.appearance?.theme ?? detectMerchantColorScheme();
+    if (theme === "dark" || theme === "system") {
+      url.searchParams.set("appearance", theme);
+    }
   }
   /** Fluid is the default; `layout: 'fixed'` opts back into the legacy container. */
   isFluidLayout() {
@@ -1440,6 +1458,23 @@ var Deposit = class {
     }
   }
 };
+function detectMerchantColorScheme() {
+  if (typeof window === "undefined" || typeof document === "undefined") return null;
+  const root = document.documentElement;
+  if (!root || typeof window.getComputedStyle !== "function") return null;
+  let value;
+  try {
+    value = window.getComputedStyle(root).colorScheme ?? "";
+  } catch {
+    return null;
+  }
+  const tokens = value.toLowerCase().split(/\s+/);
+  const dark = tokens.includes("dark");
+  const light = tokens.includes("light");
+  if (dark && light) return "system";
+  if (dark) return "dark";
+  return null;
+}
 function svgToDataUri(svg) {
   return `data:image/svg+xml,${encodeURIComponent(svg)}`;
 }