@cuemath/leap 3.2.18-mb → 3.2.19-beta-0.1

package/dist/features/ui/buttons/icon-button/icon-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button.js","sources":["../../../../../src/features/ui/buttons/icon-button/icon-button.tsx"],"sourcesContent":["import type { IIconButtonProps } from './icon-button-types';\n\nimport { memo, type FC } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport useClickHandler from '../../hooks/use-click-handler';\nimport { Loader } from '../button/button-styled';\nimport * as Styled from './icon-button-styled';\n\nconst IconButton: FC<IIconButtonProps> = memo(props => {\n  const {\n    Icon,\n    size,\n    onClick,\n    renderAs,\n    disabled,\n    analyticsLabel,\n    analyticsProps,\n    customBgColor,\n    busy,\n  } = props;\n  const { handleClick } = useClickHandler({ analyticsLabel, analyticsProps }, onClick);\n\n  return (\n    <Styled.IconButtonWrapper\n      disabled={disabled}\n      $size={size}\n      $buttonRenderAs={renderAs}\n      onClick={handleClick}\n      $customBgColor={customBgColor}\n    >\n      {busy ? (\n        <Loader src={ILLUSTRATIONS.LOADER} alt=\"Loader\" $size={size || 'small'} />\n      ) : (\n        <Styled.IconWrapper $size={size} $buttonRenderAs={renderAs}>\n          <Icon />\n        </Styled.IconWrapper>\n      )}\n    </Styled.IconButtonWrapper>\n  );\n});\n\nexport default IconButton;\n"],"names":["IconButton","memo","props","Icon","size","onClick","renderAs","disabled","analyticsLabel","analyticsProps","customBgColor","busy","handleClick","useClickHandler","jsx","Styled.IconButtonWrapper","Loader","ILLUSTRATIONS","Styled.IconWrapper","IconButton$1"],"mappings":";;;;;;AASA,MAAMA,IAAmCC,EAAK,CAASC,MAAA;AAC/C,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,MAAAC;AAAA,EACE,IAAAT,GACE,EAAE,aAAAU,MAAgBC,EAAgB,EAAE,gBAAAL,GAAgB,gBAAAC,EAAA,GAAkBJ,CAAO;AAGjF,SAAA,gBAAAS;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,UAAAR;AAAA,MACA,OAAOH;AAAA,MACP,iBAAiBE;AAAA,MACjB,SAASM;AAAA,MACT,gBAAgBF;AAAA,MAEf,UAAAC,sBACEK,GAAO,EAAA,KAAKC,EAAc,QAAQ,KAAI,UAAS,OAAOb,KAAQ,SAAS,IAEvE,gBAAAU,EAAAI,GAAA,EAAmB,OAAOd,GAAM,iBAAiBE,GAChD,UAAC,gBAAAQ,EAAAX,GAAA,CAAA,CAAK,EACR,CAAA;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC,GAEDgB,IAAenB;"}
+{"version":3,"file":"icon-button.js","sources":["../../../../../src/features/ui/buttons/icon-button/icon-button.tsx"],"sourcesContent":["import type { IIconButtonProps } from './icon-button-types';\n\nimport { memo, useMemo, type FC } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport useClickHandler from '../../hooks/use-click-handler';\nimport { EDeviceType } from '../../theme/constants';\nimport { Loader } from '../button/button-styled';\nimport * as Styled from './icon-button-styled';\n\nconst IconButton: FC<IIconButtonProps> = memo(props => {\n  const {\n    Icon,\n    size,\n    sizeOnMobile,\n    sizeOnTablet,\n    onClick,\n    renderAs,\n    disabled,\n    analyticsLabel,\n    analyticsProps,\n    customBgColor,\n    busy,\n  } = props;\n  const { handleClick } = useClickHandler({ analyticsLabel, analyticsProps }, onClick);\n  const { device } = useTheme();\n  const renderSize = useMemo(() => {\n    if (device <= EDeviceType.MOBILE) {\n      return sizeOnMobile || sizeOnTablet || size;\n    }\n\n    if (device <= EDeviceType.TABLET) {\n      return sizeOnTablet || size;\n    }\n\n    return size;\n  }, [device, size, sizeOnMobile, sizeOnTablet]);\n\n  return (\n    <Styled.IconButtonWrapper\n      disabled={disabled}\n      $size={size}\n      $buttonRenderAs={renderAs}\n      onClick={handleClick}\n      $customBgColor={customBgColor}\n    >\n      {busy ? (\n        <Loader src={ILLUSTRATIONS.LOADER} alt=\"Loader\" $size={renderSize || 'small'} />\n      ) : (\n        <Styled.IconWrapper $size={renderSize} $buttonRenderAs={renderAs}>\n          <Icon />\n        </Styled.IconWrapper>\n      )}\n    </Styled.IconButtonWrapper>\n  );\n});\n\nexport default IconButton;\n"],"names":["IconButton","memo","props","Icon","size","sizeOnMobile","sizeOnTablet","onClick","renderAs","disabled","analyticsLabel","analyticsProps","customBgColor","busy","handleClick","useClickHandler","device","useTheme","renderSize","useMemo","EDeviceType","jsx","Styled.IconButtonWrapper","Loader","ILLUSTRATIONS","Styled.IconWrapper","IconButton$1"],"mappings":";;;;;;;;AAWA,MAAMA,IAAmCC,EAAK,CAASC,MAAA;AAC/C,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,cAAAC;AAAA,IACA,cAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,MAAAC;AAAA,EACE,IAAAX,GACE,EAAE,aAAAY,MAAgBC,EAAgB,EAAE,gBAAAL,GAAgB,gBAAAC,EAAA,GAAkBJ,CAAO,GAC7E,EAAE,QAAAS,MAAWC,KACbC,IAAaC,EAAQ,MACrBH,KAAUI,EAAY,SACjBf,KAAgBC,KAAgBF,IAGrCY,KAAUI,EAAY,UACjBd,KAAgBF,GAIxB,CAACY,GAAQZ,GAAMC,GAAcC,CAAY,CAAC;AAG3C,SAAA,gBAAAe;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,UAAAb;AAAA,MACA,OAAOL;AAAA,MACP,iBAAiBI;AAAA,MACjB,SAASM;AAAA,MACT,gBAAgBF;AAAA,MAEf,UAAAC,sBACEU,GAAO,EAAA,KAAKC,EAAc,QAAQ,KAAI,UAAS,OAAON,KAAc,SAAS,IAE7E,gBAAAG,EAAAI,GAAA,EAAmB,OAAOP,GAAY,iBAAiBV,GACtD,UAAC,gBAAAa,EAAAlB,GAAA,CAAA,CAAK,EACR,CAAA;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC,GAEDuB,IAAe1B;"}

package/dist/features/ui/buttons/text-button/text-button.js

@@ -1,30 +1,34 @@
-import { jsx as r } from "react/jsx-runtime";
-import { useTheme as x } from "styled-components";
-import a from "../clickable/clickable.js";
-import { Text as f } from "./text-button-styled.js";
+import { jsx as u } from "react/jsx-runtime";
+import { useMemo as T } from "react";
+import { useTheme as a } from "styled-components";
+import { EDeviceType as c } from "../../theme/constants.js";
+import $ from "../clickable/clickable.js";
+import { Text as h } from "./text-button-styled.js";
 const l = ({
-  label: t,
-  size: o = "regular",
-  disabled: e = !1,
-  onClick: n,
-  analyticsLabel: s,
-  analyticsProps: i,
-  color: m
+  label: e,
+  size: r = "regular",
+  sizeOnMobile: n,
+  sizeOnTablet: t,
+  disabled: f = !1,
+  onClick: i,
+  analyticsLabel: p,
+  analyticsProps: s,
+  color: x
 }) => {
-  const { textButton: c } = x(), { textVariant: u } = c.sizes[o];
-  return /* @__PURE__ */ r(
-    a,
+  const { textButton: d, device: o } = a(), m = T(() => o <= c.MOBILE ? n || t || r : o <= c.TABLET && t || r, [o, r, n, t]), { textVariant: B } = d.sizes[m];
+  return /* @__PURE__ */ u(
+    $,
     {
-      label: t,
-      disabled: e,
-      onClick: n,
-      analyticsLabel: s,
-      analyticsProps: i,
-      children: /* @__PURE__ */ r(f, { $color: m, $renderAs: u, $buttonSize: o, children: t })
+      label: e,
+      disabled: f,
+      onClick: i,
+      analyticsLabel: p,
+      analyticsProps: s,
+      children: /* @__PURE__ */ u(h, { $color: x, $renderAs: B, $buttonSize: m, children: e })
     }
   );
-}, h = l;
+}, j = l;
 export {
-  h as default
+  j as default
 };
 //# sourceMappingURL=text-button.js.map

package/dist/features/ui/buttons/text-button/text-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-button.js","sources":["../../../../../src/features/ui/buttons/text-button/text-button.tsx"],"sourcesContent":["import type { ITextButtonProps } from './text-button-types';\n\nimport React from 'react';\nimport { useTheme } from 'styled-components';\n\nimport Clickable from '../clickable/clickable';\nimport * as Styled from './text-button-styled';\n\nconst TextButton: React.FC<ITextButtonProps> = ({\n  label,\n  size = 'regular',\n  disabled = false,\n  onClick,\n  analyticsLabel,\n  analyticsProps,\n  color,\n}) => {\n  const { textButton } = useTheme();\n  const { textVariant } = textButton.sizes[size];\n\n  return (\n    <Clickable\n      label={label}\n      disabled={disabled}\n      onClick={onClick}\n      analyticsLabel={analyticsLabel}\n      analyticsProps={analyticsProps}\n    >\n      <Styled.Text $color={color} $renderAs={textVariant} $buttonSize={size}>\n        {label}\n      </Styled.Text>\n    </Clickable>\n  );\n};\n\nexport default TextButton;\n"],"names":["TextButton","label","size","disabled","onClick","analyticsLabel","analyticsProps","color","textButton","useTheme","textVariant","jsx","Clickable","Styled.Text","TextButton$1"],"mappings":";;;;AAQA,MAAMA,IAAyC,CAAC;AAAA,EAC9C,OAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,OAAAC;AACF,MAAM;AACE,QAAA,EAAE,YAAAC,MAAeC,KACjB,EAAE,aAAAC,EAAgB,IAAAF,EAAW,MAAMN,CAAI;AAG3C,SAAA,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAAX;AAAA,MACA,UAAAE;AAAA,MACA,SAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MAEA,UAAA,gBAAAK,EAACE,GAAA,EAAY,QAAQN,GAAO,WAAWG,GAAa,aAAaR,GAC9D,UACHD,EAAA,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEAa,IAAed;"}
+{"version":3,"file":"text-button.js","sources":["../../../../../src/features/ui/buttons/text-button/text-button.tsx"],"sourcesContent":["import type { ITextButtonProps } from './text-button-types';\n\nimport React, { useMemo } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { EDeviceType } from '../../theme/constants';\nimport Clickable from '../clickable/clickable';\nimport * as Styled from './text-button-styled';\n\nconst TextButton: React.FC<ITextButtonProps> = ({\n  label,\n  size = 'regular',\n  sizeOnMobile,\n  sizeOnTablet,\n  disabled = false,\n  onClick,\n  analyticsLabel,\n  analyticsProps,\n  color,\n}) => {\n  const { textButton, device } = useTheme();\n  const renderSize = useMemo(() => {\n    if (device <= EDeviceType.MOBILE) {\n      return sizeOnMobile || sizeOnTablet || size;\n    }\n\n    if (device <= EDeviceType.TABLET) {\n      return sizeOnTablet || size;\n    }\n\n    return size;\n  }, [device, size, sizeOnMobile, sizeOnTablet]);\n\n  const { textVariant } = textButton.sizes[renderSize];\n\n  return (\n    <Clickable\n      label={label}\n      disabled={disabled}\n      onClick={onClick}\n      analyticsLabel={analyticsLabel}\n      analyticsProps={analyticsProps}\n    >\n      <Styled.Text $color={color} $renderAs={textVariant} $buttonSize={renderSize}>\n        {label}\n      </Styled.Text>\n    </Clickable>\n  );\n};\n\nexport default TextButton;\n"],"names":["TextButton","label","size","sizeOnMobile","sizeOnTablet","disabled","onClick","analyticsLabel","analyticsProps","color","textButton","device","useTheme","renderSize","useMemo","EDeviceType","textVariant","jsx","Clickable","Styled.Text","TextButton$1"],"mappings":";;;;;;AASA,MAAMA,IAAyC,CAAC;AAAA,EAC9C,OAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,OAAAC;AACF,MAAM;AACJ,QAAM,EAAE,YAAAC,GAAY,QAAAC,EAAO,IAAIC,EAAS,GAClCC,IAAaC,EAAQ,MACrBH,KAAUI,EAAY,SACjBZ,KAAgBC,KAAgBF,IAGrCS,KAAUI,EAAY,UACjBX,KAAgBF,GAIxB,CAACS,GAAQT,GAAMC,GAAcC,CAAY,CAAC,GAEvC,EAAE,aAAAY,EAAgB,IAAAN,EAAW,MAAMG,CAAU;AAGjD,SAAA,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAAjB;AAAA,MACA,UAAAI;AAAA,MACA,SAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MAEA,UAAA,gBAAAS,EAACE,GAAA,EAAY,QAAQV,GAAO,WAAWO,GAAa,aAAaH,GAC9D,UACHZ,EAAA,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEAmB,IAAepB;"}

package/dist/features/ui/drawer/drawer-styled.js

@@ -0,0 +1,34 @@
+import o from "styled-components";
+import e from "../layout/flex-view.js";
+const a = o.div`
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: ${({ $position: t }) => t === "left" ? 0 : "auto"};
+  right: ${({ $position: t }) => t === "right" ? 0 : "auto"};
+  width: 100%;
+  height: 100%;
+  z-index: ${({ $zIndex: t }) => t ?? 999};
+  pointer-events: ${({ $isOpen: t }) => t ? "auto" : "none"};
+`, s = o(e)`
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  ${({ $position: t }) => t === "left" ? "left: 0;" : "right: 0;"}
+  width: ${({ $drawerWidth: t }) => typeof t == "number" ? `${t}px` : t};
+  transform: ${({ $isOpen: t, $position: i }) => t ? "translateX(0)" : i === "left" ? "translateX(-100%)" : "translateX(100%)"};
+  transition: transform 0.3s ease-in-out;
+  height: 100%;
+`, p = o(e)`
+  position: absolute;
+  inset: 0;
+  backdrop-filter: blur(40px);
+  opacity: ${({ $isOpen: t }) => t ? 1 : 0};
+  transition: opacity 0.3s ease-in-out;
+`;
+export {
+  p as DrawerBackdrop,
+  a as DrawerContainer,
+  s as DrawerPanel
+};
+//# sourceMappingURL=drawer-styled.js.map

package/dist/features/ui/drawer/drawer-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-styled.js","sources":["../../../../src/features/ui/drawer/drawer-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../layout/flex-view';\n\ninterface DrawerContainerProps {\n  $isOpen: boolean;\n  $position: 'left' | 'right';\n  $zIndex?: number;\n}\n\ninterface DrawerPanelProps extends DrawerContainerProps {\n  $drawerWidth: number | string;\n}\n\nexport const DrawerContainer = styled.div<DrawerContainerProps>`\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: ${({ $position }) => ($position === 'left' ? 0 : 'auto')};\n  right: ${({ $position }) => ($position === 'right' ? 0 : 'auto')};\n  width: 100%;\n  height: 100%;\n  z-index: ${({ $zIndex }) => $zIndex ?? 999};\n  pointer-events: ${({ $isOpen }) => ($isOpen ? 'auto' : 'none')};\n`;\n\nexport const DrawerPanel = styled(FlexView)<DrawerPanelProps>`\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  ${({ $position }) => ($position === 'left' ? 'left: 0;' : 'right: 0;')}\n  width: ${({ $drawerWidth }) =>\n    typeof $drawerWidth === 'number' ? `${$drawerWidth}px` : $drawerWidth};\n  transform: ${({ $isOpen, $position }) =>\n    $isOpen ? 'translateX(0)' : $position === 'left' ? 'translateX(-100%)' : 'translateX(100%)'};\n  transition: transform 0.3s ease-in-out;\n  height: 100%;\n`;\n\nexport const DrawerBackdrop = styled(FlexView)<{ $isOpen: boolean }>`\n  position: absolute;\n  inset: 0;\n  backdrop-filter: blur(40px);\n  opacity: ${({ $isOpen }) => ($isOpen ? 1 : 0)};\n  transition: opacity 0.3s ease-in-out;\n`;\n"],"names":["DrawerContainer","styled","$position","$zIndex","$isOpen","DrawerPanel","FlexView","$drawerWidth","DrawerBackdrop"],"mappings":";;AAcO,MAAMA,IAAkBC,EAAO;AAAA;AAAA;AAAA;AAAA,UAI5B,CAAC,EAAE,WAAAC,QAAiBA,MAAc,SAAS,IAAI,MAAO;AAAA,WACrD,CAAC,EAAE,WAAAA,QAAiBA,MAAc,UAAU,IAAI,MAAO;AAAA;AAAA;AAAA,aAGrD,CAAC,EAAE,SAAAC,QAAcA,KAAW,GAAG;AAAA,oBACxB,CAAC,EAAE,SAAAC,EAAA,MAAeA,IAAU,SAAS,MAAO;AAAA,GAGnDC,IAAcJ,EAAOK,CAAQ;AAAA;AAAA;AAAA;AAAA,IAItC,CAAC,EAAE,WAAAJ,QAAiBA,MAAc,SAAS,aAAa,WAAY;AAAA,WAC7D,CAAC,EAAE,cAAAK,EACV,MAAA,OAAOA,KAAiB,WAAW,GAAGA,CAAY,OAAOA,CAAY;AAAA,eAC1D,CAAC,EAAE,SAAAH,GAAS,WAAAF,QACvBE,IAAU,kBAAkBF,MAAc,SAAS,sBAAsB,kBAAkB;AAAA;AAAA;AAAA,GAKlFM,IAAiBP,EAAOK,CAAQ;AAAA;AAAA;AAAA;AAAA,aAIhC,CAAC,EAAE,SAAAF,EAAA,MAAeA,IAAU,IAAI,CAAE;AAAA;AAAA;"}

package/dist/features/ui/drawer/drawer.js

@@ -0,0 +1,42 @@
+import { jsxs as s, jsx as c } from "react/jsx-runtime";
+import { memo as $, useRef as w, useEffect as k } from "react";
+import { DrawerContainer as D, DrawerBackdrop as _, DrawerPanel as p } from "./drawer-styled.js";
+const E = $(
+  ({ isOpen: r, onClose: e, children: i, drawerWidth: o = 300, position: n = "left", zIndex: u, theme: m = "dark" }) => {
+    const t = w(null);
+    k(() => {
+      const d = (f) => {
+        t.current && !t.current.contains(f.target) && (e == null || e());
+      };
+      return r && document.addEventListener("mousedown", d), () => {
+        document.removeEventListener("mousedown", d);
+      };
+    }, [r, e]);
+    const a = m === "dark";
+    return /* @__PURE__ */ s(D, { $isOpen: r, $position: n, $zIndex: u, children: [
+      /* @__PURE__ */ c(
+        _,
+        {
+          $isOpen: r,
+          onClick: e,
+          $background: a ? "WHITE_T_10" : "BLACK_T_38"
+        }
+      ),
+      /* @__PURE__ */ c(
+        p,
+        {
+          ref: t,
+          $isOpen: r,
+          $position: n,
+          $drawerWidth: o,
+          $background: a ? "BLACK_3" : "WHITE_3",
+          children: i
+        }
+      )
+    ] });
+  }
+), L = E;
+export {
+  L as default
+};
+//# sourceMappingURL=drawer.js.map

package/dist/features/ui/drawer/drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.js","sources":["../../../../src/features/ui/drawer/drawer.tsx"],"sourcesContent":["import type { IDrawerProps } from './drawer-types';\nimport type { FC } from 'react';\n\nimport { memo, useEffect, useRef } from 'react';\n\nimport * as Styled from './drawer-styled';\n\nconst Drawer: FC<IDrawerProps> = memo(\n  ({ isOpen, onClose, children, drawerWidth = 300, position = 'left', zIndex, theme = 'dark' }) => {\n    const drawerRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n      const handleClickOutside = (e: MouseEvent) => {\n        if (drawerRef.current && !drawerRef.current.contains(e.target as Node)) {\n          onClose?.();\n        }\n      };\n\n      if (isOpen) {\n        document.addEventListener('mousedown', handleClickOutside);\n      }\n\n      return () => {\n        document.removeEventListener('mousedown', handleClickOutside);\n      };\n    }, [isOpen, onClose]);\n\n    const isDarkTheme = theme === 'dark';\n\n    return (\n      <Styled.DrawerContainer $isOpen={isOpen} $position={position} $zIndex={zIndex}>\n        <Styled.DrawerBackdrop\n          $isOpen={isOpen}\n          onClick={onClose}\n          $background={isDarkTheme ? 'WHITE_T_10' : 'BLACK_T_38'}\n        />\n        <Styled.DrawerPanel\n          ref={drawerRef}\n          $isOpen={isOpen}\n          $position={position}\n          $drawerWidth={drawerWidth}\n          $background={isDarkTheme ? 'BLACK_3' : 'WHITE_3'}\n        >\n          {children}\n        </Styled.DrawerPanel>\n      </Styled.DrawerContainer>\n    );\n  },\n);\n\nexport default Drawer;\n"],"names":["Drawer","memo","isOpen","onClose","children","drawerWidth","position","zIndex","theme","drawerRef","useRef","useEffect","handleClickOutside","e","isDarkTheme","jsxs","Styled.DrawerContainer","jsx","Styled.DrawerBackdrop","Styled.DrawerPanel","Drawer$1"],"mappings":";;;AAOA,MAAMA,IAA2BC;AAAA,EAC/B,CAAC,EAAE,QAAAC,GAAQ,SAAAC,GAAS,UAAAC,GAAU,aAAAC,IAAc,KAAK,UAAAC,IAAW,QAAQ,QAAAC,GAAQ,OAAAC,IAAQ,OAAA,MAAa;AACzF,UAAAC,IAAYC,EAAuB,IAAI;AAE7C,IAAAC,EAAU,MAAM;AACR,YAAAC,IAAqB,CAACC,MAAkB;AACxC,QAAAJ,EAAU,WAAW,CAACA,EAAU,QAAQ,SAASI,EAAE,MAAc,MACzDV,KAAA,QAAAA;AAAA,MACZ;AAGF,aAAID,KACO,SAAA,iBAAiB,aAAaU,CAAkB,GAGpD,MAAM;AACF,iBAAA,oBAAoB,aAAaA,CAAkB;AAAA,MAAA;AAAA,IAC9D,GACC,CAACV,GAAQC,CAAO,CAAC;AAEpB,UAAMW,IAAcN,MAAU;AAG5B,WAAA,gBAAAO,EAACC,GAAA,EAAuB,SAASd,GAAQ,WAAWI,GAAU,SAASC,GACrE,UAAA;AAAA,MAAA,gBAAAU;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,SAAShB;AAAA,UACT,SAASC;AAAA,UACT,aAAaW,IAAc,eAAe;AAAA,QAAA;AAAA,MAC5C;AAAA,MACA,gBAAAG;AAAA,QAACE;AAAAA,QAAA;AAAA,UACC,KAAKV;AAAA,UACL,SAASP;AAAA,UACT,WAAWI;AAAA,UACX,cAAcD;AAAA,UACd,aAAaS,IAAc,YAAY;AAAA,UAEtC,UAAAV;AAAA,QAAA;AAAA,MACH;AAAA,IACF,EAAA,CAAA;AAAA,EAEJ;AACF,GAEAgB,IAAepB;"}

package/dist/features/ui/error/error.js

@@ -1,47 +1,85 @@
-import { jsxs as o, jsx as r, Fragment as h } from "react/jsx-runtime";
-import { useCallback as g } from "react";
-import { ILLUSTRATIONS as $ } from "../../../assets/illustrations/illustrations.js";
-import p from "../buttons/button/button.js";
-import f from "../image/image.js";
-import n from "../layout/flex-view.js";
-import i from "../text/text.js";
-const w = (a) => {
-  const { height: l, onTryAgain: t, theme: s = "light", title: m, description: c } = a, d = g(() => {
-    t ? t() : window.location.reload();
-  }, [t]), e = s === "dark" ? "WHITE_T_87" : "BLACK_T_87";
-  return /* @__PURE__ */ o(n, { $alignItems: "center", $justifyContent: "center", $height: l, children: [
-    /* @__PURE__ */ r(
-      n,
+import { jsxs as n, jsx as i, Fragment as X } from "react/jsx-runtime";
+import { useCallback as $ } from "react";
+import { ILLUSTRATIONS as p } from "../../../assets/illustrations/illustrations.js";
+import f from "../buttons/button/button.js";
+import u from "../image/image.js";
+import a from "../layout/flex-view.js";
+import m from "../text/text.js";
+const e = {
+  compact: {
+    widthX: 10,
+    heightX: 5,
+    borderRadiusX: 1,
+    marginBottomX: 1,
+    title: "h6",
+    description: "body3",
+    imageWidth: 54,
+    imageHeight: 44
+  },
+  full: {
+    widthX: 22.5,
+    heightX: 11.5,
+    borderRadiusX: 1,
+    marginBottomX: 1.5,
+    title: "h4",
+    description: "body2",
+    imageWidth: 122,
+    imageHeight: 100
+  }
+}, w = (l) => {
+  const { height: d, onTryAgain: r, theme: h = "light", title: s, description: g, size: t = "full" } = l, c = $(() => {
+    r ? r() : window.location.reload();
+  }, [r]), o = h === "dark" ? "WHITE_T_87" : "BLACK_T_87";
+  return /* @__PURE__ */ n(a, { $alignItems: "center", $justifyContent: "center", $height: d, children: [
+    /* @__PURE__ */ i(
+      a,
       {
-        $widthX: 22.5,
-        $heightX: 11.5,
-        $borderRadiusX: 1,
-        $marginBottomX: 1.5,
+        $widthX: e[t].widthX,
+        $heightX: e[t].heightX,
+        $borderRadiusX: e[t].borderRadiusX,
+        $marginBottomX: e[t].marginBottomX,
         $background: "GREY_1",
         $justifyContent: "center",
         $alignItems: "center",
-        children: /* @__PURE__ */ r(f, { width: 122, height: 100, src: $.ROCKET_BROKEN, withLoader: !1 })
+        children: /* @__PURE__ */ i(
+          u,
+          {
+            width: e[t].imageWidth,
+            height: e[t].imageHeight,
+            src: p.ROCKET_BROKEN,
+            withLoader: !1
+          }
+        )
       }
     ),
-    /* @__PURE__ */ r(i, { $renderAs: "h4", $marginBottomX: 0.5, $color: e, $align: "center", children: m ?? "Oops! Looks like something went wrong" }),
-    /* @__PURE__ */ r(i, { $renderAs: "body2", $align: "center", $marginBottomX: 1.5, $color: e, children: c ?? /* @__PURE__ */ o(h, { children: [
+    /* @__PURE__ */ i(
+      m,
+      {
+        $renderAs: e[t].title,
+        $marginBottomX: 0.5,
+        $color: o,
+        $align: "center",
+        children: s ?? "Oops! Looks like something went wrong"
+      }
+    ),
+    /* @__PURE__ */ i(m, { $renderAs: "body2", $align: "center", $marginBottomX: 1.5, $color: o, children: g ?? /* @__PURE__ */ n(X, { children: [
       "Please try again. Alternatively if that does not work,",
-      /* @__PURE__ */ r("br", {}),
+      /* @__PURE__ */ i("br", {}),
       " please contact support."
     ] }) }),
-    /* @__PURE__ */ r(
-      p,
+    /* @__PURE__ */ i(
+      f,
       {
         label: "Try again",
-        onClick: d,
+        onClick: c,
         renderAs: "primary",
         size: "small",
         widthX: 14
       }
     )
   ] });
-}, b = w;
+}, k = w;
 export {
-  b as default
+  k as default
 };
 //# sourceMappingURL=error.js.map

package/dist/features/ui/error/error.js.map

@@ -1 +1 @@
-{"version":3,"file":"error.js","sources":["../../../../src/features/ui/error/error.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Button from '../buttons/button/button';\nimport Image from '../image/image';\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\n\ninterface IErrorProps {\n  onTryAgain?: () => void;\n  height?: string | number;\n  theme?: 'light' | 'dark';\n  title?: string;\n  description?: string;\n}\n\nconst Error: React.FC<IErrorProps> = props => {\n  const { height, onTryAgain, theme = 'light', title, description } = props;\n  const handleTryAgain = useCallback(() => {\n    if (onTryAgain) {\n      onTryAgain();\n    } else {\n      window.location.reload();\n    }\n  }, [onTryAgain]);\n\n  const textColor = theme === 'dark' ? 'WHITE_T_87' : 'BLACK_T_87';\n\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\" $height={height}>\n      <FlexView\n        $widthX={22.5}\n        $heightX={11.5}\n        $borderRadiusX={1}\n        $marginBottomX={1.5}\n        $background=\"GREY_1\"\n        $justifyContent=\"center\"\n        $alignItems=\"center\"\n      >\n        <Image width={122} height={100} src={ILLUSTRATIONS.ROCKET_BROKEN} withLoader={false} />\n      </FlexView>\n      <Text $renderAs=\"h4\" $marginBottomX={0.5} $color={textColor} $align=\"center\">\n        {title ?? 'Oops! Looks like something went wrong'}\n      </Text>\n      <Text $renderAs=\"body2\" $align=\"center\" $marginBottomX={1.5} $color={textColor}>\n        {description ?? (\n          <>\n            Please try again. Alternatively if that does not work,\n            <br /> please contact support.\n          </>\n        )}\n      </Text>\n      <Button\n        label=\"Try again\"\n        onClick={handleTryAgain}\n        renderAs=\"primary\"\n        size=\"small\"\n        widthX={14}\n      />\n    </FlexView>\n  );\n};\n\nexport default Error;\n"],"names":["Error","props","height","onTryAgain","theme","title","description","handleTryAgain","useCallback","textColor","FlexView","jsx","Image","ILLUSTRATIONS","Text","jsxs","Fragment","Button","Error$1"],"mappings":";;;;;;;AAgBA,MAAMA,IAA+B,CAASC,MAAA;AAC5C,QAAM,EAAE,QAAAC,GAAQ,YAAAC,GAAY,OAAAC,IAAQ,SAAS,OAAAC,GAAO,aAAAC,EAAgB,IAAAL,GAC9DM,IAAiBC,EAAY,MAAM;AACvC,IAAIL,IACSA,MAEX,OAAO,SAAS;EAClB,GACC,CAACA,CAAU,CAAC,GAETM,IAAYL,MAAU,SAAS,eAAe;AAEpD,2BACGM,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,SAASR,GAC/D,UAAA;AAAA,IAAA,gBAAAS;AAAA,MAACD;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,UAAU;AAAA,QACV,gBAAgB;AAAA,QAChB,gBAAgB;AAAA,QAChB,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,aAAY;AAAA,QAEZ,UAAA,gBAAAC,EAACC,GAAM,EAAA,OAAO,KAAK,QAAQ,KAAK,KAAKC,EAAc,eAAe,YAAY,GAAO,CAAA;AAAA,MAAA;AAAA,IACvF;AAAA,IACA,gBAAAF,EAACG,GAAK,EAAA,WAAU,MAAK,gBAAgB,KAAK,QAAQL,GAAW,QAAO,UACjE,UAAAJ,KAAS,wCACZ,CAAA;AAAA,IACA,gBAAAM,EAACG,GAAK,EAAA,WAAU,SAAQ,QAAO,UAAS,gBAAgB,KAAK,QAAQL,GAClE,UAAAH,KACG,gBAAAS,EAAAC,GAAA,EAAA,UAAA;AAAA,MAAA;AAAA,wBAEC,MAAG,EAAA;AAAA,MAAE;AAAA,IAAA,EAAA,CACR,EAEJ,CAAA;AAAA,IACA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,SAASV;AAAA,QACT,UAAS;AAAA,QACT,MAAK;AAAA,QACL,QAAQ;AAAA,MAAA;AAAA,IACV;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAW,IAAelB;"}
+{"version":3,"file":"error.js","sources":["../../../../src/features/ui/error/error.tsx"],"sourcesContent":["import type { TTextVariants } from '../types';\n\nimport React, { useCallback } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Button from '../buttons/button/button';\nimport Image from '../image/image';\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\n\ninterface IErrorProps {\n  onTryAgain?: () => void;\n  height?: string | number;\n  theme?: 'light' | 'dark';\n  title?: string;\n  description?: string;\n  size?: 'compact' | 'full';\n}\n\ninterface IErrorConfig {\n  widthX: number;\n  heightX: number;\n  borderRadiusX: number;\n  marginBottomX: number;\n  title: TTextVariants;\n  description: TTextVariants;\n  imageWidth: number;\n  imageHeight: number;\n}\n\nconst ERROR_CONFIG: Record<'compact' | 'full', IErrorConfig> = {\n  compact: {\n    widthX: 10,\n    heightX: 5,\n    borderRadiusX: 1,\n    marginBottomX: 1,\n    title: 'h6',\n    description: 'body3',\n    imageWidth: 54,\n    imageHeight: 44,\n  },\n  full: {\n    widthX: 22.5,\n    heightX: 11.5,\n    borderRadiusX: 1,\n    marginBottomX: 1.5,\n    title: 'h4',\n    description: 'body2',\n    imageWidth: 122,\n    imageHeight: 100,\n  },\n};\n\nconst Error: React.FC<IErrorProps> = props => {\n  const { height, onTryAgain, theme = 'light', title, description, size = 'full' } = props;\n\n  const handleTryAgain = useCallback(() => {\n    if (onTryAgain) {\n      onTryAgain();\n    } else {\n      window.location.reload();\n    }\n  }, [onTryAgain]);\n\n  const textColor = theme === 'dark' ? 'WHITE_T_87' : 'BLACK_T_87';\n\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\" $height={height}>\n      <FlexView\n        $widthX={ERROR_CONFIG[size].widthX}\n        $heightX={ERROR_CONFIG[size].heightX}\n        $borderRadiusX={ERROR_CONFIG[size].borderRadiusX}\n        $marginBottomX={ERROR_CONFIG[size].marginBottomX}\n        $background=\"GREY_1\"\n        $justifyContent=\"center\"\n        $alignItems=\"center\"\n      >\n        <Image\n          width={ERROR_CONFIG[size].imageWidth}\n          height={ERROR_CONFIG[size].imageHeight}\n          src={ILLUSTRATIONS.ROCKET_BROKEN}\n          withLoader={false}\n        />\n      </FlexView>\n      <Text\n        $renderAs={ERROR_CONFIG[size].title}\n        $marginBottomX={0.5}\n        $color={textColor}\n        $align=\"center\"\n      >\n        {title ?? 'Oops! Looks like something went wrong'}\n      </Text>\n      <Text $renderAs=\"body2\" $align=\"center\" $marginBottomX={1.5} $color={textColor}>\n        {description ?? (\n          <>\n            Please try again. Alternatively if that does not work,\n            <br /> please contact support.\n          </>\n        )}\n      </Text>\n      <Button\n        label=\"Try again\"\n        onClick={handleTryAgain}\n        renderAs=\"primary\"\n        size=\"small\"\n        widthX={14}\n      />\n    </FlexView>\n  );\n};\n\nexport default Error;\n"],"names":["ERROR_CONFIG","Error","props","height","onTryAgain","theme","title","description","size","handleTryAgain","useCallback","textColor","FlexView","jsx","Image","ILLUSTRATIONS","Text","jsxs","Fragment","Button","Error$1"],"mappings":";;;;;;;AA8BA,MAAMA,IAAyD;AAAA,EAC7D,SAAS;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,eAAe;AAAA,IACf,eAAe;AAAA,IACf,OAAO;AAAA,IACP,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AAAA,EACA,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,eAAe;AAAA,IACf,eAAe;AAAA,IACf,OAAO;AAAA,IACP,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AACF,GAEMC,IAA+B,CAASC,MAAA;AACtC,QAAA,EAAE,QAAAC,GAAQ,YAAAC,GAAY,OAAAC,IAAQ,SAAS,OAAAC,GAAO,aAAAC,GAAa,MAAAC,IAAO,OAAW,IAAAN,GAE7EO,IAAiBC,EAAY,MAAM;AACvC,IAAIN,IACSA,MAEX,OAAO,SAAS;EAClB,GACC,CAACA,CAAU,CAAC,GAETO,IAAYN,MAAU,SAAS,eAAe;AAEpD,2BACGO,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,SAAST,GAC/D,UAAA;AAAA,IAAA,gBAAAU;AAAA,MAACD;AAAA,MAAA;AAAA,QACC,SAASZ,EAAaQ,CAAI,EAAE;AAAA,QAC5B,UAAUR,EAAaQ,CAAI,EAAE;AAAA,QAC7B,gBAAgBR,EAAaQ,CAAI,EAAE;AAAA,QACnC,gBAAgBR,EAAaQ,CAAI,EAAE;AAAA,QACnC,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,aAAY;AAAA,QAEZ,UAAA,gBAAAK;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAOd,EAAaQ,CAAI,EAAE;AAAA,YAC1B,QAAQR,EAAaQ,CAAI,EAAE;AAAA,YAC3B,KAAKO,EAAc;AAAA,YACnB,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,IACF;AAAA,IACA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAWhB,EAAaQ,CAAI,EAAE;AAAA,QAC9B,gBAAgB;AAAA,QAChB,QAAQG;AAAA,QACR,QAAO;AAAA,QAEN,UAASL,KAAA;AAAA,MAAA;AAAA,IACZ;AAAA,IACA,gBAAAO,EAACG,GAAK,EAAA,WAAU,SAAQ,QAAO,UAAS,gBAAgB,KAAK,QAAQL,GAClE,UAAAJ,KACG,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,MAAA;AAAA,wBAEC,MAAG,EAAA;AAAA,MAAE;AAAA,IAAA,EAAA,CACR,EAEJ,CAAA;AAAA,IACA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,SAASV;AAAA,QACT,UAAS;AAAA,QACT,MAAK;AAAA,QACL,QAAQ;AAAA,MAAA;AAAA,IACV;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAW,IAAenB;"}

package/dist/features/ui/grade-selector/grade-selector.js

@@ -1,40 +1,46 @@
-import { jsx as r } from "react/jsx-runtime";
-import { GradeSelectorWrapper as a } from "./grade-selector-styled.js";
-import f from "./grade-tab.js";
-function d({
-  selectedValue: t,
-  onSelect: o,
-  tabsWidth: i,
-  width: l,
-  grades: m,
-  renderAs: n,
-  size: c,
-  layoutAlignment: p
+import { jsx as c } from "react/jsx-runtime";
+import { useMemo as h } from "react";
+import { useTheme as s } from "styled-components";
+import { EDeviceType as f } from "../theme/constants.js";
+import { GradeSelectorWrapper as x } from "./grade-selector-styled.js";
+import E from "./grade-tab.js";
+function I({
+  selectedValue: i,
+  onSelect: n,
+  tabsWidth: p,
+  width: u,
+  grades: l,
+  renderAs: d,
+  size: e,
+  sizeOnMobile: m,
+  sizeOnTablet: t,
+  layoutAlignment: a
 }) {
-  return /* @__PURE__ */ r(
-    a,
+  const { device: o } = s(), G = h(() => o <= f.MOBILE ? m || t || e : o <= f.TABLET && t || e, [o, e, m, t]);
+  return /* @__PURE__ */ c(
+    x,
     {
-      width: l,
-      layoutAlignment: p,
+      width: u,
+      layoutAlignment: a,
       $alignItems: "center",
       $flexDirection: "row",
-      children: m.map((e) => /* @__PURE__ */ r(
-        f,
+      children: l.map((r) => /* @__PURE__ */ c(
+        E,
         {
-          label: e === "0" ? "KG" : e,
-          selected: t === e,
-          width: i,
-          onSelect: o,
-          renderAs: n,
-          size: c,
-          grade: e
+          label: r === "0" ? "KG" : r,
+          selected: i === r,
+          width: p,
+          onSelect: n,
+          renderAs: d,
+          size: G,
+          grade: r
         },
-        e
+        r
       ))
     }
   );
 }
 export {
-  d as default
+  I as default
 };
 //# sourceMappingURL=grade-selector.js.map

package/dist/features/ui/grade-selector/grade-selector.js.map

@@ -1 +1 @@
-{"version":3,"file":"grade-selector.js","sources":["../../../../src/features/ui/grade-selector/grade-selector.tsx"],"sourcesContent":["import type { IGradeSelectorProps } from './grade-selector-types';\nimport type { ReactElement } from 'react';\n\nimport * as Styled from './grade-selector-styled';\nimport GradeTab from './grade-tab';\n\nfunction GradeSelector({\n  selectedValue,\n  onSelect,\n  tabsWidth,\n  width,\n  grades,\n  renderAs,\n  size,\n  layoutAlignment,\n}: IGradeSelectorProps): ReactElement {\n  return (\n    <Styled.GradeSelectorWrapper\n      width={width}\n      layoutAlignment={layoutAlignment}\n      $alignItems=\"center\"\n      $flexDirection=\"row\"\n    >\n      {grades.map(grade => {\n        return (\n          <GradeTab\n            key={grade}\n            label={grade === '0' ? 'KG' : grade}\n            selected={selectedValue === grade}\n            width={tabsWidth}\n            onSelect={onSelect}\n            renderAs={renderAs}\n            size={size}\n            grade={grade}\n          />\n        );\n      })}\n    </Styled.GradeSelectorWrapper>\n  );\n}\n\nexport default GradeSelector;\n"],"names":["GradeSelector","selectedValue","onSelect","tabsWidth","width","grades","renderAs","size","layoutAlignment","jsx","Styled.GradeSelectorWrapper","grade","GradeTab"],"mappings":";;;AAMA,SAASA,EAAc;AAAA,EACrB,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,iBAAAC;AACF,GAAsC;AAElC,SAAA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,OAAAN;AAAA,MACA,iBAAAI;AAAA,MACA,aAAY;AAAA,MACZ,gBAAe;AAAA,MAEd,UAAAH,EAAO,IAAI,CAASM,MAEjB,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UAEC,OAAOD,MAAU,MAAM,OAAOA;AAAA,UAC9B,UAAUV,MAAkBU;AAAA,UAC5B,OAAOR;AAAA,UACP,UAAAD;AAAA,UACA,UAAAI;AAAA,UACA,MAAAC;AAAA,UACA,OAAAI;AAAA,QAAA;AAAA,QAPKA;AAAA,MAAA,CAUV;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"grade-selector.js","sources":["../../../../src/features/ui/grade-selector/grade-selector.tsx"],"sourcesContent":["import type { IGradeSelectorProps } from './grade-selector-types';\n\nimport { useMemo, type ReactElement } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { EDeviceType } from '../theme/constants';\nimport * as Styled from './grade-selector-styled';\nimport GradeTab from './grade-tab';\n\nfunction GradeSelector({\n  selectedValue,\n  onSelect,\n  tabsWidth,\n  width,\n  grades,\n  renderAs,\n  size,\n  sizeOnMobile,\n  sizeOnTablet,\n  layoutAlignment,\n}: IGradeSelectorProps): ReactElement {\n  const { device } = useTheme();\n  const renderSize = useMemo(() => {\n    if (device <= EDeviceType.MOBILE) {\n      return sizeOnMobile || sizeOnTablet || size;\n    }\n\n    if (device <= EDeviceType.TABLET) {\n      return sizeOnTablet || size;\n    }\n\n    return size;\n  }, [device, size, sizeOnMobile, sizeOnTablet]);\n\n  return (\n    <Styled.GradeSelectorWrapper\n      width={width}\n      layoutAlignment={layoutAlignment}\n      $alignItems=\"center\"\n      $flexDirection=\"row\"\n    >\n      {grades.map(grade => {\n        return (\n          <GradeTab\n            key={grade}\n            label={grade === '0' ? 'KG' : grade}\n            selected={selectedValue === grade}\n            width={tabsWidth}\n            onSelect={onSelect}\n            renderAs={renderAs}\n            size={renderSize}\n            grade={grade}\n          />\n        );\n      })}\n    </Styled.GradeSelectorWrapper>\n  );\n}\n\nexport default GradeSelector;\n"],"names":["GradeSelector","selectedValue","onSelect","tabsWidth","width","grades","renderAs","size","sizeOnMobile","sizeOnTablet","layoutAlignment","device","useTheme","renderSize","useMemo","EDeviceType","jsx","Styled.GradeSelectorWrapper","grade","GradeTab"],"mappings":";;;;;;AASA,SAASA,EAAc;AAAA,EACrB,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAC;AACF,GAAsC;AAC9B,QAAA,EAAE,QAAAC,MAAWC,KACbC,IAAaC,EAAQ,MACrBH,KAAUI,EAAY,SACjBP,KAAgBC,KAAgBF,IAGrCI,KAAUI,EAAY,UACjBN,KAAgBF,GAIxB,CAACI,GAAQJ,GAAMC,GAAcC,CAAY,CAAC;AAG3C,SAAA,gBAAAO;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,OAAAb;AAAA,MACA,iBAAAM;AAAA,MACA,aAAY;AAAA,MACZ,gBAAe;AAAA,MAEd,UAAAL,EAAO,IAAI,CAASa,MAEjB,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UAEC,OAAOD,MAAU,MAAM,OAAOA;AAAA,UAC9B,UAAUjB,MAAkBiB;AAAA,UAC5B,OAAOf;AAAA,UACP,UAAAD;AAAA,UACA,UAAAI;AAAA,UACA,MAAMO;AAAA,UACN,OAAAK;AAAA,QAAA;AAAA,QAPKA;AAAA,MAAA,CAUV;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/features/ui/image/image.js

@@ -14,7 +14,7 @@ const p = t(i)`
   overflow: hidden;
   position: relative;
 `, u = g(
-  ({ borderRadius: n = 0, borderColor: r, withLoader: a, ...o }) => {
+  ({ borderRadius: n = 0, borderColor: r, withLoader: a = !1, ...o }) => {
     const { width: s, height: d } = o, [m, l] = f(!0);
     return /* @__PURE__ */ h(
       L,

package/dist/features/ui/image/image.js.map

@@ -1 +1 @@
-{"version":3,"file":"image.js","sources":["../../../../src/features/ui/image/image.tsx"],"sourcesContent":["import type { IImageProps } from './image-types';\n\nimport { useState, memo } from 'react';\nimport styled from 'styled-components';\n\nimport { skeletonLoadingAnimation } from '../constants/style';\nimport FlexView from '../layout/flex-view';\n\nconst LoadingFlexView = styled(FlexView)`\n  animation: ${skeletonLoadingAnimation} 2s linear infinite;\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0;\n`;\n\nconst ImageWrapper = styled(FlexView)`\n  overflow: hidden;\n  position: relative;\n`;\n\nconst Image: React.FC<IImageProps> = memo(\n  ({ borderRadius = 0, borderColor, withLoader, ...props }) => {\n    const { width, height } = props;\n    const [isLoading, setIsLoading] = useState(true);\n    const handleImgLoaded = () => {\n      setIsLoading(false);\n    };\n    const showLoader = isLoading && withLoader;\n\n    return (\n      <ImageWrapper\n        $width={width}\n        $height={height}\n        $borderColor={borderColor}\n        $borderRadius={borderRadius}\n      >\n        {showLoader && <LoadingFlexView $inherit={true} />}\n        <img onLoad={handleImgLoaded} {...props} />\n      </ImageWrapper>\n    );\n  },\n);\n\nexport default Image;\n"],"names":["LoadingFlexView","styled","FlexView","skeletonLoadingAnimation","ImageWrapper","Image","memo","borderRadius","borderColor","withLoader","props","width","height","isLoading","setIsLoading","useState","jsxs","jsx","Image$1"],"mappings":";;;;;AAQA,MAAMA,IAAkBC,EAAOC,CAAQ;AAAA,eACxBC,CAAwB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQjCC,IAAeH,EAAOC,CAAQ;AAAA;AAAA;AAAA,GAK9BG,IAA+BC;AAAA,EACnC,CAAC,EAAE,cAAAC,IAAe,GAAG,aAAAC,GAAa,YAAAC,GAAY,GAAGC,QAAY;AACrD,UAAA,EAAE,OAAAC,GAAO,QAAAC,EAAW,IAAAF,GACpB,CAACG,GAAWC,CAAY,IAAIC,EAAS,EAAI;AAO7C,WAAA,gBAAAC;AAAA,MAACZ;AAAA,MAAA;AAAA,QACC,QAAQO;AAAA,QACR,SAASC;AAAA,QACT,cAAcJ;AAAA,QACd,eAAeD;AAAA,QAEd,UAAA;AAAA,UATcM,KAAaJ,KASb,gBAAAQ,EAACjB,GAAgB,EAAA,UAAU,GAAM,CAAA;AAAA,UAC/C,gBAAAiB,EAAA,OAAA,EAAI,QAbe,MAAM;AAC5B,YAAAH,EAAa,EAAK;AAAA,UAAA,GAYe,GAAGJ,EAAO,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG/C;AACF,GAEAQ,IAAeb;"}
+{"version":3,"file":"image.js","sources":["../../../../src/features/ui/image/image.tsx"],"sourcesContent":["import type { IImageProps } from './image-types';\n\nimport { useState, memo } from 'react';\nimport styled from 'styled-components';\n\nimport { skeletonLoadingAnimation } from '../constants/style';\nimport FlexView from '../layout/flex-view';\n\nconst LoadingFlexView = styled(FlexView)`\n  animation: ${skeletonLoadingAnimation} 2s linear infinite;\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0;\n`;\n\nconst ImageWrapper = styled(FlexView)`\n  overflow: hidden;\n  position: relative;\n`;\n\nconst Image: React.FC<IImageProps> = memo(\n  ({ borderRadius = 0, borderColor, withLoader = false, ...props }) => {\n    const { width, height } = props;\n    const [isLoading, setIsLoading] = useState(true);\n    const handleImgLoaded = () => {\n      setIsLoading(false);\n    };\n    const showLoader = isLoading && withLoader;\n\n    return (\n      <ImageWrapper\n        $width={width}\n        $height={height}\n        $borderColor={borderColor}\n        $borderRadius={borderRadius}\n      >\n        {showLoader && <LoadingFlexView $inherit={true} />}\n        <img onLoad={handleImgLoaded} {...props} />\n      </ImageWrapper>\n    );\n  },\n);\n\nexport default Image;\n"],"names":["LoadingFlexView","styled","FlexView","skeletonLoadingAnimation","ImageWrapper","Image","memo","borderRadius","borderColor","withLoader","props","width","height","isLoading","setIsLoading","useState","jsxs","jsx","Image$1"],"mappings":";;;;;AAQA,MAAMA,IAAkBC,EAAOC,CAAQ;AAAA,eACxBC,CAAwB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQjCC,IAAeH,EAAOC,CAAQ;AAAA;AAAA;AAAA,GAK9BG,IAA+BC;AAAA,EACnC,CAAC,EAAE,cAAAC,IAAe,GAAG,aAAAC,GAAa,YAAAC,IAAa,IAAO,GAAGC,QAAY;AAC7D,UAAA,EAAE,OAAAC,GAAO,QAAAC,EAAW,IAAAF,GACpB,CAACG,GAAWC,CAAY,IAAIC,EAAS,EAAI;AAO7C,WAAA,gBAAAC;AAAA,MAACZ;AAAA,MAAA;AAAA,QACC,QAAQO;AAAA,QACR,SAASC;AAAA,QACT,cAAcJ;AAAA,QACd,eAAeD;AAAA,QAEd,UAAA;AAAA,UATcM,KAAaJ,KASb,gBAAAQ,EAACjB,GAAgB,EAAA,UAAU,GAAM,CAAA;AAAA,UAC/C,gBAAAiB,EAAA,OAAA,EAAI,QAbe,MAAM;AAC5B,YAAAH,EAAa,EAAK;AAAA,UAAA,GAYe,GAAGJ,EAAO,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG/C;AACF,GAEAQ,IAAeb;"}

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

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

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    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      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        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","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,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,aAAa,CAACG,GAAGC,MAAM;;AAAA,gBAAAJ,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,YAAYG,GAAGC;AAAA;AAAA,IAAC;AAAA,IAEpE,CAAC;AAAA,EAAA,GAGHC,EAAU,MAAM;AACd,QAAIC,IAAY;AA4CF,YA1CQ,YAAY;AAC5B,UAAA;AACI,cAAAC,IAAgB,MAAMC,EAAYtB,CAAG;AAI3C,8BAAsB,MAAM;AACtB,UAAA,CAACO,EAAU,WAAWa,MAERX,EAAA,UAAUc,EAAO,cAAc;AAAA,YAC/C,WAAWhB,EAAU;AAAA,YACrB,eAAAc;AAAA,YACA,MAAM;AAAA,YACN,UAAU;AAAA,YACV,GAAGlB;AAAA,UAAA,CACJ,GAEGG,MACFI,EAAqB,UAAU,IAAI;AAAA,YACjC,CAAC,CAACc,CAAK,MAAM;;AACP,cAAAA,KAASA,EAAM,kBACjBV,IAAAL,EAAkB,YAAlB,QAAAK,EAA2B,UAE3BW,IAAAhB,EAAkB,YAAlB,QAAAgB,EAA2B;AAAA,YAE/B;AAAA,YACA,EAAE,WAAW,EAAE;AAAA,UAAA,GAGIf,EAAA,QAAQ,QAAQH,EAAU,OAAO,IAG7CF,KAAA,QAAAA,KACPD,KACFK,EAAkB,QAAQ,iBAAiBL,EAAc,MAAMA,EAAc,QAAQ;AAAA,QACvF,CACD;AAAA,eACMsB,GAAO;AACR,cAAA,MAAM,mCAAmCA,CAAK,EAAE;AAAA,MACxD;AAAA,IAAA,MAKK,MAAM;;AACC,MAAAN,IAAA,IACRX,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,qBAEvDwB,GAAS,EAAA,KAAKpB,GAAW,QAAQN,GAAO,SAASC,EAAQ,CAAA;AACnE,CAAC,GAEc0B,IAAAC,EAAKjC,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    }),\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","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,IAAK;AAAA,IAE9C,CAAC;AAAA,EAAA,GAGHG,EAAU,MAAM;AACd,QAAIC,IAAY;AA4CF,YA1CQ,YAAY;AAC5B,UAAA;AACI,cAAAC,IAAgB,MAAMC,EAAYpB,CAAG;AAI3C,8BAAsB,MAAM;AACtB,UAAA,CAACO,EAAU,WAAWW,MAERT,EAAA,UAAUY,EAAO,cAAc;AAAA,YAC/C,WAAWd,EAAU;AAAA,YACrB,eAAAY;AAAA,YACA,MAAM;AAAA,YACN,UAAU;AAAA,YACV,GAAGhB;AAAA,UAAA,CACJ,GAEGG,MACFI,EAAqB,UAAU,IAAI;AAAA,YACjC,CAAC,CAACY,CAAK,MAAM;;AACP,cAAAA,KAASA,EAAM,kBACjBR,IAAAL,EAAkB,YAAlB,QAAAK,EAA2B,UAE3BS,IAAAd,EAAkB,YAAlB,QAAAc,EAA2B;AAAA,YAE/B;AAAA,YACA,EAAE,WAAW,EAAE;AAAA,UAAA,GAGIb,EAAA,QAAQ,QAAQH,EAAU,OAAO,IAG7CF,KAAA,QAAAA,KACPD,KACFK,EAAkB,QAAQ,iBAAiBL,EAAc,MAAMA,EAAc,QAAQ;AAAA,QACvF,CACD;AAAA,eACMoB,GAAO;AACR,cAAA,MAAM,mCAAmCA,CAAK,EAAE;AAAA,MACxD;AAAA,IAAA,MAKK,MAAM;;AACC,MAAAN,IAAA,IACRT,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,qBAEvDsB,GAAS,EAAA,KAAKlB,GAAW,QAAQN,GAAO,SAASC,EAAQ,CAAA;AACnE,CAAC,GAEcwB,IAAAC,EAAK/B,CAAe;"}