@mychoice/mychoice-sdk-modules 2.2.3 → 2.2.4

package/dist/cjs/index.js

@@ -387,11 +387,12 @@ const VehicleOfferCoverages = ({ coverages, nonStandardCoverages, }) => {
     return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "offer-coverages-container", children: jsxRuntime.jsxs("table", { className: "offer-coverages-table", children: [jsxRuntime.jsxs("tr", { className: "table-header", children: [jsxRuntime.jsx("td", { children: vehicle_names.join(', ') }), jsxRuntime.jsx("td", { children: "Selection" }), jsxRuntime.jsx("td", { children: "Premium" })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Third Party Liability Coverage", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: "Third-party liability coverage is mandatory in Ontario and protects you if you're found at fault for injuring or killing someone or damaging their property while driving. This includes people in other vehicles, pedestrians, cyclists, and even passengers in your own car, as well as property like fences, buildings, street signs, and light poles. If you’re sued, this coverage helps pay for legal defence, settlements, and any court-ordered payments. The minimum required coverage is $200,000, but that amount often isn’t enough—most drivers choose at least $2 million to avoid having to pay out-of-pocket if costs exceed the limit. This is a mandatory coverage in Ontario. Talk to your broker to ensure you have the right amount of protection." }) })] }), jsxRuntime.jsx("td", { children: jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.liabilityOptions, name: "liability-limit", onChange: handleLiabilityChange, defaultValue: getSelectedOption(mychoiceSdkComponents.liabilityOptions, liability.coverage ? liability.limit : 1000000), title: "", description: "", placeholder: "Select from the list", autoSelectIfValueIsOutOfOptions: false, size: mychoiceSdkComponents.SizeTypes.Small, className: "coverages-select-input" }) }), jsxRuntime.jsx("td", { children: getTPBIandTPPD() })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Direct Compensation - Property Damange Coverage", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: "Third - Party Liability Direct Compensation responds when you are determined to be not at-fault in an accident with another vehicle, and covers the cost of damage to your vehicle (or actual cash value payout), it's equipment, contents, loss of use, and other associated incidentals such as towing fees and lot fees. This is considered an optional coverage, and it is highly recommended that you do not remove it. If your vehicle is financed or leased, the lienholder/lessor must agree to allow you to remove it. Should you remove it, you must also remove collision or all perils coverage. You will be entirely out-of-pocket in a not-at-fault accident and are legally restricted from claiming reimbursement (suing) the other vehicle owner or their insurer.  Chat to your broker for more details about this coverage." }) })] }), jsxRuntime.jsx("td", { children: "$0 Deductible" }), jsxRuntime.jsx("td", { children: getCoveragePremium('TPDC') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Accident Benefits Coverage", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'Accident Benefits is a mandatory coverage that responds when there is injury or death in an accident, regardless of fault, and for all affected individuals. It provides a core series of benefits with the capacity to increase coverage values, along with a menu of optional additional benefits that can be added on. The core and optional coverages must be thoroughly reviewed and evaluated, and decisions made based on your own personal circumstances and needs.  Chat to your broker for more details about this coverage.' }) })] }), jsxRuntime.jsx("td", { children: "Included" }), jsxRuntime.jsx("td", { children: getCoveragePremium('AB') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Uninsured Automobile Coverage", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'Uninsured Motorist Coverage is a mandatory coverage which responds when you are not at-fault in an accident with an uninsured or unidentified (hit-and-run) vehicle, and have incurred bodily injuries, death, or damage to your property, and the offending vehicle owner cannot be found, of if identified, cannot adequately compensate you. Coverage is capped to match the province minimum liability limit of $200,000. Due to the low coverage value, it is highly recommended to ensure inclusion of the OPCF44 Family Protection Coverage endorsement for additional protection. Chat to your broker for more details about this coverage.' }) })] }), jsxRuntime.jsx("td", { children: "Included" }), jsxRuntime.jsx("td", { children: getCoveragePremium('UA') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Comprehensive Coverage", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'Comprehensive coverage responds to types of damages ( repair or actual cash value payout) incurred by your vehicle when it is not actively being driven. Examples would be fire, theft, vandalism, glass breakage, and weather-related losses. While considered an optional coverage, it is highly recommended. Should your vehicle be financed or leased, the lienholder/lessor will not allow you to leave this coverage out and will impose a satisfactory deductible to meet their requirements.' }) })] }), jsxRuntime.jsx("td", { children: jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.coverageOptions, name: "comprehensive-coverage", onChange: handleComprehensiveChange, defaultValue: getSelectedOption(mychoiceSdkComponents.coverageOptions, comprehensive.coverage ? comprehensive.deductible : 0), title: "", description: "", placeholder: "Select from the list", autoSelectIfValueIsOutOfOptions: false, size: mychoiceSdkComponents.SizeTypes.Small, className: "coverages-select-input" }) }), jsxRuntime.jsx("td", { children: getCoveragePremium('CMP') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Collision Coverage", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'Collision coverage responds to your vehicle damages (repair or actual cash value payout) in the event you collide with another vehicle or object in the course of its use or operation, and is determined to be at-fault. While considered an optional coverage, it is highly recommended. Should your vehicle be financed or leased, the lienholder/lessor will not allow you to leave this coverage out and will impose a satisfactory deductible to meet their requirements. Chat to your broker for more details about this coverage.' }) })] }), jsxRuntime.jsx("td", { children: jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.coverageOptions, name: "collision-coverage", onChange: handleCollisionChange, defaultValue: getSelectedOption(mychoiceSdkComponents.coverageOptions, collision.coverage ? collision.deductible : 0), title: "", description: "", placeholder: "Select from the list", autoSelectIfValueIsOutOfOptions: false, size: mychoiceSdkComponents.SizeTypes.Small, className: "coverages-select-input" }) }), jsxRuntime.jsx("td", { children: getCoveragePremium('COL') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), doesCoverageExist('5') && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsx("td", { children: "Permission to Rent or Lease (OPCF 5)" }), jsxRuntime.jsx("td", { children: "Included" }), jsxRuntime.jsx("td", { children: getCoveragePremium('5') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) })] })), isNonStandardCoverageActive(20) && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Loss of Use (OPCF 20)", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'The OPCF20 Loss of Use / Transportation Replacement endorsement responds when you are determined to be at-fault for an accident, or have a comprehensive claim, and need replacement transportation while your vehicle is out-of-service being repaired, or until it is deemed to be a total loss and a settlement offer is made by your insurer. Most often used to pay for a temporary replacement vehicle rental, it can also be used to compensate for other acceptable forms of travel. Depending on the insurer, the coverage limits available may be a dollar amount or a time amount, and you must have collision and comprehensive, or all perils coverage to include this endorsement. While it is optional, it is highly recommended, and careful consideration must be given to the coverage amounts chosen, as repair delays can quickly exhaust your policy limits, leaving you out-of-pocket for transportation expenses. Chat to your broker for more details about this coverage.' }) })] }), jsxRuntime.jsx("td", { style: { paddingBottom: '7px' }, children: jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.lossOfUseOptions, name: "loss-of-use", onChange: handleLossOfUseChange, defaultValue: getSelectedOption(mychoiceSdkComponents.lossOfUseOptions, lossofuse.coverage ? lossofuse.limit : 0), title: "", description: "", placeholder: "Select from the list", autoSelectIfValueIsOutOfOptions: false, size: mychoiceSdkComponents.SizeTypes.Small, className: "coverages-select-input" }) }), jsxRuntime.jsx("td", { rowSpan: doesCoverageExist('PAK6') ? 2 : 1, children: doesCoverageExist('PAK6') ? getCoveragePremium('PAK6') : getCoveragePremium('20') })] }) })), isNonStandardCoverageActive(27) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Liability for Damage for Non-Owned Cars (OPCF 27)", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'The OPCF27 Liability for Damage to Non-Owned Automobile(s) endorsement responds when you rent or borrow a vehicle, and want to extend your coverages to that vehicle. Often used for special occasion rentals or vacation vehicle rentals. Full liability and physical damage coverages must be on your insured vehicle for this endorsement to apply, and a deductible is applicable. Careful consideration must be given in choosing a coverage amount that adequately covers the value of the vehicle you are expecting to rent or borrow.  While considered optional, it is highly recommended, and often "packaged" with the OPCF20 Loss of Use / Transportation Replacement coverage by many insurers. Chat to your broker for more details about this coverage.' }) })] }), jsxRuntime.jsx("td", { children: jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.liabilityForDamageOptions, name: "liaiblity-for-damage", onChange: handleLiaiblityForDamageChange, defaultValue: getSelectedOption(mychoiceSdkComponents.liabilityForDamageOptions, liabilityfordamage.coverage ? liabilityfordamage.limit : 0), title: "", description: "", placeholder: "Select from the list", autoSelectIfValueIsOutOfOptions: false, size: mychoiceSdkComponents.SizeTypes.Small, className: "coverages-select-input" }) }), !doesCoverageExist('PAK6') && jsxRuntime.jsx("td", { children: getCoveragePremium('27') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) })] })), isNonStandardCoverageActive('aCCW') && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Accident Waiver or Forgiveness (OPCF 39)", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: "The OPCF39 Accident Waiver/Forgiveness endorsement responds by protecting your existing driving record from being negatively impacted by a single, partial at-fault or fully at-fault accident, and must be on the policy before the accident. The benefit of the coverage continues as long as you stay with the same insurer, as it's not transferable should you move to another insurance company. Subsequent at-fault or partial at-fault accidents will not have the protection and will be adversely rated accordingly. Eligibility, terms, conditions, and formulations used can vary significantly between insurers, so careful review and consideration are essential.  While purchasing this endorsement is optional, it is highly recommended as the alternative of being accident-rated for several years will be significantly higher in premiums than the cost of the endorsement.  Chat to your broker for more details about this coverage." }) })] }), jsxRuntime.jsx("td", { children: "Included" }), jsxRuntime.jsx("td", { children: getCoveragePremium('ACCW') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) })] })), isNonStandardCoverageActive(43) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Limited waiver of depreciation (OPCF ", isLeased ? '43A' : '43', ")", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'The OPCF43/43A Removing Depreciation Deduction / Limited Waiver of Depreciation endorsement responds by protecting your original purchase/lease price of a "new" vehicle (as evidenced by a bill of sale or lease agreement) from depreciation should the vehicle be a total loss from an insured peril. Only new vehicles, and in some cases "demo\'s" with limited mileage are eligible, and the endorsement must be added immediately upon the vehicle delivery. Coverage durations available vary between insurers, generally ranging from 24 months to 60 months from the possession date of the vehicle. While an optional coverage, it is highly recommended as, without it, a total loss settlement based on actual cash value could leave you contractually owing money to a lienholder or lessor. Chat to your broker for more details about this coverage.' }) })] }), jsxRuntime.jsx("td", { children: jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.limitedWaiverOfDepreciationOptions, name: "liaiblity-for-damage", onChange: handleLimitedWaiverOfDepreciationChange, defaultValue: getSelectedOption(mychoiceSdkComponents.limitedWaiverOfDepreciationOptions, limitedwaiverofdepreciation.coverage ? limitedwaiverofdepreciation.limit : 0), title: "", description: "", placeholder: "Select from the list", autoSelectIfValueIsOutOfOptions: false, size: mychoiceSdkComponents.SizeTypes.Small, className: "coverages-select-input" }) }), jsxRuntime.jsx("td", { children: getCoveragePremium('43') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) })] })), jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsxs("td", { children: ["Family Protection (OPCF 44)", jsxRuntime.jsx("div", { style: { display: 'inline-block', marginLeft: '5px' }, children: jsxRuntime.jsx(mychoiceSdkComponents.TooltipForm, { id: "my-tooltip", description: 'The OPCF44 Family Protection Endorsement responds when you are determined to be not at-fault in a vehicle accident, and your claim / civil suit against the offending vehicle owner is not adequately satisfied as they are unidentified, uninsured, or underinsured. This endorsement bridges their coverages (if any) up to the full limits of the OPCF44 coverage on your policy. While considered an optional coverage, it is highly recommended as a form of self protection, and is extremely low in cost. Chat to your broker for more details about this coverage.' }) })] }), jsxRuntime.jsx("td", { children: "Included" }), jsxRuntime.jsx("td", { children: getCoveragePremium('44') })] }), jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: 3, children: jsxRuntime.jsx("div", { className: "divider" }) }) }), jsxRuntime.jsxs("tr", { className: "premium-total", children: [jsxRuntime.jsx("td", { children: "Annual Premium" }), jsxRuntime.jsx("td", {}), jsxRuntime.jsx("td", { children: getSumOfPremiums() })] })] }) }), jsxRuntime.jsx("div", { style: { display: 'flex', flexDirection: 'column' }, children: jsxRuntime.jsx(BlockSubmit$2, { className: "mychoice recalculate", label: "Recalculate Quote", buttonSize: mychoiceSdkComponents.SizeTypes.Medium, isRecalc: true }) })] }));
 };
 
-const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, isBestOffer, operationHours = {}, redirectUrl, fulfillmentUrl, coverages, nonStandardCoverages, brokerIntegration, }) => {
+const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, isBestOffer, isFirstOffer = true, operationHours = {}, redirectUrl, fulfillmentUrl, coverages, nonStandardCoverages, brokerIntegration, }) => {
     const { appConfigState: { appType }, } = mychoiceSdkStore.useStoreAppConfig();
     const { postRequestQuoteOnliaUrl } = mychoiceSdkStore.CarQuoteDataHandler();
     const isTheBig = appType === mychoiceSdkComponents.AppTypes.TheBig;
     const isMyChoice = mychoiceSdkComponents.isMyChoiceLike(appType);
+    const isBeginInsurance = appType === mychoiceSdkComponents.AppTypes.BeginInsurance;
     const mychoiceCls = mychoiceSdkComponents.isMyChoiceLike(appType) ? 'mychoice' : '';
     const { weekdayHours, saturdayHours, sundayHours } = operationHours;
     const [detailsIsOpen, setDetailsIsOpenIsOpen] = React.useState(isBestOffer ?? false);
@@ -399,6 +400,8 @@ const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, is
         setDetailsIsOpenIsOpen(!detailsIsOpen);
     };
     const offsiteUrl = redirectUrl || fulfillmentUrl;
+    // Only apply first offer restrictions for BeginInsurance
+    const shouldShowBrokerInfo = isBeginInsurance ? isFirstOffer : true;
     const handleCTAClick = () => {
         if (fulfillmentUrl) {
             window.open(fulfillmentUrl, '_blank');
@@ -407,13 +410,13 @@ const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, is
         postRequestQuoteOnliaUrl(true, redirectUrl);
     };
     const isHubIntegration = brokerIntegration?.type === 'hub';
-    return (jsxRuntime.jsxs("div", { className: `offer-section ${mychoiceCls}`, children: [isMyChoice && (isTheBig || !offsiteUrl) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', logo: brokerCompany?.logo, name: brokerCompany?.title, companyType: mychoiceSdkComponents.CompanyRoleTypes.Broker, description: brokerCompany?.description, isBestOffer: isBestOffer, isMyChoice: isMyChoice }), jsxRuntime.jsx("hr", { style: {
+    return (jsxRuntime.jsxs("div", { className: `offer-section ${mychoiceCls}`, children: [shouldShowBrokerInfo && isMyChoice && (isTheBig || !offsiteUrl) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', logo: brokerCompany?.logo, name: brokerCompany?.title, companyType: mychoiceSdkComponents.CompanyRoleTypes.Broker, description: brokerCompany?.description, isBestOffer: isBestOffer, isMyChoice: isMyChoice }), jsxRuntime.jsx("hr", { style: {
                             margin: '0',
                             padding: '0',
                             width: '100%',
                             height: '1px',
                             backgroundColor: '$color-background-header-primary',
-                        } })] })), isMyChoice && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: "Hours of Operation", isMyChoice: isMyChoice, isBestOffer: Boolean(isBestOffer && offsiteUrl), children: jsxRuntime.jsx(mychoiceSdkComponents.OperationHoursInfo, { weekdayHours: weekdayHours, saturdayHours: saturdayHours, sundayHours: sundayHours }) }), jsxRuntime.jsx("hr", { style: {
+                        } })] })), shouldShowBrokerInfo && isMyChoice && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: "Hours of Operation", isMyChoice: isMyChoice, isBestOffer: Boolean(isBestOffer && offsiteUrl), children: jsxRuntime.jsx(mychoiceSdkComponents.OperationHoursInfo, { weekdayHours: weekdayHours, saturdayHours: saturdayHours, sundayHours: sundayHours }) }), jsxRuntime.jsx("hr", { style: {
                             margin: '0',
                             padding: '0',
                             width: '100%',
@@ -2073,7 +2076,7 @@ const PageCarQuote = () => {
                                             sundayHours: items[0]?.brokerProfile.hoursSunday,
                                             weekdayHours: items[0]?.brokerProfile.hoursWorkdays,
                                         }, phoneNumber: formatPhoneObject(items[0]?.brokerProfile.phone), redirectUrl: items[0]?.brokerProfile.redirectUrl || '', coverages: items[0]?.coverages, nonStandardCoverages: items[0]?.nonStandardCoverages, brokerIntegration: items[0]?.brokerIntegration }) })) : (jsxRuntime.jsx(SplashScreen$2, {})) })) : (jsxRuntime.jsx(NoQuotesMessage, { type: "car" })) })), (!hasConfirmStep || appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SectionQuoteEdit$2, {}), (isTheBig || !items[0]?.coverages) && jsxRuntime.jsx(SectionQuoteRecalc$1, {})] }))] }), appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile && quoteState.showCallMessage && jsxRuntime.jsx(SplashScreen$2, {}), !quoteState.showCallMessage && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { style: { position: 'relative', width: '100%' }, children: [hasConfirmStep && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "offer-container", children: jsxRuntime.jsx(SectionConfirm, {}) }), appDeviceType === mychoiceSdkComponents.DeviceTypes.Mobile && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SectionQuoteEdit$2, {}), (isTheBig || !items[0]?.coverages) && jsxRuntime.jsx(SectionQuoteRecalc$1, {})] }))] })), jsxRuntime.jsx("div", { className: `offer-container ${hasConfirmStep ? 'blur' : ''}`, children: !!items?.length ? (quoteItems.map(({ company, brokerProfile, priceMonthly, priceYearly, coverages, nonStandardCoverages, brokerIntegration, }, index) => (jsxRuntime.jsx("div", { children: (appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile ||
-                                        (appDeviceType === mychoiceSdkComponents.DeviceTypes.Mobile && index !== 0)) && (jsxRuntime.jsx(OfferSection, { isBestOffer: index === 0, offerCompany: company, brokerCompany: brokerProfile, offerPrice: {
+                                        (appDeviceType === mychoiceSdkComponents.DeviceTypes.Mobile && index !== 0)) && (jsxRuntime.jsx(OfferSection, { isBestOffer: index === 0, isFirstOffer: index === 0, offerCompany: company, brokerCompany: brokerProfile, offerPrice: {
                                             monthly: priceMonthly,
                                             yearly: priceYearly,
                                         }, operationHours: {
@@ -3123,8 +3126,8 @@ const PageHomeQuote = () => {
                                             saturdayHours: items[0]?.brokerProfile.hoursSaturday,
                                             sundayHours: items[0]?.brokerProfile.hoursSunday,
                                             weekdayHours: items[0]?.brokerProfile.hoursWorkdays,
-                                        }, phoneNumber: formatPhoneObject(items[0]?.brokerProfile.phone), redirectUrl: items[0]?.brokerProfile.redirectUrl || '', fulfillmentUrl: items[0]?.fulfillmentUrl || '', brokerIntegration: items[0]?.brokerIntegration }) })) : (jsxRuntime.jsx(SplashScreen$1, {})) })) : (jsxRuntime.jsx(NoQuotesMessage, { type: "home" })) })), jsxRuntime.jsx(SectionQuoteEdit$1, {}), jsxRuntime.jsx(SectionQuoteRecalc, {})] }), appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile && quoteState.showCallMessage && jsxRuntime.jsx(SplashScreen$1, {}), !quoteState.showCallMessage && (jsxRuntime.jsx("div", { className: "offer-container", children: !!items?.length ? (items.map(({ company, brokerProfile, priceMonthly, priceYearly, fulfillmentUrl, brokerIntegration }, index) => (jsxRuntime.jsx("div", { children: (appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile ||
-                            (appDeviceType === mychoiceSdkComponents.DeviceTypes.Mobile && index !== 0)) && (jsxRuntime.jsx(OfferSection, { isBestOffer: index === 0, offerCompany: company, brokerCompany: brokerProfile, offerPrice: {
+                                        }, phoneNumber: formatPhoneObject(items[0]?.brokerProfile.phone), redirectUrl: items[0]?.brokerProfile.redirectUrl || '', fulfillmentUrl: items[0]?.fulfillmentUrl || '', brokerIntegration: items[0]?.brokerIntegration }) })) : (jsxRuntime.jsx(SplashScreen$1, {})) })) : (jsxRuntime.jsx(NoQuotesMessage, { type: "home" })) })), jsxRuntime.jsx(SectionQuoteEdit$1, {}), jsxRuntime.jsx(SectionQuoteRecalc, {})] }), appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile && quoteState.showCallMessage && jsxRuntime.jsx(SplashScreen$1, {}), !quoteState.showCallMessage && (jsxRuntime.jsx("div", { className: "offer-container", children: !!items?.length ? (items.map(({ company, brokerProfile, priceMonthly, priceYearly, fulfillmentUrl, brokerIntegration, }, index) => (jsxRuntime.jsx("div", { children: (appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile ||
+                            (appDeviceType === mychoiceSdkComponents.DeviceTypes.Mobile && index !== 0)) && (jsxRuntime.jsx(OfferSection, { isBestOffer: index === 0, isFirstOffer: index === 0, offerCompany: company, brokerCompany: brokerProfile, offerPrice: {
                                 monthly: priceMonthly,
                                 yearly: priceYearly,
                             }, operationHours: {
@@ -3415,7 +3418,7 @@ const PageLifeQuote = () => {
                         }
                         // Otherwise, show all quotes as before
                         return items.map(({ company, brokerProfile, priceMonthly, priceYearly, brokerIntegration }, index) => (jsxRuntime.jsx("div", { children: (appDeviceType !== mychoiceSdkComponents.DeviceTypes.Mobile ||
-                                (appDeviceType === mychoiceSdkComponents.DeviceTypes.Mobile && index !== 0)) && (jsxRuntime.jsx(OfferSection, { isBestOffer: index === 0, offerCompany: company, brokerCompany: brokerProfile, offerPrice: {
+                                (appDeviceType === mychoiceSdkComponents.DeviceTypes.Mobile && index !== 0)) && (jsxRuntime.jsx(OfferSection, { isBestOffer: index === 0, isFirstOffer: index === 0, offerCompany: company, brokerCompany: brokerProfile, offerPrice: {
                                     monthly: priceMonthly,
                                     yearly: priceYearly,
                                 }, operationHours: {