@mychoice/mychoice-sdk-modules 2.1.23 → 2.1.25

package/dist/cjs/index.js

@@ -168,7 +168,7 @@ const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, is
         postRequestQuoteOnliaUrl(true, redirectUrl);
     };
     return (jsxRuntime.jsxs("div", { className: `offer-section ${mychoiceCls}`, children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferHeader, { className: isTheBig ? 'thebig-bold' : '', companyName: offerCompany?.name, isBestOffer: isBestOffer }), jsxRuntime.jsx(mychoiceSdkComponents.OfferPrice, { className: isTheBig ? 'thebig' : '', companyLogo: offerCompany?.logo, price: offerPrice }), !isTheBig && offsiteUrl
-                ? (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { children: "Click below to get this rate" }), jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: "Get details", type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium, onClick: handleCTAClick })] })) : (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { className: isTheBig ? 'thebig-bold' : '', children: "Call now to get this rate" }), jsxRuntime.jsx("a", { target: "_blank", rel: "noreferrer noopener", href: `tel:${phoneNumber?.number}`, children: jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `${isTheBig ? 'thebig-bold' : 'mychoice'} offer-phone-number`, label: phoneNumber?.title, type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium }) })] })), jsxRuntime.jsxs("button", { className: "dropdown", onClick: handleDropdownClick, children: [jsxRuntime.jsx("span", { children: detailsIsOpen ? 'Less Info' : 'More Info' }), jsxRuntime.jsx(mychoiceSdkComponents.IconDropdownArrow, { color: "grey", className: detailsIsOpen ? 'rotated' : '' })] }), detailsIsOpen && (jsxRuntime.jsxs("div", { className: "offer-details", children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: offerCompany?.name, companyType: mychoiceSdkComponents.CompanyRoleTypes.Offering, description: offerCompany?.description }), jsxRuntime.jsx("hr", {}), (isTheBig || !offsiteUrl)
+                ? (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { children: "Click below to get this rate" }), jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: "Buy online", type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium, onClick: handleCTAClick })] })) : (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { className: isTheBig ? 'thebig-bold' : '', children: "Call now to get this rate" }), jsxRuntime.jsx("a", { target: "_blank", rel: "noreferrer noopener", href: `tel:${phoneNumber?.number}`, children: jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `${isTheBig ? 'thebig-bold' : 'mychoice'} offer-phone-number`, label: phoneNumber?.title, type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium }) })] })), jsxRuntime.jsxs("button", { className: "dropdown", onClick: handleDropdownClick, children: [jsxRuntime.jsx("span", { children: detailsIsOpen ? 'Less Info' : 'More Info' }), jsxRuntime.jsx(mychoiceSdkComponents.IconDropdownArrow, { color: "grey", className: detailsIsOpen ? 'rotated' : '' })] }), detailsIsOpen && (jsxRuntime.jsxs("div", { className: "offer-details", children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: offerCompany?.name, companyType: mychoiceSdkComponents.CompanyRoleTypes.Offering, description: offerCompany?.description }), jsxRuntime.jsx("hr", {}), (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 }), jsxRuntime.jsx("hr", {})] })), jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: "Hours of Operation", children: jsxRuntime.jsx(mychoiceSdkComponents.OperationHoursInfo, { weekdayHours: weekdayHours, saturdayHours: saturdayHours, sundayHours: sundayHours }) })] }))] }));
 };
 OfferSection.defaultProps = {
@@ -259,10 +259,11 @@ const LoaderPrimary = () => {
     const { appLoaderState } = mychoiceSdkStore.useStoreAppLoader();
     const { appConfigState } = mychoiceSdkStore.useStoreAppConfig();
     const isLastPage = window.location.pathname.includes('discount') || window.location.pathname.includes('/life/applicant');
-    return (jsxRuntime.jsxs("div", { className: "loader-wrapper", children: [appConfigState.appType === mychoiceSdkComponents.AppTypes.TheBig || !isLastPage ? jsxRuntime.jsx(mychoiceSdkComponents.IconLoaderPrimary, {}) : jsxRuntime.jsx(LoaderVid, {}), !!appLoaderState.description && appLoaderState.description.includes('accurate')
+    const isHome = window.location.pathname.includes('home') || window.location.pathname.includes('condo') || window.location.pathname.includes('tenant');
+    return (jsxRuntime.jsxs("div", { className: "loader-wrapper", children: [appConfigState.appType === mychoiceSdkComponents.AppTypes.TheBig || !isLastPage ? jsxRuntime.jsx(mychoiceSdkComponents.IconLoaderPrimary, {}) : jsxRuntime.jsx(LoaderVid, {}), appLoaderState.description
                 ? (jsxRuntime.jsx("h4", { children: appLoaderState.description.split('\n').map((line, index) => (jsxRuntime.jsxs("div", { children: [line, jsxRuntime.jsx("br", {})] }, index))) }))
                 // eslint-disable-next-line react/no-unescaped-entities
-                : !appLoaderState.description && jsxRuntime.jsx("h4", { children: "'Hang tight, while we collect and process information about your property'" })] }));
+                : !appLoaderState.description && isHome && jsxRuntime.jsx("h4", { children: "Hang tight, while we collect and process information about your property." })] }));
 };
 
 const ModalConfirm = () => {
@@ -319,9 +320,10 @@ const ModalPostal = () => {
 
 const getVehicleYearRange = () => {
     const vehicleYear = [];
-    const currentYear = 2024;
+    const currentDate = new Date();
+    const currentYear = currentDate.getFullYear();
     const minYear = currentYear - 25;
-    for (let year = (currentYear); year > minYear; year -= 1) {
+    for (let year = (currentDate.getFullYear()); year > minYear; year -= 1) {
         vehicleYear.push({ name: `${year}`, value: `${year}` });
     }
     vehicleYear.push({ name: `${minYear} or older`, value: `${minYear}` });
@@ -426,14 +428,20 @@ const BlockCarInfo = () => {
     const { status: statusModel, getVehicleModel, vehicleModelList = [] } = mychoiceSdkStore.useHandlerCarModel();
     const { vehicleState, dispatchVehicleState } = mychoiceSdkStore.useStoreFormCarVehicle();
     const { year: currentYear, make: currentMake, model: currentModel, } = vehicleState.items[vehicleState.activeIndex];
-    const yearIsValid = !currentYear || Number(currentYear) > 1998;
+    const yearIsValid = !currentYear || Number(currentYear) > 1999;
     const yearMessage = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: ["Please contact a licenced representative at Hagerty for classic car insurance:", ' ', jsxRuntime.jsx("a", { href: "tel:18335431540", children: "1-833-543-1540" })] }));
     const handleVehicleYearChange = ({ value }) => {
+        console.log(value);
         if (value) {
+            console.log(dispatchVehicleState({
+                type: mychoiceSdkStore.StoreFormCarVehicleActionTypes.FormCarVehicleYearSet,
+                payload: { year: value },
+            }), 'hm');
             dispatchVehicleState({
                 type: mychoiceSdkStore.StoreFormCarVehicleActionTypes.FormCarVehicleYearSet,
                 payload: { year: value },
             });
+            console.log(value, 'hmHm');
             getVehicleMake(value);
         }
     };
@@ -3424,7 +3432,7 @@ ButtonsBox.defaultProps = {
 
 const NavigationTop = ({ title, postalCode, validationHooks, formSteps, clearForm, propertyIsCompleted, }) => {
     const { pathname } = reactRouterDom.useLocation();
-    const { appConfigState: { appType } } = mychoiceSdkStore.useStoreAppConfig();
+    const { appConfigState: { appType, localIndex } } = mychoiceSdkStore.useStoreAppConfig();
     const isTheBig = appType === mychoiceSdkComponents.AppTypes.TheBig;
     const { appDeviceType } = mychoiceSdkStore.useStoreDeviceType();
     const isDesktop = appDeviceType === mychoiceSdkComponents.DeviceTypes.Desktop;
@@ -3433,7 +3441,24 @@ const NavigationTop = ({ title, postalCode, validationHooks, formSteps, clearFor
     const activeStep = formSteps.find((step) => currentPath[currentPath.length - 1] === step.path?.substring(1));
     let activeIndex = formSteps.indexOf(activeStep);
     activeIndex = activeIndex === -1 ? 0 : activeIndex;
-    return (jsxRuntime.jsx("div", { className: "navigation-container", children: jsxRuntime.jsxs("div", { className: `content ${appType === mychoiceSdkComponents.AppTypes.MyChoice ? 'mychoice' : ''}`, children: [jsxRuntime.jsx(PostalCodeDataBox, { className: isTheBig ? 'thebig' : '', title: title, postalCode: postalCode }), appType === mychoiceSdkComponents.AppTypes.MyChoice
+    if (localIndex !== mychoiceSdkComponents.defaultLocalIndex) {
+        const primaryColor = getComputedStyle(document.documentElement).getPropertyValue('--color-primary').trim();
+        // eslint-disable-next-line @typescript-eslint/no-use-before-define
+        const rgbaColor = hexToRgba(primaryColor, 0.5);
+        document.documentElement.style.setProperty('--color-primary-with-opacity', rgbaColor);
+        // eslint-disable-next-line no-inner-declarations
+        function hexToRgba(hex, alpha) {
+            const bigint = parseInt(hex.slice(1), 16);
+            // eslint-disable-next-line no-bitwise
+            const r = (bigint >> 16) & 255;
+            // eslint-disable-next-line no-bitwise
+            const g = (bigint >> 8) & 255;
+            // eslint-disable-next-line no-bitwise
+            const b = bigint & 255;
+            return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+        }
+    }
+    return (jsxRuntime.jsx("div", { className: localIndex !== mychoiceSdkComponents.defaultLocalIndex ? 'navigation-container-partner' : 'navigation-container', children: jsxRuntime.jsxs("div", { className: `content ${appType === mychoiceSdkComponents.AppTypes.MyChoice ? 'mychoice' : ''}`, children: [jsxRuntime.jsx(PostalCodeDataBox, { className: isTheBig ? 'thebig' : '', title: title, postalCode: postalCode }), appType === mychoiceSdkComponents.AppTypes.MyChoice
                     ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: !isDesktop && (formSteps.length - activeIndex - 1) ? (jsxRuntime.jsxs("div", { className: "estimated-minutes", children: [jsxRuntime.jsx(mychoiceSdkComponents.IconClock, {}), jsxRuntime.jsxs("div", { children: [isMobile ? (jsxRuntime.jsx("div", { children: jsxRuntime.jsxs("span", { className: "time", children: [formSteps.length - activeIndex - 1, ' ', formSteps.length - activeIndex - 1 > 1 ? 'minutes' : 'minute'] }) })) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { children: ["Estimated", ' ', jsxRuntime.jsxs("span", { className: "time", children: [formSteps.length - activeIndex - 1, ' ', formSteps.length - activeIndex - 1 > 1 ? 'minutes' : 'minute'] }), ' ', "to complete"] }) })), jsxRuntime.jsx("span", { children: `Step ${activeIndex + 1}/${formSteps.length - 1}` })] })] })) : jsxRuntime.jsx("span", {}) })) : (jsxRuntime.jsx(StepsBox, { formSteps: formSteps, validationHooks: validationHooks, propertyIsCompleted: propertyIsCompleted })), jsxRuntime.jsx(ButtonsBox, { formSteps: formSteps, validationHooks: validationHooks, clearForm: clearForm, propertyIsCompleted: propertyIsCompleted })] }) }));
 };
 NavigationTop.defaultProps = {
@@ -4007,7 +4032,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: "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();
@@ -4023,6 +4048,7 @@ const NestedRoutes = () => {
 };
 const RedirectWithSearchParams = ({ to, path }) => {
     const insuranceType = mychoiceSdkComponents.getInsuranceType();
+    mychoiceSdkStore.useStoreAppConfig();
     const [isRender, setIsRender] = React.useState(false);
     const { getPostal } = mychoiceSdkStore.useHandlerPostal(insuranceType);
     const { dispatchDiscountState: dispatchCarDiscountState } = mychoiceSdkStore.useStoreFormCarDiscount();
@@ -4033,6 +4059,7 @@ const RedirectWithSearchParams = ({ to, path }) => {
     mychoiceSdkComponents.useEffectOnce(() => {
         if (queryRoot.length > 1) {
             const query = JSON.parse(`{"${decodeURI(queryRoot[1]).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g, '":"')}"}`);
+            console.log(query, 'hm');
             if (!isRender) {
                 if (query.postal_code && (insuranceType !== mychoiceSdkComponents.InsuranceTypes.Life)) {
                     const formattedPostalCode = query.postal_code.replace(' ', '');