@schematichq/schematic-components 2.0.1 → 2.0.2

package/dist/schematic-components.esm.js

@@ -4,13 +4,7 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __require = /* @__PURE__ */ ((x2) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x2, {
-  get: (a2, b2) => (typeof require !== "undefined" ? require : a2)[b2]
-}) : x2)(function(x2) {
-  if (typeof require !== "undefined") return require.apply(this, arguments);
-  throw Error('Dynamic require of "' + x2 + '" is not supported');
-});
-var __commonJS = (cb, mod) => function __require2() {
+var __commonJS = (cb, mod) => function __require() {
   return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
 };
 var __copyProps = (to, from2, except, desc) => {
@@ -89,82 +83,6 @@ var require_void_elements = __commonJS({
   }
 });
 
-// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js
-var require_use_sync_external_store_shim_development = __commonJS({
-  "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js"(exports) {
-    "use strict";
-    (function() {
-      function is(x2, y2) {
-        return x2 === y2 && (0 !== x2 || 1 / x2 === 1 / y2) || x2 !== x2 && y2 !== y2;
-      }
-      function useSyncExternalStore$2(subscribe, getSnapshot) {
-        didWarnOld18Alpha || void 0 === React3.startTransition || (didWarnOld18Alpha = true, console.error(
-          "You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."
-        ));
-        var value = getSnapshot();
-        if (!didWarnUncachedGetSnapshot) {
-          var cachedValue = getSnapshot();
-          objectIs(value, cachedValue) || (console.error(
-            "The result of getSnapshot should be cached to avoid an infinite loop"
-          ), didWarnUncachedGetSnapshot = true);
-        }
-        cachedValue = useState21({
-          inst: { value, getSnapshot }
-        });
-        var inst = cachedValue[0].inst, forceUpdate = cachedValue[1];
-        useLayoutEffect6(
-          function() {
-            inst.value = value;
-            inst.getSnapshot = getSnapshot;
-            checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-          },
-          [subscribe, value, getSnapshot]
-        );
-        useEffect11(
-          function() {
-            checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-            return subscribe(function() {
-              checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-            });
-          },
-          [subscribe]
-        );
-        useDebugValue(value);
-        return value;
-      }
-      function checkIfSnapshotChanged(inst) {
-        var latestGetSnapshot = inst.getSnapshot;
-        inst = inst.value;
-        try {
-          var nextValue = latestGetSnapshot();
-          return !objectIs(inst, nextValue);
-        } catch (error) {
-          return true;
-        }
-      }
-      function useSyncExternalStore$1(subscribe, getSnapshot) {
-        return getSnapshot();
-      }
-      "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
-      var React3 = __require("react"), objectIs = "function" === typeof Object.is ? Object.is : is, useState21 = React3.useState, useEffect11 = React3.useEffect, useLayoutEffect6 = React3.useLayoutEffect, useDebugValue = React3.useDebugValue, didWarnOld18Alpha = false, didWarnUncachedGetSnapshot = false, shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
-      exports.useSyncExternalStore = void 0 !== React3.useSyncExternalStore ? React3.useSyncExternalStore : shim;
-      "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
-    })();
-  }
-});
-
-// node_modules/use-sync-external-store/shim/index.js
-var require_shim = __commonJS({
-  "node_modules/use-sync-external-store/shim/index.js"(exports, module) {
-    "use strict";
-    if (false) {
-      module.exports = null;
-    } else {
-      module.exports = require_use_sync_external_store_shim_development();
-    }
-  }
-});
-
 // node_modules/lodash/isObject.js
 var require_isObject = __commonJS({
   "node_modules/lodash/isObject.js"(exports, module) {
@@ -7157,19 +7075,16 @@ function IcuTrans({
 IcuTrans.displayName = "IcuTrans";
 
 // node_modules/react-i18next/dist/es/useTranslation.js
-var import_shim = __toESM(require_shim(), 1);
-import { useContext as useContext3, useCallback as useCallback2, useMemo as useMemo2, useEffect, useRef, useState } from "react";
-var notReadyT = (k2, optsOrDefaultValue) => {
-  if (isString2(optsOrDefaultValue)) return optsOrDefaultValue;
-  if (isObject(optsOrDefaultValue) && isString2(optsOrDefaultValue.defaultValue)) return optsOrDefaultValue.defaultValue;
-  return Array.isArray(k2) ? k2[k2.length - 1] : k2;
-};
-var notReadySnapshot = {
-  t: notReadyT,
-  ready: false
-};
-var dummySubscribe = () => () => {
+import { useState, useEffect, useContext as useContext3, useRef, useCallback as useCallback2 } from "react";
+var usePrevious = (value, ignore) => {
+  const ref = useRef();
+  useEffect(() => {
+    ref.current = ignore ? ref.current : value;
+  }, [value, ignore]);
+  return ref.current;
 };
+var alwaysNewT = (i18n, language, namespace, keyPrefix) => i18n.getFixedT(language, namespace, keyPrefix);
+var useMemoizedT = (i18n, language, namespace, keyPrefix) => useCallback2(alwaysNewT(i18n, language, namespace, keyPrefix), [i18n, language, namespace, keyPrefix]);
 var useTranslation = (ns, props = {}) => {
   const {
     i18n: i18nFromProps
@@ -7182,103 +7097,95 @@ var useTranslation = (ns, props = {}) => {
   if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();
   if (!i18n) {
     warnOnce(i18n, "NO_I18NEXT_INSTANCE", "useTranslation: You will need to pass in an i18next instance by using initReactI18next");
-  }
-  const i18nOptions = useMemo2(() => ({
+    const notReadyT = (k2, optsOrDefaultValue) => {
+      if (isString2(optsOrDefaultValue)) return optsOrDefaultValue;
+      if (isObject(optsOrDefaultValue) && isString2(optsOrDefaultValue.defaultValue)) return optsOrDefaultValue.defaultValue;
+      return Array.isArray(k2) ? k2[k2.length - 1] : k2;
+    };
+    const retNotReady = [notReadyT, {}, false];
+    retNotReady.t = notReadyT;
+    retNotReady.i18n = {};
+    retNotReady.ready = false;
+    return retNotReady;
+  }
+  if (i18n.options.react?.wait) warnOnce(i18n, "DEPRECATED_OPTION", "useTranslation: It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.");
+  const i18nOptions = {
     ...getDefaults(),
-    ...i18n?.options?.react,
+    ...i18n.options.react,
     ...props
-  }), [i18n, props]);
+  };
   const {
     useSuspense,
     keyPrefix
   } = i18nOptions;
-  const namespaces = useMemo2(() => {
-    const nsOrContext = ns || defaultNSFromContext || i18n?.options?.defaultNS;
-    return isString2(nsOrContext) ? [nsOrContext] : nsOrContext || ["translation"];
-  }, [ns, defaultNSFromContext, i18n]);
-  i18n?.reportNamespaces?.addUsedNamespaces?.(namespaces);
-  const revisionRef = useRef(0);
-  const subscribe = useCallback2((callback) => {
-    if (!i18n) return dummySubscribe;
+  let namespaces = ns || defaultNSFromContext || i18n.options?.defaultNS;
+  namespaces = isString2(namespaces) ? [namespaces] : namespaces || ["translation"];
+  i18n.reportNamespaces.addUsedNamespaces?.(namespaces);
+  const ready = (i18n.isInitialized || i18n.initializedStoreOnce) && namespaces.every((n) => hasLoadedNamespace2(n, i18n, i18nOptions));
+  const memoGetT = useMemoizedT(i18n, props.lng || null, i18nOptions.nsMode === "fallback" ? namespaces : namespaces[0], keyPrefix);
+  const getT = () => memoGetT;
+  const getNewT = () => alwaysNewT(i18n, props.lng || null, i18nOptions.nsMode === "fallback" ? namespaces : namespaces[0], keyPrefix);
+  const [t2, setT] = useState(getT);
+  let joinedNS = namespaces.join();
+  if (props.lng) joinedNS = `${props.lng}${joinedNS}`;
+  const previousJoinedNS = usePrevious(joinedNS);
+  const isMounted = useRef(true);
+  useEffect(() => {
     const {
       bindI18n,
       bindI18nStore
     } = i18nOptions;
-    const wrappedCallback = () => {
-      revisionRef.current += 1;
-      callback();
+    isMounted.current = true;
+    if (!ready && !useSuspense) {
+      if (props.lng) {
+        loadLanguages2(i18n, props.lng, namespaces, () => {
+          if (isMounted.current) setT(getNewT);
+        });
+      } else {
+        loadNamespaces2(i18n, namespaces, () => {
+          if (isMounted.current) setT(getNewT);
+        });
+      }
+    }
+    if (ready && previousJoinedNS && previousJoinedNS !== joinedNS && isMounted.current) {
+      setT(getNewT);
+    }
+    const boundReset = () => {
+      if (isMounted.current) setT(getNewT);
     };
-    if (bindI18n) i18n.on(bindI18n, wrappedCallback);
-    if (bindI18nStore) i18n.store.on(bindI18nStore, wrappedCallback);
+    if (bindI18n) i18n?.on(bindI18n, boundReset);
+    if (bindI18nStore) i18n?.store.on(bindI18nStore, boundReset);
     return () => {
-      if (bindI18n) bindI18n.split(" ").forEach((e2) => i18n.off(e2, wrappedCallback));
-      if (bindI18nStore) bindI18nStore.split(" ").forEach((e2) => i18n.store.off(e2, wrappedCallback));
-    };
-  }, [i18n, i18nOptions]);
-  const snapshotRef = useRef();
-  const getSnapshot = useCallback2(() => {
-    if (!i18n) {
-      return notReadySnapshot;
-    }
-    const calculatedReady = !!(i18n.isInitialized || i18n.initializedStoreOnce) && namespaces.every((n) => hasLoadedNamespace2(n, i18n, i18nOptions));
-    const currentLng = props.lng || i18n.language;
-    const currentRevision = revisionRef.current;
-    const lastSnapshot = snapshotRef.current;
-    if (lastSnapshot && lastSnapshot.ready === calculatedReady && lastSnapshot.lng === currentLng && lastSnapshot.keyPrefix === keyPrefix && lastSnapshot.revision === currentRevision) {
-      return lastSnapshot;
-    }
-    const calculatedT = i18n.getFixedT(currentLng, i18nOptions.nsMode === "fallback" ? namespaces : namespaces[0], keyPrefix);
-    const newSnapshot = {
-      t: calculatedT,
-      ready: calculatedReady,
-      lng: currentLng,
-      keyPrefix,
-      revision: currentRevision
+      isMounted.current = false;
+      if (i18n && bindI18n) bindI18n?.split(" ").forEach((e2) => i18n.off(e2, boundReset));
+      if (bindI18nStore && i18n) bindI18nStore.split(" ").forEach((e2) => i18n.store.off(e2, boundReset));
     };
-    snapshotRef.current = newSnapshot;
-    return newSnapshot;
-  }, [i18n, namespaces, keyPrefix, i18nOptions, props.lng]);
-  const [loadCount, setLoadCount] = useState(0);
-  const {
-    t: t2,
-    ready
-  } = (0, import_shim.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+  }, [i18n, joinedNS]);
   useEffect(() => {
-    if (i18n && !ready && !useSuspense) {
-      const onLoaded = () => setLoadCount((c2) => c2 + 1);
-      if (props.lng) {
-        loadLanguages2(i18n, props.lng, namespaces, onLoaded);
-      } else {
-        loadNamespaces2(i18n, namespaces, onLoaded);
-      }
-    }
-  }, [i18n, props.lng, namespaces, ready, useSuspense, loadCount]);
-  const finalI18n = i18n || {};
-  const ret = useMemo2(() => {
-    const arr = [t2, finalI18n, ready];
-    arr.t = t2;
-    arr.i18n = finalI18n;
-    arr.ready = ready;
-    return arr;
-  }, [t2, finalI18n, ready]);
-  if (i18n && useSuspense && !ready) {
-    throw new Promise((resolve) => {
-      const onLoaded = () => resolve();
-      if (props.lng) {
-        loadLanguages2(i18n, props.lng, namespaces, onLoaded);
-      } else {
-        loadNamespaces2(i18n, namespaces, onLoaded);
-      }
-    });
-  }
-  return ret;
+    if (isMounted.current && ready) {
+      setT(getT);
+    }
+  }, [i18n, keyPrefix, ready]);
+  const ret = [t2, i18n, ready];
+  ret.t = t2;
+  ret.i18n = i18n;
+  ret.ready = ready;
+  if (ready) return ret;
+  if (!ready && !useSuspense) return ret;
+  throw new Promise((resolve) => {
+    if (props.lng) {
+      loadLanguages2(i18n, props.lng, namespaces, () => resolve());
+    } else {
+      loadNamespaces2(i18n, namespaces, () => resolve());
+    }
+  });
 };
 
 // node_modules/react-i18next/dist/es/withTranslation.js
 import { createElement as createElement2, forwardRef as forwardRefReact } from "react";
 
 // node_modules/react-i18next/dist/es/I18nextProvider.js
-import { createElement as createElement3, useMemo as useMemo3 } from "react";
+import { createElement as createElement3, useMemo as useMemo2 } from "react";
 
 // node_modules/react-i18next/dist/es/withSSR.js
 import { createElement as createElement4 } from "react";
@@ -7635,7 +7542,7 @@ var import_merge2 = __toESM(require_merge());
 import {
   useCallback as useCallback3,
   useEffect as useEffect2,
-  useMemo as useMemo4,
+  useMemo as useMemo3,
   useReducer,
   useRef as useRef2,
   useState as useState2
@@ -11272,7 +11179,7 @@ var reducer = (state, action) => {
 // src/context/EmbedProvider.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
 var getCustomHeaders = (sessionId) => ({
-  "X-Schematic-Components-Version": "2.0.1",
+  "X-Schematic-Components-Version": "2.0.2",
   "X-Schematic-Session-ID": sessionId
 });
 var EmbedProvider = ({
@@ -11324,7 +11231,7 @@ var EmbedProvider = ({
       });
     }
   }, [api.public]);
-  const debouncedHydratePublic = useMemo4(
+  const debouncedHydratePublic = useMemo3(
     () => (0, import_debounce.default)(
       hydratePublic,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11350,7 +11257,7 @@ var EmbedProvider = ({
       });
     }
   }, [api.checkout]);
-  const debouncedHydrate = useMemo4(
+  const debouncedHydrate = useMemo3(
     () => (0, import_debounce.default)(hydrate, FETCH_DEBOUNCE_TIMEOUT, LEADING_DEBOUNCE_SETTINGS),
     [hydrate]
   );
@@ -11377,7 +11284,7 @@ var EmbedProvider = ({
     },
     [api.checkout]
   );
-  const debouncedHydrateComponent = useMemo4(
+  const debouncedHydrateComponent = useMemo3(
     () => (0, import_debounce.default)(
       hydrateComponent,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11401,7 +11308,7 @@ var EmbedProvider = ({
       });
     }
   }, []);
-  const debouncedHydrateExternal = useMemo4(
+  const debouncedHydrateExternal = useMemo3(
     () => (0, import_debounce.default)(
       hydrateExternal,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11412,7 +11319,7 @@ var EmbedProvider = ({
   const createSetupIntent = useCallback3(async () => {
     return api.checkout?.createSetupIntent();
   }, [api.checkout]);
-  const debouncedCreateSetupIntent = useMemo4(
+  const debouncedCreateSetupIntent = useMemo3(
     () => (0, import_debounce.default)(
       createSetupIntent,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11435,7 +11342,7 @@ var EmbedProvider = ({
     },
     [api.checkout]
   );
-  const debouncedUpdatePaymentMethod = useMemo4(
+  const debouncedUpdatePaymentMethod = useMemo3(
     () => (0, import_debounce.default)(
       updatePaymentMethod,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11458,7 +11365,7 @@ var EmbedProvider = ({
     },
     [api.checkout]
   );
-  const debouncedDeletePaymentMethod = useMemo4(
+  const debouncedDeletePaymentMethod = useMemo3(
     () => (0, import_debounce.default)(
       deletePaymentMethod,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11481,7 +11388,7 @@ var EmbedProvider = ({
     },
     [api.checkout]
   );
-  const debouncedCheckout = useMemo4(
+  const debouncedCheckout = useMemo3(
     () => (0, import_debounce.default)(checkout, FETCH_DEBOUNCE_TIMEOUT, LEADING_DEBOUNCE_SETTINGS),
     [checkout]
   );
@@ -11501,7 +11408,7 @@ var EmbedProvider = ({
     }
     return response;
   }, [api.checkout]);
-  const debouncedUnsubscribe = useMemo4(
+  const debouncedUnsubscribe = useMemo3(
     () => (0, import_debounce.default)(unsubscribe, FETCH_DEBOUNCE_TIMEOUT, LEADING_DEBOUNCE_SETTINGS),
     [unsubscribe]
   );
@@ -11513,7 +11420,7 @@ var EmbedProvider = ({
     },
     [api.checkout]
   );
-  const debouncedGetUpcomingInvoice = useMemo4(
+  const debouncedGetUpcomingInvoice = useMemo3(
     () => (0, import_debounce.default)(
       getUpcomingInvoice,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11524,7 +11431,7 @@ var EmbedProvider = ({
   const getCustomerBalance = useCallback3(async () => {
     return api.checkout?.fetchCustomerBalance();
   }, [api.checkout]);
-  const debouncedGetCustomerBalance = useMemo4(
+  const debouncedGetCustomerBalance = useMemo3(
     () => (0, import_debounce.default)(
       getCustomerBalance,
       FETCH_DEBOUNCE_TIMEOUT,
@@ -11535,7 +11442,7 @@ var EmbedProvider = ({
   const listInvoices = useCallback3(async () => {
     return api.checkout?.listInvoices();
   }, [api.checkout]);
-  const debouncedListInvoices = useMemo4(
+  const debouncedListInvoices = useMemo3(
     () => (0, import_debounce.default)(listInvoices, FETCH_DEBOUNCE_TIMEOUT, LEADING_DEBOUNCE_SETTINGS),
     [listInvoices]
   );
@@ -11702,10 +11609,10 @@ var EmbedProvider = ({
 var useEmbed = () => useContext5(EmbedContext);
 
 // src/hooks/useIsLightBackground.ts
-import { useMemo as useMemo5 } from "react";
+import { useMemo as useMemo4 } from "react";
 function useIsLightBackground() {
   const { settings } = useEmbed();
-  const isLightBackground = useMemo5(() => {
+  const isLightBackground = useMemo4(() => {
     return hexToHSL(settings.theme.card.background).l > 50;
   }, [settings.theme.card.background]);
   return isLightBackground;
@@ -11820,7 +11727,7 @@ var usePaymentConfirmation = ({
 };
 
 // src/hooks/useRequest.ts
-import { useCallback as useCallback5, useMemo as useMemo6, useState as useState4 } from "react";
+import { useCallback as useCallback5, useMemo as useMemo5, useState as useState4 } from "react";
 function useRequest(fn) {
   const [isLoading, setIsLoading] = useState4(false);
   const [error, setError] = useState4(null);
@@ -11840,7 +11747,7 @@ function useRequest(fn) {
       setIsLoading(false);
     }
   }, [fn]);
-  const value = useMemo6(() => {
+  const value = useMemo5(() => {
     const state = { isLoading, error, data };
     return [state, request];
   }, [isLoading, error, data, request]);
@@ -11848,11 +11755,11 @@ function useRequest(fn) {
 }
 
 // src/hooks/useTrialEnd.ts
-import { useMemo as useMemo7 } from "react";
+import { useMemo as useMemo6 } from "react";
 function useTrialEnd() {
   const { t: t2 } = useTranslation();
   const { data } = useEmbed();
-  const { endDate, formatted } = useMemo7(() => {
+  const { endDate, formatted } = useMemo6(() => {
     const billingSubscription = data?.company?.billingSubscription;
     const end = typeof billingSubscription?.trialEnd === "number" ? new Date(billingSubscription.trialEnd * 1e3) : void 0;
     let formatted2;
@@ -13049,7 +12956,7 @@ Root.displayName = "Root";
 
 // src/components/layout/viewport/Viewport.tsx
 var import_debounce3 = __toESM(require_debounce());
-import { forwardRef as forwardRef5, useLayoutEffect as useLayoutEffect5, useMemo as useMemo16, useRef as useRef9, useState as useState13 } from "react";
+import { forwardRef as forwardRef5, useLayoutEffect as useLayoutEffect5, useMemo as useMemo15, useRef as useRef9, useState as useState13 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
 
 // src/components/shared/billing-threshold-tooltip/BillingThresholdTooltip.tsx
@@ -13086,7 +12993,7 @@ import {
   useCallback as useCallback10,
   useEffect as useEffect5,
   useLayoutEffect as useLayoutEffect4,
-  useMemo as useMemo10,
+  useMemo as useMemo9,
   useRef as useRef6,
   useState as useState10
 } from "react";
@@ -13094,7 +13001,7 @@ import {
 // src/components/shared/sidebar/Sidebar.tsx
 import {
   useCallback as useCallback9,
-  useMemo as useMemo8
+  useMemo as useMemo7
 } from "react";
 
 // src/components/shared/sidebar/EntitlementRow.tsx
@@ -13558,7 +13465,7 @@ var Sidebar = ({
     billingSubscription,
     paymentMethod,
     trialPaymentMethodRequired
-  } = useMemo8(() => {
+  } = useMemo7(() => {
     const currentEntitlements2 = data?.featureUsage?.features || [];
     return {
       currentPlan: data?.company?.plan,
@@ -13581,7 +13488,7 @@ var Sidebar = ({
     data?.subscription?.paymentMethod,
     data?.trialPaymentMethodRequired
   ]);
-  const { payInAdvanceEntitlements } = useMemo8(() => {
+  const { payInAdvanceEntitlements } = useMemo7(() => {
     const payAsYouGoEntitlements = [];
     const payInAdvanceEntitlements2 = usageBasedEntitlements.filter(
       (entitlement) => {
@@ -13593,7 +13500,7 @@ var Sidebar = ({
     );
     return { payAsYouGoEntitlements, payInAdvanceEntitlements: payInAdvanceEntitlements2 };
   }, [usageBasedEntitlements]);
-  const subscriptionPrice = useMemo8(() => {
+  const subscriptionPrice = useMemo7(() => {
     let planPrice;
     let currency;
     if (selectedPlan) {
@@ -13630,7 +13537,7 @@ var Sidebar = ({
     proration,
     taxAmount,
     taxDescription
-  } = useMemo8(() => {
+  } = useMemo7(() => {
     return {
       amountOff: charges?.amountOff ?? 0,
       dueNow: charges?.dueNow ?? 0,
@@ -13642,7 +13549,7 @@ var Sidebar = ({
       taxDescription: charges?.taxDisplayName
     };
   }, [charges]);
-  const updatedUsageBasedEntitlements = useMemo8(() => {
+  const updatedUsageBasedEntitlements = useMemo7(() => {
     const changedUsageBasedEntitlements = [];
     const addedUsageBasedEntitlements = selectedPlan ? usageBasedEntitlements.reduce(
       (acc, selected) => {
@@ -13693,15 +13600,15 @@ var Sidebar = ({
     currentUsageBasedEntitlements,
     usageBasedEntitlements
   ]);
-  const selectedAddOns = useMemo8(
+  const selectedAddOns = useMemo7(
     () => addOns.filter((addOn) => addOn.isSelected),
     [addOns]
   );
-  const addedCreditBundles = useMemo8(
+  const addedCreditBundles = useMemo7(
     () => creditBundles.filter((bundle) => bundle.count > 0),
     [creditBundles]
   );
-  const discountApplied = useMemo8(
+  const discountApplied = useMemo7(
     () => promoCode && (amountOff > 0 || percentOff > 0),
     [promoCode, amountOff, percentOff]
   );
@@ -13839,7 +13746,7 @@ var Sidebar = ({
       setError(t2("Unsubscribe failed"));
     }
   }, [t2, unsubscribe, setError, setIsLoading, setLayout]);
-  const { removedAddOns, willAddOnsChange } = useMemo8(() => {
+  const { removedAddOns, willAddOnsChange } = useMemo7(() => {
     const addedAddOns = selectedAddOns.filter(
       (selected) => !currentAddOns.some((current) => selected.id === current.id)
     );
@@ -14888,7 +14795,7 @@ var Navigation = ({
 };
 
 // src/components/shared/checkout-dialog/Plan.tsx
-import { Fragment as Fragment8, useEffect as useEffect4, useMemo as useMemo9, useState as useState9 } from "react";
+import { Fragment as Fragment8, useEffect as useEffect4, useMemo as useMemo8, useState as useState9 } from "react";
 
 // src/components/shared/checkout-dialog/styles.ts
 var FlexWithAlignEnd = dt(Flex)`
@@ -14900,7 +14807,7 @@ import { Fragment as Fragment9, jsx as jsx19, jsxs as jsxs14 } from "react/jsx-r
 var Selected = ({ isCurrent = false, isTrial = false }) => {
   const { t: t2 } = useTranslation();
   const { settings } = useEmbed();
-  const text = useMemo9(() => {
+  const text = useMemo8(() => {
     if (isCurrent) {
       return isTrial ? t2("Trial in progress") : t2("Current plan");
     }
@@ -14936,10 +14843,10 @@ var PlanButtonGroup = ({
 }) => {
   const { t: t2 } = useTranslation();
   const { data } = useEmbed();
-  const isTrialing = useMemo9(() => {
+  const isTrialing = useMemo8(() => {
     return data?.subscription?.status === "trialing" || false;
   }, [data]);
-  const { isCurrentPlan, isValidPlan } = useMemo9(() => {
+  const { isCurrentPlan, isValidPlan } = useMemo8(() => {
     return {
       isCurrentPlan: data?.company?.plan?.id === plan.id,
       isValidPlan: plan.valid
@@ -15035,7 +14942,7 @@ var Plan = ({
   const [entitlementCounts, setEntitlementCounts] = useState9(
     () => plans.reduce(entitlementCountsReducer, {})
   );
-  const { isTrialing, showCredits, showPeriodToggle, showZeroPriceAsFree } = useMemo9(() => {
+  const { isTrialing, showCredits, showPeriodToggle, showZeroPriceAsFree } = useMemo8(() => {
     return {
       isTrialing: data?.subscription?.status === "trialing",
       showCredits: data?.showCredits ?? true,
@@ -15625,7 +15532,7 @@ var CheckoutDialog = ({ top = 0 }) => {
     currentEntitlements,
     showPeriodToggle,
     trialPaymentMethodRequired
-  } = useMemo10(() => {
+  } = useMemo9(() => {
     return {
       currentPlanId: data?.company?.plan?.id,
       currentEntitlements: data?.featureUsage ? data.featureUsage.features : [],
@@ -15638,7 +15545,7 @@ var CheckoutDialog = ({ top = 0 }) => {
     data?.showPeriodToggle,
     data?.trialPaymentMethodRequired
   ]);
-  const currentPeriod = useMemo10(
+  const currentPeriod = useMemo9(
     () => checkoutState?.period || data?.company?.plan?.planPeriod || "month",
     [data?.company?.plan?.planPeriod, checkoutState?.period]
   );
@@ -15696,13 +15603,13 @@ var CheckoutDialog = ({ top = 0 }) => {
       );
     });
   });
-  const payInAdvanceEntitlements = useMemo10(
+  const payInAdvanceEntitlements = useMemo9(
     () => usageBasedEntitlements.filter(
       (entitlement) => entitlement.priceBehavior === "pay_in_advance" /* PayInAdvance */
     ),
     [usageBasedEntitlements]
   );
-  const addOnPayInAdvanceEntitlements = useMemo10(
+  const addOnPayInAdvanceEntitlements = useMemo9(
     () => addOnUsageBasedEntitlements.filter(
       (entitlement) => entitlement.priceBehavior === "pay_in_advance" /* PayInAdvance */
     ),
@@ -15710,12 +15617,12 @@ var CheckoutDialog = ({ top = 0 }) => {
   );
   const [promoCode, setPromoCode] = useState10(null);
   const [isPaymentMethodRequired, setIsPaymentMethodRequired] = useState10(false);
-  const willTrialWithoutPaymentMethod = useMemo10(
+  const willTrialWithoutPaymentMethod = useMemo9(
     () => shouldTrial && !trialPaymentMethodRequired,
     [shouldTrial, trialPaymentMethodRequired]
   );
   const isSelectedPlanTrialable = selectedPlan && selectedPlan.isTrialable && selectedPlan.companyCanTrial;
-  const checkoutStages = useMemo10(() => {
+  const checkoutStages = useMemo9(() => {
     const stages = [];
     if (availablePlans.length > 0) {
       stages.push({
@@ -16505,7 +16412,7 @@ var PaymentForm = ({ onConfirm, financeData }) => {
 };
 
 // src/components/shared/period-toggle/PeriodToggle.tsx
-import { useMemo as useMemo11 } from "react";
+import { useMemo as useMemo10 } from "react";
 import { jsx as jsx24 } from "react/jsx-runtime";
 var PeriodToggle = ({
   options,
@@ -16516,7 +16423,7 @@ var PeriodToggle = ({
   const { t: t2 } = useTranslation();
   const { settings } = useEmbed();
   const isLightBackground = useIsLightBackground();
-  const savingsPercentage = useMemo11(() => {
+  const savingsPercentage = useMemo10(() => {
     if (selectedPlan) {
       const monthlyBillingPrice = getPlanPrice(selectedPlan, "month");
       const yearlyBillingPrice = getPlanPrice(selectedPlan, "year");
@@ -16602,10 +16509,10 @@ var PeriodToggle = ({
 };
 
 // src/components/shared/pricing-tiers-tooltip/PricingTiersTooltip.tsx
-import { useMemo as useMemo13 } from "react";
+import { useMemo as useMemo12 } from "react";
 
 // src/components/shared/pricing-tiers-tooltip/PriceText.tsx
-import { useMemo as useMemo12 } from "react";
+import { useMemo as useMemo11 } from "react";
 import { Fragment as Fragment11, jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
 var PriceText = ({
   feature,
@@ -16615,7 +16522,7 @@ var PriceText = ({
   perUnitPrice = 0
 }) => {
   const { settings } = useEmbed();
-  const text = useMemo12(() => {
+  const text = useMemo11(() => {
     if (!flatAmount && perUnitPrice) {
       return /* @__PURE__ */ jsxs19(Fragment11, { children: [
         formatCurrency(perUnitPrice, currency),
@@ -16663,7 +16570,7 @@ var PricingTiersTooltip = ({
   const { t: t2 } = useTranslation();
   const { settings } = useEmbed();
   const isLightBackground = useIsLightBackground();
-  const { tiers } = useMemo13(() => {
+  const { tiers } = useMemo12(() => {
     return priceTiers.reduce(
       (acc, tier) => {
         const end = tier.upTo ?? Infinity;
@@ -16754,13 +16661,13 @@ var PricingTiersTooltip = ({
 };
 
 // src/components/shared/tiered-pricing-details/TieredPricingDetails.tsx
-import { useMemo as useMemo14 } from "react";
+import { useMemo as useMemo13 } from "react";
 var TieredPricingDetails = ({
   entitlement,
   period
 }) => {
   const { t: t2 } = useTranslation();
-  const { currency, flatAmount, perUnitPrice, upTo } = useMemo14(() => {
+  const { currency, flatAmount, perUnitPrice, upTo } = useMemo13(() => {
     const { currency: currency2, priceTier } = getEntitlementPrice(entitlement, period) || {};
     const { flatAmount: flatAmount2, perUnitPrice: perUnitPrice2, perUnitPriceDecimal, upTo: upTo2 } = priceTier?.[0] || {};
     return {
@@ -16808,7 +16715,7 @@ var TieredPricingDetails = ({
 };
 
 // src/components/shared/unsubscribe-dialog/UnsubscribeDialog.tsx
-import { useMemo as useMemo15, useRef as useRef8, useState as useState12 } from "react";
+import { useMemo as useMemo14, useRef as useRef8, useState as useState12 } from "react";
 import { jsx as jsx27, jsxs as jsxs21 } from "react/jsx-runtime";
 var UnsubscribeDialog = ({ top = 0 }) => {
   const { t: t2 } = useTranslation();
@@ -16816,7 +16723,7 @@ var UnsubscribeDialog = ({ top = 0 }) => {
   const contentRef = useRef8(null);
   const [error, setError] = useState12();
   const [isLoading, setIsLoading] = useState12(false);
-  const { planPeriod, currentPlan, currentAddOns, featureUsage, cancelDate } = useMemo15(() => {
+  const { planPeriod, currentPlan, currentAddOns, featureUsage, cancelDate } = useMemo14(() => {
     const cancelDate2 = data?.subscription?.cancelAt || data?.upcomingInvoice?.dueDate;
     return {
       planPeriod: data?.company?.plan?.planPeriod || "month",
@@ -16833,7 +16740,7 @@ var UnsubscribeDialog = ({ top = 0 }) => {
     data?.upcomingInvoice?.dueDate
   ]);
   const { plans: availablePlans, addOns: availableAddOns } = useAvailablePlans(planPeriod);
-  const selectedPlan = useMemo15(
+  const selectedPlan = useMemo14(
     () => availablePlans.find((plan) => plan.id === currentPlan?.id),
     [currentPlan?.id, availablePlans]
   );
@@ -16842,7 +16749,7 @@ var UnsubscribeDialog = ({ top = 0 }) => {
     createActiveUsageBasedEntitlementsReducer(currentEntitlements, planPeriod),
     []
   );
-  const addOns = useMemo15(
+  const addOns = useMemo14(
     () => availableAddOns.map((available) => ({
       ...available,
       isSelected: currentAddOns.some((current) => available.id === current.id) ?? false
@@ -17111,7 +17018,7 @@ var Viewport = forwardRef5(
     const portalRef = useRef9(portal || document.body);
     const { data, layout, settings } = useEmbed();
     const [top, setTop] = useState13(0);
-    const { canCheckout, isBadgeVisible } = useMemo16(() => {
+    const { canCheckout, isBadgeVisible } = useMemo15(() => {
       return {
         canCheckout: data?.capabilities?.checkout ?? true,
         isBadgeVisible: !data?.capabilities?.badgeVisibility || settings.badge?.visibility !== "hidden"
@@ -17213,10 +17120,10 @@ var ButtonElement = forwardRef6(({ children, className, ...rest }, ref) => {
 ButtonElement.displayName = "Button";
 
 // src/components/elements/included-features/IncludedFeatures.tsx
-import { forwardRef as forwardRef7, useMemo as useMemo18, useRef as useRef10, useState as useState14 } from "react";
+import { forwardRef as forwardRef7, useMemo as useMemo17, useRef as useRef10, useState as useState14 } from "react";
 
 // src/components/elements/included-features/UsageDetails.tsx
-import { Fragment as Fragment14, useMemo as useMemo17 } from "react";
+import { Fragment as Fragment14, useMemo as useMemo16 } from "react";
 import { Fragment as Fragment15, jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
 var UsageDetails = ({
   entitlement,
@@ -17235,17 +17142,17 @@ var UsageDetails = ({
   } = entitlement;
   const { t: t2 } = useTranslation();
   const { data } = useEmbed();
-  const { period, showCredits } = useMemo17(() => {
+  const { period, showCredits } = useMemo16(() => {
     return {
       period: data?.company?.plan?.planPeriod || void 0,
       showCredits: data?.showCredits ?? true
     };
   }, [data?.company?.plan?.planPeriod, data?.showCredits]);
-  const { billingPrice, cost, currentTier } = useMemo17(
+  const { billingPrice, cost, currentTier } = useMemo16(
     () => getUsageDetails(entitlement, period),
     [entitlement, period]
   );
-  const text = useMemo17(() => {
+  const text = useMemo16(() => {
     if (!feature) {
       return;
     }
@@ -17321,7 +17228,7 @@ var UsageDetails = ({
     currentTier,
     showCredits
   ]);
-  const usageText = useMemo17(() => {
+  const usageText = useMemo16(() => {
     if (!feature) {
       return;
     }
@@ -17474,7 +17381,7 @@ var IncludedFeatures = forwardRef7(({ className, ...rest }, ref) => {
   const shouldWrapChildren = useWrapChildren(elementsRef);
   const isLightBackground = useIsLightBackground();
   const [showCount, setShowCount] = useState14(VISIBLE_ENTITLEMENT_COUNT);
-  const { plan, addOns, featureUsage } = useMemo18(() => {
+  const { plan, addOns, featureUsage } = useMemo17(() => {
     const orderedFeatureUsage = props.visibleFeatures?.reduce(
       (acc, id) => {
         const mappedFeatureUsage = data?.featureUsage?.features.find(
@@ -17753,7 +17660,7 @@ var Invoices = forwardRef8(({ className, data, ...rest }, ref) => {
 Invoices.displayName = "Invoices";
 
 // src/components/elements/metered-features/MeteredFeatures.tsx
-import { forwardRef as forwardRef9, useCallback as useCallback12, useMemo as useMemo19, useRef as useRef11, useState as useState16 } from "react";
+import { forwardRef as forwardRef9, useCallback as useCallback12, useMemo as useMemo18, useRef as useRef11, useState as useState16 } from "react";
 
 // src/components/elements/metered-features/Meter.tsx
 import { jsx as jsx36 } from "react/jsx-runtime";
@@ -17960,7 +17867,7 @@ var MeteredFeatures = forwardRef9(({ className, ...rest }, ref) => {
   const { t: t2 } = useTranslation();
   const { data, settings, setCheckoutState } = useEmbed();
   const isLightBackground = useIsLightBackground();
-  const meteredFeatures = useMemo19(() => {
+  const meteredFeatures = useMemo18(() => {
     const orderedFeatureUsage = props.visibleFeatures?.reduce(
       (acc, id) => {
         const mappedFeatureUsage = data?.featureUsage?.features.find(
@@ -18255,10 +18162,10 @@ var MeteredFeatures = forwardRef9(({ className, ...rest }, ref) => {
 MeteredFeatures.displayName = "MeteredFeatures";
 
 // src/components/elements/payment-method/PaymentMethod.tsx
-import { forwardRef as forwardRef10, useMemo as useMemo21 } from "react";
+import { forwardRef as forwardRef10, useMemo as useMemo20 } from "react";
 
 // src/components/elements/payment-method/PaymentMethodElement.tsx
-import { useMemo as useMemo20 } from "react";
+import { useMemo as useMemo19 } from "react";
 import { jsx as jsx39, jsxs as jsxs30 } from "react/jsx-runtime";
 var PaymentElement2 = ({
   iconName,
@@ -18378,7 +18285,7 @@ var PaymentListElement = ({
 }) => {
   const isLightBackground = useIsLightBackground();
   const { iconName, iconTitle, label, paymentLast4 } = getPaymentMethodData(paymentMethod);
-  const expirationDate = useMemo20(() => {
+  const expirationDate = useMemo19(() => {
     const { cardExpMonth, cardExpYear } = paymentMethod;
     if (!cardExpMonth || !cardExpYear) {
       return;
@@ -18466,7 +18373,7 @@ var resolveDesignProps5 = (props) => {
 var PaymentMethod = forwardRef10(({ children, className, portal, allowEdit = true, ...rest }, ref) => {
   const props = resolveDesignProps5(rest);
   const { data, setLayout } = useEmbed();
-  const { paymentMethod, monthsToExpiration } = useMemo21(() => {
+  const { paymentMethod, monthsToExpiration } = useMemo20(() => {
     const paymentMethod2 = data?.subscription?.paymentMethod || data?.company?.defaultPaymentMethod;
     let monthsToExpiration2;
     if (typeof paymentMethod2?.cardExpYear === "number" && typeof paymentMethod2?.cardExpMonth === "number") {
@@ -18653,7 +18560,7 @@ var loadStripe = function loadStripe2() {
 };
 
 // src/components/elements/payment-method/PaymentMethodDetails.tsx
-import { useCallback as useCallback13, useEffect as useEffect7, useMemo as useMemo22, useState as useState17 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect7, useMemo as useMemo21, useState as useState17 } from "react";
 import { jsx as jsx41, jsxs as jsxs31 } from "react/jsx-runtime";
 var resolveDesignProps6 = () => {
   return {
@@ -18682,7 +18589,7 @@ var PaymentMethodDetails = ({
     updatePaymentMethod,
     deletePaymentMethod
   } = useEmbed();
-  const { defaultPaymentMethod, paymentMethods, subscription } = useMemo22(() => {
+  const { defaultPaymentMethod, paymentMethods, subscription } = useMemo21(() => {
     return {
       defaultPaymentMethod: data?.company?.defaultPaymentMethod,
       paymentMethods: data?.company?.paymentMethods || [],
@@ -18713,7 +18620,7 @@ var PaymentMethodDetails = ({
     },
     autoConfirm: true
   });
-  const monthsToExpiration = useMemo22(() => {
+  const monthsToExpiration = useMemo21(() => {
     let expiration;
     if (typeof currentPaymentMethod?.cardExpYear === "number" && typeof currentPaymentMethod?.cardExpMonth === "number") {
       const now = /* @__PURE__ */ new Date();
@@ -18956,7 +18863,7 @@ var PaymentMethodDetails = ({
 };
 
 // src/components/elements/plan-manager/PlanManager.tsx
-import { forwardRef as forwardRef11, useMemo as useMemo24 } from "react";
+import { forwardRef as forwardRef11, useMemo as useMemo23 } from "react";
 
 // src/components/elements/plan-manager/AddOn.tsx
 import { jsx as jsx42, jsxs as jsxs32 } from "react/jsx-runtime";
@@ -18980,7 +18887,7 @@ var AddOn = ({ addOn, currency, layout }) => {
 };
 
 // src/components/elements/plan-manager/UsageDetails.tsx
-import { Fragment as Fragment19, useMemo as useMemo23 } from "react";
+import { Fragment as Fragment19, useMemo as useMemo22 } from "react";
 import { Fragment as Fragment20, jsx as jsx43, jsxs as jsxs33 } from "react/jsx-runtime";
 var UsageDetails2 = ({
   entitlement,
@@ -18995,11 +18902,11 @@ var UsageDetails2 = ({
     limit,
     amount = 0,
     cost = 0
-  } = useMemo23(
+  } = useMemo22(
     () => getUsageDetails(entitlement, period),
     [entitlement, period]
   );
-  const description = useMemo23(() => {
+  const description = useMemo22(() => {
     const acc = [];
     let index = 0;
     if (entitlement.priceBehavior === "overage" /* Overage */) {
@@ -19163,7 +19070,7 @@ var PlanManager = forwardRef11(({ children, className, portal, ...rest }, ref) =
     showCredits,
     showZeroPriceAsFree,
     trialPaymentMethodRequired
-  } = useMemo24(() => {
+  } = useMemo23(() => {
     return {
       currentPlan: data?.company?.plan,
       currentAddOns: data?.company?.addOns || [],
@@ -19207,7 +19114,7 @@ var PlanManager = forwardRef11(({ children, className, portal, ...rest }, ref) =
     data?.showZeroPriceAsFree,
     data?.trialPaymentMethodRequired
   ]);
-  const usageBasedEntitlements = useMemo24(
+  const usageBasedEntitlements = useMemo23(
     () => featureUsage.filter((usage) => typeof usage.priceBehavior === "string"),
     [featureUsage]
   );
@@ -19216,7 +19123,7 @@ var PlanManager = forwardRef11(({ children, className, portal, ...rest }, ref) =
     subscriptionCurrency,
     willSubscriptionCancel,
     isTrialSubscription
-  } = useMemo24(() => {
+  } = useMemo23(() => {
     const subscriptionInterval2 = billingSubscription?.interval;
     const subscriptionCurrency2 = billingSubscription?.currency;
     const isTrialSubscription2 = billingSubscription?.status === "trialing";
@@ -19534,12 +19441,12 @@ import {
   forwardRef as forwardRef12,
   useCallback as useCallback14,
   useEffect as useEffect8,
-  useMemo as useMemo27,
+  useMemo as useMemo26,
   useState as useState18
 } from "react";
 
 // src/components/elements/pricing-table/AddOn.tsx
-import { useMemo as useMemo25 } from "react";
+import { useMemo as useMemo24 } from "react";
 import { Fragment as Fragment22, jsx as jsx45, jsxs as jsxs35 } from "react/jsx-runtime";
 function renderMeteredEntitlementPricing2({
   priceBehavior,
@@ -19589,7 +19496,7 @@ var AddOn2 = ({ addOn, sharedProps, selectedPeriod }) => {
   const { t: t2 } = useTranslation();
   const { data, settings, setCheckoutState } = useEmbed();
   const isLightBackground = useIsLightBackground();
-  const { currentAddOns, canCheckout, isStandalone } = useMemo25(() => {
+  const { currentAddOns, canCheckout, isStandalone } = useMemo24(() => {
     const isStandalone2 = typeof data?.component === "undefined";
     return {
       currentAddOns: data?.company?.addOns || [],
@@ -19823,7 +19730,7 @@ var AddOn2 = ({ addOn, sharedProps, selectedPeriod }) => {
 };
 
 // src/components/elements/pricing-table/Plan.tsx
-import { useMemo as useMemo26 } from "react";
+import { useMemo as useMemo25 } from "react";
 
 // src/components/elements/pricing-table/Entitlement.tsx
 import { Fragment as Fragment23, jsx as jsx46, jsxs as jsxs36 } from "react/jsx-runtime";
@@ -20012,7 +19919,7 @@ var Plan2 = ({
     isStandalone,
     showCredits,
     showZeroPriceAsFree
-  } = useMemo26(() => {
+  } = useMemo25(() => {
     const isStandalone2 = typeof data?.component === "undefined";
     return {
       currentPeriod: data?.company?.plan?.planPeriod || "month",
@@ -20353,7 +20260,7 @@ var PricingTable = forwardRef12(({ className, ...rest }, ref) => {
     },
     []
   );
-  const { currentPeriod, isStandalone } = useMemo27(() => {
+  const { currentPeriod, isStandalone } = useMemo26(() => {
     const isStandalone2 = typeof data?.component === "undefined";
     return {
       currentPeriod: data?.company?.plan?.planPeriod || "month",
@@ -20565,7 +20472,7 @@ var TextElement = forwardRef13(({ children, className, ...rest }, ref) => {
 TextElement.displayName = "Text";
 
 // src/components/elements/unsubscribe-button/UnsubscribeButton.tsx
-import { forwardRef as forwardRef14, useMemo as useMemo28 } from "react";
+import { forwardRef as forwardRef14, useMemo as useMemo27 } from "react";
 import { jsx as jsx50 } from "react/jsx-runtime";
 var buttonStyles = {
   primary: {
@@ -20596,7 +20503,7 @@ var UnsubscribeButton = forwardRef14(({ children, className, ...rest }, ref) =>
   const props = resolveDesignProps10(rest);
   const { t: t2 } = useTranslation();
   const { data, setLayout } = useEmbed();
-  const hasActiveSubscription = useMemo28(() => {
+  const hasActiveSubscription = useMemo27(() => {
     return data?.subscription && data.subscription.status !== "cancelled" && !data.subscription.cancelAt;
   }, [data?.subscription]);
   if (!hasActiveSubscription) {
@@ -20631,7 +20538,7 @@ var UnsubscribeButton = forwardRef14(({ children, className, ...rest }, ref) =>
 UnsubscribeButton.displayName = "UnsubscribeButton";
 
 // src/components/elements/upcoming-bill/UpcomingBill.tsx
-import { forwardRef as forwardRef15, useCallback as useCallback15, useEffect as useEffect9, useMemo as useMemo29, useState as useState19 } from "react";
+import { forwardRef as forwardRef15, useCallback as useCallback15, useEffect as useEffect9, useMemo as useMemo28, useState as useState19 } from "react";
 import { jsx as jsx51, jsxs as jsxs39 } from "react/jsx-runtime";
 function resolveDesignProps11(props) {
   return {
@@ -20660,7 +20567,7 @@ var UpcomingBill = forwardRef15(({ className, ...rest }, ref) => {
   const [error, setError] = useState19();
   const [upcomingInvoice, setUpcomingInvoice] = useState19();
   const [balances, setBalances] = useState19([]);
-  const discounts = useMemo29(() => {
+  const discounts = useMemo28(() => {
     return (data?.subscription?.discounts || []).map((discount) => ({
       couponId: discount.couponId,
       customerFacingCode: discount.customerFacingCode || void 0,
@@ -25252,17 +25159,6 @@ export {
 };
 /*! Bundled license information:
 
-use-sync-external-store/cjs/use-sync-external-store-shim.development.js:
-  (**
-   * @license React
-   * use-sync-external-store-shim.development.js
-   *
-   * Copyright (c) Meta Platforms, Inc. and affiliates.
-   *
-   * This source code is licensed under the MIT license found in the
-   * LICENSE file in the root directory of this source tree.
-   *)
-
 pako/dist/pako.esm.mjs:
   (*! pako 2.1.0 https://github.com/nodeca/pako @license (MIT AND Zlib) *)
 */