@cuemath/leap 3.2.24-mb → 3.2.25-m

package/dist/features/notification/notification.js

@@ -0,0 +1,129 @@
+import { jsxs as w, jsx as l } from "react/jsx-runtime";
+import { useEffect as e } from "react";
+import x, { keyframes as A, css as I } from "styled-components";
+import T from "../../assets/line-icons/icons/cross.js";
+import W from "../ui/layout/flex-view.js";
+import k from "../ui/text/text.js";
+const C = ({ $position: r, $verticalDist: o }) => A`
+  ${(r === "top-right" || r === "top-left") && `
+    0% {
+        top: 0;
+    }
+    100% {
+        top: ${o}px;
+    }
+  `};
+  ${(r === "bottom-left" || r === "bottom-right") && `
+    0% {
+        bottom: 0;
+    }
+    100% {
+        bottom: ${o}px;
+    }
+  `};
+`, E = ({ $position: r, $verticalDist: o, $horizontalDist: t }) => I`
+  ${r === "top-right" && `
+    top: ${o}px;
+    right: ${t}px;
+  `};
+  ${r === "top-left" && `
+	top: ${o}px;
+    left: ${t}px;
+  `};
+  ${r === "bottom-left" && `
+    bottom: ${o}px;
+    left: ${t}px;
+  `};
+  ${r === "bottom-right" && `
+    bottom: ${o}px;
+    right: ${t}px;
+  `};
+`, m = x.div`
+  position: fixed;
+  width: 310px;
+  padding: ${({ $gap: r, $gutter: o }) => `${r}px ${o}px`};
+  box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);
+  border-radius: 16px;
+  ${E};
+  animation: ${C} 0.5s ease-in;
+  z-index: 105;
+  background: ${({ $notificationTheme: r, theme: o }) => {
+  var t, p;
+  return r === "white" ? (t = o == null ? void 0 : o.colors) == null ? void 0 : t.WHITE : (p = o == null ? void 0 : o.colors) == null ? void 0 : p.BLACK;
+}};
+  color: ${({ $notificationTheme: r, theme: o }) => {
+  var t, p;
+  return r === "white" ? (t = o == null ? void 0 : o.colors) == null ? void 0 : t.BLACK : (p = o == null ? void 0 : o.colors) == null ? void 0 : p.WHITE;
+}};
+`, B = x.div`
+  width: 48px;
+  height: 48px;
+  background: ${({ $src: r }) => `url(${r})`};
+  border-radius: 50%;
+  border: 2px solid #ffffff;
+  position: absolute;
+  bottom: 88%;
+`, H = x(W)`
+  position: absolute;
+  top: -40px;
+  right: 0;
+  cursor: pointer;
+`, K = x(k)`
+  white-space: pre-wrap;
+`, L = ({
+  avatarUrl: r = null,
+  Component: o = null,
+  componentProps: t = {},
+  duration: p = null,
+  gap: f = 24,
+  gutter: u = 16,
+  hideNotification: c = () => null,
+  horizontalDist: $ = 50,
+  notificationTheme: s = "black",
+  position: i = "bottom-right",
+  showCloseIcon: b = !1,
+  text: d = null,
+  verticalDist: a = 60,
+  visible: n = !1
+}) => (e(() => {
+  if (p && n) {
+    const g = setTimeout(() => {
+      c();
+    }, p * 1e3);
+    return () => {
+      clearTimeout(g);
+    };
+  }
+  return () => {
+  };
+}, [p, c, n]), n ? /* @__PURE__ */ w(
+  m,
+  {
+    $gap: f,
+    $gutter: u,
+    $horizontalDist: $,
+    $notificationTheme: s,
+    $position: i,
+    $verticalDist: a,
+    children: [
+      b && /* @__PURE__ */ l(
+        H,
+        {
+          onClick: c,
+          $background: s === "white" ? "WHITE" : "BLACK",
+          $borderRadiusX: 10,
+          $gutter: 2,
+          $gap: 2,
+          children: /* @__PURE__ */ l(T, { color: s === "white" ? "BLACK" : "WHITE" })
+        }
+      ),
+      r && /* @__PURE__ */ l(B, { $src: r }),
+      d && /* @__PURE__ */ l(K, { $renderAs: "ub3", $color: s === "white" ? "BLACK" : "WHITE", children: d }),
+      o && /* @__PURE__ */ l(o, { ...t })
+    ]
+  }
+) : null), V = L;
+export {
+  V as default
+};
+//# sourceMappingURL=notification.js.map

package/dist/features/notification/notification.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification.js","sources":["../../../src/features/notification/notification.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport styled, { keyframes, css } from 'styled-components';\n\nimport CrossIcon from '../../assets/line-icons/icons/cross';\nimport FlexView from '../ui/layout/flex-view';\nimport Text from '../ui/text/text';\n\ntype Position = 'top-right' | 'top-left' | 'bottom-left' | 'bottom-right';\ntype NotificationTheme = 'white' | 'black';\n\ninterface SlideProps {\n  $position: Position;\n  $verticalDist: number;\n}\n\ninterface PositionProps {\n  $position: Position;\n  $verticalDist: number;\n  $horizontalDist: number;\n}\n\ninterface WrapperProps extends PositionProps {\n  $gap: number;\n  $gutter: number;\n  $notificationTheme: NotificationTheme;\n}\n\ninterface AvatarWrapperProps {\n  $src: string;\n}\n\ninterface NotificationProps {\n  avatarUrl?: string | null;\n  Component?: React.ComponentType<Record<string, unknown>> | null;\n  componentProps?: Record<string, unknown>;\n  duration?: number | null;\n  gap?: number;\n  gutter?: number;\n  hideNotification?: () => void;\n  horizontalDist?: number;\n  notificationTheme?: NotificationTheme;\n  position?: Position;\n  showCloseIcon?: boolean;\n  text?: string | null;\n  verticalDist?: number;\n  visible?: boolean;\n}\n\nconst slide = ({ $position, $verticalDist }: SlideProps) => keyframes`\n  ${\n    ($position === 'top-right' || $position === 'top-left') &&\n    `\n    0% {\n        top: 0;\n    }\n    100% {\n        top: ${$verticalDist}px;\n    }\n  `\n  };\n  ${\n    ($position === 'bottom-left' || $position === 'bottom-right') &&\n    `\n    0% {\n        bottom: 0;\n    }\n    100% {\n        bottom: ${$verticalDist}px;\n    }\n  `\n  };\n`;\n\nconst notificationPostion = ({ $position, $verticalDist, $horizontalDist }: PositionProps) => css`\n  ${$position === 'top-right' &&\n  `\n    top: ${$verticalDist}px;\n    right: ${$horizontalDist}px;\n  `};\n  ${$position === 'top-left' &&\n  `\n\ttop: ${$verticalDist}px;\n    left: ${$horizontalDist}px;\n  `};\n  ${$position === 'bottom-left' &&\n  `\n    bottom: ${$verticalDist}px;\n    left: ${$horizontalDist}px;\n  `};\n  ${$position === 'bottom-right' &&\n  `\n    bottom: ${$verticalDist}px;\n    right: ${$horizontalDist}px;\n  `};\n`;\n\nconst Wrapper = styled.div<WrapperProps>`\n  position: fixed;\n  width: 310px;\n  padding: ${({ $gap, $gutter }) => `${$gap}px ${$gutter}px`};\n  box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.05);\n  border-radius: 16px;\n  ${notificationPostion};\n  animation: ${slide} 0.5s ease-in;\n  z-index: 105;\n  background: ${({ $notificationTheme, theme }) =>\n    $notificationTheme === 'white' ? theme?.colors?.WHITE : theme?.colors?.BLACK};\n  color: ${({ $notificationTheme, theme }) =>\n    $notificationTheme === 'white' ? theme?.colors?.BLACK : theme?.colors?.WHITE};\n`;\n\nconst AvatarWrapper = styled.div<AvatarWrapperProps>`\n  width: 48px;\n  height: 48px;\n  background: ${({ $src }) => `url(${$src})`};\n  border-radius: 50%;\n  border: 2px solid #ffffff;\n  position: absolute;\n  bottom: 88%;\n`;\n\nconst StyledIcon = styled(FlexView)`\n  position: absolute;\n  top: -40px;\n  right: 0;\n  cursor: pointer;\n`;\n\nconst StyledText = styled(Text)`\n  white-space: pre-wrap;\n`;\n\nconst Notification: React.FC<NotificationProps> = ({\n  avatarUrl = null,\n  Component = null,\n  componentProps = {},\n  duration = null,\n  gap = 24,\n  gutter = 16,\n  hideNotification = () => null,\n  horizontalDist = 50,\n  notificationTheme = 'black',\n  position = 'bottom-right',\n  showCloseIcon = false,\n  text = null,\n  verticalDist = 60,\n  visible = false,\n}) => {\n  useEffect(() => {\n    if (duration && visible) {\n      const countdown = setTimeout(() => {\n        hideNotification();\n      }, duration * 1000);\n\n      return () => {\n        clearTimeout(countdown);\n      };\n    }\n\n    return () => {};\n  }, [duration, hideNotification, visible]);\n\n  if (!visible) return null;\n\n  return (\n    <Wrapper\n      $gap={gap}\n      $gutter={gutter}\n      $horizontalDist={horizontalDist}\n      $notificationTheme={notificationTheme}\n      $position={position}\n      $verticalDist={verticalDist}\n    >\n      {showCloseIcon && (\n        <StyledIcon\n          onClick={hideNotification}\n          $background={notificationTheme === 'white' ? 'WHITE' : 'BLACK'}\n          $borderRadiusX={10}\n          $gutter={2}\n          $gap={2}\n        >\n          <CrossIcon color={notificationTheme === 'white' ? 'BLACK' : 'WHITE'} />\n        </StyledIcon>\n      )}\n      {avatarUrl && <AvatarWrapper $src={avatarUrl} />}\n      {text && (\n        <StyledText $renderAs=\"ub3\" $color={notificationTheme === 'white' ? 'BLACK' : 'WHITE'}>\n          {text}\n        </StyledText>\n      )}\n      {Component && <Component {...componentProps} />}\n    </Wrapper>\n  );\n};\n\nexport default Notification;\n"],"names":["slide","$position","$verticalDist","keyframes","notificationPostion","$horizontalDist","css","Wrapper","styled","$gap","$gutter","$notificationTheme","theme","_a","_b","AvatarWrapper","$src","StyledIcon","FlexView","StyledText","Text","Notification","avatarUrl","Component","componentProps","duration","gap","gutter","hideNotification","horizontalDist","notificationTheme","position","showCloseIcon","text","verticalDist","visible","useEffect","countdown","jsxs","jsx","CrossIcon","Notification$1"],"mappings":"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"}

package/dist/features/stickers/stickers-effects/stickers-cache.js

@@ -1,13 +1,19 @@
 const o = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map();
-async function s(e) {
-  if (o.has(e))
-    return o.get(e);
-  if (n.has(e))
-    return n.get(e);
-  const r = fetch(e).then((t) => t.ok ? t.json() : null).then((t) => (t && o.set(e, t), n.delete(e), t)).catch((t) => (console.error("Lottie preload error:", t), n.delete(e), null));
-  return n.set(e, r), r;
+async function r(t) {
+  if (o.has(t))
+    return o.get(t);
+  if (n.has(t))
+    return n.get(t);
+  const i = fetch(t).then(async (e) => {
+    if (!e.ok) return null;
+    const a = t.endsWith(".lottie") ? await e.arrayBuffer() : await e.json();
+    return o.set(t, a), a;
+  }).catch((e) => (console.error("Lottie preload error:", e), null)).finally(() => {
+    n.delete(t);
+  });
+  return n.set(t, i), i;
 }
 export {
-  s as preloadLottieFile
+  r as preloadLottieFile
 };
 //# sourceMappingURL=stickers-cache.js.map

package/dist/features/stickers/stickers-effects/stickers-cache.js.map

@@ -1 +1 @@
-{"version":3,"file":"stickers-cache.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-cache.ts"],"sourcesContent":["const lottieCache = new Map<string, object>();\nconst lottiePromises = new Map<string, Promise<object | null>>();\n\nexport async function preloadLottieFile(url: string): Promise<object | null> {\n  if (lottieCache.has(url)) {\n    return lottieCache.get(url)!;\n  }\n\n  if (lottiePromises.has(url)) {\n    return lottiePromises.get(url)!;\n  }\n\n  const fetchPromise = fetch(url)\n    .then(res => (res.ok ? res.json() : null))\n    .then(data => {\n      if (data) lottieCache.set(url, data);\n      lottiePromises.delete(url);\n\n      return data;\n    })\n    .catch(err => {\n      // eslint-disable-next-line no-console\n      console.error('Lottie preload error:', err);\n      lottiePromises.delete(url);\n\n      return null;\n    });\n\n  lottiePromises.set(url, fetchPromise);\n\n  return fetchPromise;\n}\n"],"names":["lottieCache","lottiePromises","preloadLottieFile","url","fetchPromise","res","data","err"],"mappings":"AAAA,MAAMA,wBAAkB,OAClBC,wBAAqB;AAE3B,eAAsBC,EAAkBC,GAAqC;AACvE,MAAAH,EAAY,IAAIG,CAAG;AACd,WAAAH,EAAY,IAAIG,CAAG;AAGxB,MAAAF,EAAe,IAAIE,CAAG;AACjB,WAAAF,EAAe,IAAIE,CAAG;AAG/B,QAAMC,IAAe,MAAMD,CAAG,EAC3B,KAAK,CAAQE,MAAAA,EAAI,KAAKA,EAAI,KAAK,IAAI,IAAK,EACxC,KAAK,CAAQC,OACRA,KAAMN,EAAY,IAAIG,GAAKG,CAAI,GACnCL,EAAe,OAAOE,CAAG,GAElBG,EACR,EACA,MAAM,CAAOC,OAEJ,QAAA,MAAM,yBAAyBA,CAAG,GAC1CN,EAAe,OAAOE,CAAG,GAElB,KACR;AAEY,SAAAF,EAAA,IAAIE,GAAKC,CAAY,GAE7BA;AACT;"}
+{"version":3,"file":"stickers-cache.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-cache.ts"],"sourcesContent":["import type { Data } from '@lottiefiles/dotlottie-web';\n\nconst lottieCache = new Map<string, Data>();\nconst lottiePromises = new Map<string, Promise<Data | null>>();\n\nexport async function preloadLottieFile(url: string): Promise<Data | null> {\n  if (lottieCache.has(url)) {\n    return lottieCache.get(url)!;\n  }\n\n  if (lottiePromises.has(url)) {\n    return lottiePromises.get(url)!;\n  }\n\n  const fetchPromise = fetch(url)\n    .then(async res => {\n      if (!res.ok) return null;\n\n      const isLottieFile = url.endsWith('.lottie');\n      const data = isLottieFile ? await res.arrayBuffer() : await res.json();\n\n      lottieCache.set(url, data);\n\n      return data;\n    })\n    .catch(err => {\n      // eslint-disable-next-line no-console\n      console.error('Lottie preload error:', err);\n\n      return null;\n    })\n    .finally(() => {\n      lottiePromises.delete(url);\n    });\n\n  lottiePromises.set(url, fetchPromise);\n\n  return fetchPromise;\n}\n"],"names":["lottieCache","lottiePromises","preloadLottieFile","url","fetchPromise","res","data","err"],"mappings":"AAEA,MAAMA,wBAAkB,OAClBC,wBAAqB;AAE3B,eAAsBC,EAAkBC,GAAmC;AACrE,MAAAH,EAAY,IAAIG,CAAG;AACd,WAAAH,EAAY,IAAIG,CAAG;AAGxB,MAAAF,EAAe,IAAIE,CAAG;AACjB,WAAAF,EAAe,IAAIE,CAAG;AAG/B,QAAMC,IAAe,MAAMD,CAAG,EAC3B,KAAK,OAAME,MAAO;AACb,QAAA,CAACA,EAAI,GAAW,QAAA;AAGd,UAAAC,IADeH,EAAI,SAAS,SAAS,IACf,MAAME,EAAI,gBAAgB,MAAMA,EAAI;AAEpD,WAAAL,EAAA,IAAIG,GAAKG,CAAI,GAElBA;AAAA,EAAA,CACR,EACA,MAAM,CAAOC,OAEJ,QAAA,MAAM,yBAAyBA,CAAG,GAEnC,KACR,EACA,QAAQ,MAAM;AACb,IAAAN,EAAe,OAAOE,CAAG;AAAA,EAAA,CAC1B;AAEY,SAAAF,EAAA,IAAIE,GAAKC,CAAY,GAE7BA;AACT;"}

package/dist/features/stickers/stickers-effects/stickers-effects.js

@@ -1,27 +1,27 @@
-import { jsx as c, Fragment as E } from "react/jsx-runtime";
-import { memo as u, useState as f, useEffect as h } from "react";
-import F from "../../ui/lottie-animation/lottie-animation.js";
+import { jsx as s, Fragment as E } from "react/jsx-runtime";
+import { memo as u, useState as f, useEffect as d } from "react";
+import F from "../../ui/dot-lottie-animations/dot-lottie-animation.js";
 import { preloadLottieFile as g } from "./stickers-cache.js";
 import { generateStickerData as z } from "./stickers-effects-helper.js";
 import { Container as L, Sticker as T } from "./stickers-effects-styled.js";
-const $ = u(({ url: t, sticker: o, size: s }) => {
+const $ = u(({ url: t, sticker: o, size: a }) => {
   const [i, m] = f(), [n, e] = f(!1);
-  return h(() => {
+  return d(() => {
     let r = !0;
     if (t)
-      return g(t).then((a) => {
-        r && (a ? m(a) : e(!0));
+      return g(t).then((c) => {
+        r && (c ? m(c) : e(!0));
       }).catch(() => {
         r && e(!0);
       }), () => {
         r = !1;
       };
-  }, [t]), !t || n || !i ? /* @__PURE__ */ c(E, { children: o }) : /* @__PURE__ */ c(F, { src: i, width: s, height: s, onError: () => e(!0) });
-}), b = ({ stickers: t, effect: o, count: s, duration: i }) => {
+  }, [t]), !t || n || !i ? /* @__PURE__ */ s(E, { children: o }) : /* @__PURE__ */ s(F, { data: i, width: a, height: a, onError: () => e(!0) });
+}), b = ({ stickers: t, effect: o, count: a, duration: i }) => {
   const [m, n] = f([]);
-  return h(() => {
+  return d(() => {
     const e = z({
-      count: s,
+      count: a,
       effect: o,
       stickers: t,
       minSize: 32,
@@ -30,21 +30,21 @@ const $ = u(({ url: t, sticker: o, size: s }) => {
     n(e);
     const r = setTimeout(() => n([]), i);
     return () => clearTimeout(r);
-  }, [t, o, s, i]), /* @__PURE__ */ c(L, { children: m.map((e, r) => {
-    const { id: a, sticker: k, lottie: p, x: S, y: d, size: l, fromX: x, fromY: D } = e;
-    return /* @__PURE__ */ c(
+  }, [t, o, a, i]), /* @__PURE__ */ s(L, { children: m.map((e, r) => {
+    const { id: c, sticker: h, lottie: k, x: p, y: S, size: l, fromX: D, fromY: x } = e;
+    return /* @__PURE__ */ s(
       T,
       {
         effect: o,
         duration: i,
-        fromX: x,
-        fromY: D,
-        x: S,
-        y: d,
+        fromX: D,
+        fromY: x,
+        x: p,
+        y: S,
         size: l,
-        children: /* @__PURE__ */ c($, { url: p, sticker: k, size: l })
+        children: /* @__PURE__ */ s($, { url: k, sticker: h, size: l })
       },
-      `${a}-${r}`
+      `${c}-${r}`
     );
   }) });
 }, W = u(b);

package/dist/features/stickers/stickers-effects/stickers-effects.js.map

@@ -1 +1 @@
-{"version":3,"file":"stickers-effects.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-effects.tsx"],"sourcesContent":["import type { TStickerData, IStickersProps } from './stickers-effects-types';\n\nimport React, { memo, useEffect, useState } from 'react';\n\nimport LottieAnimation from '../../ui/lottie-animation/lottie-animation';\nimport { preloadLottieFile } from './stickers-cache';\nimport { generateStickerData } from './stickers-effects-helper';\nimport * as S from './stickers-effects-styled';\n\nconst StickerWithFallback: React.FC<{\n  url?: string;\n  sticker: string;\n  size: number;\n}> = memo(({ url, sticker, size }) => {\n  const [src, setSrc] = useState<string | object | undefined>();\n  const [failed, setFailed] = useState(false);\n\n  useEffect(() => {\n    let isMounted = true;\n\n    if (!url) return;\n\n    preloadLottieFile(url)\n      .then(result => {\n        if (isMounted) {\n          if (result) {\n            setSrc(result);\n          } else {\n            setFailed(true);\n          }\n        }\n      })\n      .catch(() => {\n        if (isMounted) setFailed(true);\n      });\n\n    return () => {\n      isMounted = false;\n    };\n  }, [url]);\n\n  if (!url || failed || !src) {\n    return <>{sticker}</>;\n  }\n\n  return <LottieAnimation src={src} width={size} height={size} onError={() => setFailed(true)} />;\n});\n\nconst StickersEffects: React.FC<IStickersProps> = ({ stickers, effect, count, duration }) => {\n  const [stickersData, setStickersData] = useState<ReturnType<typeof generateStickerData>>([]);\n\n  useEffect(() => {\n    const stickerData = generateStickerData({\n      count,\n      effect,\n      stickers,\n      minSize: 32,\n      maxSize: 48,\n    });\n\n    setStickersData(stickerData);\n\n    const timeout = setTimeout(() => setStickersData([]), duration);\n\n    return () => clearTimeout(timeout);\n  }, [stickers, effect, count, duration]);\n\n  return (\n    <S.Container>\n      {stickersData.map((data: TStickerData, i) => {\n        const { id, sticker, lottie, x, y, size, fromX, fromY } = data;\n\n        return (\n          <S.Sticker\n            key={`${id}-${i}`}\n            effect={effect}\n            duration={duration}\n            fromX={fromX}\n            fromY={fromY}\n            x={x}\n            y={y}\n            size={size}\n          >\n            <StickerWithFallback url={lottie} sticker={sticker} size={size} />\n          </S.Sticker>\n        );\n      })}\n    </S.Container>\n  );\n};\n\nexport default memo(StickersEffects);\n"],"names":["StickerWithFallback","memo","url","sticker","size","src","setSrc","useState","failed","setFailed","useEffect","isMounted","preloadLottieFile","result","jsx","LottieAnimation","StickersEffects","stickers","effect","count","duration","stickersData","setStickersData","stickerData","generateStickerData","timeout","S.Container","data","i","id","lottie","x","y","fromX","fromY","S.Sticker","stickersEffects"],"mappings":";;;;;;AASA,MAAMA,IAIDC,EAAK,CAAC,EAAE,KAAAC,GAAK,SAAAC,GAAS,MAAAC,QAAW;AACpC,QAAM,CAACC,GAAKC,CAAM,IAAIC,EAAsC,GACtD,CAACC,GAAQC,CAAS,IAAIF,EAAS,EAAK;AA0B1C,SAxBAG,EAAU,MAAM;AACd,QAAIC,IAAY;AAEhB,QAAKT;AAEa,aAAAU,EAAAV,CAAG,EAClB,KAAK,CAAUW,MAAA;AACd,QAAIF,MACEE,IACFP,EAAOO,CAAM,IAEbJ,EAAU,EAAI;AAAA,MAElB,CACD,EACA,MAAM,MAAM;AACP,QAAAE,OAAqB,EAAI;AAAA,MAAA,CAC9B,GAEI,MAAM;AACC,QAAAA,IAAA;AAAA,MAAA;AAAA,EACd,GACC,CAACT,CAAG,CAAC,GAEJ,CAACA,KAAOM,KAAU,CAACH,2BACX,UAAQF,EAAA,CAAA,IAGb,gBAAAW,EAACC,GAAgB,EAAA,KAAAV,GAAU,OAAOD,GAAM,QAAQA,GAAM,SAAS,MAAMK,EAAU,EAAI,EAAG,CAAA;AAC/F,CAAC,GAEKO,IAA4C,CAAC,EAAE,UAAAC,GAAU,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,QAAe;AAC3F,QAAM,CAACC,GAAcC,CAAe,IAAIf,EAAiD,CAAE,CAAA;AAE3F,SAAAG,EAAU,MAAM;AACd,UAAMa,IAAcC,EAAoB;AAAA,MACtC,OAAAL;AAAA,MACA,QAAAD;AAAA,MACA,UAAAD;AAAA,MACA,SAAS;AAAA,MACT,SAAS;AAAA,IAAA,CACV;AAED,IAAAK,EAAgBC,CAAW;AAE3B,UAAME,IAAU,WAAW,MAAMH,EAAgB,CAAE,CAAA,GAAGF,CAAQ;AAEvD,WAAA,MAAM,aAAaK,CAAO;AAAA,KAChC,CAACR,GAAUC,GAAQC,GAAOC,CAAQ,CAAC,GAGpC,gBAAAN,EAACY,GAAA,EACE,YAAa,IAAI,CAACC,GAAoBC,MAAM;AACrC,UAAA,EAAE,IAAAC,GAAI,SAAA1B,GAAS,QAAA2B,GAAQ,GAAAC,GAAG,GAAAC,GAAG,MAAA5B,GAAM,OAAA6B,GAAO,OAAAC,EAAU,IAAAP;AAGxD,WAAA,gBAAAb;AAAA,MAACqB;AAAAA,MAAA;AAAA,QAEC,QAAAjB;AAAA,QACA,UAAAE;AAAA,QACA,OAAAa;AAAA,QACA,OAAAC;AAAA,QACA,GAAAH;AAAA,QACA,GAAAC;AAAA,QACA,MAAA5B;AAAA,QAEA,UAAC,gBAAAU,EAAAd,GAAA,EAAoB,KAAK8B,GAAQ,SAAA3B,GAAkB,MAAAC,GAAY;AAAA,MAAA;AAAA,MAT3D,GAAGyB,CAAE,IAAID,CAAC;AAAA,IAAA;AAAA,EAYpB,CAAA,EACH,CAAA;AAEJ,GAEeQ,IAAAnC,EAAKe,CAAe;"}
+{"version":3,"file":"stickers-effects.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-effects.tsx"],"sourcesContent":["import type { TStickerData, IStickersProps } from './stickers-effects-types';\nimport type { Data } from '@lottiefiles/dotlottie-web';\n\nimport React, { memo, useEffect, useState } from 'react';\n\nimport DotLottieAnimation from '../../ui/dot-lottie-animations/dot-lottie-animation';\nimport { preloadLottieFile } from './stickers-cache';\nimport { generateStickerData } from './stickers-effects-helper';\nimport * as S from './stickers-effects-styled';\n\nconst StickerWithFallback: React.FC<{\n  url?: string;\n  sticker: string;\n  size: number;\n}> = memo(({ url, sticker, size }) => {\n  const [data, setData] = useState<Data>();\n  const [failed, setFailed] = useState(false);\n\n  useEffect(() => {\n    let isMounted = true;\n\n    if (!url) return;\n\n    preloadLottieFile(url)\n      .then(result => {\n        if (isMounted) {\n          if (result) {\n            setData(result);\n          } else {\n            setFailed(true);\n          }\n        }\n      })\n      .catch(() => {\n        if (isMounted) setFailed(true);\n      });\n\n    return () => {\n      isMounted = false;\n    };\n  }, [url]);\n\n  if (!url || failed || !data) {\n    return <>{sticker}</>;\n  }\n\n  return (\n    <DotLottieAnimation data={data} width={size} height={size} onError={() => setFailed(true)} />\n  );\n});\n\nconst StickersEffects: React.FC<IStickersProps> = ({ stickers, effect, count, duration }) => {\n  const [stickersData, setStickersData] = useState<ReturnType<typeof generateStickerData>>([]);\n\n  useEffect(() => {\n    const stickerData = generateStickerData({\n      count,\n      effect,\n      stickers,\n      minSize: 32,\n      maxSize: 48,\n    });\n\n    setStickersData(stickerData);\n\n    const timeout = setTimeout(() => setStickersData([]), duration);\n\n    return () => clearTimeout(timeout);\n  }, [stickers, effect, count, duration]);\n\n  return (\n    <S.Container>\n      {stickersData.map((data: TStickerData, i) => {\n        const { id, sticker, lottie, x, y, size, fromX, fromY } = data;\n\n        return (\n          <S.Sticker\n            key={`${id}-${i}`}\n            effect={effect}\n            duration={duration}\n            fromX={fromX}\n            fromY={fromY}\n            x={x}\n            y={y}\n            size={size}\n          >\n            <StickerWithFallback url={lottie} sticker={sticker} size={size} />\n          </S.Sticker>\n        );\n      })}\n    </S.Container>\n  );\n};\n\nexport default memo(StickersEffects);\n"],"names":["StickerWithFallback","memo","url","sticker","size","data","setData","useState","failed","setFailed","useEffect","isMounted","preloadLottieFile","result","jsx","DotLottieAnimation","StickersEffects","stickers","effect","count","duration","stickersData","setStickersData","stickerData","generateStickerData","timeout","S.Container","i","id","lottie","x","y","fromX","fromY","S.Sticker","stickersEffects"],"mappings":";;;;;;AAUA,MAAMA,IAIDC,EAAK,CAAC,EAAE,KAAAC,GAAK,SAAAC,GAAS,MAAAC,QAAW;AACpC,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAe,GACjC,CAACC,GAAQC,CAAS,IAAIF,EAAS,EAAK;AA0B1C,SAxBAG,EAAU,MAAM;AACd,QAAIC,IAAY;AAEhB,QAAKT;AAEa,aAAAU,EAAAV,CAAG,EAClB,KAAK,CAAUW,MAAA;AACd,QAAIF,MACEE,IACFP,EAAQO,CAAM,IAEdJ,EAAU,EAAI;AAAA,MAElB,CACD,EACA,MAAM,MAAM;AACP,QAAAE,OAAqB,EAAI;AAAA,MAAA,CAC9B,GAEI,MAAM;AACC,QAAAA,IAAA;AAAA,MAAA;AAAA,EACd,GACC,CAACT,CAAG,CAAC,GAEJ,CAACA,KAAOM,KAAU,CAACH,2BACX,UAAQF,EAAA,CAAA,IAIlB,gBAAAW,EAACC,GAAmB,EAAA,MAAAV,GAAY,OAAOD,GAAM,QAAQA,GAAM,SAAS,MAAMK,EAAU,EAAI,EAAG,CAAA;AAE/F,CAAC,GAEKO,IAA4C,CAAC,EAAE,UAAAC,GAAU,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,QAAe;AAC3F,QAAM,CAACC,GAAcC,CAAe,IAAIf,EAAiD,CAAE,CAAA;AAE3F,SAAAG,EAAU,MAAM;AACd,UAAMa,IAAcC,EAAoB;AAAA,MACtC,OAAAL;AAAA,MACA,QAAAD;AAAA,MACA,UAAAD;AAAA,MACA,SAAS;AAAA,MACT,SAAS;AAAA,IAAA,CACV;AAED,IAAAK,EAAgBC,CAAW;AAE3B,UAAME,IAAU,WAAW,MAAMH,EAAgB,CAAE,CAAA,GAAGF,CAAQ;AAEvD,WAAA,MAAM,aAAaK,CAAO;AAAA,KAChC,CAACR,GAAUC,GAAQC,GAAOC,CAAQ,CAAC,GAGpC,gBAAAN,EAACY,GAAA,EACE,YAAa,IAAI,CAACrB,GAAoBsB,MAAM;AACrC,UAAA,EAAE,IAAAC,GAAI,SAAAzB,GAAS,QAAA0B,GAAQ,GAAAC,GAAG,GAAAC,GAAG,MAAA3B,GAAM,OAAA4B,GAAO,OAAAC,EAAU,IAAA5B;AAGxD,WAAA,gBAAAS;AAAA,MAACoB;AAAAA,MAAA;AAAA,QAEC,QAAAhB;AAAA,QACA,UAAAE;AAAA,QACA,OAAAY;AAAA,QACA,OAAAC;AAAA,QACA,GAAAH;AAAA,QACA,GAAAC;AAAA,QACA,MAAA3B;AAAA,QAEA,UAAC,gBAAAU,EAAAd,GAAA,EAAoB,KAAK6B,GAAQ,SAAA1B,GAAkB,MAAAC,GAAY;AAAA,MAAA;AAAA,MAT3D,GAAGwB,CAAE,IAAID,CAAC;AAAA,IAAA;AAAA,EAYpB,CAAA,EACH,CAAA;AAEJ,GAEeQ,IAAAlC,EAAKe,CAAe;"}

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

@@ -0,0 +1,9 @@
+import p from "styled-components";
+const a = p.canvas`
+  ${({ $renderWidth: o }) => typeof o == "number" ? `width: ${o}px;` : `width: ${o};`}
+  ${({ $renderHeight: o }) => typeof o == "number" ? `height: ${o}px;` : `height: ${o};`}
+`;
+export {
+  a as Canvas
+};
+//# sourceMappingURL=dot-lottie-animation-styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dot-lottie-animation-styled.js","sources":["../../../../src/features/ui/dot-lottie-animations/dot-lottie-animation-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Canvas = styled.canvas<{\n  $renderWidth: string | number;\n  $renderHeight: string | number;\n}>`\n  ${({ $renderWidth }) =>\n    typeof $renderWidth === 'number' ? `width: ${$renderWidth}px;` : `width: ${$renderWidth};`}\n  ${({ $renderHeight }) =>\n    typeof $renderHeight === 'number' ? `height: ${$renderHeight}px;` : `height: ${$renderHeight};`}\n`;\n"],"names":["Canvas","styled","$renderWidth","$renderHeight"],"mappings":";AAEO,MAAMA,IAASC,EAAO;AAAA,IAIzB,CAAC,EAAE,cAAAC,EAAa,MAChB,OAAOA,KAAiB,WAAW,UAAUA,CAAY,QAAQ,UAAUA,CAAY,GAAG;AAAA,IAC1F,CAAC,EAAE,eAAAC,EAAc,MACjB,OAAOA,KAAkB,WAAW,WAAWA,CAAa,QAAQ,WAAWA,CAAa,GAAG;AAAA;"}

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

@@ -0,0 +1,93 @@
+import { jsx as d } 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
+      },
+      s
+    ) });
+  }
+), C = w(E);
+export {
+  C as default
+};
+//# sourceMappingURL=dot-lottie-animation.js.map

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

@@ -0,0 +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;"}

package/dist/features/ui/inputs/base-select-input/base-select-input.js

@@ -1,114 +1,124 @@
-import { jsxs as k, jsx as t } from "react/jsx-runtime";
-import { useMemo as W, useRef as T, useCallback as d } from "react";
-import X from "../../../../assets/line-icons/icons/cross.js";
-import H from "../../hooks/use-context-menu-click-handler.js";
-import q from "../base-input/base-input.js";
-import { Input as G } from "../text-input/text-input-styled.js";
-import { Container as J, OptionsContainer as K, OptionsWrapper as N, StyledChevronDownIcon as P, StyledDownIcon as Q } from "./base-select-input-styled.js";
-import U from "./select-option/select-option.js";
-import Y from "./select-section/select-section.js";
-const ae = (y) => {
+import { jsxs as V, jsx as t } from "react/jsx-runtime";
+import { useMemo as G, useRef as A, useCallback as d } from "react";
+import J from "../../../../assets/line-icons/icons/cross.js";
+import K from "../../hooks/use-context-menu-click-handler.js";
+import N from "../base-input/base-input.js";
+import { Input as P } from "../text-input/text-input-styled.js";
+import { Container as Q, OptionsContainer as U, OptionsWrapper as Y, StyledChevronDownIcon as Z, StyledDownIcon as _ } from "./base-select-input-styled.js";
+import ee from "./select-option/select-option.js";
+import ne from "./select-section/select-section.js";
+const he = (E) => {
   const {
-    label: C,
-    value: r,
+    label: b,
+    value: i,
     options: u,
     searchable: n = !1,
     searchText: g,
-    onCloseWithoutSelection: V,
-    onSearchTextChange: o,
-    onChange: b,
+    onCloseWithoutSelection: L,
+    onSearchTextChange: r,
+    onChange: v,
     renderAs: h,
-    width: A,
-    widthX: E,
+    width: R,
+    widthX: j,
     disabled: p,
-    willShowMessage: R,
-    mandatory: j,
-    size: v = "regular",
+    willShowMessage: z,
+    mandatory: B,
+    size: w = "regular",
     shape: m,
     theme: f = "light",
-    isTransparent: w = !1,
+    isTransparent: S = !1,
     renderOptionsAs: $ = "list",
-    errorMessage: z
-  } = y, i = $ === "section-list" && u, s = $ === "list" && u, I = W(() => {
-    var e, c;
+    errorMessage: D,
+    inputLabelOverrides: C
+  } = E, s = $ === "section-list" && u, l = $ === "list" && u, I = G(() => {
+    var e;
     if (n) return g;
-    if (i)
-      return (e = i.flatMap((l) => l.data).find(({ id: l }) => l === r)) == null ? void 0 : e.label;
-    if (s) return (c = s.find((l) => l.id === r)) == null ? void 0 : c.label;
-  }, [n, g, i, s, r]), S = T(null), x = T(null), { menuVisible: a, onMenuClick: B, hideMenu: M } = H(
-    S,
+    if (s) {
+      let o, a;
+      for (const T of s) {
+        const y = T.data.find(({ id: q }) => q === i);
+        if (y) {
+          o = T, a = y;
+          break;
+        }
+      }
+      return o && C ? C(o, a) : (a == null ? void 0 : a.label) || "";
+    }
+    if (l) return (e = l.find((o) => o.id === i)) == null ? void 0 : e.label;
+  }, [n, g, s, l, C, i]), k = A(null), x = A(null), { menuVisible: c, onMenuClick: F, hideMenu: O } = K(
+    k,
     void 0,
     !n,
-    V,
+    L,
     p
-  ), D = d(
+  ), W = d(
     (e) => {
-      n && o && o(e.target.value);
+      n && r && r(e.target.value);
     },
-    [o, n]
-  ), O = d(
-    (e, c) => {
-      M(), b(e, c);
+    [r, n]
+  ), M = d(
+    (e, o) => {
+      O(), v(e, o);
     },
-    [M, b]
-  ), F = d((e) => {
+    [O, v]
+  ), X = d((e) => {
     e.target.select(), setTimeout(() => {
       e.target.scrollIntoView({
         behavior: "smooth"
       });
     }, 300);
-  }, []), L = d(() => {
+  }, []), H = d(() => {
     var e;
-    o && (o(""), (e = x.current) == null || e.focus());
-  }, [o]);
-  return /* @__PURE__ */ k(J, { ref: S, $width: A, $widthX: E, onClick: B, children: [
+    r && (r(""), (e = x.current) == null || e.focus());
+  }, [r]);
+  return /* @__PURE__ */ V(Q, { ref: k, $width: R, $widthX: j, onClick: F, children: [
     /* @__PURE__ */ t(
-      q,
+      N,
       {
         renderAs: h,
-        label: C,
+        label: b,
         stickyLabel: !0,
         disabled: p,
-        willShowMessage: R,
-        size: v,
-        mandatory: j,
+        willShowMessage: z,
+        size: w,
+        mandatory: B,
         shape: m,
-        isTransparent: w,
+        isTransparent: S,
         inputElement: /* @__PURE__ */ t(
-          G,
+          P,
           {
             ref: x,
             $renderAs: h,
-            $size: v,
-            placeholder: I ? "" : C,
+            $size: w,
+            placeholder: I ? "" : b,
             disabled: p,
             readOnly: !n,
             value: I ?? "",
-            onFocus: n ? F : void 0,
-            onChange: n ? D : void 0,
-            $isTransparent: w
+            onFocus: n ? X : void 0,
+            onChange: n ? W : void 0,
+            $isTransparent: S
           }
         ),
-        siblingElement: n && a ? /* @__PURE__ */ t(X, { onClick: L }) : m === "curved" || m === "borderLess" ? /* @__PURE__ */ t(P, { $menuVisible: a, pointerEvents: "none" }) : /* @__PURE__ */ t(Q, { $menuVisible: a, pointerEvents: "none" }),
-        errorMessage: z
+        siblingElement: n && c ? /* @__PURE__ */ t(J, { onClick: H }) : m === "curved" || m === "borderLess" ? /* @__PURE__ */ t(Z, { $menuVisible: c, pointerEvents: "none" }) : /* @__PURE__ */ t(_, { $menuVisible: c, pointerEvents: "none" }),
+        errorMessage: D
       }
     ),
-    u.length > 0 && /* @__PURE__ */ t(K, { $visible: a, children: /* @__PURE__ */ k(N, { $renderAs: h, $theme: f, children: [
-      i && /* @__PURE__ */ t(
-        Y,
+    u.length > 0 && /* @__PURE__ */ t(U, { $visible: c, children: /* @__PURE__ */ V(Y, { $renderAs: h, $theme: f, children: [
+      s && /* @__PURE__ */ t(
+        ne,
         {
-          sectionOptions: i,
+          sectionOptions: s,
           theme: f,
-          value: r,
-          onChange: O
+          value: i,
+          onChange: M
         }
       ),
-      s && s.map((e) => /* @__PURE__ */ t(
-        U,
+      l && l.map((e) => /* @__PURE__ */ t(
+        ee,
         {
           option: e,
-          selected: e.id === r,
-          onChange: O,
+          selected: e.id === i,
+          onChange: M,
           theme: f
         },
         e.id
@@ -117,6 +127,6 @@ const ae = (y) => {
   ] });
 };
 export {
-  ae as default
+  he as default
 };
 //# sourceMappingURL=base-select-input.js.map