@mychoice/mychoice-sdk-modules 2.1.23 → 2.1.25

package/dist/esm/index.js

@@ -158,7 +158,7 @@ const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, is
         postRequestQuoteOnliaUrl(true, redirectUrl);
     };
     return (jsxs("div", { className: `offer-section ${mychoiceCls}`, children: [jsx(OfferHeader, { className: isTheBig ? 'thebig-bold' : '', companyName: offerCompany?.name, isBestOffer: isBestOffer }), jsx(OfferPrice, { className: isTheBig ? 'thebig' : '', companyLogo: offerCompany?.logo, price: offerPrice }), !isTheBig && offsiteUrl
-                ? (jsxs("div", { className: "offer-phone", children: [jsx("h3", { children: "Click below to get this rate" }), jsx(ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: "Get details", type: ButtonTypes.Button, category: CategoryTypes.Filled, color: ColorTypes.Primary, variant: ButtonVariantTypes.Rectangle, size: SizeTypes.Medium, onClick: handleCTAClick })] })) : (jsxs("div", { className: "offer-phone", children: [jsx("h3", { className: isTheBig ? 'thebig-bold' : '', children: "Call now to get this rate" }), jsx("a", { target: "_blank", rel: "noreferrer noopener", href: `tel:${phoneNumber?.number}`, children: jsx(ButtonBase, { className: `${isTheBig ? 'thebig-bold' : 'mychoice'} offer-phone-number`, label: phoneNumber?.title, type: ButtonTypes.Button, category: CategoryTypes.Filled, color: ColorTypes.Primary, variant: ButtonVariantTypes.Rectangle, size: SizeTypes.Medium }) })] })), jsxs("button", { className: "dropdown", onClick: handleDropdownClick, children: [jsx("span", { children: detailsIsOpen ? 'Less Info' : 'More Info' }), jsx(IconDropdownArrow, { color: "grey", className: detailsIsOpen ? 'rotated' : '' })] }), detailsIsOpen && (jsxs("div", { className: "offer-details", children: [jsx(OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: offerCompany?.name, companyType: CompanyRoleTypes.Offering, description: offerCompany?.description }), jsx("hr", {}), (isTheBig || !offsiteUrl)
+                ? (jsxs("div", { className: "offer-phone", children: [jsx("h3", { children: "Click below to get this rate" }), jsx(ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: "Buy online", type: ButtonTypes.Button, category: CategoryTypes.Filled, color: ColorTypes.Primary, variant: ButtonVariantTypes.Rectangle, size: SizeTypes.Medium, onClick: handleCTAClick })] })) : (jsxs("div", { className: "offer-phone", children: [jsx("h3", { className: isTheBig ? 'thebig-bold' : '', children: "Call now to get this rate" }), jsx("a", { target: "_blank", rel: "noreferrer noopener", href: `tel:${phoneNumber?.number}`, children: jsx(ButtonBase, { className: `${isTheBig ? 'thebig-bold' : 'mychoice'} offer-phone-number`, label: phoneNumber?.title, type: ButtonTypes.Button, category: CategoryTypes.Filled, color: ColorTypes.Primary, variant: ButtonVariantTypes.Rectangle, size: SizeTypes.Medium }) })] })), jsxs("button", { className: "dropdown", onClick: handleDropdownClick, children: [jsx("span", { children: detailsIsOpen ? 'Less Info' : 'More Info' }), jsx(IconDropdownArrow, { color: "grey", className: detailsIsOpen ? 'rotated' : '' })] }), detailsIsOpen && (jsxs("div", { className: "offer-details", children: [jsx(OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: offerCompany?.name, companyType: CompanyRoleTypes.Offering, description: offerCompany?.description }), jsx("hr", {}), (isTheBig || !offsiteUrl)
                         && (jsxs(Fragment, { children: [jsx(OfferDetail, { className: isTheBig ? 'thebig-bold' : '', logo: brokerCompany?.logo, name: brokerCompany?.title, companyType: CompanyRoleTypes.Broker, description: brokerCompany?.description }), jsx("hr", {})] })), jsx(OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: "Hours of Operation", children: jsx(OperationHoursInfo, { weekdayHours: weekdayHours, saturdayHours: saturdayHours, sundayHours: sundayHours }) })] }))] }));
 };
 OfferSection.defaultProps = {
@@ -249,10 +249,11 @@ const LoaderPrimary = () => {
     const { appLoaderState } = useStoreAppLoader();
     const { appConfigState } = useStoreAppConfig();
     const isLastPage = window.location.pathname.includes('discount') || window.location.pathname.includes('/life/applicant');
-    return (jsxs("div", { className: "loader-wrapper", children: [appConfigState.appType === AppTypes.TheBig || !isLastPage ? jsx(IconLoaderPrimary, {}) : 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 (jsxs("div", { className: "loader-wrapper", children: [appConfigState.appType === AppTypes.TheBig || !isLastPage ? jsx(IconLoaderPrimary, {}) : jsx(LoaderVid, {}), appLoaderState.description
                 ? (jsx("h4", { children: appLoaderState.description.split('\n').map((line, index) => (jsxs("div", { children: [line, jsx("br", {})] }, index))) }))
                 // eslint-disable-next-line react/no-unescaped-entities
-                : !appLoaderState.description && jsx("h4", { children: "'Hang tight, while we collect and process information about your property'" })] }));
+                : !appLoaderState.description && isHome && jsx("h4", { children: "Hang tight, while we collect and process information about your property." })] }));
 };
 
 const ModalConfirm = () => {
@@ -309,9 +310,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}` });
@@ -416,14 +418,20 @@ const BlockCarInfo = () => {
     const { status: statusModel, getVehicleModel, vehicleModelList = [] } = useHandlerCarModel();
     const { vehicleState, dispatchVehicleState } = 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 = (jsxs(Fragment, { children: ["Please contact a licenced representative at Hagerty for classic car insurance:", ' ', jsx("a", { href: "tel:18335431540", children: "1-833-543-1540" })] }));
     const handleVehicleYearChange = ({ value }) => {
+        console.log(value);
         if (value) {
+            console.log(dispatchVehicleState({
+                type: StoreFormCarVehicleActionTypes.FormCarVehicleYearSet,
+                payload: { year: value },
+            }), 'hm');
             dispatchVehicleState({
                 type: StoreFormCarVehicleActionTypes.FormCarVehicleYearSet,
                 payload: { year: value },
             });
+            console.log(value, 'hmHm');
             getVehicleMake(value);
         }
     };
@@ -3414,7 +3422,7 @@ ButtonsBox.defaultProps = {
 
 const NavigationTop = ({ title, postalCode, validationHooks, formSteps, clearForm, propertyIsCompleted, }) => {
     const { pathname } = useLocation();
-    const { appConfigState: { appType } } = useStoreAppConfig();
+    const { appConfigState: { appType, localIndex } } = useStoreAppConfig();
     const isTheBig = appType === AppTypes.TheBig;
     const { appDeviceType } = useStoreDeviceType();
     const isDesktop = appDeviceType === DeviceTypes.Desktop;
@@ -3423,7 +3431,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 (jsx("div", { className: "navigation-container", children: jsxs("div", { className: `content ${appType === AppTypes.MyChoice ? 'mychoice' : ''}`, children: [jsx(PostalCodeDataBox, { className: isTheBig ? 'thebig' : '', title: title, postalCode: postalCode }), appType === AppTypes.MyChoice
+    if (localIndex !== 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 (jsx("div", { className: localIndex !== defaultLocalIndex ? 'navigation-container-partner' : 'navigation-container', children: jsxs("div", { className: `content ${appType === AppTypes.MyChoice ? 'mychoice' : ''}`, children: [jsx(PostalCodeDataBox, { className: isTheBig ? 'thebig' : '', title: title, postalCode: postalCode }), appType === AppTypes.MyChoice
                     ? (jsx(Fragment, { children: !isDesktop && (formSteps.length - activeIndex - 1) ? (jsxs("div", { className: "estimated-minutes", children: [jsx(IconClock, {}), jsxs("div", { children: [isMobile ? (jsx("div", { children: jsxs("span", { className: "time", children: [formSteps.length - activeIndex - 1, ' ', formSteps.length - activeIndex - 1 > 1 ? 'minutes' : 'minute'] }) })) : (jsx(Fragment, { children: jsxs("div", { children: ["Estimated", ' ', jsxs("span", { className: "time", children: [formSteps.length - activeIndex - 1, ' ', formSteps.length - activeIndex - 1 > 1 ? 'minutes' : 'minute'] }), ' ', "to complete"] }) })), jsx("span", { children: `Step ${activeIndex + 1}/${formSteps.length - 1}` })] })] })) : jsx("span", {}) })) : (jsx(StepsBox, { formSteps: formSteps, validationHooks: validationHooks, propertyIsCompleted: propertyIsCompleted })), jsx(ButtonsBox, { formSteps: formSteps, validationHooks: validationHooks, clearForm: clearForm, propertyIsCompleted: propertyIsCompleted })] }) }));
 };
 NavigationTop.defaultProps = {
@@ -3997,7 +4022,7 @@ const AppRouteWrapper = (props) => {
             }
         }
     }, [carPostal, homePostal, lifePostal, isReady]);
-    return (jsx(Fragment, { children: isReady && (jsxs(Fragment, { children: [jsx(AppHeader, {}), jsx(AppModal, {}), insuranceType && (jsx(NavigationTop, { title: `${insuranceType.replace(/^./, insuranceType[0].toUpperCase())} Insurance Quote`, postalCode: postalCode, formSteps: steps, validationHooks: validationHooks, clearForm: clearFormData, propertyIsCompleted: isCompleted })), insuranceType && appType === AppTypes.MyChoice && (jsx("div", { className: "step-progress-bar", children: jsx("span", { style: { width: progressLength } }) })), jsx("div", { className: `${insuranceType ? 'form-page-content' : ''} ${insuranceType && appType === AppTypes.MyChoice ? 'mychoice' : ''}`, children: insuranceType && appType === AppTypes.MyChoice && isDesktop && progressLength ? (jsx(Fragment, { children: jsxs("div", { className: "mychoice-content", children: [jsx(StepsBox, { className: "step-box", formSteps: steps, validationHooks: validationHooks, propertyIsCompleted: isCompleted }), children, jsx("div", { className: "empty-steps-container" })] }) })) : children }), isMychoice && !appLoaderState.isOpen && jsx(ProviderImageFooter, {})] })) }));
+    return (jsx(Fragment, { children: isReady && (jsxs(Fragment, { children: [jsx(AppHeader, {}), jsx(AppModal, {}), insuranceType && (jsx(NavigationTop, { title: `${insuranceType.replace(/^./, insuranceType[0].toUpperCase())} Insurance Quote`, postalCode: postalCode, formSteps: steps, validationHooks: validationHooks, clearForm: clearFormData, propertyIsCompleted: isCompleted })), insuranceType && appType === AppTypes.MyChoice && (jsx("div", { className: localIndex !== defaultLocalIndex ? 'step-progress-bar-partner' : 'step-progress-bar', children: jsx("span", { style: { width: progressLength } }) })), jsx("div", { className: `${insuranceType ? 'form-page-content' : ''} ${insuranceType && appType === AppTypes.MyChoice ? 'mychoice' : ''}`, children: insuranceType && appType === AppTypes.MyChoice && isDesktop && progressLength ? (jsx(Fragment, { children: jsxs("div", { className: "mychoice-content", children: [jsx(StepsBox, { className: "step-box", formSteps: steps, validationHooks: validationHooks, propertyIsCompleted: isCompleted }), children, jsx("div", { className: "empty-steps-container" })] }) })) : children }), isMychoice && !appLoaderState.isOpen && jsx(ProviderImageFooter, {})] })) }));
 };
 const NestedRoutes = () => {
     const insuranceType = getInsuranceType();
@@ -4013,6 +4038,7 @@ const NestedRoutes = () => {
 };
 const RedirectWithSearchParams = ({ to, path }) => {
     const insuranceType = getInsuranceType();
+    useStoreAppConfig();
     const [isRender, setIsRender] = useState(false);
     const { getPostal } = useHandlerPostal(insuranceType);
     const { dispatchDiscountState: dispatchCarDiscountState } = useStoreFormCarDiscount();
@@ -4023,6 +4049,7 @@ const RedirectWithSearchParams = ({ to, path }) => {
     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 !== InsuranceTypes.Life)) {
                     const formattedPostalCode = query.postal_code.replace(' ', '');