@vertical-insure/web-components
Version:
Vertical Insure Web Components using Lit and Open Web Standards
80 lines (79 loc) • 3.69 kB
JavaScript
import { OfferRadioButtonType } from "../common/offer-radio-button.js";
import { html } from "lit";
import { when } from "lit/directives/when.js";
import snakeCase from "lodash-es/snakeCase.js";
import { SelectedState } from "./selected-state.js";
const apiHost = "https://api.verticalinsure.com";
function formatCurrency(cents, currency) {
const locale = "en-" + (currency === "CAD" ? "CA" : "US");
const formatter = new Intl.NumberFormat(locale, {
style: "currency",
currency
});
return cents ? formatter.format(cents / 100) : 0;
}
const titleCase = (s) => s.toLowerCase().replace(/^[-_]*(.)/, (_, c) => c.toUpperCase()).replace(/[-_]+(.)/g, (_, c) => " " + c.toUpperCase());
function parseJwt(token) {
const base64Url = token.split(".")[1];
const base64 = base64Url.replace(/-/g, "+").replace(/_/g, "/");
const jsonPayload = decodeURIComponent(
window.atob(base64).split("").map((c) => "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2)).join("")
);
return JSON.parse(jsonPayload);
}
const dataToObject = function(dataset) {
return Object.keys(dataset).reduce(function(object, key) {
object[snakeCase(key)] = dataset[key];
return object;
}, {});
};
const standardDisplayTemplate = (selectedState, acceptAction, declineAction, renderPaymentElement, landingPageAction, quote, productTemplate, errors) => html`
<div id="offer-display">
<div id="offer-tag-wrapper">
<div id="offer-tag">Recommended</div>
</div>
<offer-header .quote=${quote}></offer-header>
<section id="offer-content">
<descriptor-list .quote=${quote} .declined=${selectedState === SelectedState.DECLINED}></descriptor-list>
<section id="actions">
${when(landingPageAction, () => html`
<landing-page-action></landing-page-action>
`, () => html`
<div id="action-header">*Required: Select an option to continue</div>
<offer-radio-button type=${OfferRadioButtonType.ACCEPTED} @change=${acceptAction} ?checked=${selectedState === SelectedState.ACCEPTED}>
${(productTemplate == null ? void 0 : productTemplate.accept_action_text) || `Accept Coverage for ${(quote == null ? void 0 : quote.total) || (quote == null ? void 0 : quote.premium_amount) ? formatCurrency((quote == null ? void 0 : quote.total) || (quote == null ? void 0 : quote.premium_amount), quote.currency) : ""}`}
</offer-radio-button>
<offer-radio-button type=${OfferRadioButtonType.DECLINED} @change=${declineAction} ?checked=${selectedState === SelectedState.DECLINED}>
${(productTemplate == null ? void 0 : productTemplate.decline_action_text) || `Decline Coverage`}
</offer-radio-button>
`)}
${when(errors.length > 0 && errors.some((v) => v in FRIENDLY_ERROR_MESSAGE), () => html`
<section id="errors" class="error-message">
${errors.map((e) => html`<p>${FRIENDLY_ERROR_MESSAGE[e]}</p>`)}
</section>
`)}
</section>
</section>
${renderPaymentElement && renderPaymentElement()}
<legal-disclaimer .quote=${quote}></legal-disclaimer>
</div>
`;
const FRIENDLY_ERROR_MESSAGE = {
selection_required: "A selection is required."
};
var ControllerStatus = /* @__PURE__ */ ((ControllerStatus2) => {
ControllerStatus2[ControllerStatus2["PENDING"] = 0] = "PENDING";
ControllerStatus2[ControllerStatus2["COMPLETE"] = 1] = "COMPLETE";
ControllerStatus2[ControllerStatus2["ERROR"] = 2] = "ERROR";
return ControllerStatus2;
})(ControllerStatus || {});
export {
ControllerStatus,
FRIENDLY_ERROR_MESSAGE,
apiHost,
dataToObject,
formatCurrency,
parseJwt,
standardDisplayTemplate,
titleCase
};