Integrating with SDK
The Sensible Weather Javascript SDK is designed to allow you to seamlessly generate Weather Guarantee Quotes from within your client-side code.
Auth
The Javascript SDK is authenticated using CORS policies combined with a limited security footprint. The SDK is only permitted to generate quotes, but you will still need to accept the quote within your system's backend by using the Sensible Weather API.
To interact with the Javascript SDK, your app must be able to authorize using our auth API. A partner_id
or product_id
is provided via shared secure vault. Your CORS domains must also be whitelisted.
Installing the SDK
To begin using the SDK, copy the following into the HTML header of the desired page.
<script type='module' src='https://static.sensibleweather.io/js-sdk/v1.0.3/build/sensible-sdk.esm.js'></script>
<script nomodule src='https://static.sensibleweather.io/js-sdk/v1.0.3/build/sensible-sdk.js'></script>
<link rel="stylesheet" href="https://static.sensibleweather.io/js-sdk/v1.0.3/assets/css/fonts.css" />
Once the SDK has been installed on your page, you can access it as a global object named Sensible
.
To configure the SDK, call the Sensible.configure
method, passing in your partner_id
, product_id
, and an optional third argument to specify a connection to the sandbox environment.
<script>
// Production Configuration
document.addEventListener('DOMContentLoaded', () => {
Sensible.configure('your_partner_id', 'your_product_id');
});
</script>
<script>
// Sandbox Configuration
document.addEventListener('DOMContentLoaded', () => {
Sensible.configure('your_partner_id', 'your_product_id', 'sandbox');
});
</script>
Creating a Quote
In your checkout flow, use the Sensible SDK to create a quote.
const quote = await Sensible.quote.createQuote({
coverageStartDate: "2024-01-01",
coverageEndDate: "2024-01-05",
currency: "usd",
exposureName: "Example Exposure Name",
exposureLatitude: 37.77664018315584,
exposureLongitude: -111.63836828825272,
exposureTotalCoverageAmount: 10,
langLocale: "en-us"
});
The created quote will provide you with all of the information needed to display to your customer under the quoteData
namespace.
The quote object also provides suggested plain language to be used when incorporating the quote into your checkout UI. The main
namespace includes language suitable for a simple inline item, while the details
namespace includes language suitable for either a modal or separate page.
interface Quote {
quoteData: {
id: string;
pricePerDay: number;
totalPrice: number;
dailyCoverageStartHour: number;
dailyCoverageEndHour: number;
sortedTiers: {
hours: number;
reimbursementRate: number
}[];
exposureProtections: {
name: string;
unit: string;
upperThreshold?: number;
lowerThreshold?: number;
}[];
currency: "usd" | "eur" | "gbp";
},
main: {
title: string;
suggested_price: string;
suggested_price_total: string;
body: string;
action: string;
open_details: string;
terms_conditions: string;
privacy: string;
},
details: {
title: string;
summary_heading: string;
summary_times: string;
summary_tiers: string[];
summary_subheading: string;
summary_body: string;
summary_explainer: string;
steps_heading: string;
step_1_heading: string;
step_1_body: string;
step_2_heading: string;
step_2_body: string;
step_3_heading: string;
step_3_body: string;
summary_body: string;
suggested_price: string;
suggested_total_price: string;
action: string;
close: string;
terms_conditions: string;
privacy: string;
}
}
Example suggested plain language usage

Top image: Embedded component in checkout/purchase page
Bottom image: Popup modal when customers click on "Learn more" in the embedded component
Accepting or Declining a Quote
Once your customer has selected a quote created by the Sensible Weather SDK, you will be able to complete the process of Accepting or Declining the quote using the Sensible Weather API within your backend. To do so, follow the steps in the Integrating with API guide, passing the ID value from the SDK generated quote.
Updated about 1 month ago