@embedreach/components 0.1.22 → 0.1.24

package/dist/chunks/index.js

@@ -1,6 +1,6 @@
-import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import * as React from "react";
-import React__default, { createContext as createContext$1, Component, useReducer, useMemo, useEffect, createElement as createElement$1, forwardRef, useRef, useId as useId$2, useContext as useContext$1, useInsertionEffect, useCallback, Children, isValidElement, useLayoutEffect, useState, Fragment as Fragment$1, cloneElement } from "react";
+import React__default, { createContext as createContext$1, Component, useReducer, useMemo, useEffect, useContext as useContext$1, useCallback, useState, useRef, createElement as createElement$1, forwardRef, useId as useId$2, useInsertionEffect, Children, isValidElement, useLayoutEffect, Fragment as Fragment$1, cloneElement } from "react";
 import * as ReactDOM from "react-dom";
 import ReactDOM__default, { flushSync } from "react-dom";
 var Subscribable = class {
@@ -4486,7 +4486,7 @@ var isPlainObject = (payload) => {
 };
 var isEmptyObject = (payload) => isPlainObject(payload) && Object.keys(payload).length === 0;
 var isArray = (payload) => Array.isArray(payload);
-var isString$1 = (payload) => typeof payload === "string";
+var isString$2 = (payload) => typeof payload === "string";
 var isNumber$1 = (payload) => typeof payload === "number" && !isNaN(payload);
 var isBoolean = (payload) => typeof payload === "boolean";
 var isRegExp = (payload) => payload instanceof RegExp;
@@ -4496,7 +4496,7 @@ var isSymbol$1 = (payload) => getType(payload) === "Symbol";
 var isDate$3 = (payload) => payload instanceof Date && !isNaN(payload.valueOf());
 var isError = (payload) => payload instanceof Error;
 var isNaNValue = (payload) => typeof payload === "number" && isNaN(payload);
-var isPrimitive = (payload) => isBoolean(payload) || isNull(payload) || isUndefined(payload) || isNumber$1(payload) || isString$1(payload) || isSymbol$1(payload);
+var isPrimitive = (payload) => isBoolean(payload) || isNull(payload) || isUndefined(payload) || isNumber$1(payload) || isString$2(payload) || isSymbol$1(payload);
 var isBigint = (payload) => typeof payload === "bigint";
 var isInfinite = (payload) => payload === Infinity || payload === -Infinity;
 var isTypedArray = (payload) => ArrayBuffer.isView(payload) && !(payload instanceof DataView);
@@ -7873,7 +7873,7 @@ const createQueryClient = () => new QueryClient({
   }
 });
 const createDataContext = (reducer2, actions, defaultValue, listeners2) => {
-  const Context = React__default.createContext({
+  const Context2 = React__default.createContext({
     state: defaultValue
   });
   const Provider2 = ({ children: children2 }) => {
@@ -7905,9 +7905,9 @@ const createDataContext = (reducer2, actions, defaultValue, listeners2) => {
       () => ({ state, ...boundActions }),
       [state, boundActions]
     );
-    return /* @__PURE__ */ jsx(Context.Provider, { value: contextValue, children: children2 });
+    return /* @__PURE__ */ jsx(Context2.Provider, { value: contextValue, children: children2 });
   };
-  return { Context, Provider: Provider2 };
+  return { Context: Context2, Provider: Provider2 };
 };
 const authReducer = (state, action) => {
   switch (action.type) {
@@ -8120,6 +8120,13 @@ const applyThemeStyles = (styles2) => {
   styleElement.textContent = cssText;
   document.head.appendChild(styleElement);
 };
+const mergeThemeStyles = (themeConfig, overrides) => {
+  return {
+    ...DEFAULT_THEME_STYLES,
+    ...themeConfig?.styles || {},
+    ...{}
+  };
+};
 const themeReducer = (state, action) => {
   switch (action.type) {
     case "set_theme":
@@ -8150,7 +8157,7 @@ const themeReducer = (state, action) => {
 const setTheme = (dispatch2) => (theme2) => dispatch2({ type: "set_theme", payload: theme2 });
 const setLoading = (dispatch2) => (loading2) => dispatch2({ type: "set_loading", payload: loading2 });
 const setError = (dispatch2) => (error2) => dispatch2({ type: "set_error", payload: error2 });
-const { Provider: Provider$2 } = createDataContext(
+const { Context, Provider: Provider$2 } = createDataContext(
   themeReducer,
   {
     setTheme,
@@ -8163,6 +8170,56 @@ const { Provider: Provider$2 } = createDataContext(
     error: null
   }
 );
+const warn = (...args) => {
+  if (console?.warn) {
+    if (isString$1(args[0])) args[0] = `react-i18next:: ${args[0]}`;
+    console.warn(...args);
+  }
+};
+const alreadyWarned$1 = {};
+const warnOnce$1 = (...args) => {
+  if (isString$1(args[0]) && alreadyWarned$1[args[0]]) return;
+  if (isString$1(args[0])) alreadyWarned$1[args[0]] = /* @__PURE__ */ new Date();
+  warn(...args);
+};
+const loadedClb = (i18n, cb) => () => {
+  if (i18n.isInitialized) {
+    cb();
+  } else {
+    const initialized = () => {
+      setTimeout(() => {
+        i18n.off("initialized", initialized);
+      }, 0);
+      cb();
+    };
+    i18n.on("initialized", initialized);
+  }
+};
+const loadNamespaces = (i18n, ns, cb) => {
+  i18n.loadNamespaces(ns, loadedClb(i18n, cb));
+};
+const loadLanguages = (i18n, lng, ns, cb) => {
+  if (isString$1(ns)) ns = [ns];
+  if (i18n.options.preload && i18n.options.preload.indexOf(lng) > -1) return loadNamespaces(i18n, ns, cb);
+  ns.forEach((n2) => {
+    if (i18n.options.ns.indexOf(n2) < 0) i18n.options.ns.push(n2);
+  });
+  i18n.loadLanguages(lng, loadedClb(i18n, cb));
+};
+const hasLoadedNamespace = (ns, i18n, options = {}) => {
+  if (!i18n.languages || !i18n.languages.length) {
+    warnOnce$1("i18n.languages were undefined or empty", i18n.languages);
+    return true;
+  }
+  return i18n.hasLoadedNamespace(ns, {
+    lng: options.lng,
+    precheck: (i18nInstance2, loadNotPending) => {
+      if (options.bindI18n?.indexOf("languageChanging") > -1 && i18nInstance2.services.backendConnector.backend && i18nInstance2.isLanguageChangingTo && !loadNotPending(i18nInstance2.isLanguageChangingTo, ns)) return false;
+    }
+  });
+};
+const isString$1 = (obj) => typeof obj === "string";
+const isObject = (obj) => typeof obj === "object" && obj !== null;
 const matchHtmlEntity = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g;
 const htmlEntities = {
   "&amp;": "&",
@@ -8204,13 +8261,137 @@ const setDefaults = (options = {}) => {
     ...options
   };
 };
+const getDefaults$1 = () => defaultOptions$2;
+let i18nInstance;
+const setI18n = (instance2) => {
+  i18nInstance = instance2;
+};
+const getI18n = () => i18nInstance;
 const initReactI18next = {
   type: "3rdParty",
   init(instance2) {
     setDefaults(instance2.options.react);
+    setI18n(instance2);
   }
 };
 const I18nContext = createContext$1();
+class ReportNamespaces {
+  constructor() {
+    this.usedNamespaces = {};
+  }
+  addUsedNamespaces(namespaces) {
+    namespaces.forEach((ns) => {
+      if (!this.usedNamespaces[ns]) this.usedNamespaces[ns] = true;
+    });
+  }
+  getUsedNamespaces() {
+    return Object.keys(this.usedNamespaces);
+  }
+}
+const usePrevious$1 = (value, ignore) => {
+  const ref = useRef();
+  useEffect(() => {
+    ref.current = value;
+  }, [value, ignore]);
+  return ref.current;
+};
+const alwaysNewT = (i18n, language, namespace, keyPrefix) => i18n.getFixedT(language, namespace, keyPrefix);
+const useMemoizedT = (i18n, language, namespace, keyPrefix) => useCallback(alwaysNewT(i18n, language, namespace, keyPrefix), [i18n, language, namespace, keyPrefix]);
+const useTranslation = (ns, props = {}) => {
+  const {
+    i18n: i18nFromProps
+  } = props;
+  const {
+    i18n: i18nFromContext,
+    defaultNS: defaultNSFromContext
+  } = useContext$1(I18nContext) || {};
+  const i18n = i18nFromProps || i18nFromContext || getI18n();
+  if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();
+  if (!i18n) {
+    warnOnce$1("You will need to pass in an i18next instance by using initReactI18next");
+    const notReadyT = (k3, optsOrDefaultValue) => {
+      if (isString$1(optsOrDefaultValue)) return optsOrDefaultValue;
+      if (isObject(optsOrDefaultValue) && isString$1(optsOrDefaultValue.defaultValue)) return optsOrDefaultValue.defaultValue;
+      return Array.isArray(k3) ? k3[k3.length - 1] : k3;
+    };
+    const retNotReady = [notReadyT, {}, false];
+    retNotReady.t = notReadyT;
+    retNotReady.i18n = {};
+    retNotReady.ready = false;
+    return retNotReady;
+  }
+  if (i18n.options.react?.wait) warnOnce$1("It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.");
+  const i18nOptions = {
+    ...getDefaults$1(),
+    ...i18n.options.react,
+    ...props
+  };
+  const {
+    useSuspense,
+    keyPrefix
+  } = i18nOptions;
+  let namespaces = defaultNSFromContext || i18n.options?.defaultNS;
+  namespaces = isString$1(namespaces) ? [namespaces] : namespaces || ["translation"];
+  i18n.reportNamespaces.addUsedNamespaces?.(namespaces);
+  const ready = (i18n.isInitialized || i18n.initializedStoreOnce) && namespaces.every((n2) => hasLoadedNamespace(n2, 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 [t3, setT] = useState(getT);
+  let joinedNS = namespaces.join();
+  if (props.lng) joinedNS = `${props.lng}${joinedNS}`;
+  const previousJoinedNS = usePrevious$1(joinedNS);
+  const isMounted = useRef(true);
+  useEffect(() => {
+    const {
+      bindI18n,
+      bindI18nStore
+    } = i18nOptions;
+    isMounted.current = true;
+    if (!ready && !useSuspense) {
+      if (props.lng) {
+        loadLanguages(i18n, props.lng, namespaces, () => {
+          if (isMounted.current) setT(getNewT);
+        });
+      } else {
+        loadNamespaces(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, boundReset);
+    if (bindI18nStore) i18n?.store.on(bindI18nStore, boundReset);
+    return () => {
+      isMounted.current = false;
+      if (i18n) bindI18n?.split(" ").forEach((e4) => i18n.off(e4, boundReset));
+      if (bindI18nStore && i18n) bindI18nStore.split(" ").forEach((e4) => i18n.store.off(e4, boundReset));
+    };
+  }, [i18n, joinedNS]);
+  useEffect(() => {
+    if (isMounted.current && ready) {
+      setT(getT);
+    }
+  }, [i18n, keyPrefix, ready]);
+  const ret = [t3, i18n, ready];
+  ret.t = t3;
+  ret.i18n = i18n;
+  ret.ready = ready;
+  if (ready) return ret;
+  if (!ready && !useSuspense) return ret;
+  throw new Promise((resolve) => {
+    if (props.lng) {
+      loadLanguages(i18n, props.lng, namespaces, () => resolve());
+    } else {
+      loadNamespaces(i18n, namespaces, () => resolve());
+    }
+  });
+};
 function I18nextProvider({
   i18n,
   defaultNS,
@@ -11696,6 +11877,167 @@ const I18nProvider = ({
   }, [initialLanguage]);
   return /* @__PURE__ */ jsx(I18nextProvider, { i18n: instance, children: children2 });
 };
+const useThemeContext = () => {
+  const context = useContext$1(Context);
+  if (context === void 0) {
+    throw new Error("useThemeContext must be used within a ThemeProvider");
+  }
+  const applyTheme = (themeConfig) => {
+    if (!themeConfig) return;
+    const mergedStyles = mergeThemeStyles(themeConfig);
+    const finalTheme = {
+      styles: mergedStyles
+    };
+    context.setTheme(finalTheme);
+  };
+  return {
+    ...context.state,
+    setTheme: context.setTheme,
+    setLoading: context.setLoading,
+    setError: context.setError,
+    // Add the helper function
+    applyTheme
+  };
+};
+const H3 = ({ children: children2 }) => {
+  return /* @__PURE__ */ jsx("h3", { className: "scroll-m-20 text-2xl font-semibold tracking-tight", children: children2 });
+};
+const SpinLoader = ({
+  size: size2 = 35,
+  color: color2 = "black",
+  speed = 0.9,
+  strokeWidth = 3.5,
+  text,
+  textSpeed = 2e3,
+  // Default 2 seconds per text
+  textColor = "black"
+}) => {
+  const [currentTextIndex, setCurrentTextIndex] = useState(0);
+  const textArray = Array.isArray(text) ? text : text ? [text] : [];
+  useEffect(() => {
+    if (textArray.length <= 1) return;
+    if (currentTextIndex >= textArray.length - 1) return;
+    const interval = setInterval(() => {
+      setCurrentTextIndex(
+        (current) => current < textArray.length - 1 ? current + 1 : current
+      );
+    }, textSpeed);
+    return () => clearInterval(interval);
+  }, [textArray.length, textSpeed, currentTextIndex]);
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col justify-center items-center h-full", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-4", children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "loader-container",
+        style: {
+          "--uib-size": `${size2}px`,
+          "--uib-color": color2,
+          "--uib-speed": `${speed}s`,
+          "--uib-stroke": `${strokeWidth}px`
+        },
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "line" }),
+          /* @__PURE__ */ jsx("div", { className: "line" }),
+          /* @__PURE__ */ jsx("div", { className: "line" }),
+          /* @__PURE__ */ jsx("div", { className: "line" }),
+          /* @__PURE__ */ jsx("div", { className: "line" }),
+          /* @__PURE__ */ jsx("div", { className: "line" })
+        ]
+      }
+    ),
+    textArray.length > 0 && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `text-center text-sm text-muted-foreground animate-fade-in ${textColor ? `text-${textColor}` : ""}`,
+        children: /* @__PURE__ */ jsx(H3, { children: textArray[currentTextIndex] })
+      },
+      currentTextIndex
+    ),
+    /* @__PURE__ */ jsx("style", { children: `
+          .loader-container {
+            position: relative;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            height: var(--uib-size);
+            width: var(--uib-size);
+          }
+          .line {
+            position: absolute;
+            top: calc(50% - var(--uib-stroke) / 2);
+            left: 0;
+            height: var(--uib-stroke);
+            width: 100%;
+            border-radius: calc(var(--uib-stroke) / 2);
+            background-color: var(--uib-color);
+            animation: rotate var(--uib-speed) ease-in-out infinite;
+            transition: background-color 0.3s ease;
+          }
+          .line:nth-child(1) {
+            animation-delay: calc(var(--uib-speed) * -0.375);
+          }
+          .line:nth-child(2) {
+            animation-delay: calc(var(--uib-speed) * -0.375);
+            opacity: 0.8;
+          }
+          .line:nth-child(3) {
+            animation-delay: calc(var(--uib-speed) * -0.3);
+            opacity: 0.6;
+          }
+          .line:nth-child(4) {
+            animation-delay: calc(var(--uib-speed) * -0.225);
+            opacity: 0.4;
+          }
+          .line:nth-child(5) {
+            animation-delay: calc(var(--uib-speed) * -0.15);
+            opacity: 0.2;
+          }
+          .line:nth-child(6) {
+            animation-delay: calc(var(--uib-speed) * -0.075);
+            opacity: 0.1;
+          }
+          @keyframes rotate {
+            0% {
+              transform: rotate(0deg);
+            }
+            100% {
+              transform: rotate(180deg);
+            }
+          }
+          .animate-fade-in {
+            animation: fadeIn 0.5s ease-in-out;
+          }
+          @keyframes fadeIn {
+            from {
+              opacity: 0;
+              transform: translateY(5px);
+            }
+            to {
+              opacity: 1;
+              transform: translateY(0);
+            }
+          }
+        ` })
+  ] }) });
+};
+const ReachProviderThemeProvider = ({
+  children: children2,
+  theme: theme2
+}) => {
+  const { t: t3 } = useTranslation();
+  const { loading: themeLoading, applyTheme } = useThemeContext();
+  const themeApplied = useRef(false);
+  useEffect(() => {
+    if (!themeApplied.current && theme2) {
+      applyTheme(theme2);
+      themeApplied.current = true;
+    }
+  }, [applyTheme, theme2]);
+  if (themeLoading && theme2) {
+    return /* @__PURE__ */ jsx("div", { className: "flex flex-col justify-center items-center h-screen", children: /* @__PURE__ */ jsx(SpinLoader, { text: [t3("loading")] }) });
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: children2 });
+};
 const TOAST_LIMIT = 1;
 const TOAST_REMOVE_DELAY = 1e6;
 let count$2 = 0;
@@ -11855,15 +12197,15 @@ function useComposedRefs(...refs) {
   return React.useCallback(composeRefs(...refs), refs);
 }
 function createContext2(rootComponentName, defaultContext) {
-  const Context = React.createContext(defaultContext);
+  const Context2 = React.createContext(defaultContext);
   const Provider2 = (props) => {
     const { children: children2, ...context } = props;
     const value = React.useMemo(() => context, Object.values(context));
-    return /* @__PURE__ */ jsx(Context.Provider, { value, children: children2 });
+    return /* @__PURE__ */ jsx(Context2.Provider, { value, children: children2 });
   };
   Provider2.displayName = rootComponentName + "Provider";
   function useContext2(consumerName) {
-    const context = React.useContext(Context);
+    const context = React.useContext(Context2);
     if (context) return context;
     if (defaultContext !== void 0) return defaultContext;
     throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
@@ -11878,14 +12220,14 @@ function createContextScope(scopeName, createContextScopeDeps = []) {
     defaultContexts = [...defaultContexts, defaultContext];
     const Provider2 = (props) => {
       const { scope, children: children2, ...context } = props;
-      const Context = scope?.[scopeName]?.[index2] || BaseContext;
+      const Context2 = scope?.[scopeName]?.[index2] || BaseContext;
       const value = React.useMemo(() => context, Object.values(context));
-      return /* @__PURE__ */ jsx(Context.Provider, { value, children: children2 });
+      return /* @__PURE__ */ jsx(Context2.Provider, { value, children: children2 });
     };
     Provider2.displayName = rootComponentName + "Provider";
     function useContext2(consumerName, scope) {
-      const Context = scope?.[scopeName]?.[index2] || BaseContext;
-      const context = React.useContext(Context);
+      const Context2 = scope?.[scopeName]?.[index2] || BaseContext;
+      const context = React.useContext(Context2);
       if (context) return context;
       if (defaultContext !== void 0) return defaultContext;
       throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
@@ -16211,7 +16553,8 @@ const ReachProvider = ({
   authToken: authToken2,
   tenantExternalId,
   language,
-  children: children2
+  children: children2,
+  theme: theme2
 }) => {
   const [queryClient] = React__default.useState(() => {
     if (authToken2) {
@@ -16241,7 +16584,7 @@ const ReachProvider = ({
           sendEventsOnFlagRead: true
         },
         children: /* @__PURE__ */ jsx(I18nProvider, { initialLanguage: language, children: /* @__PURE__ */ jsx(Provider$2, { children: /* @__PURE__ */ jsxs(Provider$3, { children: [
-          children2,
+          /* @__PURE__ */ jsx(ReachProviderThemeProvider, { theme: theme2, children: children2 }),
           /* @__PURE__ */ jsx(Toaster, {})
         ] }) }) })
       }
@@ -23612,127 +23955,6 @@ const BlurDiv = ({ children: children2, className: className2, key }) => {
     key
   );
 };
-const H3 = ({ children: children2 }) => {
-  return /* @__PURE__ */ jsx("h3", { className: "scroll-m-20 text-2xl font-semibold tracking-tight", children: children2 });
-};
-const SpinLoader = ({
-  size: size2 = 35,
-  color: color2 = "black",
-  speed = 0.9,
-  strokeWidth = 3.5,
-  text,
-  textSpeed = 2e3,
-  // Default 2 seconds per text
-  textColor = "black"
-}) => {
-  const [currentTextIndex, setCurrentTextIndex] = useState(0);
-  const textArray = Array.isArray(text) ? text : text ? [text] : [];
-  useEffect(() => {
-    if (textArray.length <= 1) return;
-    if (currentTextIndex >= textArray.length - 1) return;
-    const interval = setInterval(() => {
-      setCurrentTextIndex(
-        (current) => current < textArray.length - 1 ? current + 1 : current
-      );
-    }, textSpeed);
-    return () => clearInterval(interval);
-  }, [textArray.length, textSpeed, currentTextIndex]);
-  return /* @__PURE__ */ jsx("div", { className: "flex flex-col justify-center items-center h-full", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-4", children: [
-    /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: "loader-container",
-        style: {
-          "--uib-size": `${size2}px`,
-          "--uib-color": color2,
-          "--uib-speed": `${speed}s`,
-          "--uib-stroke": `${strokeWidth}px`
-        },
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "line" }),
-          /* @__PURE__ */ jsx("div", { className: "line" }),
-          /* @__PURE__ */ jsx("div", { className: "line" }),
-          /* @__PURE__ */ jsx("div", { className: "line" }),
-          /* @__PURE__ */ jsx("div", { className: "line" }),
-          /* @__PURE__ */ jsx("div", { className: "line" })
-        ]
-      }
-    ),
-    textArray.length > 0 && /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: `text-center text-sm text-muted-foreground animate-fade-in ${textColor ? `text-${textColor}` : ""}`,
-        children: /* @__PURE__ */ jsx(H3, { children: textArray[currentTextIndex] })
-      },
-      currentTextIndex
-    ),
-    /* @__PURE__ */ jsx("style", { children: `
-          .loader-container {
-            position: relative;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            height: var(--uib-size);
-            width: var(--uib-size);
-          }
-          .line {
-            position: absolute;
-            top: calc(50% - var(--uib-stroke) / 2);
-            left: 0;
-            height: var(--uib-stroke);
-            width: 100%;
-            border-radius: calc(var(--uib-stroke) / 2);
-            background-color: var(--uib-color);
-            animation: rotate var(--uib-speed) ease-in-out infinite;
-            transition: background-color 0.3s ease;
-          }
-          .line:nth-child(1) {
-            animation-delay: calc(var(--uib-speed) * -0.375);
-          }
-          .line:nth-child(2) {
-            animation-delay: calc(var(--uib-speed) * -0.375);
-            opacity: 0.8;
-          }
-          .line:nth-child(3) {
-            animation-delay: calc(var(--uib-speed) * -0.3);
-            opacity: 0.6;
-          }
-          .line:nth-child(4) {
-            animation-delay: calc(var(--uib-speed) * -0.225);
-            opacity: 0.4;
-          }
-          .line:nth-child(5) {
-            animation-delay: calc(var(--uib-speed) * -0.15);
-            opacity: 0.2;
-          }
-          .line:nth-child(6) {
-            animation-delay: calc(var(--uib-speed) * -0.075);
-            opacity: 0.1;
-          }
-          @keyframes rotate {
-            0% {
-              transform: rotate(0deg);
-            }
-            100% {
-              transform: rotate(180deg);
-            }
-          }
-          .animate-fade-in {
-            animation: fadeIn 0.5s ease-in-out;
-          }
-          @keyframes fadeIn {
-            from {
-              opacity: 0;
-              transform: translateY(5px);
-            }
-            to {
-              opacity: 1;
-              transform: translateY(0);
-            }
-          }
-        ` })
-  ] }) });
-};
 const BUSINESS_SEGMENT_PATH = "/segments";
 const BUSINESS_AUTOMATION_PATH = "/automations";
 const CHANNEL_SENDER_PATH = "/channel/senders";
@@ -33451,19 +33673,19 @@ function $6ed0406888f73fc4$export$c7b2cbe3552a0d05(...refs) {
   return useCallback($6ed0406888f73fc4$export$43e446d32b3d21af(...refs), refs);
 }
 function $c512c27ab02ef895$export$fd42f52fd3ae1109(rootComponentName, defaultContext) {
-  const Context = /* @__PURE__ */ createContext$1(defaultContext);
+  const Context2 = /* @__PURE__ */ createContext$1(defaultContext);
   function Provider2(props) {
     const { children: children2, ...context } = props;
     const value = useMemo(
       () => context,
       Object.values(context)
     );
-    return /* @__PURE__ */ createElement$1(Context.Provider, {
+    return /* @__PURE__ */ createElement$1(Context2.Provider, {
       value
     }, children2);
   }
   function useContext2(consumerName) {
-    const context = useContext$1(Context);
+    const context = useContext$1(Context2);
     if (context) return context;
     if (defaultContext !== void 0) return defaultContext;
     throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
@@ -33485,18 +33707,18 @@ function $c512c27ab02ef895$export$50c7b4e9d9f19c1(scopeName, createContextScopeD
     ];
     function Provider2(props) {
       const { scope, children: children2, ...context } = props;
-      const Context = (scope === null || scope === void 0 ? void 0 : scope[scopeName][index2]) || BaseContext;
+      const Context2 = (scope === null || scope === void 0 ? void 0 : scope[scopeName][index2]) || BaseContext;
       const value = useMemo(
         () => context,
         Object.values(context)
       );
-      return /* @__PURE__ */ createElement$1(Context.Provider, {
+      return /* @__PURE__ */ createElement$1(Context2.Provider, {
         value
       }, children2);
     }
     function useContext2(consumerName, scope) {
-      const Context = (scope === null || scope === void 0 ? void 0 : scope[scopeName][index2]) || BaseContext;
-      const context = useContext$1(Context);
+      const Context2 = (scope === null || scope === void 0 ? void 0 : scope[scopeName][index2]) || BaseContext;
+      const context = useContext$1(Context2);
       if (context) return context;
       if (defaultContext !== void 0) return defaultContext;
       throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);