Checkout widget

Protection in the cart.

A drop-in toggle that prices protection as the cart changes and tells you when the shopper turns it on or off.

Checkout widget

A drop-in toggle for your cart or checkout. It prices protection as the cart changes and tells you when the shopper turns it on or off — you add or remove the fee, and send us the order.

1. Load the script and place the container

<script type="text/javascript" async
            src="https://api.covrprotection.com/protection-widget.js"></script>

    <div class="covr-div"></div>

2. Render it

window.Covr.Protection.render({
      merchantId: "merch_2zta9l4uravokw42",
      storeDomain: "your-store.com",
      subtotal: 145.00,      // shippable items only, before discounts
      currency: "USD",
      environment: window.Covr.Environment.Production,
      theming: {
        mode: window.Covr.Theme.Mode.LightMode,
        alignment: window.Covr.Theme.Alignment.Left
      }
    });

3. React to the shopper

window.Covr.Protection.on("get_quote", function (event) {
      // { quote: { id, premium: { currency: "USD", amount: 4.35 },
      //            paymentResponsible: { type: "customer", toggleState: "unchecked" } } }
    });

    window.Covr.Protection.on("status_change", function (event) {
      // { from: 0, to: 1 } — add or remove the protection fee from the cart
    });

    // Re-quote whenever the cart total changes.
    window.Covr.Protection.update({ subtotal: 162.50 });

window.Covr.Protection

Field	Type	Description
render(options)	method	Mounts the widget and fetches the first quote. merchantId is required.
update({ subtotal })	method	Re-quotes after a cart change. Late responses for stale carts are discarded.
on(event, fn) / off(event, fn)	method	get_quote, status_change, and error.
isSelected() / getQuote()	method	Current toggle state, and the latest quote (null before the first arrives).
setSelected(bool)	method	Sets the toggle programmatically; fires status_change exactly like a click.

The subtotal is shippable items only

Exclude digital goods, gift cards, and anything else that cannot be lost in transit. Mark those line items is_insured: false when you send the order and we will exclude them there too — the covered amount is always derived from the insured items.

The toggle starts off, deliberately

toggleState is unchecked. Pre-selecting an optional paid add-on for a shopper is the practice consumer-protection regulators object to, and it is not something we will default on. If you want it pre-checked, that is a conversation to have with your own counsel first.

Legacy names keep working

.arrive-div and .route-div containers are detected exactly like .covr-div, and window.Arrive is the same object as window.Covr. An integration written against either name keeps working unchanged.

It does not claim window.Route

If you are migrating and still have Route's script on the page, both can load without fighting. Port your handlers by changing the namespace; the method and event names are the same.