@cuemath/leap 3.3.8-m → 3.3.8

package/dist/features/ui/arrow-tooltip/arrow-tooltip-styled.js

@@ -1,5 +1,5 @@
-import i from "styled-components";
-const e = i.div`
+import o from "styled-components";
+const i = o.div`
   position: absolute;
   top: 0;
   left: 0;
@@ -8,13 +8,8 @@ const e = i.div`
   width: 100%;
   height: 100%;
   z-index: ${({ theme: t }) => t.zIndex.JOURNEY_OVERLAY};
-`, n = i.div`
-  visibility: ${({ $visible: t }) => t ? "visible" : "hidden"};
-  opacity: ${({ $visible: t }) => t ? 1 : 0};
-  pointer-events: ${({ $visible: t }) => t ? "auto" : "none"};
 `;
 export {
-  e as BackgroundOverlay,
-  n as TooltipWrapper
+  i as BackgroundOverlay
 };
 //# sourceMappingURL=arrow-tooltip-styled.js.map

package/dist/features/ui/arrow-tooltip/arrow-tooltip-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"arrow-tooltip-styled.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const BackgroundOverlay = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  width: 100%;\n  height: 100%;\n  z-index: ${({ theme }) => theme.zIndex.JOURNEY_OVERLAY};\n`;\n\nexport const TooltipWrapper = styled.div<{ $visible: boolean }>`\n  visibility: ${({ $visible }) => ($visible ? 'visible' : 'hidden')};\n  opacity: ${({ $visible }) => ($visible ? 1 : 0)};\n  pointer-events: ${({ $visible }) => ($visible ? 'auto' : 'none')};\n`;\n"],"names":["BackgroundOverlay","styled","theme","TooltipWrapper","$visible"],"mappings":";AAEO,MAAMA,IAAoBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAQ3B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,eAAe;AAAA,GAG3CC,IAAiBF,EAAO;AAAA,gBACrB,CAAC,EAAE,UAAAG,EAAA,MAAgBA,IAAW,YAAY,QAAS;AAAA,aACtD,CAAC,EAAE,UAAAA,EAAA,MAAgBA,IAAW,IAAI,CAAE;AAAA,oBAC7B,CAAC,EAAE,UAAAA,EAAA,MAAgBA,IAAW,SAAS,MAAO;AAAA;"}
+{"version":3,"file":"arrow-tooltip-styled.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const BackgroundOverlay = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  width: 100%;\n  height: 100%;\n  z-index: ${({ theme }) => theme.zIndex.JOURNEY_OVERLAY};\n`;\n"],"names":["BackgroundOverlay","styled","theme"],"mappings":";AAEO,MAAMA,IAAoBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAQ3B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,eAAe;AAAA;"}

package/dist/features/ui/arrow-tooltip/arrow-tooltip.js

@@ -1,53 +1,53 @@
-import { jsxs as j, Fragment as D, jsx as e } from "react/jsx-runtime";
-import U from "../../../node_modules/lodash.throttle/index.js";
-import { memo as Y, useRef as H, useState as a, useCallback as f, useEffect as m } from "react";
+import { jsxs as D, Fragment as U, jsx as e } from "react/jsx-runtime";
+import W from "../../../node_modules/lodash.throttle/index.js";
+import { memo as Y, useRef as H, useState as f, useCallback as p, useEffect as m } from "react";
 import $ from "../layout/flex-view.js";
 import P from "../portal/portal.js";
 import { THROTTLE_DURATION as Z, DEFAULT_ARROW_SIZE as q } from "./arrow-tooltip-constants.js";
-import { TooltipWrapper as G, BackgroundOverlay as J } from "./arrow-tooltip-styled.js";
-import { computeTooltipNewCoOrdinates as K } from "./arrow-tooltip-util.js";
-import Q from "./comps/tooltip-body.js";
-const V = ({
+import { BackgroundOverlay as G } from "./arrow-tooltip-styled.js";
+import { computeTooltipNewCoOrdinates as J } from "./arrow-tooltip-util.js";
+import K from "./comps/tooltip-body.js";
+const Q = ({
   isAnimated: C,
   alwaysVisible: o = !1,
   arrowColor: O,
   arrowSize: w = q,
-  arrowXCoOrdinates: T,
-  arrowYCoOrdinates: v,
-  backgroundColor: E,
-  borderColor: h,
-  children: R,
+  arrowXCoOrdinates: E,
+  arrowYCoOrdinates: T,
+  backgroundColor: v,
+  borderColor: R,
+  children: h,
   hidden: t,
   position: l,
   renderAs: A,
   textVariant: L,
   tooltipItem: g,
   tooltipOffset: x,
-  tooltipXCoOrdinates: b,
-  tooltipYCoOrdinates: z,
-  width: I,
+  tooltipXCoOrdinates: z,
+  tooltipYCoOrdinates: I,
+  width: b,
   widthX: k,
   zIndex: B,
   parentWidth: F,
   isBlocking: M = !1
 }) => {
-  const d = H(null), [N, u] = a(o), [S, W] = a(
+  const u = H(null), [N, d] = f(o), [S, X] = f(
     null
-  ), s = f(
+  ), s = p(
     (n, i) => {
-      W(n), u(i);
+      X(n), d(i);
     },
     []
-  ), X = f(() => {
+  ), _ = p(() => {
     if (t || o)
       return null;
     s(null, !1);
-  }, [o, s, t]), r = U(() => {
-    var p;
-    const { current: n } = d;
+  }, [o, s, t]), r = W(() => {
+    var a;
+    const { current: n } = u;
     if (t || !n) return null;
-    const i = (p = n.children[0]) == null ? void 0 : p.getBoundingClientRect(), _ = i ? K(l, i) : null;
-    return s(_, !0), null;
+    const i = (a = n.children[0]) == null ? void 0 : a.getBoundingClientRect(), j = i ? J(l, i) : null;
+    return s(j, !0), null;
   }, Z);
   m(() => {
     if (!(!o || t))
@@ -55,46 +55,46 @@ const V = ({
         window.removeEventListener("scroll", r, !0), window.removeEventListener("resize", r);
       };
   }, [o, t, l, r]), m(() => {
-    t && u(!1), o && r();
+    t && d(!1), o && r();
   }, [o, t]);
   const c = /* @__PURE__ */ e(
-    Q,
+    K,
     {
       $arrowSize: w,
-      $arrowXCoOrdinates: T,
-      $arrowYCoOrdinates: v,
+      $arrowXCoOrdinates: E,
+      $arrowYCoOrdinates: T,
       $position: l,
       $renderAs: A,
       $tooltipCoOrdinates: S,
       $tooltipOffset: x,
-      $tooltipXCoOrdinates: b,
-      $tooltipYCoOrdinates: z,
+      $tooltipXCoOrdinates: z,
+      $tooltipYCoOrdinates: I,
       $zIndex: B,
-      $backgroundColor: E,
+      $backgroundColor: v,
       $arrowColor: O,
-      $borderColor: h,
+      $borderColor: R,
       $isAnimated: C,
-      $width: I,
+      $width: b,
       $widthX: k,
       textVariant: L || "body3",
       children: g
     }
   );
-  return /* @__PURE__ */ j(D, { children: [
+  return /* @__PURE__ */ D(U, { children: [
     /* @__PURE__ */ e(
       $,
       {
         $width: F || "fit-content",
-        ref: d,
+        ref: u,
         onMouseEnter: r,
-        onMouseLeave: X,
-        children: /* @__PURE__ */ e($, { children: R })
+        onMouseLeave: _,
+        children: /* @__PURE__ */ e($, { children: h })
       }
     ),
-    /* @__PURE__ */ e(P, { portalId: "tooltip-root", children: /* @__PURE__ */ e(G, { $visible: N, children: M ? /* @__PURE__ */ e(J, { children: c }) : c }) })
+    N && /* @__PURE__ */ e(P, { portalId: "tooltip-root", children: M ? /* @__PURE__ */ e(G, { children: c }) : c })
   ] });
-}, uo = Y(V);
+}, so = Y(Q);
 export {
-  uo as default
+  so as default
 };
 //# sourceMappingURL=arrow-tooltip.js.map

package/dist/features/ui/arrow-tooltip/arrow-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"arrow-tooltip.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip.tsx"],"sourcesContent":["import type {\n  IArrowTooltipProps,\n  THandleVisibleNCoOrdinatesProps,\n  TTooltipCoOrdinatesProps,\n} from './arrow-tooltip-types';\n\nimport throttle from 'lodash.throttle';\nimport { useState, type FC, useCallback, useRef, useEffect, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Portal from '../portal/portal';\nimport { DEFAULT_ARROW_SIZE, THROTTLE_DURATION } from './arrow-tooltip-constants';\nimport * as Styled from './arrow-tooltip-styled';\nimport { computeTooltipNewCoOrdinates } from './arrow-tooltip-util';\nimport TooltipBody from './comps/tooltip-body';\n\nconst ArrowTooltip: FC<IArrowTooltipProps> = ({\n  isAnimated,\n  alwaysVisible = false,\n  arrowColor,\n  arrowSize = DEFAULT_ARROW_SIZE,\n  arrowXCoOrdinates,\n  arrowYCoOrdinates,\n  backgroundColor,\n  borderColor,\n  children,\n  hidden,\n  position,\n  renderAs,\n  textVariant,\n  tooltipItem,\n  tooltipOffset,\n  tooltipXCoOrdinates,\n  tooltipYCoOrdinates,\n  width,\n  widthX,\n  zIndex,\n  parentWidth,\n  isBlocking = false,\n}) => {\n  const tooltipWrapperRef = useRef<HTMLDivElement>(null);\n  const [visible, setVisible] = useState(alwaysVisible);\n  const [tooltipCoOrdinates, setTooltipCoOrdinates] = useState<TTooltipCoOrdinatesProps | null>(\n    null,\n  );\n\n  const handleVisibleNCoOrdinates: THandleVisibleNCoOrdinatesProps = useCallback(\n    (newCoOrdinates, visibility) => {\n      setTooltipCoOrdinates(newCoOrdinates);\n      setVisible(visibility);\n    },\n    [],\n  );\n\n  const handleVisibility = useCallback(() => {\n    if (hidden || alwaysVisible) {\n      return null;\n    }\n\n    handleVisibleNCoOrdinates(null, false);\n\n    return;\n  }, [alwaysVisible, handleVisibleNCoOrdinates, hidden]);\n\n  const handleOnMouseEnter = throttle(() => {\n    const { current } = tooltipWrapperRef;\n\n    if (hidden || !current) return null;\n\n    const boundingClientRect = current.children[0]?.getBoundingClientRect();\n    const newCoOrdinates = boundingClientRect\n      ? computeTooltipNewCoOrdinates(position, boundingClientRect)\n      : null;\n\n    handleVisibleNCoOrdinates(newCoOrdinates, true);\n\n    return null;\n  }, THROTTLE_DURATION);\n\n  useEffect(() => {\n    if (!alwaysVisible || hidden) return;\n\n    window.addEventListener('scroll', handleOnMouseEnter, true);\n    window.addEventListener('resize', handleOnMouseEnter);\n\n    return () => {\n      window.removeEventListener('scroll', handleOnMouseEnter, true);\n      window.removeEventListener('resize', handleOnMouseEnter);\n    };\n  }, [alwaysVisible, hidden, position, handleOnMouseEnter]);\n\n  useEffect(() => {\n    if (hidden) {\n      setVisible(false);\n    }\n\n    if (alwaysVisible) {\n      handleOnMouseEnter();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [alwaysVisible, hidden]);\n\n  const tooltipContent = (\n    <TooltipBody\n      $arrowSize={arrowSize}\n      $arrowXCoOrdinates={arrowXCoOrdinates}\n      $arrowYCoOrdinates={arrowYCoOrdinates}\n      $position={position}\n      $renderAs={renderAs}\n      $tooltipCoOrdinates={tooltipCoOrdinates}\n      $tooltipOffset={tooltipOffset}\n      $tooltipXCoOrdinates={tooltipXCoOrdinates}\n      $tooltipYCoOrdinates={tooltipYCoOrdinates}\n      $zIndex={zIndex}\n      $backgroundColor={backgroundColor}\n      $arrowColor={arrowColor}\n      $borderColor={borderColor}\n      $isAnimated={isAnimated}\n      $width={width}\n      $widthX={widthX}\n      textVariant={textVariant || 'body3'}\n    >\n      {tooltipItem}\n    </TooltipBody>\n  );\n\n  return (\n    <>\n      <FlexView\n        $width={parentWidth || 'fit-content'}\n        ref={tooltipWrapperRef}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleVisibility}\n      >\n        <FlexView>{children}</FlexView>\n      </FlexView>\n\n      <Portal portalId=\"tooltip-root\">\n        <Styled.TooltipWrapper $visible={visible}>\n          {isBlocking ? (\n            <Styled.BackgroundOverlay>{tooltipContent}</Styled.BackgroundOverlay>\n          ) : (\n            tooltipContent\n          )}\n        </Styled.TooltipWrapper>\n      </Portal>\n    </>\n  );\n};\n\nexport default memo(ArrowTooltip);\n"],"names":["ArrowTooltip","isAnimated","alwaysVisible","arrowColor","arrowSize","DEFAULT_ARROW_SIZE","arrowXCoOrdinates","arrowYCoOrdinates","backgroundColor","borderColor","children","hidden","position","renderAs","textVariant","tooltipItem","tooltipOffset","tooltipXCoOrdinates","tooltipYCoOrdinates","width","widthX","zIndex","parentWidth","isBlocking","tooltipWrapperRef","useRef","visible","setVisible","useState","tooltipCoOrdinates","setTooltipCoOrdinates","handleVisibleNCoOrdinates","useCallback","newCoOrdinates","visibility","handleVisibility","handleOnMouseEnter","throttle","current","boundingClientRect","_a","computeTooltipNewCoOrdinates","THROTTLE_DURATION","useEffect","tooltipContent","jsx","TooltipBody","jsxs","Fragment","FlexView","Portal","Styled.TooltipWrapper","Styled.BackgroundOverlay","ArrowTooltip$1","memo"],"mappings":";;;;;;;;;AAgBA,MAAMA,IAAuC,CAAC;AAAA,EAC5C,YAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,YAAAC;AAAA,EACA,WAAAC,IAAYC;AAAA,EACZ,mBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAa;AACf,MAAM;AACE,QAAAC,IAAoBC,EAAuB,IAAI,GAC/C,CAACC,GAASC,CAAU,IAAIC,EAAS1B,CAAa,GAC9C,CAAC2B,GAAoBC,CAAqB,IAAIF;AAAA,IAClD;AAAA,EAAA,GAGIG,IAA6DC;AAAA,IACjE,CAACC,GAAgBC,MAAe;AAC9B,MAAAJ,EAAsBG,CAAc,GACpCN,EAAWO,CAAU;AAAA,IACvB;AAAA,IACA,CAAC;AAAA,EAAA,GAGGC,IAAmBH,EAAY,MAAM;AACzC,QAAIrB,KAAUT;AACL,aAAA;AAGT,IAAA6B,EAA0B,MAAM,EAAK;AAAA,EAGpC,GAAA,CAAC7B,GAAe6B,GAA2BpB,CAAM,CAAC,GAE/CyB,IAAqBC,EAAS,MAAM;;AAClC,UAAA,EAAE,SAAAC,EAAY,IAAAd;AAEhB,QAAAb,KAAU,CAAC2B,EAAgB,QAAA;AAE/B,UAAMC,KAAqBC,IAAAF,EAAQ,SAAS,CAAC,MAAlB,gBAAAE,EAAqB,yBAC1CP,IAAiBM,IACnBE,EAA6B7B,GAAU2B,CAAkB,IACzD;AAEJ,WAAAR,EAA0BE,GAAgB,EAAI,GAEvC;AAAA,KACNS,CAAiB;AAEpB,EAAAC,EAAU,MAAM;AACV,QAAA,GAACzC,KAAiBS;AAEf,oBAAA,iBAAiB,UAAUyB,GAAoB,EAAI,GACnD,OAAA,iBAAiB,UAAUA,CAAkB,GAE7C,MAAM;AACJ,eAAA,oBAAoB,UAAUA,GAAoB,EAAI,GACtD,OAAA,oBAAoB,UAAUA,CAAkB;AAAA,MAAA;AAAA,KAExD,CAAClC,GAAeS,GAAQC,GAAUwB,CAAkB,CAAC,GAExDO,EAAU,MAAM;AACd,IAAIhC,KACFgB,EAAW,EAAK,GAGdzB,KACiBkC;EACrB,GAEC,CAAClC,GAAeS,CAAM,CAAC;AAE1B,QAAMiC,IACJ,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,YAAY1C;AAAA,MACZ,oBAAoBE;AAAA,MACpB,oBAAoBC;AAAA,MACpB,WAAWK;AAAA,MACX,WAAWC;AAAA,MACX,qBAAqBgB;AAAA,MACrB,gBAAgBb;AAAA,MAChB,sBAAsBC;AAAA,MACtB,sBAAsBC;AAAA,MACtB,SAASG;AAAA,MACT,kBAAkBb;AAAA,MAClB,aAAaL;AAAA,MACb,cAAcM;AAAA,MACd,aAAaR;AAAA,MACb,QAAQkB;AAAA,MACR,SAASC;AAAA,MACT,aAAaN,KAAe;AAAA,MAE3B,UAAAC;AAAA,IAAA;AAAA,EAAA;AAIL,SAEI,gBAAAgC,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,QAAQ3B,KAAe;AAAA,QACvB,KAAKE;AAAA,QACL,cAAcY;AAAA,QACd,cAAcD;AAAA,QAEd,UAAA,gBAAAU,EAACI,KAAU,UAAAvC,EAAS,CAAA;AAAA,MAAA;AAAA,IACtB;AAAA,sBAECwC,GAAO,EAAA,UAAS,gBACf,UAAC,gBAAAL,EAAAM,GAAA,EAAsB,UAAUzB,GAC9B,UAAAH,sBACE6B,GAAA,EAA0B,UAAeR,GAAA,IAE1CA,EAEJ,CAAA,GACF;AAAA,EACF,EAAA,CAAA;AAEJ,GAEeS,KAAAC,EAAKtD,CAAY;"}
+{"version":3,"file":"arrow-tooltip.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip.tsx"],"sourcesContent":["import type {\n  IArrowTooltipProps,\n  THandleVisibleNCoOrdinatesProps,\n  TTooltipCoOrdinatesProps,\n} from './arrow-tooltip-types';\n\nimport throttle from 'lodash.throttle';\nimport { useState, type FC, useCallback, useRef, useEffect, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Portal from '../portal/portal';\nimport { DEFAULT_ARROW_SIZE, THROTTLE_DURATION } from './arrow-tooltip-constants';\nimport * as Styled from './arrow-tooltip-styled';\nimport { computeTooltipNewCoOrdinates } from './arrow-tooltip-util';\nimport TooltipBody from './comps/tooltip-body';\n\nconst ArrowTooltip: FC<IArrowTooltipProps> = ({\n  isAnimated,\n  alwaysVisible = false,\n  arrowColor,\n  arrowSize = DEFAULT_ARROW_SIZE,\n  arrowXCoOrdinates,\n  arrowYCoOrdinates,\n  backgroundColor,\n  borderColor,\n  children,\n  hidden,\n  position,\n  renderAs,\n  textVariant,\n  tooltipItem,\n  tooltipOffset,\n  tooltipXCoOrdinates,\n  tooltipYCoOrdinates,\n  width,\n  widthX,\n  zIndex,\n  parentWidth,\n  isBlocking = false,\n}) => {\n  const tooltipWrapperRef = useRef<HTMLDivElement>(null);\n  const [visible, setVisible] = useState(alwaysVisible);\n  const [tooltipCoOrdinates, setTooltipCoOrdinates] = useState<TTooltipCoOrdinatesProps | null>(\n    null,\n  );\n\n  const handleVisibleNCoOrdinates: THandleVisibleNCoOrdinatesProps = useCallback(\n    (newCoOrdinates, visibility) => {\n      setTooltipCoOrdinates(newCoOrdinates);\n      setVisible(visibility);\n    },\n    [],\n  );\n\n  const handleVisibility = useCallback(() => {\n    if (hidden || alwaysVisible) {\n      return null;\n    }\n\n    handleVisibleNCoOrdinates(null, false);\n\n    return;\n  }, [alwaysVisible, handleVisibleNCoOrdinates, hidden]);\n\n  const handleOnMouseEnter = throttle(() => {\n    const { current } = tooltipWrapperRef;\n\n    if (hidden || !current) return null;\n\n    const boundingClientRect = current.children[0]?.getBoundingClientRect();\n    const newCoOrdinates = boundingClientRect\n      ? computeTooltipNewCoOrdinates(position, boundingClientRect)\n      : null;\n\n    handleVisibleNCoOrdinates(newCoOrdinates, true);\n\n    return null;\n  }, THROTTLE_DURATION);\n\n  useEffect(() => {\n    if (!alwaysVisible || hidden) return;\n\n    window.addEventListener('scroll', handleOnMouseEnter, true);\n    window.addEventListener('resize', handleOnMouseEnter);\n\n    return () => {\n      window.removeEventListener('scroll', handleOnMouseEnter, true);\n      window.removeEventListener('resize', handleOnMouseEnter);\n    };\n  }, [alwaysVisible, hidden, position, handleOnMouseEnter]);\n\n  useEffect(() => {\n    if (hidden) {\n      setVisible(false);\n    }\n\n    if (alwaysVisible) {\n      handleOnMouseEnter();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [alwaysVisible, hidden]);\n\n  const tooltipContent = (\n    <TooltipBody\n      $arrowSize={arrowSize}\n      $arrowXCoOrdinates={arrowXCoOrdinates}\n      $arrowYCoOrdinates={arrowYCoOrdinates}\n      $position={position}\n      $renderAs={renderAs}\n      $tooltipCoOrdinates={tooltipCoOrdinates}\n      $tooltipOffset={tooltipOffset}\n      $tooltipXCoOrdinates={tooltipXCoOrdinates}\n      $tooltipYCoOrdinates={tooltipYCoOrdinates}\n      $zIndex={zIndex}\n      $backgroundColor={backgroundColor}\n      $arrowColor={arrowColor}\n      $borderColor={borderColor}\n      $isAnimated={isAnimated}\n      $width={width}\n      $widthX={widthX}\n      textVariant={textVariant || 'body3'}\n    >\n      {tooltipItem}\n    </TooltipBody>\n  );\n\n  return (\n    <>\n      <FlexView\n        $width={parentWidth || 'fit-content'}\n        ref={tooltipWrapperRef}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleVisibility}\n      >\n        <FlexView>{children}</FlexView>\n      </FlexView>\n\n      {visible && (\n        <Portal portalId=\"tooltip-root\">\n          {isBlocking ? (\n            <Styled.BackgroundOverlay>{tooltipContent}</Styled.BackgroundOverlay>\n          ) : (\n            tooltipContent\n          )}\n        </Portal>\n      )}\n    </>\n  );\n};\n\nexport default memo(ArrowTooltip);\n"],"names":["ArrowTooltip","isAnimated","alwaysVisible","arrowColor","arrowSize","DEFAULT_ARROW_SIZE","arrowXCoOrdinates","arrowYCoOrdinates","backgroundColor","borderColor","children","hidden","position","renderAs","textVariant","tooltipItem","tooltipOffset","tooltipXCoOrdinates","tooltipYCoOrdinates","width","widthX","zIndex","parentWidth","isBlocking","tooltipWrapperRef","useRef","visible","setVisible","useState","tooltipCoOrdinates","setTooltipCoOrdinates","handleVisibleNCoOrdinates","useCallback","newCoOrdinates","visibility","handleVisibility","handleOnMouseEnter","throttle","current","boundingClientRect","_a","computeTooltipNewCoOrdinates","THROTTLE_DURATION","useEffect","tooltipContent","jsx","TooltipBody","jsxs","Fragment","FlexView","Portal","Styled.BackgroundOverlay","ArrowTooltip$1","memo"],"mappings":"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"}

package/dist/features/ui/dot-lottie-animations/dot-lottie-animation.js

@@ -1,93 +1,80 @@
-import { jsx as d } from "react/jsx-runtime";
+import { jsx as l } from "react/jsx-runtime";
 import { DotLottieWorker as v } from "../../../node_modules/@lottiefiles/dotlottie-web/dist/index.js";
-import { memo as w, forwardRef as x, useRef as p, useImperativeHandle as A, useEffect as h } from "react";
-import R from "../layout/flex-view.js";
-import { Canvas as $ } from "./dot-lottie-animation-styled.js";
-const E = x(
-  (y, g) => {
-    const {
-      src: s,
-      data: f,
-      width: i = "100%",
-      height: a = "100%",
-      settings: l,
-      eventListeners: o,
-      onRender: u,
-      onError: c
-    } = y, m = p(null), t = p(null);
-    return A(
-      g,
-      () => ({
-        play: () => {
-          var e;
-          (e = t.current) == null || e.play();
-        },
-        pause: () => {
-          var e;
-          (e = t.current) == null || e.pause();
-        },
-        playSegments: (e) => {
-          var r, n;
-          (r = t.current) == null || r.setSegment(e[0], e[1]), (n = t.current) == null || n.play();
-        },
-        setFrame: (e) => {
-          var r;
-          (r = t.current) == null || r.setFrame(e);
-        }
-      }),
-      []
-    ), h(() => {
-      if (!m.current) return;
-      let e = !1;
-      return (() => {
-        try {
-          t.current = new v({
-            src: s,
-            data: f,
-            canvas: m.current,
-            autoplay: !0,
-            loop: !1,
-            renderConfig: {
-              autoResize: !0,
-              devicePixelRatio: window.devicePixelRatio,
-              freezeOnOffscreen: !0
-            },
-            ...l
-          }), requestAnimationFrame(() => {
-            e || u == null || u();
-          });
-        } catch (n) {
-          console.log(n), c == null || c();
-        }
-      })(), () => {
-        e = !0, t.current && (t.current.destroy(), t.current = null);
-      };
-    }, [s, l, u, c, f]), h(() => (o == null || o.forEach(
-      ({ name: e, callback: r }) => {
-        var n;
-        return (n = t.current) == null ? void 0 : n.addEventListener(e, r);
-      }
-    ), () => {
-      o == null || o.forEach(
-        ({ name: e, callback: r }) => {
-          var n;
-          return (n = t.current) == null ? void 0 : n.removeEventListener(e, r);
-        }
-      );
-    }), [o]), /* @__PURE__ */ d(R, { $width: i, $height: a, children: /* @__PURE__ */ d(
-      $,
-      {
-        ref: m,
-        $renderWidth: i,
-        $renderHeight: a,
-        width: typeof i == "number" ? i : void 0,
-        height: typeof a == "number" ? a : void 0
+import { memo as w, forwardRef as x, useRef as p, useImperativeHandle as R, useEffect as h } from "react";
+import E from "../layout/flex-view.js";
+import { Canvas as H } from "./dot-lottie-animation-styled.js";
+const N = x((y, g) => {
+  const {
+    src: m,
+    width: i = "100%",
+    height: a = "100%",
+    settings: f,
+    eventListeners: r,
+    onRender: u,
+    onError: c
+  } = y, s = p(null), t = p(null);
+  return R(
+    g,
+    () => ({
+      playSegments: (e) => {
+        var n, o;
+        (n = t.current) == null || n.setSegment(e[0], e[1]), (o = t.current) == null || o.play();
+      },
+      play: () => {
+        var e;
+        (e = t.current) == null || e.play();
       },
-      s
-    ) });
-  }
-), C = w(E);
+      pause: () => {
+        var e;
+        (e = t.current) == null || e.pause();
+      }
+    }),
+    []
+  ), h(() => {
+    if (s.current)
+      try {
+        t.current = new v({
+          src: m,
+          canvas: s.current,
+          autoplay: !0,
+          loop: !1,
+          renderConfig: {
+            autoResize: !0,
+            devicePixelRatio: window.devicePixelRatio,
+            freezeOnOffscreen: !0
+          },
+          ...f
+        }), requestAnimationFrame(() => {
+          u == null || u();
+        });
+      } catch (e) {
+        console.log(e), c == null || c();
+      }
+  }, [m, f, u, c]), h(() => (r == null || r.forEach(
+    ({ name: e, callback: n }) => {
+      var o;
+      return (o = t.current) == null ? void 0 : o.addEventListener(e, n);
+    }
+  ), () => {
+    var e;
+    r == null || r.forEach(
+      ({ name: n, callback: o }) => {
+        var d;
+        return (d = t.current) == null ? void 0 : d.removeEventListener(n, o);
+      }
+    ), (e = t.current) == null || e.destroy();
+  }), [r]), /* @__PURE__ */ l(E, { $width: i, $height: a, children: /* @__PURE__ */ l(
+    H,
+    {
+      ref: s,
+      $renderWidth: i,
+      $renderHeight: a,
+      width: typeof i == "number" ? i : void 0,
+      height: typeof a == "number" ? a : void 0
+    }
+  ) });
+}), F = w(N);
 export {
-  C as default
+  F as default
 };
 //# sourceMappingURL=dot-lottie-animation.js.map

package/dist/features/ui/dot-lottie-animations/dot-lottie-animation.js.map

@@ -1 +1 @@
-{"version":3,"file":"dot-lottie-animation.js","sources":["../../../../src/features/ui/dot-lottie-animations/dot-lottie-animation.tsx"],"sourcesContent":["import type {\n  AnimationSegment,\n  IDotLottieAnimationProps,\n  IDotLottieAnimationRef,\n} from './dot-lottie-types';\n\nimport { DotLottieWorker } from '@lottiefiles/dotlottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport * as Styled from './dot-lottie-animation-styled';\n\nconst DotLottieAnimation = forwardRef<IDotLottieAnimationRef, IDotLottieAnimationProps>(\n  (props, ref) => {\n    const {\n      src,\n      data,\n      width = '100%',\n      height = '100%',\n      settings,\n      eventListeners,\n      onRender,\n      onError,\n    } = props;\n\n    const canvasRef = useRef<HTMLCanvasElement>(null);\n    const animationInstance = useRef<DotLottieWorker | null>(null);\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        play: () => {\n          animationInstance.current?.play();\n        },\n        pause: () => {\n          animationInstance.current?.pause();\n        },\n        playSegments: (segments: AnimationSegment) => {\n          animationInstance.current?.setSegment(segments[0], segments[1]);\n          animationInstance.current?.play();\n        },\n        setFrame: (frame: number) => {\n          animationInstance.current?.setFrame(frame);\n        },\n      }),\n      [],\n    );\n\n    useEffect(() => {\n      if (!canvasRef.current) return;\n\n      let destroyed = false;\n\n      const loadAnimation = () => {\n        try {\n          animationInstance.current = new DotLottieWorker({\n            src,\n            data,\n            canvas: canvasRef.current!,\n            autoplay: true,\n            loop: false,\n            renderConfig: {\n              autoResize: true,\n              devicePixelRatio: window.devicePixelRatio,\n              freezeOnOffscreen: true,\n            },\n            ...settings,\n          });\n\n          requestAnimationFrame(() => {\n            if (destroyed) return;\n            onRender?.();\n          });\n        } catch (err) {\n          // eslint-disable-next-line no-console\n          console.log(err);\n          onError?.();\n        }\n      };\n\n      loadAnimation();\n\n      return () => {\n        destroyed = true;\n        if (animationInstance.current) {\n          animationInstance.current.destroy();\n          animationInstance.current = null;\n        }\n      };\n    }, [src, settings, onRender, onError, data]);\n\n    useEffect(() => {\n      eventListeners?.forEach(\n        ({ name, callback }) => animationInstance.current?.addEventListener(name, callback),\n      );\n\n      return () => {\n        eventListeners?.forEach(\n          ({ name, callback }) => animationInstance.current?.removeEventListener(name, callback),\n        );\n      };\n    }, [eventListeners]);\n\n    const isNumW = typeof width === 'number';\n    const isNumH = typeof height === 'number';\n\n    return (\n      <FlexView $width={width} $height={height}>\n        <Styled.Canvas\n          key={src}\n          ref={canvasRef}\n          $renderWidth={width}\n          $renderHeight={height}\n          width={isNumW ? width : undefined}\n          height={isNumH ? height : undefined}\n        />\n      </FlexView>\n    );\n  },\n);\n\nexport default memo(DotLottieAnimation);\n"],"names":["DotLottieAnimation","forwardRef","props","ref","src","data","width","height","settings","eventListeners","onRender","onError","canvasRef","useRef","animationInstance","useImperativeHandle","_a","segments","_b","frame","useEffect","destroyed","DotLottieWorker","err","name","callback","jsx","FlexView","Styled.Canvas","DotLottieAnimation$1","memo"],"mappings":";;;;;AAYA,MAAMA,IAAqBC;AAAA,EACzB,CAACC,GAAOC,MAAQ;AACR,UAAA;AAAA,MACJ,KAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAC,IAAQ;AAAA,MACR,QAAAC,IAAS;AAAA,MACT,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,UAAAC;AAAA,MACA,SAAAC;AAAA,IACE,IAAAT,GAEEU,IAAYC,EAA0B,IAAI,GAC1CC,IAAoBD,EAA+B,IAAI;AAE7D,WAAAE;AAAA,MACEZ;AAAA,MACA,OAAO;AAAA,QACL,MAAM,MAAM;;AACV,WAAAa,IAAAF,EAAkB,YAAlB,QAAAE,EAA2B;AAAA,QAC7B;AAAA,QACA,OAAO,MAAM;;AACX,WAAAA,IAAAF,EAAkB,YAAlB,QAAAE,EAA2B;AAAA,QAC7B;AAAA,QACA,cAAc,CAACC,MAA+B;;AAC5C,WAAAD,IAAAF,EAAkB,YAAlB,QAAAE,EAA2B,WAAWC,EAAS,CAAC,GAAGA,EAAS,CAAC,KAC7DC,IAAAJ,EAAkB,YAAlB,QAAAI,EAA2B;AAAA,QAC7B;AAAA,QACA,UAAU,CAACC,MAAkB;;AACT,WAAAH,IAAAF,EAAA,YAAA,QAAAE,EAAS,SAASG;AAAA,QACtC;AAAA,MAAA;AAAA,MAEF,CAAC;AAAA,IAAA,GAGHC,EAAU,MAAM;AACV,UAAA,CAACR,EAAU,QAAS;AAExB,UAAIS,IAAY;AA6BF,cA3BQ,MAAM;AACtB,YAAA;AACgB,UAAAP,EAAA,UAAU,IAAIQ,EAAgB;AAAA,YAC9C,KAAAlB;AAAA,YACA,MAAAC;AAAA,YACA,QAAQO,EAAU;AAAA,YAClB,UAAU;AAAA,YACV,MAAM;AAAA,YACN,cAAc;AAAA,cACZ,YAAY;AAAA,cACZ,kBAAkB,OAAO;AAAA,cACzB,mBAAmB;AAAA,YACrB;AAAA,YACA,GAAGJ;AAAA,UAAA,CACJ,GAED,sBAAsB,MAAM;AAC1B,YAAIa,KACOX,KAAA,QAAAA;AAAA,UAAA,CACZ;AAAA,iBACMa,GAAK;AAEZ,kBAAQ,IAAIA,CAAG,GACLZ,KAAA,QAAAA;AAAA,QACZ;AAAA,MAAA,MAKK,MAAM;AACC,QAAAU,IAAA,IACRP,EAAkB,YACpBA,EAAkB,QAAQ,WAC1BA,EAAkB,UAAU;AAAA,MAC9B;AAAA,IACF,GACC,CAACV,GAAKI,GAAUE,GAAUC,GAASN,CAAI,CAAC,GAE3Ce,EAAU,OACQX,KAAA,QAAAA,EAAA;AAAA,MACd,CAAC,EAAE,MAAAe,GAAM,UAAAC,QAAe;;AAAA,gBAAAT,IAAAF,EAAkB,YAAlB,gBAAAE,EAA2B,iBAAiBQ,GAAMC;AAAA;AAAA,OAGrE,MAAM;AACK,MAAAhB,KAAA,QAAAA,EAAA;AAAA,QACd,CAAC,EAAE,MAAAe,GAAM,UAAAC,QAAe;;AAAA,kBAAAT,IAAAF,EAAkB,YAAlB,gBAAAE,EAA2B,oBAAoBQ,GAAMC;AAAA;AAAA;AAAA,IAC/E,IAED,CAAChB,CAAc,CAAC,GAMhB,gBAAAiB,EAAAC,GAAA,EAAS,QAAQrB,GAAO,SAASC,GAChC,UAAA,gBAAAmB;AAAA,MAACE;AAAAA,MAAA;AAAA,QAEC,KAAKhB;AAAA,QACL,cAAcN;AAAA,QACd,eAAeC;AAAA,QACf,OAVS,OAAOD,KAAU,WAUVA,IAAQ;AAAA,QACxB,QAVS,OAAOC,KAAW,WAUVA,IAAS;AAAA,MAAA;AAAA,MALrBH;AAAA,IAOT,EAAA,CAAA;AAAA,EAEJ;AACF,GAEeyB,IAAAC,EAAK9B,CAAkB;"}
+{"version":3,"file":"dot-lottie-animation.js","sources":["../../../../src/features/ui/dot-lottie-animations/dot-lottie-animation.tsx"],"sourcesContent":["import type {\n  AnimationSegment,\n  ILottieAnimationProps,\n  ILottieAnimationRef,\n} from './dot-lottie-types';\n\nimport { DotLottieWorker } from '@lottiefiles/dotlottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport * as Styled from './dot-lottie-animation-styled';\n\nconst DotLottieAnimation = forwardRef<ILottieAnimationRef, ILottieAnimationProps>((props, ref) => {\n  const {\n    src,\n    width = '100%',\n    height = '100%',\n    settings,\n    eventListeners,\n    onRender,\n    onError,\n  } = props;\n\n  const canvasRef = useRef<HTMLCanvasElement>(null);\n  const animationInstance = useRef<DotLottieWorker | null>(null);\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      playSegments: (segments: AnimationSegment) => {\n        animationInstance.current?.setSegment(segments[0], segments[1]);\n        animationInstance.current?.play();\n      },\n      play: () => {\n        animationInstance.current?.play();\n      },\n      pause: () => {\n        animationInstance.current?.pause();\n      },\n    }),\n    [],\n  );\n\n  useEffect(() => {\n    if (!canvasRef.current) return;\n\n    try {\n      animationInstance.current = new DotLottieWorker({\n        src,\n        canvas: canvasRef.current,\n        autoplay: true,\n        loop: false,\n        renderConfig: {\n          autoResize: true,\n          devicePixelRatio: window.devicePixelRatio,\n          freezeOnOffscreen: true,\n        },\n        ...settings,\n      });\n\n      requestAnimationFrame(() => {\n        onRender?.();\n      });\n    } catch (err) {\n      // eslint-disable-next-line no-console\n      console.log(err);\n      onError?.();\n    }\n  }, [src, settings, onRender, onError]);\n\n  useEffect(() => {\n    eventListeners?.forEach(\n      ({ name, callback }) => animationInstance.current?.addEventListener(name, callback),\n    );\n\n    return () => {\n      eventListeners?.forEach(\n        ({ name, callback }) => animationInstance.current?.removeEventListener(name, callback),\n      );\n      animationInstance.current?.destroy();\n    };\n  }, [eventListeners]);\n\n  const isNumW = typeof width === 'number';\n  const isNumH = typeof height === 'number';\n\n  return (\n    <FlexView $width={width} $height={height}>\n      <Styled.Canvas\n        ref={canvasRef}\n        $renderWidth={width}\n        $renderHeight={height}\n        width={isNumW ? width : undefined}\n        height={isNumH ? height : undefined}\n      />\n    </FlexView>\n  );\n});\n\nexport default memo(DotLottieAnimation);\n"],"names":["DotLottieAnimation","forwardRef","props","ref","src","width","height","settings","eventListeners","onRender","onError","canvasRef","useRef","animationInstance","useImperativeHandle","segments","_a","_b","useEffect","DotLottieWorker","err","name","callback","jsx","FlexView","Styled.Canvas","dotLottieAnimation","memo"],"mappings":";;;;;AAYA,MAAMA,IAAqBC,EAAuD,CAACC,GAAOC,MAAQ;AAC1F,QAAA;AAAA,IACJ,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,EACE,IAAAR,GAEES,IAAYC,EAA0B,IAAI,GAC1CC,IAAoBD,EAA+B,IAAI;AAE7D,SAAAE;AAAA,IACEX;AAAA,IACA,OAAO;AAAA,MACL,cAAc,CAACY,MAA+B;;AAC5C,SAAAC,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B,WAAWD,EAAS,CAAC,GAAGA,EAAS,CAAC,KAC7DE,IAAAJ,EAAkB,YAAlB,QAAAI,EAA2B;AAAA,MAC7B;AAAA,MACA,MAAM,MAAM;;AACV,SAAAD,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B;AAAA,MAC7B;AAAA,MACA,OAAO,MAAM;;AACX,SAAAA,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B;AAAA,MAC7B;AAAA,IAAA;AAAA,IAEF,CAAC;AAAA,EAAA,GAGHE,EAAU,MAAM;AACV,QAACP,EAAU;AAEX,UAAA;AACgB,QAAAE,EAAA,UAAU,IAAIM,EAAgB;AAAA,UAC9C,KAAAf;AAAA,UACA,QAAQO,EAAU;AAAA,UAClB,UAAU;AAAA,UACV,MAAM;AAAA,UACN,cAAc;AAAA,YACZ,YAAY;AAAA,YACZ,kBAAkB,OAAO;AAAA,YACzB,mBAAmB;AAAA,UACrB;AAAA,UACA,GAAGJ;AAAA,QAAA,CACJ,GAED,sBAAsB,MAAM;AACf,UAAAE,KAAA,QAAAA;AAAA,QAAA,CACZ;AAAA,eACMW,GAAK;AAEZ,gBAAQ,IAAIA,CAAG,GACLV,KAAA,QAAAA;AAAA,MACZ;AAAA,KACC,CAACN,GAAKG,GAAUE,GAAUC,CAAO,CAAC,GAErCQ,EAAU,OACQV,KAAA,QAAAA,EAAA;AAAA,IACd,CAAC,EAAE,MAAAa,GAAM,UAAAC,QAAe;;AAAA,cAAAN,IAAAH,EAAkB,YAAlB,gBAAAG,EAA2B,iBAAiBK,GAAMC;AAAA;AAAA,KAGrE,MAAM;;AACK,IAAAd,KAAA,QAAAA,EAAA;AAAA,MACd,CAAC,EAAE,MAAAa,GAAM,UAAAC,QAAe;;AAAA,gBAAAN,IAAAH,EAAkB,YAAlB,gBAAAG,EAA2B,oBAAoBK,GAAMC;AAAA;AAAA,QAE/EN,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B;AAAA,EAAQ,IAEpC,CAACR,CAAc,CAAC,GAMhB,gBAAAe,EAAAC,GAAA,EAAS,QAAQnB,GAAO,SAASC,GAChC,UAAA,gBAAAiB;AAAA,IAACE;AAAAA,IAAA;AAAA,MACC,KAAKd;AAAA,MACL,cAAcN;AAAA,MACd,eAAeC;AAAA,MACf,OATS,OAAOD,KAAU,WASVA,IAAQ;AAAA,MACxB,QATS,OAAOC,KAAW,WASVA,IAAS;AAAA,IAAA;AAAA,EAE9B,EAAA,CAAA;AAEJ,CAAC,GAEcoB,IAAAC,EAAK3B,CAAkB;"}

package/dist/features/ui/lottie-animation/lottie-animation.js

@@ -1,33 +1,32 @@
-import { jsx as A } from "react/jsx-runtime";
-import E from "lottie-web";
-import { memo as w, forwardRef as b, useRef as m, useImperativeHandle as I, useEffect as S } from "react";
+import { jsx as E } from "react/jsx-runtime";
+import g from "lottie-web";
+import { memo as w, forwardRef as A, useRef as u, useImperativeHandle as b, useEffect as I } from "react";
 import $ from "../layout/flex-view.js";
 import { fetchLottie as x } from "./helper.js";
-const O = b((L, h) => {
+const O = A((v, L) => {
   const {
-    src: l,
-    width: g = "100%",
+    src: m,
+    width: h = "100%",
     height: y = "100%",
-    settings: f,
-    eventListener: o,
+    settings: l,
+    eventListener: n,
     onRender: i,
-    onError: a,
-    animateOnIntersect: s
-  } = L, c = m(null), r = m(null), u = m(null);
-  return I(
-    h,
+    animateOnIntersect: c
+  } = v, a = u(null), r = u(null), s = u(null);
+  return b(
+    L,
     () => ({
-      playSegments: (e, n) => {
+      playSegments: (e, o) => {
         var t;
-        return (t = r.current) == null ? void 0 : t.playSegments(e, n);
+        return (t = r.current) == null ? void 0 : t.playSegments(e, o);
       },
-      addEventListener: (e, n) => {
+      addEventListener: (e, o) => {
         var t;
-        return (t = r.current) == null ? void 0 : t.addEventListener(e, n);
+        return (t = r.current) == null ? void 0 : t.addEventListener(e, o);
       },
-      removeEventListener: (e, n) => {
+      removeEventListener: (e, o) => {
         var t;
-        return (t = r.current) == null ? void 0 : t.removeEventListener(e, n);
+        return (t = r.current) == null ? void 0 : t.removeEventListener(e, o);
       },
       play: () => {
         var e;
@@ -39,41 +38,37 @@ const O = b((L, h) => {
       },
       setLoop: (e) => {
         r.current && (r.current.loop = e);
-      },
-      goToAndStop: (e, n) => {
-        var t;
-        return (t = r.current) == null ? void 0 : t.goToAndStop(e, n);
       }
     }),
     []
-  ), S(() => {
+  ), I(() => {
     let e = !1;
     return (async () => {
       try {
-        const t = await x(l);
+        const t = await x(m);
         requestAnimationFrame(() => {
-          !c.current || e || (r.current = E.loadAnimation({
-            container: c.current,
+          !a.current || e || (r.current = g.loadAnimation({
+            container: a.current,
             animationData: t,
             loop: !0,
             autoplay: !0,
-            ...f
-          }), s && (u.current = new IntersectionObserver(
-            ([d]) => {
-              var p, v;
-              d && d.isIntersecting ? (p = r.current) == null || p.play() : (v = r.current) == null || v.pause();
+            ...l
+          }), c && (s.current = new IntersectionObserver(
+            ([f]) => {
+              var d, p;
+              f && f.isIntersecting ? (d = r.current) == null || d.play() : (p = r.current) == null || p.pause();
             },
             { threshold: 0 }
-          ), u.current.observe(c.current)), i == null || i(), o && r.current.addEventListener(o.name, o.callback));
+          ), s.current.observe(a.current)), i == null || i(), n && r.current.addEventListener(n.name, n.callback));
         });
       } catch (t) {
-        throw a == null || a(), Error(`Error loading Lottie animation: ${t}`);
+        throw Error(`Error loading Lottie animation: ${t}`);
       }
     })(), () => {
       var t;
-      e = !0, r.current && (o && r.current.removeEventListener(o.name, o.callback), s && ((t = u.current) == null || t.disconnect()), r.current.destroy());
+      e = !0, r.current && (n && r.current.removeEventListener(n.name, n.callback), c && ((t = s.current) == null || t.disconnect()), r.current.destroy());
     };
-  }, [l, o, i, s, f, a]), /* @__PURE__ */ A($, { ref: c, $width: g, $height: y });
+  }, [m, n, i, c, l]), /* @__PURE__ */ E($, { ref: a, $width: h, $height: y });
 }), D = w(O);
 export {
   D as default

package/dist/features/ui/lottie-animation/lottie-animation.js.map

@@ -1 +1 @@
-{"version":3,"file":"lottie-animation.js","sources":["../../../../src/features/ui/lottie-animation/lottie-animation.tsx"],"sourcesContent":["import type { ILottieAnimationProps, ILottieAnimationRef } from './types';\nimport type { AnimationEventName, AnimationItem, AnimationSegment } from 'lottie-web';\n\nimport lottie from 'lottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport { fetchLottie } from './helper';\n\nconst LottieAnimation = forwardRef<ILottieAnimationRef, ILottieAnimationProps>((props, ref) => {\n  const {\n    src,\n    width = '100%',\n    height = '100%',\n    settings,\n    eventListener,\n    onRender,\n    onError,\n    animateOnIntersect,\n  } = props;\n\n  const container = useRef<HTMLDivElement>(null);\n  const animationInstance = useRef<AnimationItem | null>(null);\n  const intersectionObserver = useRef<IntersectionObserver | null>(null);\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      playSegments: (segments: AnimationSegment, forceFlag?: boolean) =>\n        animationInstance.current?.playSegments(segments, forceFlag),\n      addEventListener: (eventName: string, callback: () => void) =>\n        animationInstance.current?.addEventListener(eventName as AnimationEventName, callback),\n      removeEventListener: (eventName: string, callback: () => void) =>\n        animationInstance.current?.removeEventListener(eventName as AnimationEventName, callback),\n      play: () => animationInstance.current?.play(),\n      stop: () => animationInstance.current?.stop(),\n      setLoop: (loop: boolean) => {\n        if (animationInstance.current) {\n          animationInstance.current.loop = loop;\n        }\n      },\n      goToAndStop: (v, f) => animationInstance.current?.goToAndStop(v, f),\n    }),\n    [],\n  );\n\n  useEffect(() => {\n    let destroyed = false;\n\n    const loadAnimation = async () => {\n      try {\n        const animationData = await fetchLottie(src);\n\n        // Wait for layout\n        // NOTE: Do not remove this as this is needed to fix canvas rendering on first layout.\n        requestAnimationFrame(() => {\n          if (!container.current || destroyed) return;\n\n          animationInstance.current = lottie.loadAnimation({\n            container: container.current,\n            animationData,\n            loop: true,\n            autoplay: true,\n            ...settings,\n          });\n\n          if (animateOnIntersect) {\n            intersectionObserver.current = new IntersectionObserver(\n              ([entry]) => {\n                if (entry && entry.isIntersecting) {\n                  animationInstance.current?.play();\n                } else {\n                  animationInstance.current?.pause();\n                }\n              },\n              { threshold: 0 },\n            );\n\n            intersectionObserver.current.observe(container.current);\n          }\n\n          onRender?.();\n          if (eventListener) {\n            animationInstance.current.addEventListener(eventListener.name, eventListener.callback);\n          }\n        });\n      } catch (error) {\n        onError?.();\n        throw Error(`Error loading Lottie animation: ${error}`);\n      }\n    };\n\n    loadAnimation();\n\n    return () => {\n      destroyed = true;\n      if (animationInstance.current) {\n        if (eventListener) {\n          animationInstance.current.removeEventListener(eventListener.name, eventListener.callback);\n        }\n\n        if (animateOnIntersect) {\n          intersectionObserver.current?.disconnect();\n        }\n        animationInstance.current.destroy();\n      }\n    };\n  }, [src, eventListener, onRender, animateOnIntersect, settings, onError]);\n\n  return <FlexView ref={container} $width={width} $height={height} />;\n});\n\nexport default memo(LottieAnimation);\n"],"names":["LottieAnimation","forwardRef","props","ref","src","width","height","settings","eventListener","onRender","onError","animateOnIntersect","container","useRef","animationInstance","intersectionObserver","useImperativeHandle","segments","forceFlag","_a","eventName","callback","loop","v","f","useEffect","destroyed","animationData","fetchLottie","lottie","entry","_b","error","FlexView","LottieAnimation$1","memo"],"mappings":";;;;;AASA,MAAMA,IAAkBC,EAAuD,CAACC,GAAOC,MAAQ;AACvF,QAAA;AAAA,IACJ,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,oBAAAC;AAAA,EACE,IAAAT,GAEEU,IAAYC,EAAuB,IAAI,GACvCC,IAAoBD,EAA6B,IAAI,GACrDE,IAAuBF,EAAoC,IAAI;AAErE,SAAAG;AAAA,IACEb;AAAA,IACA,OAAO;AAAA,MACL,cAAc,CAACc,GAA4BC,MACzC;;AAAA,gBAAAC,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,aAAaF,GAAUC;AAAA;AAAA,MACpD,kBAAkB,CAACE,GAAmBC,MACpC;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,iBAAiBC,GAAiCC;AAAA;AAAA,MAC/E,qBAAqB,CAACD,GAAmBC,MACvC;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,oBAAoBC,GAAiCC;AAAA;AAAA,MAClF,MAAM,MAAM;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B;AAAA;AAAA,MACvC,MAAM,MAAM;;AAAA,gBAAAA,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B;AAAA;AAAA,MACvC,SAAS,CAACG,MAAkB;AAC1B,QAAIR,EAAkB,YACpBA,EAAkB,QAAQ,OAAOQ;AAAA,MAErC;AAAA,MACA,aAAa,CAACC,GAAGC,MAAM;;AAAA,gBAAAL,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,YAAYI,GAAGC;AAAA;AAAA,IAAC;AAAA,IAEpE,CAAC;AAAA,EAAA,GAGHC,EAAU,MAAM;AACd,QAAIC,IAAY;AA6CF,YA3CQ,YAAY;AAC5B,UAAA;AACI,cAAAC,IAAgB,MAAMC,EAAYxB,CAAG;AAI3C,8BAAsB,MAAM;AACtB,UAAA,CAACQ,EAAU,WAAWc,MAERZ,EAAA,UAAUe,EAAO,cAAc;AAAA,YAC/C,WAAWjB,EAAU;AAAA,YACrB,eAAAe;AAAA,YACA,MAAM;AAAA,YACN,UAAU;AAAA,YACV,GAAGpB;AAAA,UAAA,CACJ,GAEGI,MACFI,EAAqB,UAAU,IAAI;AAAA,YACjC,CAAC,CAACe,CAAK,MAAM;;AACP,cAAAA,KAASA,EAAM,kBACjBX,IAAAL,EAAkB,YAAlB,QAAAK,EAA2B,UAE3BY,IAAAjB,EAAkB,YAAlB,QAAAiB,EAA2B;AAAA,YAE/B;AAAA,YACA,EAAE,WAAW,EAAE;AAAA,UAAA,GAGIhB,EAAA,QAAQ,QAAQH,EAAU,OAAO,IAG7CH,KAAA,QAAAA,KACPD,KACFM,EAAkB,QAAQ,iBAAiBN,EAAc,MAAMA,EAAc,QAAQ;AAAA,QACvF,CACD;AAAA,eACMwB,GAAO;AACJ,cAAAtB,KAAA,QAAAA,KACJ,MAAM,mCAAmCsB,CAAK,EAAE;AAAA,MACxD;AAAA,IAAA,MAKK,MAAM;;AACC,MAAAN,IAAA,IACRZ,EAAkB,YAChBN,KACFM,EAAkB,QAAQ,oBAAoBN,EAAc,MAAMA,EAAc,QAAQ,GAGtFG,OACFQ,IAAAJ,EAAqB,YAArB,QAAAI,EAA8B,eAEhCL,EAAkB,QAAQ;IAC5B;AAAA,EACF,GACC,CAACV,GAAKI,GAAeC,GAAUE,GAAoBJ,GAAUG,CAAO,CAAC,qBAEhEuB,GAAS,EAAA,KAAKrB,GAAW,QAAQP,GAAO,SAASC,EAAQ,CAAA;AACnE,CAAC,GAEc4B,IAAAC,EAAKnC,CAAe;"}
+{"version":3,"file":"lottie-animation.js","sources":["../../../../src/features/ui/lottie-animation/lottie-animation.tsx"],"sourcesContent":["import type { ILottieAnimationProps, ILottieAnimationRef } from './types';\nimport type { AnimationEventName, AnimationItem, AnimationSegment } from 'lottie-web';\n\nimport lottie from 'lottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport { fetchLottie } from './helper';\n\nconst LottieAnimation = forwardRef<ILottieAnimationRef, ILottieAnimationProps>((props, ref) => {\n  const {\n    src,\n    width = '100%',\n    height = '100%',\n    settings,\n    eventListener,\n    onRender,\n    animateOnIntersect,\n  } = props;\n\n  const container = useRef<HTMLDivElement>(null);\n  const animationInstance = useRef<AnimationItem | null>(null);\n  const intersectionObserver = useRef<IntersectionObserver | null>(null);\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      playSegments: (segments: AnimationSegment, forceFlag?: boolean) =>\n        animationInstance.current?.playSegments(segments, forceFlag),\n      addEventListener: (eventName: string, callback: () => void) =>\n        animationInstance.current?.addEventListener(eventName as AnimationEventName, callback),\n      removeEventListener: (eventName: string, callback: () => void) =>\n        animationInstance.current?.removeEventListener(eventName as AnimationEventName, callback),\n      play: () => animationInstance.current?.play(),\n      stop: () => animationInstance.current?.stop(),\n      setLoop: (loop: boolean) => {\n        if (animationInstance.current) {\n          animationInstance.current.loop = loop;\n        }\n      },\n    }),\n    [],\n  );\n\n  useEffect(() => {\n    let destroyed = false;\n\n    const loadAnimation = async () => {\n      try {\n        const animationData = await fetchLottie(src);\n\n        // Wait for layout\n        // NOTE: Do not remove this as this is needed to fix canvas rendering on first layout.\n        requestAnimationFrame(() => {\n          if (!container.current || destroyed) return;\n\n          animationInstance.current = lottie.loadAnimation({\n            container: container.current,\n            animationData,\n            loop: true,\n            autoplay: true,\n            ...settings,\n          });\n\n          if (animateOnIntersect) {\n            intersectionObserver.current = new IntersectionObserver(\n              ([entry]) => {\n                if (entry && entry.isIntersecting) {\n                  animationInstance.current?.play();\n                } else {\n                  animationInstance.current?.pause();\n                }\n              },\n              { threshold: 0 },\n            );\n\n            intersectionObserver.current.observe(container.current);\n          }\n\n          onRender?.();\n          if (eventListener) {\n            animationInstance.current.addEventListener(eventListener.name, eventListener.callback);\n          }\n        });\n      } catch (error) {\n        throw Error(`Error loading Lottie animation: ${error}`);\n      }\n    };\n\n    loadAnimation();\n\n    return () => {\n      destroyed = true;\n      if (animationInstance.current) {\n        if (eventListener) {\n          animationInstance.current.removeEventListener(eventListener.name, eventListener.callback);\n        }\n\n        if (animateOnIntersect) {\n          intersectionObserver.current?.disconnect();\n        }\n        animationInstance.current.destroy();\n      }\n    };\n  }, [src, eventListener, onRender, animateOnIntersect, settings]);\n\n  return <FlexView ref={container} $width={width} $height={height} />;\n});\n\nexport default memo(LottieAnimation);\n"],"names":["LottieAnimation","forwardRef","props","ref","src","width","height","settings","eventListener","onRender","animateOnIntersect","container","useRef","animationInstance","intersectionObserver","useImperativeHandle","segments","forceFlag","_a","eventName","callback","loop","useEffect","destroyed","animationData","fetchLottie","lottie","entry","_b","error","FlexView","LottieAnimation$1","memo"],"mappings":";;;;;AASA,MAAMA,IAAkBC,EAAuD,CAACC,GAAOC,MAAQ;AACvF,QAAA;AAAA,IACJ,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC;AAAA,IACA,oBAAAC;AAAA,EACE,IAAAR,GAEES,IAAYC,EAAuB,IAAI,GACvCC,IAAoBD,EAA6B,IAAI,GACrDE,IAAuBF,EAAoC,IAAI;AAErE,SAAAG;AAAA,IACEZ;AAAA,IACA,OAAO;AAAA,MACL,cAAc,CAACa,GAA4BC,MACzC;;AAAA,gBAAAC,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,aAAaF,GAAUC;AAAA;AAAA,MACpD,kBAAkB,CAACE,GAAmBC,MACpC;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,iBAAiBC,GAAiCC;AAAA;AAAA,MAC/E,qBAAqB,CAACD,GAAmBC,MACvC;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,oBAAoBC,GAAiCC;AAAA;AAAA,MAClF,MAAM,MAAM;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B;AAAA;AAAA,MACvC,MAAM,MAAM;;AAAA,gBAAAA,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B;AAAA;AAAA,MACvC,SAAS,CAACG,MAAkB;AAC1B,QAAIR,EAAkB,YACpBA,EAAkB,QAAQ,OAAOQ;AAAA,MAErC;AAAA,IAAA;AAAA,IAEF,CAAC;AAAA,EAAA,GAGHC,EAAU,MAAM;AACd,QAAIC,IAAY;AA4CF,YA1CQ,YAAY;AAC5B,UAAA;AACI,cAAAC,IAAgB,MAAMC,EAAYrB,CAAG;AAI3C,8BAAsB,MAAM;AACtB,UAAA,CAACO,EAAU,WAAWY,MAERV,EAAA,UAAUa,EAAO,cAAc;AAAA,YAC/C,WAAWf,EAAU;AAAA,YACrB,eAAAa;AAAA,YACA,MAAM;AAAA,YACN,UAAU;AAAA,YACV,GAAGjB;AAAA,UAAA,CACJ,GAEGG,MACFI,EAAqB,UAAU,IAAI;AAAA,YACjC,CAAC,CAACa,CAAK,MAAM;;AACP,cAAAA,KAASA,EAAM,kBACjBT,IAAAL,EAAkB,YAAlB,QAAAK,EAA2B,UAE3BU,IAAAf,EAAkB,YAAlB,QAAAe,EAA2B;AAAA,YAE/B;AAAA,YACA,EAAE,WAAW,EAAE;AAAA,UAAA,GAGId,EAAA,QAAQ,QAAQH,EAAU,OAAO,IAG7CF,KAAA,QAAAA,KACPD,KACFK,EAAkB,QAAQ,iBAAiBL,EAAc,MAAMA,EAAc,QAAQ;AAAA,QACvF,CACD;AAAA,eACMqB,GAAO;AACR,cAAA,MAAM,mCAAmCA,CAAK,EAAE;AAAA,MACxD;AAAA,IAAA,MAKK,MAAM;;AACC,MAAAN,IAAA,IACRV,EAAkB,YAChBL,KACFK,EAAkB,QAAQ,oBAAoBL,EAAc,MAAMA,EAAc,QAAQ,GAGtFE,OACFQ,IAAAJ,EAAqB,YAArB,QAAAI,EAA8B,eAEhCL,EAAkB,QAAQ;IAC5B;AAAA,EACF,GACC,CAACT,GAAKI,GAAeC,GAAUC,GAAoBH,CAAQ,CAAC,qBAEvDuB,GAAS,EAAA,KAAKnB,GAAW,QAAQN,GAAO,SAASC,EAAQ,CAAA;AACnE,CAAC,GAEcyB,IAAAC,EAAKhC,CAAe;"}