@openreceive/elements 0.4.5 → 0.4.6

package/README.md

@@ -1,6 +1,30 @@
 # @openreceive/elements
 
-The OpenReceive checkout custom element (`<openreceive-checkout>`) and theme toggle (`<openreceive-theme-toggle>`).
+Add Bitcoin Lightning checkout to any website with
+`<openreceive-checkout>`. The custom element displays payment choices, QR
+codes, and live payment status, with no frontend framework required. It also
+ships `<openreceive-theme-toggle>` for switching the checkout theme.
+
+OpenReceive supports optional swaps from **USDT, USDC, SOL, and ETH** through
+a configured swap provider. The provider converts the payment to **BTC over
+Lightning**, which settles into the merchant's connected wallet. Available
+assets and networks depend on the provider; swaps are optional.
+
+Pair this browser package with an OpenReceive server integration. Your server
+authorizes the order, sets the amount, configures swaps, and verifies
+settlement; wallet and provider credentials stay on the server.
+
+## Install
+
+Use Node.js 22 or later for package tooling.
+
+```sh
+npm install @openreceive/elements
+```
+
+Follow the [frontend checkout guide](https://github.com/openreceive/openreceive/blob/master/docs/guides/frontend-checkout.md)
+to connect the component to your server routes. Use the server-side payment
+hook to fulfill orders; browser callbacks update the interface.
 
 ## Mount
 

package/dist/{chunk-4APDZW7L.js → chunk-VP27OICT.js}

@@ -1250,7 +1250,7 @@ function renderElementCompactPaymentSelectorHtml(swapAssetOptions, view) {
         <h2 id="payment-method-heading" class="${orClasses5.wizardHeaderTitle}">${escapeHtml6(checkoutLabels5.wizardTitle)}</h2>
         <p class="${orClasses5.wizardHeaderSubtitle}">${escapeHtml6(checkoutLabels5.wizardSubtitle)}</p>
       </header>
-      <div class="${orClasses5.wizardBody}" aria-labelledby="payment-method-heading">
+      <div class="${orClasses5.methodBody}" aria-labelledby="payment-method-heading">
         <div part="method-grid" role="group" aria-label="${escapeHtml6(checkoutLabels5.paymentMethod)}" class="${orClasses5.methodGrid}">
           ${tiles}${loadingTile}
         </div>
@@ -1284,7 +1284,7 @@ function renderElementNetworkSelectorHtml(group, view, continueButtonHtml, mobil
       label: option.network_label
     })}
             </span>
-            <span class="truncate">${escapeHtml6(option.network_label)}</span>
+            <span class="${orClasses5.methodNetworkLabel}">${escapeHtml6(option.network_label)}</span>
             ${optionSelected ? `<span aria-hidden="true" class="${networkCheckClasses(accent)}">\u2713</span>` : ""}
           </button>
           ${optionDisabled && optionLimit !== void 0 ? `<span class="${orClasses5.methodLimitHint}">${escapeHtml6(optionLimit)}</span>` : ""}

package/dist/index.js

@@ -12,7 +12,7 @@ import {
   renderCheckoutHtml,
   renderThemeToggleHtml,
   renderTransactionDetailsHtml
-} from "./chunk-4APDZW7L.js";
+} from "./chunk-VP27OICT.js";
 export {
   OPENRECEIVE_CHECKOUT_ELEMENT_ATTRIBUTES,
   OPENRECEIVE_CHECKOUT_ELEMENT_EVENTS,