@mychoice/mychoice-sdk-modules 2.1.56 → 2.1.58

package/dist/cjs/index.js

@@ -206,7 +206,7 @@ const usePathGroups = (insuranceType) => {
     const externalPathGroup = [
         { name: 'Car', link: 'https://quote.mychoice.ca/insurance/car' },
         { name: 'Home', link: 'https://quote.mychoice.ca/insurance/home' },
-        { name: 'Life', link: 'https://staging.new.mychoice.ca/insurance/life' },
+        { name: 'Life', link: 'https://quote.mychoice.ca/insurance/life' },
         { name: 'Learn', link: 'https://www.mychoice.ca/blog/' },
     ];
     // @todo: use in future.
@@ -235,7 +235,7 @@ const HeaderMyChoice = ({ className, }) => {
         ? mychoiceSdkComponents.InsuranceTypes.Home
         : insuranceType;
     const { externalPathGroup } = usePathGroups(insuranceTypeCls);
-    return (jsxRuntime.jsx("div", { className: `${className} primary-header`, children: jsxRuntime.jsxs("div", { className: "content", children: [jsxRuntime.jsx("div", { className: "logo", children: jsxRuntime.jsx("a", { href: "https://www.mychoice.ca/", rel: "noreferrer", children: jsxRuntime.jsx("img", { src: logo, alt: "logotype" }) }) }), jsxRuntime.jsx("div", { className: "nav-links", children: jsxRuntime.jsx(mychoiceSdkComponents.HeaderNavGroup, { className: insuranceTypeCls, navItems: externalPathGroup }) }), jsxRuntime.jsx("div", { className: "empty-box" })] }) }));
+    return (jsxRuntime.jsx("div", { className: `${className} primary-header`, children: jsxRuntime.jsxs("div", { className: "content", children: [jsxRuntime.jsx("div", { className: "logo", children: jsxRuntime.jsx("a", { href: "https://www.mychoice.ca/", rel: "noreferrer", children: jsxRuntime.jsx("img", { src: logo, alt: "logotype" }) }) }), jsxRuntime.jsx("div", { className: "nav-links", children: jsxRuntime.jsx(mychoiceSdkComponents.HeaderNavGroup, { className: insuranceTypeCls, navItems: externalPathGroup, isExternal: true }) }), jsxRuntime.jsx("div", { className: "empty-box" })] }) }));
 };
 HeaderMyChoice.defaultProps = {
     className: '',
@@ -315,8 +315,8 @@ const ModalMessage = () => {
 const ModalPostal = () => {
     const [inputValue, setInputValue] = React.useState('');
     const insuranceType = mychoiceSdkComponents.getInsuranceType();
-    const { getPostal, status, errorMessage, } = mychoiceSdkStore.useHandlerPostal(insuranceType);
-    const { appModalState: { title, submitButtonText, submitCallBack, }, } = mychoiceSdkStore.useStoreAppModal();
+    const { getPostal, status, errorMessage } = mychoiceSdkStore.useHandlerPostal(insuranceType);
+    const { appModalState: { title, submitButtonText, submitCallBack }, } = mychoiceSdkStore.useStoreAppModal();
     const loading = status === mychoiceSdkComponents.RequestStatusTypes.Loading;
     const error = status === mychoiceSdkComponents.RequestStatusTypes.Error;
     const onSubmit = (event) => {
@@ -2998,12 +2998,12 @@ const SectionCoverage = () => {
     const { coverageState: { type, coverage, province, inValidation }, dispatchCoverageState, } = mychoiceSdkStore.useStoreFormLifeCoverage();
     const { appConfigState: { appType }, } = mychoiceSdkStore.useStoreAppConfig();
     const isMychoice = appType === mychoiceSdkComponents.AppTypes.MyChoice;
-    const handleProvinceChange = ({ value }) => {
-        dispatchCoverageState({
-            type: mychoiceSdkStore.StoreFormLifeCoverageActionTypes.FormLifeProvinceSelect,
-            payload: { province: value },
-        });
-    };
+    // const handleProvinceChange = ({ value }: OnChangeEventInterface) => {
+    //   dispatchCoverageState({
+    //     type: StoreFormLifeCoverageActionTypes.FormLifeProvinceSelect,
+    //     payload: { province: value as string },
+    //   });
+    // };
     const handleLifeInsuranceTypeChange = ({ value }) => {
         dispatchCoverageState({
             type: mychoiceSdkStore.StoreFormLifeCoverageActionTypes.FormLifeCoverageTypeSelect,
@@ -3027,7 +3027,7 @@ const SectionCoverage = () => {
             options: mychoiceSdkComponents.lifeInsuranceTypeOptions.filter((option) => option.name.includes('Year Level')),
         };
     }, [isMychoice, province]);
-    return (jsxRuntime.jsxs("div", { className: "form-section", children: [jsxRuntime.jsx("h2", { className: "section-title", style: { textAlign: 'center' }, children: "Get the coverage you need" }), jsxRuntime.jsx(SelectFormBox, { options: isMychoice ? mychoiceSdkComponents.lifeProvinceOptionsMC : mychoiceSdkComponents.lifeProvinceOptions, name: "province", onChange: handleProvinceChange, defaultValue: province, title: "Province", placeholder: "Select", autoSelectIfValueIsOutOfOptions: false, error: !province && inValidation, errorMessage: getErrorMessage(type, inValidation) }), jsxRuntime.jsx(SelectFormBox, { ...newLifeOptions, name: "type", onChange: handleLifeInsuranceTypeChange, defaultValue: type, title: "Type of Insurance", description: jsxRuntime.jsx(Description, {}), placeholder: "Select", autoSelectIfValueIsOutOfOptions: false, error: !type && inValidation, errorMessage: getErrorMessage(type, inValidation) }), jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.lifeCoverageOptions, name: "coverage", onChange: handleCoverageChange, defaultValue: coverage, title: "Required coverage", description: "The extent of coverage you need is determined by several factors, including your expenditure patterns, anticipated future expenses, yearly earnings, and so forth. Generally, individuals opt for a coverage amount that equals five times their current annual income before taxes. On an average, it is observed that Canadians choose a coverage amount of around $500,000.", placeholder: "Select", autoSelectIfValueIsOutOfOptions: false, error: !coverage && inValidation, errorMessage: getErrorMessage(coverage, inValidation) })] }));
+    return (jsxRuntime.jsxs("div", { className: "form-section", children: [jsxRuntime.jsx("h2", { className: "section-title", style: { textAlign: 'center' }, children: "Get the coverage you need" }), jsxRuntime.jsx(SelectFormBox, { ...newLifeOptions, name: "type", onChange: handleLifeInsuranceTypeChange, defaultValue: type, title: "Type of Insurance", description: jsxRuntime.jsx(Description, {}), placeholder: "Select", autoSelectIfValueIsOutOfOptions: false, error: !type && inValidation, errorMessage: getErrorMessage(type, inValidation) }), jsxRuntime.jsx(SelectFormBox, { options: mychoiceSdkComponents.lifeCoverageOptions, name: "coverage", onChange: handleCoverageChange, defaultValue: coverage, title: "Required coverage", description: "The extent of coverage you need is determined by several factors, including your expenditure patterns, anticipated future expenses, yearly earnings, and so forth. Generally, individuals opt for a coverage amount that equals five times their current annual income before taxes. On an average, it is observed that Canadians choose a coverage amount of around $500,000.", placeholder: "Select", autoSelectIfValueIsOutOfOptions: false, error: !coverage && inValidation, errorMessage: getErrorMessage(coverage, inValidation) })] }));
 };
 
 const PageCoverage = () => {
@@ -3942,7 +3942,7 @@ const AppRouteWrapper = (props) => {
     const { homeDiscountFormValidate, homeDiscountFormIsValid } = mychoiceSdkStore.useValidationHomeDiscount();
     // life insurance validation
     const { coverageFormValidate, coverageFormIsValid } = mychoiceSdkStore.useValidationCoverage();
-    const { applicantFormValidate: lifeApplicantFormValidate, applicantFormIsValid: lifeApplicantFormIsValid, } = mychoiceSdkStore.useValidationLifeApplicant();
+    const { applicantFormValidate: lifeApplicantFormValidate, applicantFormIsValid: lifeApplicantFormIsValid } = mychoiceSdkStore.useValidationLifeApplicant();
     let postalCode = carPostal;
     const { clearFormData, checkIsExpired, checkIsExpiredWithModal } = mychoiceSdkStore.ClearFormDataHandler();
     const { appLoaderState } = mychoiceSdkStore.useStoreAppLoader();
@@ -4200,7 +4200,8 @@ const AppRouteWrapper = (props) => {
     });
     React.useEffect(() => {
         if (isReady) {
-            if (!carPostal && insuranceType === mychoiceSdkComponents.InsuranceTypes.Car) {
+            if ((!carPostal && insuranceType === mychoiceSdkComponents.InsuranceTypes.Car) ||
+                (!lifePostal && insuranceType === mychoiceSdkComponents.InsuranceTypes.Life)) {
                 dispatchAppModalState({
                     type: mychoiceSdkStore.StoreConfigAppModalActionTypes.AppModalPostalModal,
                     payload: {
@@ -4210,12 +4211,7 @@ const AppRouteWrapper = (props) => {
             }
         }
     }, [carPostal, homePostal, lifePostal, isReady]);
-    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: isReady && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(AppHeader, {}), jsxRuntime.jsx(AppModal, {}), insuranceType && (jsxRuntime.jsx(NavigationTop, { title: `${insuranceType.replace(/^./, insuranceType[0].toUpperCase())} Insurance Quote`, postalCode: postalCode, formSteps: steps, validationHooks: validationHooks, clearForm: clearFormData, propertyIsCompleted: isCompleted })), insuranceType && appType === mychoiceSdkComponents.AppTypes.MyChoice && (jsxRuntime.jsx("div", { className: localIndex !== mychoiceSdkComponents.defaultLocalIndex
-                        ? 'step-progress-bar-partner'
-                        : 'step-progress-bar', children: jsxRuntime.jsx("span", { style: { width: progressLength } }) })), jsxRuntime.jsx("div", { className: `${insuranceType ? 'form-page-content' : ''} ${insuranceType && appType === mychoiceSdkComponents.AppTypes.MyChoice ? 'mychoice' : ''}`, children: insuranceType &&
-                        appType === mychoiceSdkComponents.AppTypes.MyChoice &&
-                        isDesktop &&
-                        progressLength ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: "mychoice-content", children: [jsxRuntime.jsx(StepsBox, { className: "step-box", formSteps: steps, validationHooks: validationHooks, propertyIsCompleted: isCompleted }), children, jsxRuntime.jsx("div", { className: "empty-steps-container" })] }) })) : (children) }), isMychoice && !appLoaderState.isOpen && jsxRuntime.jsx(ProviderImageFooter, {})] })) }));
+    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: isReady && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(AppHeader, {}), jsxRuntime.jsx(AppModal, {}), insuranceType && (jsxRuntime.jsx(NavigationTop, { title: `${insuranceType.replace(/^./, insuranceType[0].toUpperCase())} Insurance Quote`, postalCode: postalCode, formSteps: steps, validationHooks: validationHooks, clearForm: clearFormData, propertyIsCompleted: isCompleted })), insuranceType && appType === mychoiceSdkComponents.AppTypes.MyChoice && (jsxRuntime.jsx("div", { className: localIndex !== mychoiceSdkComponents.defaultLocalIndex ? 'step-progress-bar-partner' : 'step-progress-bar', children: jsxRuntime.jsx("span", { style: { width: progressLength } }) })), jsxRuntime.jsx("div", { className: `${insuranceType ? 'form-page-content' : ''} ${insuranceType && appType === mychoiceSdkComponents.AppTypes.MyChoice ? 'mychoice' : ''}`, children: insuranceType && appType === mychoiceSdkComponents.AppTypes.MyChoice && isDesktop && progressLength ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: "mychoice-content", children: [jsxRuntime.jsx(StepsBox, { className: "step-box", formSteps: steps, validationHooks: validationHooks, propertyIsCompleted: isCompleted }), children, jsxRuntime.jsx("div", { className: "empty-steps-container" })] }) })) : (children) }), isMychoice && !appLoaderState.isOpen && jsxRuntime.jsx(ProviderImageFooter, {})] })) }));
 };
 const NestedRoutes = () => {
     const insuranceType = mychoiceSdkComponents.getInsuranceType();
@@ -4230,7 +4226,7 @@ const NestedRoutes = () => {
                                 pathname: `/${appConfigState.localIndex || mychoiceSdkComponents.defaultLocalIndex}/${insuranceType}`,
                             } }) }), insuranceType === mychoiceSdkComponents.InsuranceTypes.Car && (jsxRuntime.jsxs(reactRouterDom.Route, { path: "car", children: [jsxRuntime.jsx(reactRouterDom.Route, { index: true, element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: insuranceType, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageVehicle, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "driver", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: insuranceType, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageDriver, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "discount", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: insuranceType, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageCarDiscount, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "quotes", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: insuranceType, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageCarQuote, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "offer", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: insuranceType, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageCarQuote, {}) }) }) })] })), jsxRuntime.jsxs(reactRouterDom.Route, { path: "home", children: [jsxRuntime.jsx(reactRouterDom.Route, { index: true, element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Home, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageAddress, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "applicant", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Home, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageApplicant, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "property", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Home, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageProperty, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "discount", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Home, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageHomeDiscount, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "quotes", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Home, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageHomeQuote, {}) }) }) })] }), jsxRuntime.jsxs(reactRouterDom.Route, { path: "condo", children: [jsxRuntime.jsx(reactRouterDom.Route, { index: true, element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Condo, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageAddress, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "applicant", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Condo, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageApplicant, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "property", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Condo, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageProperty, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "discount", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Condo, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageHomeDiscount, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "quotes", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Condo, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageHomeQuote, {}) }) }) })] }), jsxRuntime.jsxs(reactRouterDom.Route, { path: "tenant", children: [jsxRuntime.jsx(reactRouterDom.Route, { index: true, element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Tenant, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageAddress, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "applicant", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Tenant, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageApplicant, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "property", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Tenant, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageProperty, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "discount", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Tenant, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageHomeDiscount, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "quotes", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Tenant, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageHomeQuote, {}) }) }) })] }), jsxRuntime.jsxs(reactRouterDom.Route, { path: "life", children: [jsxRuntime.jsx(reactRouterDom.Route, { index: true, element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Life, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageCoverage, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "applicant", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Life, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageLifeApplicant, {}) }) }) }), jsxRuntime.jsx(reactRouterDom.Route, { path: "quotes", element: jsxRuntime.jsx(AppRouteWrapper, { insuranceType: mychoiceSdkComponents.InsuranceTypes.Life, children: jsxRuntime.jsx(RouteWrapperPublic, { children: jsxRuntime.jsx(PageLifeQuote, {}) }) }) })] })] }) })) }));
 };
-const RedirectWithSearchParams = ({ to, path, }) => {
+const RedirectWithSearchParams = ({ to, path }) => {
     const insuranceType = mychoiceSdkComponents.getInsuranceType();
     const [isRender, setIsRender] = React.useState(false);
     const { getPostal } = mychoiceSdkStore.useHandlerPostal(insuranceType);
@@ -4241,12 +4237,9 @@ const RedirectWithSearchParams = ({ to, path, }) => {
     const toBasePath = to?.split('/')?.slice(-1)?.[0];
     mychoiceSdkComponents.useEffectOnce(() => {
         if (queryRoot.length > 1) {
-            const query = JSON.parse(`{"${decodeURI(queryRoot[1])
-                .replace(/"/g, '\\"')
-                .replace(/&/g, '","')
-                .replace(/=/g, '":"')}"}`);
+            const query = JSON.parse(`{"${decodeURI(queryRoot[1]).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g, '":"')}"}`);
             if (!isRender) {
-                if (query.postal_code && insuranceType !== mychoiceSdkComponents.InsuranceTypes.Life) {
+                if (query.postal_code) {
                     const formattedPostalCode = query.postal_code.replace(' ', '');
                     getPostal(formattedPostalCode).then(() => {
                         setIsRender(true);
@@ -4290,8 +4283,7 @@ const RedirectWithSearchParams = ({ to, path, }) => {
                             payload: { utmCampaign: query.utm_campaign },
                         });
                     }
-                    if (path === 'broker' ||
-                        ['home', 'condo', 'tenant'].includes(toBasePath)) {
+                    if (path === 'broker' || ['home', 'condo', 'tenant'].includes(toBasePath)) {
                         dispatchHomeDiscountState({
                             type: mychoiceSdkStore.StoreFormHomeDiscountActionTypes.FormHomeQuoterBrokerInfoSet,
                             payload: query,