@swype-org/deposit 0.3.26 → 0.3.32

package/dist/react.d.cts

@@ -1,5 +1,5 @@
-import { c as DepositConfig, D as DepositStatus, a as DepositResult, b as DepositError, d as DepositRequest } from './types-BjnQ2ux2.cjs';
-export { k as getDisplayMessage } from './types-BjnQ2ux2.cjs';
+import { c as DepositConfig, D as DepositStatus, a as DepositResult, b as DepositError, d as DepositRequest } from './types-QRkKxsoP.cjs';
+export { k as getDisplayMessage } from './types-QRkKxsoP.cjs';
 import { ReactElement } from 'react';
 
 interface BlinkDepositButtonProps {

package/dist/react.d.ts

@@ -1,5 +1,5 @@
-import { c as DepositConfig, D as DepositStatus, a as DepositResult, b as DepositError, d as DepositRequest } from './types-BjnQ2ux2.js';
-export { k as getDisplayMessage } from './types-BjnQ2ux2.js';
+import { c as DepositConfig, D as DepositStatus, a as DepositResult, b as DepositError, d as DepositRequest } from './types-QRkKxsoP.js';
+export { k as getDisplayMessage } from './types-QRkKxsoP.js';
 import { ReactElement } from 'react';
 
 interface BlinkDepositButtonProps {

package/dist/react.js

@@ -1,5 +1,5 @@
-import { Deposit, getDisplayMessage } from './chunk-S3SPMEXQ.js';
-export { DepositError, getDisplayMessage } from './chunk-S3SPMEXQ.js';
+import { Deposit, getDisplayMessage } from './chunk-MJSD7JWR.js';
+export { DepositError, getDisplayMessage } from './chunk-MJSD7JWR.js';
 import { useState, createElement, useRef, useEffect, useCallback } from 'react';
 
 function svgToDataUri(svg) {

package/dist/{types-BjnQ2ux2.d.cts → types-QRkKxsoP.d.cts}

@@ -70,11 +70,72 @@ interface DepositConfig {
      */
     hostedFlowOrigin?: string;
     /**
-     * DOM element to mount the iframe overlay into.
+     * DOM element the iframe is mounted into.
+     *
+     * In the default `presentation: 'overlay'` this only changes the overlay's
+     * append parent — the overlay is still `position: fixed; inset: 0` and
+     * covers the viewport regardless of where it hangs in the tree.
+     *
+     * In `presentation: 'embedded'` it is the real mount point: the iframe
+     * renders inline inside this element, and the option is **required**. The
+     * element must be stable across re-renders — moving an iframe in the DOM
+     * reloads it, discarding the warmed-up document and the user's session.
+     * (On mobile, where an embedded flow presents as an overlay instead, this
+     * element is left untouched and the overlay mounts on `document.body` — a
+     * `position: fixed` overlay inside a host's animated dialog would position
+     * against that dialog rather than the viewport.)
      *
      * @default document.body
      */
     containerElement?: HTMLElement;
+    /**
+     * How the hosted flow is presented on the host page.
+     *
+     * `'overlay'` (the default) is the classic modal: a full-viewport dim +
+     * blur backdrop with the payment card centered on top, dismissable by
+     * backdrop click or Escape.
+     *
+     * `'embedded'` mounts the iframe **inline** inside {@link containerElement}
+     * — for a payment-method aggregator that lists Blink as one option inside
+     * its own widget. There is no backdrop, no body scroll lock, and no
+     * backdrop/Escape dismissal (the host owns all of that); the flow renders
+     * chrome-less so the host's own panel provides the radius, background and
+     * shadow. The iframe's height follows the flow's content, reported through
+     * the {@link Deposit.on | `resize`} event.
+     *
+     * Requires {@link containerElement}.
+     *
+     * **Desktop only.** On mobile an embedded flow presents as the overlay: a
+     * phone-sized method panel cannot hold a payment journey with a keypad,
+     * wallet lists and a QR code, and the overlay is what a phone user gets from
+     * every other Blink integration. Read the resolved value from
+     * {@link Deposit.presentation} — on `'overlay'` no `resize` event ever fires,
+     * so a panel sized from those reports should be collapsed or skipped.
+     *
+     * Nothing else downgrades it. A *failure* never reaches the overlay (an
+     * older webview keeps the inline presenter), because dropping a full-screen
+     * modal over an aggregator's widget unannounced is worse than the flow not
+     * starting; the mobile choice is deliberate and made before anything renders.
+     *
+     * @default 'overlay'
+     */
+    presentation?: 'overlay' | 'embedded';
+    /**
+     * Embedded presentation only: hard cap on the inline iframe's height, in
+     * CSS pixels. Ignored on mobile, where the flow presents as an overlay and
+     * sizes itself against the real viewport.
+     *
+     * Two jobs. It bounds the iframe element, so a tall screen scrolls
+     * internally instead of pushing the host's page around. And it is the
+     * basis viewport-derived sizing inside the flow resolves against — which
+     * is why it must be a budget the host decides, never a measurement of what
+     * the iframe currently is. (An inline iframe sized from its own content
+     * makes `dvh` self-referential; feeding the measured height back in would
+     * make every decorative band inflate to its ceiling.)
+     *
+     * @default Math.round(window.innerHeight * 0.9)
+     */
+    embedMaxHeightPx?: number;
     /**
      * Maximum time in milliseconds to wait for the signer endpoint to respond.
      *
@@ -133,6 +194,54 @@ interface DepositConfig {
          * falling back to `'light'`
          */
         theme?: 'light' | 'dark' | 'system';
+        /**
+         * Brand colors for the hosted UI. Blink derives its whole palette from
+         * these — surfaces, the recessed/hover steps, the text ramp, borders, the
+         * button hover and label, the tinted semantic surfaces — so the flow reads
+         * as part of your product rather than a foreign panel inside it. Most
+         * valuable in the embedded presentation, where Blink sits in your own
+         * dialog, but applied on every surface.
+         *
+         * **Opaque hex only** (`#rgb` or `#rrggbb`). Anything else — `rgb()`, a CSS
+         * color name, 8-digit hex with alpha — is dropped with a console error
+         * naming the key: a solid card cannot honour translucency, and a color that
+         * cannot be parsed cannot be contrast-checked.
+         *
+         * Contrast is enforced. Where a derived pair would fall below WCAG AA the
+         * *derived* value is substituted (never your input) and the substitution is
+         * reported in the hosted flow's console. A `colorPrimary` too mid-toned for
+         * either a black or a white label is reported and left alone — only you can
+         * fix that one.
+         *
+         * The scale (sizes, weights, radii) and Blink's own brand marks, semantic
+         * hues and authorization states are not themeable.
+         *
+         * @example
+         * appearance: {
+         *   theme: 'light',
+         *   variables: {
+         *     colorPrimary: '#0f62fe',
+         *     colorBackground: '#ffffff',
+         *     colorText: '#111111',
+         *   },
+         * }
+         */
+        variables?: {
+            /** Primary button fill, focus ring, selected states. */
+            colorPrimary?: string;
+            /**
+             * The card surface. Its luminance also picks the light or dark base for
+             * everything not themeable — shadows, the backdrop scrim, semantic hues —
+             * so a dark surface stays coherent even with `theme: 'light'`.
+             */
+            colorBackground?: string;
+            /** Body text. The secondary/muted/tertiary ramp is derived from it. */
+            colorText?: string;
+            /** Error text and the error surface tint. */
+            colorDanger?: string;
+            /** Hairline borders. Derived from surface + text when omitted. */
+            colorBorder?: string;
+        };
     };
     /**
      * Warm up the hosted payment flow in a hidden iframe as soon as the
@@ -192,6 +301,24 @@ interface DepositRequest {
     reference?: string;
     /** Arbitrary key-value pairs forwarded to the signer endpoint. */
     metadata?: Record<string, string>;
+    /**
+     * The user's current balance on YOUR platform, in USD — display only.
+     *
+     * When provided, the hosted flow shows it under the deposit header as
+     * "{Merchant} balance: $X.XX" so the user tops up with their platform
+     * balance in view. It is never part of the signed payload and is never
+     * sent to your signer, so passing it requires no signer changes — and it
+     * cannot influence the transfer amount or destination.
+     *
+     * Must be a finite number, `>= 0` and below `1e12`. The SDK floors it to
+     * whole cents before sending (`20.789` renders as `$20.78`); anything else
+     * is dropped with a `console.error` naming the field, and the deposit
+     * proceeds without the subtitle. The hosted flow independently re-validates
+     * whatever it receives, so the value is purely cosmetic. When omitted, the
+     * hosted flow may fall back to showing the destination wallet's on-chain
+     * balance instead.
+     */
+    balance?: number;
 }
 /** Result returned when a deposit completes successfully. */
 interface DepositResult {

package/dist/{types-BjnQ2ux2.d.ts → types-QRkKxsoP.d.ts}

@@ -70,11 +70,72 @@ interface DepositConfig {
      */
     hostedFlowOrigin?: string;
     /**
-     * DOM element to mount the iframe overlay into.
+     * DOM element the iframe is mounted into.
+     *
+     * In the default `presentation: 'overlay'` this only changes the overlay's
+     * append parent — the overlay is still `position: fixed; inset: 0` and
+     * covers the viewport regardless of where it hangs in the tree.
+     *
+     * In `presentation: 'embedded'` it is the real mount point: the iframe
+     * renders inline inside this element, and the option is **required**. The
+     * element must be stable across re-renders — moving an iframe in the DOM
+     * reloads it, discarding the warmed-up document and the user's session.
+     * (On mobile, where an embedded flow presents as an overlay instead, this
+     * element is left untouched and the overlay mounts on `document.body` — a
+     * `position: fixed` overlay inside a host's animated dialog would position
+     * against that dialog rather than the viewport.)
      *
      * @default document.body
      */
     containerElement?: HTMLElement;
+    /**
+     * How the hosted flow is presented on the host page.
+     *
+     * `'overlay'` (the default) is the classic modal: a full-viewport dim +
+     * blur backdrop with the payment card centered on top, dismissable by
+     * backdrop click or Escape.
+     *
+     * `'embedded'` mounts the iframe **inline** inside {@link containerElement}
+     * — for a payment-method aggregator that lists Blink as one option inside
+     * its own widget. There is no backdrop, no body scroll lock, and no
+     * backdrop/Escape dismissal (the host owns all of that); the flow renders
+     * chrome-less so the host's own panel provides the radius, background and
+     * shadow. The iframe's height follows the flow's content, reported through
+     * the {@link Deposit.on | `resize`} event.
+     *
+     * Requires {@link containerElement}.
+     *
+     * **Desktop only.** On mobile an embedded flow presents as the overlay: a
+     * phone-sized method panel cannot hold a payment journey with a keypad,
+     * wallet lists and a QR code, and the overlay is what a phone user gets from
+     * every other Blink integration. Read the resolved value from
+     * {@link Deposit.presentation} — on `'overlay'` no `resize` event ever fires,
+     * so a panel sized from those reports should be collapsed or skipped.
+     *
+     * Nothing else downgrades it. A *failure* never reaches the overlay (an
+     * older webview keeps the inline presenter), because dropping a full-screen
+     * modal over an aggregator's widget unannounced is worse than the flow not
+     * starting; the mobile choice is deliberate and made before anything renders.
+     *
+     * @default 'overlay'
+     */
+    presentation?: 'overlay' | 'embedded';
+    /**
+     * Embedded presentation only: hard cap on the inline iframe's height, in
+     * CSS pixels. Ignored on mobile, where the flow presents as an overlay and
+     * sizes itself against the real viewport.
+     *
+     * Two jobs. It bounds the iframe element, so a tall screen scrolls
+     * internally instead of pushing the host's page around. And it is the
+     * basis viewport-derived sizing inside the flow resolves against — which
+     * is why it must be a budget the host decides, never a measurement of what
+     * the iframe currently is. (An inline iframe sized from its own content
+     * makes `dvh` self-referential; feeding the measured height back in would
+     * make every decorative band inflate to its ceiling.)
+     *
+     * @default Math.round(window.innerHeight * 0.9)
+     */
+    embedMaxHeightPx?: number;
     /**
      * Maximum time in milliseconds to wait for the signer endpoint to respond.
      *
@@ -133,6 +194,54 @@ interface DepositConfig {
          * falling back to `'light'`
          */
         theme?: 'light' | 'dark' | 'system';
+        /**
+         * Brand colors for the hosted UI. Blink derives its whole palette from
+         * these — surfaces, the recessed/hover steps, the text ramp, borders, the
+         * button hover and label, the tinted semantic surfaces — so the flow reads
+         * as part of your product rather than a foreign panel inside it. Most
+         * valuable in the embedded presentation, where Blink sits in your own
+         * dialog, but applied on every surface.
+         *
+         * **Opaque hex only** (`#rgb` or `#rrggbb`). Anything else — `rgb()`, a CSS
+         * color name, 8-digit hex with alpha — is dropped with a console error
+         * naming the key: a solid card cannot honour translucency, and a color that
+         * cannot be parsed cannot be contrast-checked.
+         *
+         * Contrast is enforced. Where a derived pair would fall below WCAG AA the
+         * *derived* value is substituted (never your input) and the substitution is
+         * reported in the hosted flow's console. A `colorPrimary` too mid-toned for
+         * either a black or a white label is reported and left alone — only you can
+         * fix that one.
+         *
+         * The scale (sizes, weights, radii) and Blink's own brand marks, semantic
+         * hues and authorization states are not themeable.
+         *
+         * @example
+         * appearance: {
+         *   theme: 'light',
+         *   variables: {
+         *     colorPrimary: '#0f62fe',
+         *     colorBackground: '#ffffff',
+         *     colorText: '#111111',
+         *   },
+         * }
+         */
+        variables?: {
+            /** Primary button fill, focus ring, selected states. */
+            colorPrimary?: string;
+            /**
+             * The card surface. Its luminance also picks the light or dark base for
+             * everything not themeable — shadows, the backdrop scrim, semantic hues —
+             * so a dark surface stays coherent even with `theme: 'light'`.
+             */
+            colorBackground?: string;
+            /** Body text. The secondary/muted/tertiary ramp is derived from it. */
+            colorText?: string;
+            /** Error text and the error surface tint. */
+            colorDanger?: string;
+            /** Hairline borders. Derived from surface + text when omitted. */
+            colorBorder?: string;
+        };
     };
     /**
      * Warm up the hosted payment flow in a hidden iframe as soon as the
@@ -192,6 +301,24 @@ interface DepositRequest {
     reference?: string;
     /** Arbitrary key-value pairs forwarded to the signer endpoint. */
     metadata?: Record<string, string>;
+    /**
+     * The user's current balance on YOUR platform, in USD — display only.
+     *
+     * When provided, the hosted flow shows it under the deposit header as
+     * "{Merchant} balance: $X.XX" so the user tops up with their platform
+     * balance in view. It is never part of the signed payload and is never
+     * sent to your signer, so passing it requires no signer changes — and it
+     * cannot influence the transfer amount or destination.
+     *
+     * Must be a finite number, `>= 0` and below `1e12`. The SDK floors it to
+     * whole cents before sending (`20.789` renders as `$20.78`); anything else
+     * is dropped with a `console.error` naming the field, and the deposit
+     * proceeds without the subtitle. The hosted flow independently re-validates
+     * whatever it receives, so the value is purely cosmetic. When omitted, the
+     * hosted flow may fall back to showing the destination wallet's on-chain
+     * balance instead.
+     */
+    balance?: number;
 }
 /** Result returned when a deposit completes successfully. */
 interface DepositResult {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swype-org/deposit",
-  "version": "0.3.26",
+  "version": "0.3.32",
   "description": "Lightweight merchant deposit SDK — open a hosted payment flow, handle completion, zero dependencies",
   "type": "module",
   "main": "dist/index.cjs",