{"version":3,"file":"BK5GhYMP.js","sources":["../../../../components/ChangePlanPopup.vue","../../../../components/Cart/SelectPlan.vue","../../../../virtual:public?%2Fassets%2Fimages%2Fmenu%2Fm-divider.svg","../../../../models/Exceptions/MaxPlanThresholdReachedError.js","../../../../components/ExternalServices/Beam/track/beamNonprofitShown.ts","../../../../components/Cart/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport AbandonedCart from \"@/models/AbandonedCart\";\n\nconst emit = defineEmits([\"show\"]);\n\ndefineProps<{\n  show: boolean;\n}>();\n\nconst onboardingStore = useOnboardingStore();\nconst menusStore = useMenusStore();\nconst router = useRouter();\nconst selectedPlan = ref();\n\nconst currentSelectedPlan = computed(() => {\n  return onboardingStore.selectedPlan;\n});\n\nfunction selectPlan(planId: string) {\n  selectedPlan.value =\n    planId && onboardingStore.plans.find((plan) => plan.id == planId);\n  submit();\n}\n\nfunction closePopup() {\n  emit(\"show\", false);\n}\n\nasync function submit() {\n  if (\n    currentSelectedPlan.value &&\n    currentSelectedPlan.value.id == selectedPlan.value.id\n  ) {\n    closePopup();\n    return close();\n  }\n  if (\n    currentSelectedPlan.value &&\n    currentSelectedPlan.value.threshold > selectedPlan.value.threshold\n  ) {\n    await downgrade();\n  } else {\n    await upgrade();\n  }\n\n  // Update the url to the new plan\n  router.replace({\n    query: {\n      ...router.currentRoute.value.query,\n      plan: selectedPlan.value.slug,\n    },\n  });\n\n  close();\n  closePopup();\n}\nasync function downgrade() {\n  await onboardingStore.UPDATE_PLAN({\n    planId: selectedPlan.value.id,\n    sourceUrl: window.location.href,\n  });\n}\nasync function upgrade() {\n  await onboardingStore.UPDATE_PLAN({\n    planId: selectedPlan.value.id,\n    sourceUrl: window.location.href,\n  });\n  if (menusStore.pendingCartItem && menusStore.pendingCartItem.sku) {\n    await abandonedCart.value.addProduct(\n      menusStore.pendingCartItem,\n      window.location.href\n    );\n  }\n}\nfunction close() {\n  menusStore.SET_PRODUCT_ABOUT_TO_BE_ADDED_TO_CART(null);\n}\nconst abandonedCart = computed(() => {\n  return new AbandonedCart(onboardingStore.$state);\n});\n\nwatch(\n  () => currentSelectedPlan.value,\n  (newSelectedPlan) => {\n    selectedPlan.value = newSelectedPlan;\n  }\n);\n\nonMounted(() => {\n  selectedPlan.value = currentSelectedPlan.value;\n});\n</script>\n<template>\n  <div\n    class=\"tw-absolute tw-z-10 tw-top-full tw-w-full tw-left-0 tw-pt-[9px] tw-opacity-0 tw-invisible tw-transition-all group-hover/drop:tw-opacity-100 group-hover/drop:tw-visible\"\n  >\n    <ul\n      class=\"tw-bg-white tw-p-2 tw-rounded-[7px] tw-text-[16px] tw-leading-none tw-font-medium tw-text-left tw-shadow-nl-12\"\n    >\n      <li v-for=\"plan in onboardingStore.plans\" :key=\"plan.id\">\n        <a\n          href=\"#\"\n          @click.prevent=\"selectPlan(plan.id)\"\n          class=\"tw-block tw-py-3 tw-px-2 tw-rounded-[7px] hover:tw-bg-[#e7f2ed] hover:tw-font-bold tw-transition-all\"\n          ><span\n            ><span>{{ plan.threshold }}</span>\n            <span v-if=\"plan.can_exceed_threshold\">{{\n              plan.can_exceed_threshold ? \"+\" : \"\"\n            }}</span\n            >&nbsp;items\n            <span v-if=\"plan.description\">({{ plan.description }})</span></span\n          ></a\n        >\n      </li>\n    </ul>\n  </div>\n</template>\n<style></style>\n","<script setup lang=\"ts\">\nimport AbandonedCart from \"@/models/AbandonedCart\";\nimport { URL_ACCOUNT_ORDERS_PAGE } from \"@/constants/urls\";\n\nconst onboardingStore = useOnboardingStore();\nconst menusStore = useMenusStore();\nconst router = useRouter();\nconst selectedPlan = ref();\nconst authStore = useAuthStore();\n\nconst currentSelectedPlan = computed(() => {\n  return onboardingStore.selectedPlan;\n});\n\nfunction selectPlan(planId: string) {\n  selectedPlan.value =\n    planId && onboardingStore.plans.find((plan) => plan.id == planId);\n  submit();\n}\n\nasync function submit() {\n  if (Number(authStore?.user?.id) > 0) {\n    window.location.href = URL_ACCOUNT_ORDERS_PAGE;\n    return;\n  }\n\n  if (\n    currentSelectedPlan.value &&\n    currentSelectedPlan.value.id == selectedPlan.value.id\n  ) {\n    return close();\n  }\n  if (\n    currentSelectedPlan.value &&\n    currentSelectedPlan.value.threshold > selectedPlan.value.threshold\n  ) {\n    await downgrade();\n  } else {\n    await upgrade();\n  }\n\n  // Update the url to the new plan\n  router.replace({\n    query: {\n      ...router.currentRoute.value.query,\n      plan: selectedPlan.value.slug,\n    },\n  });\n\n  close();\n}\nasync function downgrade() {\n  await onboardingStore.UPDATE_PLAN({\n    planId: selectedPlan.value.id,\n    sourceUrl: window.location.href,\n  });\n}\nasync function upgrade() {\n  await onboardingStore.UPDATE_PLAN({\n    planId: selectedPlan.value.id,\n    sourceUrl: window.location.href,\n  });\n  if (menusStore.pendingCartItem && menusStore.pendingCartItem.sku) {\n    await abandonedCart.value.addProduct(\n      menusStore.pendingCartItem,\n      window.location.href\n    );\n  }\n}\nfunction close() {\n  menusStore.SET_PRODUCT_ABOUT_TO_BE_ADDED_TO_CART(null);\n}\nconst abandonedCart = computed(() => {\n  return new AbandonedCart(onboardingStore.$state);\n});\n\nwatch(\n  () => currentSelectedPlan.value,\n  (newSelectedPlan) => {\n    selectedPlan.value = newSelectedPlan;\n  }\n);\n\nonMounted(() => {\n  selectedPlan.value = currentSelectedPlan.value;\n});\n</script>\n<template>\n  <ul class=\"tw-flex tw-flex-col tw-gap-[12px]\">\n    <li\n      v-for=\"plan in onboardingStore.plans\"\n      :key=\"plan.id\"\n      @click=\"selectPlan(plan.id)\"\n      class=\"tw-right-0 tw-flex tw-max-w-[280px] tw-w-full tw-h-[51px] tw-items-center tw-justify-start tw-cursor-pointer tw-bg-[#F2F9F6] tw-rounded-[6px] tw-shadow-[3.71px_3.71px_4.64px_0px_#00000033] tw-outline tw-outline-transparent hover:tw-outline-[#008753]\"\n    >\n      <div\n        class=\"tw-text-center tw-w-[51px] tw-h-full tw-font-black tw-font-agenda tw-text-[32px] tw-uppercase tw-leading-3 tw-flex tw-justify-center tw-items-center tw-rounded-tl-[6px] tw-rounded-bl-[6px] tw-bg-[#DAE8E1]\"\n      >\n        {{ plan.threshold }}\n      </div>\n      <div class=\"tw-px-[18px] tw-max-w-[145px] tw-w-full tw-font-bold\">items per week</div>\n\n      <div\n        class=\"tw-ml-auto tw-pr-[9px] tw-pt-[5px] tw-flex tw-flex-col tw-mb-auto tw-h-full tw-w-full tw-max-w-[69px] tw-items-end\"\n      >\n        <div\n          v-if=\"plan.description\"\n          class=\"tw-relative tw-w-[46px] tw-mb-[8px] tw-h-full\"\n        >\n          <svg\n            class=\"tw-absolute tw-z-1\"\n            width=\"49\"\n            height=\"22\"\n            viewBox=\"0 0 49 22\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M22.2287 1.35628C17.1879 -0.762878 8.99348 -0.762975 3.95251 4.00538C-5.56897 13.0118 4.32651 21.5906 10.4668 20.4288C16.0678 19.3691 17.809 19.6174 26.7094 21.4883C31.7502 22.548 39.0313 22.0182 44.0721 19.3692C53.0734 14.6389 48.6477 1.02945 39.5914 1.88609C33.9906 2.41588 30.1742 4.69659 22.2287 1.35628Z\"\n              fill=\"#008753\"\n            />\n          </svg>\n          <p\n            class=\"tw-text-[#FFFFFF] tw-text-[12px] tw-z-3 tw-relative tw-z-2 tw-w-full tw-flex tw-justify-center tw-items-center tw-h-full tw-max-h-[20px] tw-font-semibold\"\n          >\n            {{ plan.description }}\n          </p>\n        </div>\n\n        <div v-if=\"plan.tag\" class=\"tw-text-[11px] tw-leading-4 tw-font-medium tw-whitespace-nowrap\">\n          <span>{{ plan.tag }}!</span>\n        </div>\n      </div>\n    </li>\n  </ul>\n</template>\n<style scoped></style>\n","import { publicAssetsURL } from '#internal/nuxt/paths';export default publicAssetsURL(\"/assets/images/menu/m-divider.svg\")","export default class MaxPlanThresholdReachedError extends Error {\n  constructor(error) {\n    super(error);\n    this.errorMessage = error;\n  }\n  dispatchFlahsNotification() {\n    let event = new CustomEvent(\"flashMessage\", {\n      detail: { type: \"error\", message: this.errorMessage },\n      bubbles: true,\n    });\n    document.dispatchEvent(event);\n  }\n}\n","import eventsManager from \"@/services/events/eventsManager\";\n\nconst track = async () => {\n  await eventsManager.push(\"beamNonprofitShown\", {\n    env: import.meta.env.VITE_NODE_ENV,\n  });\n};\n\nexport { track };","<script lang=\"ts\" setup>\nimport {\n  MAPPED_ROUTE_NAMES,\n  ROUTE_CHECKOUT,\n  ROUTE_MENUS,\n  ROUTE_NAMES,\n} from \"@/constants/routes\";\nimport AbandonedCart from \"@/models/AbandonedCart\";\nimport MaxPlanThresholdReachedError from \"@/models/Exceptions/MaxPlanThresholdReachedError\";\nimport {track as trackBeamNonprofitShown} from \"@/components/ExternalServices/Beam/track/beamNonprofitShown\";\n\nconst onboardingStore = useOnboardingStore();\nconst { isAnyTopBannerVisible } = storeToRefs(onboardingStore);\n\nconst cartStore = useCartStore();\nconst route = useRoute();\nconst router = useRouter();\nconst config = useRuntimeConfig();\n\nconst reserveHeight = ref(\"180px\");\nconst mainSectionRef = ref();\nconst beamSelectNonrofitRef = ref();\nconst isChangePlanPopupShow = ref(false);\nuseHead({\n  script: [\n    {\n      type: \"module\",\n      crossorigin: \"anonymous\",\n      src: \"https://production-beam-widgets.beamimpact.com/web-sdk/v1.40.0/dist/components/select-nonprofit.js\",\n    },\n  ],\n});\n\nconst mainContentSectionHeight = computed(() => {\n  return mainSectionRef?.value?.getBoundingClientRect()?.height + \"px\";\n});\n\nasync function handleFillCartWithBestsellersClick(id: string) {\n  await onboardingStore.FILL_CART_WITH_BESTSELLERS({\n    bestsellerGroupId: id,\n    sourceUrl: window.location.href,\n  });\n}\n\nasync function handleSubtractProductClick(sku: string) {\n  await cartStore.SUBTRACT_PRODUCT({ sku, sourceUrl: window.location.href });\n}\n\nasync function upgrade(nextPossiblePlan: {\n  id: string;\n  threshold: number;\n  slug: string;\n  description: string;\n  can_exceed_threshold: boolean;\n}) {\n  await onboardingStore.UPDATE_PLAN({\n    planId: nextPossiblePlan.id,\n    sourceUrl: window.location.href,\n  });\n}\n\nasync function autoUpdatePlan() {\n  const nextPossiblePlan = onboardingStore.plans.find(\n    (item) => item.threshold > Number(currentSelectedPlan?.value?.threshold)\n  );\n\n  if (nextPossiblePlan) {\n    await upgrade(nextPossiblePlan);\n  }\n\n  // Update the url to the new plan\n  router.replace({\n    query: {\n      ...router.currentRoute.value.query,\n      plan: nextPossiblePlan?.slug,\n    },\n  });\n}\n\nasync function addProduct(sku: string) {\n  upgradePlanIfNeeded();\n  try {\n    await abandonedCart.value.addProduct(\n      { sku, quantity: 1 },\n      window.location.href\n    );\n  } catch (error) {\n    if (error instanceof MaxPlanThresholdReachedError) {\n      return error.dispatchFlahsNotification();\n    }\n    throw error;\n  }\n}\n\nfunction upgradePlanIfNeeded() {\n  // if cart items quantity is tied up with selected plan threshold - go upgrade the box\n\n  if (\n    (onboardingStore.isCheckoutStepAvailable ||\n      cartStore.cartProductsCount >=\n        Number(onboardingStore?.selectedPlan?.threshold)) &&\n    onboardingStore.largestPlan?.id !== onboardingStore.selectedPlan?.id\n  ) {\n    autoUpdatePlan();\n  } else return;\n}\n\nfunction close() {\n  cartStore.UPDATE_CART_STATE({ isOpen: false });\n  document.body.classList.remove(\"cart-box-active\");\n}\n\nfunction handleCtaClick() {\n  close();\n  if (onboardingStore.isCheckoutStepAvailable) {\n    return ROUTE_NAMES.includes(route.name as string)\n      ? router.push({ name: MAPPED_ROUTE_NAMES.CHECKOUT })\n      : (window.location.href = ROUTE_CHECKOUT);\n  }\n  if (route.name !== MAPPED_ROUTE_NAMES.MENUS) {\n    return ROUTE_NAMES.includes(route.name as string)\n      ? router.push({ name: MAPPED_ROUTE_NAMES.MENUS })\n      : (window.location.href = ROUTE_MENUS);\n  }\n}\n\nfunction categoryName(item) {\n  let name = item;\n  if (item?.startsWith(\"Finger\")) {\n    return \"Finger Food\";\n  } else if (item?.startsWith(\"Kids\")) {\n    return \"Kids Meal\";\n  }\n\n  return name;\n}\n\nconst abandonedCart = computed(() => new AbandonedCart(onboardingStore.$state));\nconst isEmpty = computed(() => cartStore.cartProductsCount === 0);\nconst targetProductsCount = computed(\n  () => onboardingStore?.selectedPlan?.threshold\n);\n\nconst isOnLargestPlan = computed(\n  () => onboardingStore?.selectedPlan?.id === onboardingStore?.largestPlan?.id\n);\nconst isCountDownVisible = computed(() =>\n  !onboardingStore.isCheckoutStepAvailable ? true : !isOnLargestPlan.value\n);\nconst remainingToAdd = computed(\n  () => Number(targetProductsCount.value) - cartStore.cartProductsCount\n);\n\nconst canShowCart = computed(() => {\n  if (\n    route.name === MAPPED_ROUTE_NAMES.SIGNUP ||\n    route.name === MAPPED_ROUTE_NAMES.ONBOARDING_PLANS\n  )\n    return false;\n\n  return cartStore.isCartOpen;\n});\n\nconst currentSelectedPlan = computed(() => {\n  return onboardingStore.selectedPlan;\n});\n\nconst nextPossiblePlan = computed(() => {\n  return onboardingStore.plans.find(\n    (item) => item.threshold > Number(currentSelectedPlan?.value?.threshold)\n  );\n});\n\nonMounted(async () => {\n  await onboardingStore.GET_BESTSELLER_GROUPS({\n    abandonedCartId: abandonedCart.value.state.abandonedCartId,\n  });\n});\n\nwatch(\n  () => beamSelectNonrofitRef.value,\n  (newValue) => {\n    if (newValue) {\n      trackBeamNonprofitShown();\n    }\n  }\n);\n\nconst scrollToBottom = () => {\n  const element = document.getElementById(\"autoscroll\");\n  if (element) {\n    element.scrollIntoView({ behavior: \"smooth\", block: \"end\" });\n  }\n};\n\nconst bannerForNextDiscountText = computed(() => {\n  if (!currentSelectedPlan.value) {\n    return null;\n  }\n\n  let currentPlanThreshold = currentSelectedPlan.value.threshold;\n  let currentCartProductCount = cartStore.cartProductsCount;\n\n  if (\n    currentCartProductCount < currentPlanThreshold &&\n    currentSelectedPlan.value.discount === 0\n  ) {\n    let productsLeft = currentPlanThreshold - currentCartProductCount;\n\n    return \"ADD \" + productsLeft + (productsLeft === 1 ? \" ITEM!\" : \" ITEMS!\");\n  }\n\n  if (\n    nextPossiblePlan.value?.discount > 0 &&\n    currentCartProductCount === currentPlanThreshold\n  ) {\n    return (\n      \"ADD \" +\n      (nextPossiblePlan.value.threshold - currentCartProductCount) +\n      \" ITEMS TO GET $\" +\n      nextPossiblePlan.value.discount +\n      \" OFF!\"\n    );\n  }\n\n  if (currentCartProductCount < currentPlanThreshold) {\n    return (\n      \"ADD \" +\n      (currentPlanThreshold - currentCartProductCount) +\n      \" ITEMS TO GET $\" +\n      currentSelectedPlan.value.discount +\n      \" OFF!\"\n    );\n  }\n\n  return null;\n});\n</script>\n<template>\n  <transition\n    enter-active-class=\"tw-ease-out-quad tw-transition-all tw-duration-300\"\n    leave-active-class=\"tw-ease-in-quad tw-transition-all tw-duration-200\"\n    enter-class=\"tw-md:tw-opacity-0\"\n    enter-to-class=\"tw-md:tw-opacity-100\"\n    leave-class=\"tw-opacity-100\"\n    leave-to-class=\"tw-opacity-0\"\n  >\n    <div\n      v-if=\"canShowCart\"\n      role=\"dialog\"\n      aria-labelledby=\"modal-cart-title\"\n      class=\"max-lg:tw-fixed max-lg:tw-inset-0 max-lg:tw-bg-nl-green-100/[0.35] max-lg:tw-z-50 max-lg:tw-flex max-lg:tw-justify-end lg:tw-sticky\"\n      :class=\"{\n        'lg:tw-top-[calc(var(--om-floating-height)+72px)]': !isAnyTopBannerVisible,\n        'lg:tw-top-[calc(var(--om-floating-height)+128px)]': isAnyTopBannerVisible,\n      }\"\n    >\n      <span\n        @click=\"close\"\n        aria-label=\"Close Dialog\"\n        class=\"icon-main-times tw-text-[12px] tw-cursor-pointer tw-absolute tw-right-[18px] tw-top-[18px] tw-z-10 lg:tw-hidden\"\n      ></span>\n      <div\n        class=\"tw-h-[calc(--vh)] tw-w-[343px] lg:tw-w-[270px] xxl:tw-w-[343px] tw-shadow-nl-10 tw-z-[9] tw-bg-nl-yellow-100 tw-relative\"\n        :class=\"{\n          'lg:tw-h-[calc(var(--vh)-72px-var(--om-floating-height))]': !isAnyTopBannerVisible,\n          'lg:tw-h-[calc(var(--vh)-128px-var(--om-floating-height))]': isAnyTopBannerVisible,\n        }\"\n      >\n        <div\n          v-if=\"onboardingStore.selectedPlan\"\n          class=\"tw-h-full tw-flex tw-flex-col\"\n        >\n          <div class=\"tw-flex-1 tw-h-[1%] md:tw-overflow-y-auto md:tw-overflow-x-hidden tw-flex tw-flex-col\">\n            <div>\n              <div class=\"tw-p-3 tw-pb-4 tw-text-center tw-shadow-nl-3\">\n                <strong\n                  class=\"tw-block tw-text-[20px] tw-leading-[1.75] tw-uppercase tw-font-black\"\n                  >Your Box</strong\n                >\n                <strong\n                  class=\"tw-block tw-font-black tw-text-[40px] tw-leading-none tw-mb-px\"\n                >\n                  {{ cartStore.cartProductsCount }}\n                  <span\n                    v-if=\"\n                      cartStore.cartProductsCount <=\n                      Number(onboardingStore?.largestPlan?.threshold)\n                    \"\n                    >/{{ targetProductsCount }}</span\n                  >\n                </strong>\n                <div\n                  @mouseover=\"isChangePlanPopupShow = true\"\n                  @mouseleave=\"isChangePlanPopupShow = false\"\n                  class=\"tw-group/drop tw-relative tw-inline-flex tw-min-w-[153px]\"\n                >\n                  <a\n                    href=\"#\"\n                    class=\"tw-inline-flex tw-items-center tw-gap-1 tw-bg-nl-white-100 tw-text-[14px] tw-leading-[1.2] tw-font-medium tw-rounded-[6px] tw-shadow-nl-9 tw-uppercase tw-px-3 tw-py-[3px]\"\n                  >\n                    Change plan size\n                    <span\n                      class=\"icon-main-chevron-bold-right tw-inline-block tw-align-center tw-text-[10px] tw-relative tw-transition-all tw-transform tw-mt-px\"\n                      :class=\"[\n                        isChangePlanPopupShow ? 'tw-rotate-90 tw-mt-0.5' : '',\n                      ]\"\n                    ></span>\n                  </a>\n                  <ChangePlanPopup\n                    v-show=\"isChangePlanPopupShow\"\n                    :show=\"isChangePlanPopupShow\"\n                    @show=\"isChangePlanPopupShow = $event\"\n                  />\n                </div>\n              </div>\n              <div class=\"tw-overflow-hidden\">\n                <a\n                  v-if=\"bannerForNextDiscountText\"\n                  href=\"#\"\n                  :class=\"{\n                    'shake-animation': !(remainingToAdd > 0 && isCountDownVisible),\n                  }\"\n                  class=\"tw-block tw-bg-nl-green-100 tw-p-3 tw-text-center\"\n                >\n                  <span\n                    class=\"tw-uppercase tw-text-[16px] tw-leading-[1.2] tw-font-bold tw-text-nl-yellow-100\"\n                    v-text=\"bannerForNextDiscountText\"\n                  />\n                </a>\n              </div>\n            </div>\n            <div class=\"max-md:tw-overflow-y-auto max-md:tw-overflow-x-hidden tw-flex-1 max-md:tw-h-[1%]\">\n              <div\n                v-if=\"cartStore.cartProductsCount < 1\"\n                class=\"tw-py-5 tw-px-[39px] tw-text-center tw-text-[16px] tw-leading-none tw-font-medium\"\n              >\n                <h3\n                  class=\"tw-text-[21px] tw-leading-none tw-font-bold tw-mb-[14px]\"\n                >\n                  Not sure where to start?\n                </h3>\n                <p class=\"tw-mb-3\">\n                  Mix & match any combination of items to create an order that\n                  fits your family’s need!\n                </p>\n                <p class=\"tw-mb-3\">\n                  Or choose one of the options below and we’ll fill your order\n                  with our top-rated favorites by category.\n                </p>\n              </div>\n              <div\n                ref=\"mainSectionRef\"\n                class=\"tw-p-2.5 tw-pr-[15px]\"\n              >\n                <div class=\"tw-flex tw-justify-end\">\n                  <button\n                    v-if=\"!isEmpty\"\n                    @click=\"cartStore.EMPTY_CART\"\n                    class=\"tw-inline-block tw-bg-nl-white-100 tw-text-[14px] tw-leading-[1.2] tw-font-medium tw-rounded-[6px] tw-shadow-nl-9 tw-uppercase tw-px-3 tw-py-[3px]\"\n                  >\n                    Empty Box\n                  </button>\n                </div>\n\n                <div v-if=\"!isEmpty\" class=\"tw-flex tw-flex-col tw-gap-[9px]\">\n                  <div\n                    v-for=\"product in cartStore.cartProducts\"\n                    :key=\"product.sku\"\n                    class=\"tw-flex tw-items-center tw-gap-[11px]\"\n                  >\n                    <div class=\"tw-flex-1 tw-flex tw-items-center tw-gap-[14px]\">\n                      <div\n                        class=\"tw-size-[88px] lg:tw-size-[55px] xxl:tw-size-[88px]\"\n                      >\n                        <img\n                          :src=\"product.image['cartMobile']\"\n                          :alt=\"product.name\"\n                          class=\"tw-w-full tw-h-full tw-object-cover\"\n                        />\n                      </div>\n                      <div class=\"tw-flex-1\">\n                        <strong\n                          class=\"tw-block tw-text-[16px] tw-leading-none tw-font-black tw-mb-[5px]\"\n                          >{{ product.name }}</strong\n                        >\n                        <span\n                          class=\"tw-block tw-text-[14px] tw-leading-[1.07] tw-font-medium\"\n                          v-if=\"product?.category?.name\"\n                          >{{ categoryName(product?.category?.name) }}</span\n                        >\n                      </div>\n                    </div>\n                    <div\n                      class=\"tw-shrink-0 tw-w-[100px] lg:tw-w-[60px] xxl:tw-w-[108px] tw-h-[30px] tw-white tw-bg-nl-green-300 tw-rounded-[6px] tw-flex tw-items-center tw-justify-between tw-text-white\"\n                    >\n                      <span\n                        @click=\"handleSubtractProductClick(product.sku)\"\n                        aria-label=\"Decrease quantity\"\n                        class=\"tw-w-[30px] tw-h-[30px] tw-text-[24px] tw-leading-none tw-flex tw-items-center tw-justify-center tw-cursor-pointer -tw-mt-0.5\"\n                        >-</span\n                      >\n                      <span class=\"tw-text-[16px] tw-leading-none tw-font-bold\">{{\n                        product.quantity\n                      }}</span>\n                      <span\n                        @click=\"addProduct(product.sku)\"\n                        aria-label=\"Increase quantity\"\n                        class=\"tw-w-[30px] tw-h-[30px] tw-text-[24px] tw-leading-none tw-flex tw-items-center tw-justify-center tw-cursor-pointer -tw-mt-0.5\"\n                        >+</span\n                      >\n                    </div>\n                  </div>\n                </div>\n\n                <div\n                  v-if=\"\n                    remainingToAdd > 0 &&\n                    onboardingStore.bestsellerGroups.length > 0\n                  \"\n                  class=\"tw-pt-[19px] tw-pb-[10px] tw-flex tw-justify-center tw-items-center\"\n                >\n                  <img\n                    src=\"/assets/images/menu/m-divider.svg\"\n                    alt=\"divider\"\n                    class=\"tw-w-[294px]\"\n                  />\n                </div>\n\n                <div\n                  v-if=\"\n                    remainingToAdd > 0 &&\n                    onboardingStore.bestsellerGroups.length > 0\n                  \"\n                  class=\"tw-text-center tw-pb-5\"\n                >\n                  <strong\n                    class=\"tw-block tw-uppercase tw-text-[16px] tw-leading-[1.2065] tw-font-bold tw-mb-[9px]\"\n                    >Complete with top-rated meals</strong\n                  >\n                  <ul\n                    class=\"tw-max-w-[247px] tw-mx-auto tw-flex tw-flex-col tw-gap-[6px]\"\n                  >\n                    <li\n                      v-for=\"bestsellers in onboardingStore.bestsellerGroupsShownOnCart\"\n                      :key=\"bestsellers.id\"\n                    >\n                      <a\n                        href=\"#\"\n                        @click.prevent=\"\n                          handleFillCartWithBestsellersClick(bestsellers.id)\n                        \"\n                        class=\"tw-block tw-bg-nl-white-100 tw-text-[16px] tw-leading-[1.2] tw-font-medium tw-rounded-[6px] tw-shadow-nl-9 tw-uppercase tw-px-4 tw-py-[7px]\"\n                      >\n                        {{\n                          bestsellers.cart_cta\n                            ? bestsellers.cart_cta\n                            : bestsellers.name\n                        }}\n                      </a>\n                    </li>\n                  </ul>\n                </div>\n              </div>\n            </div>\n\n            <div\n              v-if=\"\n                route.name !== 'checkout' && cartStore.cartProducts.length > 0\n              \"\n              class=\"tw-px-1 tw-pt-4 md:tw-pb-4 max-md:tw-shadow-nl-4\"\n            >\n              <beam-select-nonprofit\n                ref=\"beamSelectNonrofitRef\"\n                :apiKey=\"config.public.beamApiKey\"\n                :chainId=\"config.public.beamChainId\"\n                :storeId=\"parseInt(config.public.beamStoreId)\"\n                :baseUrl=\"config.public.beamApiUrl\"\n                debug\n                @click=\"scrollToBottom\"\n                class=\"tw-px-2\"\n              ></beam-select-nonprofit>\n              <span id=\"autoscroll\"></span>\n            </div>\n          </div>\n\n          <div\n            class=\"tw-flex tw-flex-col tw-items-center tw-text-center tw-text-[16px] tw-leading-none tw-font-bold tw-bg-nl-yellow-100 md:tw-shadow-nl-4 tw-py-[9px] tw-uppercase -tw-px-2 tw-gap-[10px]\"\n          >\n            <div class=\"tw-w-full tw-px-4\">\n              <button\n                @click.prevent=\"handleCtaClick\"\n                :disabled=\"!onboardingStore.isCheckoutStepAvailable\"\n                :class=\"{\n                  'tw-bg-nl-violet-100':\n                    onboardingStore.isCheckoutStepAvailable,\n                }\"\n                class=\"tw-w-full k tw-rounded tw-bg-[#aa8dce] tw-text-white tw-p-3 tw-max-w-[257px] tw-mx-auto tw-transition-all hover:tw-bg-nl-violet-100 tw-uppercase\"\n              >\n                Checkout\n              </button>\n            </div>\n          </div>\n        </div>\n        <div\n          v-else\n          class=\"tw-flex tw-h-full tw-flex-col tw-items-center tw-px-[25px]\"\n        >\n          <h1\n            class=\"tw-mt-[48px] tw-text-center tw-font-black tw-font-agenda tw-text-[32px] tw-uppercase tw-mb-[3px] tw-leading-9\"\n          >\n            Choose your plan to add to cart!\n          </h1>\n          <p class=\"tw-mb-[12px]\">The more you get, the more you save!</p>\n          <CartSelectPlan class=\"tw-mb-[29px]\" />\n          <p class=\"tw-text-center\">\n            We’re all about flexibility! Update your plan size, skip weeks, or\n            cancel your account any time.\n          </p>\n        </div>\n      </div>\n    </div>\n  </transition>\n</template>\n\n<style scoped>\n@keyframes pendulum {\n  0% {\n    transform: scale(1);\n  }\n\n  100% {\n    transform: scale(1.1);\n  }\n}\n\n.shake-animation {\n  animation: pendulum 1.5s infinite alternate;\n}\n</style>\n"],"names":["emit","__emit","onboardingStore","useOnboardingStore","menusStore","useMenusStore","router","useRouter","selectedPlan","ref","currentSelectedPlan","computed","selectPlan","planId","plan","submit","closePopup","close","downgrade","upgrade","abandonedCart","AbandonedCart","watch","newSelectedPlan","onMounted","authStore","useAuthStore","_a","URL_ACCOUNT_ORDERS_PAGE","_imports_0","publicAssetsURL","MaxPlanThresholdReachedError","error","event","track","eventsManager","define_import_meta_env_default","isAnyTopBannerVisible","storeToRefs","cartStore","useCartStore","route","useRoute","config","useRuntimeConfig","mainSectionRef","beamSelectNonrofitRef","isChangePlanPopupShow","useHead","_b","handleFillCartWithBestsellersClick","id","handleSubtractProductClick","sku","nextPossiblePlan","autoUpdatePlan","item","addProduct","upgradePlanIfNeeded","_c","handleCtaClick","ROUTE_NAMES","MAPPED_ROUTE_NAMES","ROUTE_CHECKOUT","ROUTE_MENUS","categoryName","name","isEmpty","targetProductsCount","isOnLargestPlan","isCountDownVisible","remainingToAdd","canShowCart","newValue","trackBeamNonprofitShown","scrollToBottom","element","bannerForNextDiscountText","currentPlanThreshold","currentCartProductCount","productsLeft"],"mappings":"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"}