@cuemath/leap 3.2.25-mb → 3.2.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/dist/features/analytics-events/whitelist-events.js +17 -15
  2. package/dist/features/analytics-events/whitelist-events.js.map +1 -1
  3. package/dist/features/auth/comps/pill-button/pill-button.js +41 -38
  4. package/dist/features/auth/comps/pill-button/pill-button.js.map +1 -1
  5. package/dist/features/auth/comps/resend-otp/resend-otp.js +18 -14
  6. package/dist/features/auth/comps/resend-otp/resend-otp.js.map +1 -1
  7. package/dist/features/auth/comps/selectable-info-card/selectable-info-card.js +32 -26
  8. package/dist/features/auth/comps/selectable-info-card/selectable-info-card.js.map +1 -1
  9. package/dist/features/auth/pla-signup/pla-analytics-events.js +23 -0
  10. package/dist/features/auth/pla-signup/pla-analytics-events.js.map +1 -0
  11. package/dist/features/auth/pla-signup/signup-options/signup-options.js +42 -35
  12. package/dist/features/auth/pla-signup/signup-options/signup-options.js.map +1 -1
  13. package/dist/features/milestone/create/comps/chapters-selection-step/chapter-selection-step-v2/chapters-list.js +68 -53
  14. package/dist/features/milestone/create/comps/chapters-selection-step/chapter-selection-step-v2/chapters-list.js.map +1 -1
  15. package/dist/features/notification/notification.js +129 -0
  16. package/dist/features/notification/notification.js.map +1 -0
  17. package/dist/features/ui/carousal/carousal-styles.js +45 -0
  18. package/dist/features/ui/carousal/carousal-styles.js.map +1 -0
  19. package/dist/features/ui/carousal/carousal.js +76 -0
  20. package/dist/features/ui/carousal/carousal.js.map +1 -0
  21. package/dist/features/ui/dot-lottie-animations/dot-lottie-animation.js +75 -88
  22. package/dist/features/ui/dot-lottie-animations/dot-lottie-animation.js.map +1 -1
  23. package/dist/features/ui/inputs/base-select-input/base-select-input.js +77 -67
  24. package/dist/features/ui/inputs/base-select-input/base-select-input.js.map +1 -1
  25. package/dist/features/ui/lottie-animation/lottie-animation.js +31 -36
  26. package/dist/features/ui/lottie-animation/lottie-animation.js.map +1 -1
  27. package/dist/features/ui/modals/modal-styled.js +8 -39
  28. package/dist/features/ui/modals/modal-styled.js.map +1 -1
  29. package/dist/features/ui/modals/modal.js +31 -31
  30. package/dist/features/ui/modals/modal.js.map +1 -1
  31. package/dist/features/{stickers/sticker-selector/sticker-selector-styles.js → ui/sticker-grid/sticker-grid-styles.js} +31 -21
  32. package/dist/features/ui/sticker-grid/sticker-grid-styles.js.map +1 -0
  33. package/dist/features/ui/sticker-grid/sticker-grid.js +24 -0
  34. package/dist/features/ui/sticker-grid/sticker-grid.js.map +1 -0
  35. package/dist/features/ui/sticker-grid/sticker.js +57 -0
  36. package/dist/features/ui/sticker-grid/sticker.js.map +1 -0
  37. package/dist/features/ui/stickers/constants.js +6 -0
  38. package/dist/features/ui/stickers/constants.js.map +1 -0
  39. package/dist/features/{stickers/stickers-effects/effects.js → ui/stickers/stickers-effects.js} +6 -6
  40. package/dist/features/ui/stickers/stickers-effects.js.map +1 -0
  41. package/dist/features/{stickers/stickers-effects/stickers-effects-styled.js → ui/stickers/stickers-styled.js} +2 -2
  42. package/dist/features/ui/stickers/stickers-styled.js.map +1 -0
  43. package/dist/features/ui/stickers/stickers-utils.js +91 -0
  44. package/dist/features/ui/stickers/stickers-utils.js.map +1 -0
  45. package/dist/features/ui/stickers/stickers.js +40 -0
  46. package/dist/features/ui/stickers/stickers.js.map +1 -0
  47. package/dist/features/ui/theme/layout.js +3 -3
  48. package/dist/features/ui/theme/layout.js.map +1 -1
  49. package/dist/index.d.ts +110 -79
  50. package/dist/index.js +452 -448
  51. package/dist/index.js.map +1 -1
  52. package/dist/node_modules/uuid/dist/esm-browser/native.js +7 -0
  53. package/dist/node_modules/uuid/dist/esm-browser/native.js.map +1 -0
  54. package/dist/node_modules/uuid/dist/esm-browser/rng.js +3 -2
  55. package/dist/node_modules/uuid/dist/esm-browser/rng.js.map +1 -1
  56. package/dist/node_modules/uuid/dist/esm-browser/stringify.js +6 -10
  57. package/dist/node_modules/uuid/dist/esm-browser/stringify.js.map +1 -1
  58. package/dist/node_modules/uuid/dist/esm-browser/v4.js +12 -9
  59. package/dist/node_modules/uuid/dist/esm-browser/v4.js.map +1 -1
  60. package/package.json +1 -1
  61. package/dist/features/stickers/sticker-data.js +0 -234
  62. package/dist/features/stickers/sticker-data.js.map +0 -1
  63. package/dist/features/stickers/sticker-selector/sticker-selector-styles.js.map +0 -1
  64. package/dist/features/stickers/sticker-selector/sticker-selector.js +0 -27
  65. package/dist/features/stickers/sticker-selector/sticker-selector.js.map +0 -1
  66. package/dist/features/stickers/sticker-selector/sticker.js +0 -57
  67. package/dist/features/stickers/sticker-selector/sticker.js.map +0 -1
  68. package/dist/features/stickers/stickers-effects/effects.js.map +0 -1
  69. package/dist/features/stickers/stickers-effects/stickers-cache.js +0 -19
  70. package/dist/features/stickers/stickers-effects/stickers-cache.js.map +0 -1
  71. package/dist/features/stickers/stickers-effects/stickers-effects-helper.js +0 -86
  72. package/dist/features/stickers/stickers-effects/stickers-effects-helper.js.map +0 -1
  73. package/dist/features/stickers/stickers-effects/stickers-effects-styled.js.map +0 -1
  74. package/dist/features/stickers/stickers-effects/stickers-effects.js +0 -54
  75. package/dist/features/stickers/stickers-effects/stickers-effects.js.map +0 -1
  76. package/dist/node_modules/uuid/dist/esm-browser/regex.js +0 -5
  77. package/dist/node_modules/uuid/dist/esm-browser/regex.js.map +0 -1
  78. package/dist/node_modules/uuid/dist/esm-browser/validate.js +0 -8
  79. package/dist/node_modules/uuid/dist/esm-browser/validate.js.map +0 -1
@@ -1,93 +1,80 @@
1
- import { jsx as d } from "react/jsx-runtime";
1
+ import { jsx as l } from "react/jsx-runtime";
2
2
  import { DotLottieWorker as v } from "../../../node_modules/@lottiefiles/dotlottie-web/dist/index.js";
3
- import { memo as w, forwardRef as x, useRef as p, useImperativeHandle as A, useEffect as h } from "react";
4
- import R from "../layout/flex-view.js";
5
- import { Canvas as $ } from "./dot-lottie-animation-styled.js";
6
- const E = x(
7
- (y, g) => {
8
- const {
9
- src: s,
10
- data: f,
11
- width: i = "100%",
12
- height: a = "100%",
13
- settings: l,
14
- eventListeners: o,
15
- onRender: u,
16
- onError: c
17
- } = y, m = p(null), t = p(null);
18
- return A(
19
- g,
20
- () => ({
21
- play: () => {
22
- var e;
23
- (e = t.current) == null || e.play();
24
- },
25
- pause: () => {
26
- var e;
27
- (e = t.current) == null || e.pause();
28
- },
29
- playSegments: (e) => {
30
- var r, n;
31
- (r = t.current) == null || r.setSegment(e[0], e[1]), (n = t.current) == null || n.play();
32
- },
33
- setFrame: (e) => {
34
- var r;
35
- (r = t.current) == null || r.setFrame(e);
36
- }
37
- }),
38
- []
39
- ), h(() => {
40
- if (!m.current) return;
41
- let e = !1;
42
- return (() => {
43
- try {
44
- t.current = new v({
45
- src: s,
46
- data: f,
47
- canvas: m.current,
48
- autoplay: !0,
49
- loop: !1,
50
- renderConfig: {
51
- autoResize: !0,
52
- devicePixelRatio: window.devicePixelRatio,
53
- freezeOnOffscreen: !0
54
- },
55
- ...l
56
- }), requestAnimationFrame(() => {
57
- e || u == null || u();
58
- });
59
- } catch (n) {
60
- console.log(n), c == null || c();
61
- }
62
- })(), () => {
63
- e = !0, t.current && (t.current.destroy(), t.current = null);
64
- };
65
- }, [s, l, u, c, f]), h(() => (o == null || o.forEach(
66
- ({ name: e, callback: r }) => {
67
- var n;
68
- return (n = t.current) == null ? void 0 : n.addEventListener(e, r);
69
- }
70
- ), () => {
71
- o == null || o.forEach(
72
- ({ name: e, callback: r }) => {
73
- var n;
74
- return (n = t.current) == null ? void 0 : n.removeEventListener(e, r);
75
- }
76
- );
77
- }), [o]), /* @__PURE__ */ d(R, { $width: i, $height: a, children: /* @__PURE__ */ d(
78
- $,
79
- {
80
- ref: m,
81
- $renderWidth: i,
82
- $renderHeight: a,
83
- width: typeof i == "number" ? i : void 0,
84
- height: typeof a == "number" ? a : void 0
3
+ import { memo as w, forwardRef as x, useRef as p, useImperativeHandle as R, useEffect as h } from "react";
4
+ import E from "../layout/flex-view.js";
5
+ import { Canvas as H } from "./dot-lottie-animation-styled.js";
6
+ const N = x((y, g) => {
7
+ const {
8
+ src: m,
9
+ width: i = "100%",
10
+ height: a = "100%",
11
+ settings: f,
12
+ eventListeners: r,
13
+ onRender: u,
14
+ onError: c
15
+ } = y, s = p(null), t = p(null);
16
+ return R(
17
+ g,
18
+ () => ({
19
+ playSegments: (e) => {
20
+ var n, o;
21
+ (n = t.current) == null || n.setSegment(e[0], e[1]), (o = t.current) == null || o.play();
22
+ },
23
+ play: () => {
24
+ var e;
25
+ (e = t.current) == null || e.play();
85
26
  },
86
- s
87
- ) });
88
- }
89
- ), C = w(E);
27
+ pause: () => {
28
+ var e;
29
+ (e = t.current) == null || e.pause();
30
+ }
31
+ }),
32
+ []
33
+ ), h(() => {
34
+ if (s.current)
35
+ try {
36
+ t.current = new v({
37
+ src: m,
38
+ canvas: s.current,
39
+ autoplay: !0,
40
+ loop: !1,
41
+ renderConfig: {
42
+ autoResize: !0,
43
+ devicePixelRatio: window.devicePixelRatio,
44
+ freezeOnOffscreen: !0
45
+ },
46
+ ...f
47
+ }), requestAnimationFrame(() => {
48
+ u == null || u();
49
+ });
50
+ } catch (e) {
51
+ console.log(e), c == null || c();
52
+ }
53
+ }, [m, f, u, c]), h(() => (r == null || r.forEach(
54
+ ({ name: e, callback: n }) => {
55
+ var o;
56
+ return (o = t.current) == null ? void 0 : o.addEventListener(e, n);
57
+ }
58
+ ), () => {
59
+ var e;
60
+ r == null || r.forEach(
61
+ ({ name: n, callback: o }) => {
62
+ var d;
63
+ return (d = t.current) == null ? void 0 : d.removeEventListener(n, o);
64
+ }
65
+ ), (e = t.current) == null || e.destroy();
66
+ }), [r]), /* @__PURE__ */ l(E, { $width: i, $height: a, children: /* @__PURE__ */ l(
67
+ H,
68
+ {
69
+ ref: s,
70
+ $renderWidth: i,
71
+ $renderHeight: a,
72
+ width: typeof i == "number" ? i : void 0,
73
+ height: typeof a == "number" ? a : void 0
74
+ }
75
+ ) });
76
+ }), F = w(N);
90
77
  export {
91
- C as default
78
+ F as default
92
79
  };
93
80
  //# sourceMappingURL=dot-lottie-animation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"dot-lottie-animation.js","sources":["../../../../src/features/ui/dot-lottie-animations/dot-lottie-animation.tsx"],"sourcesContent":["import type {\n AnimationSegment,\n IDotLottieAnimationProps,\n IDotLottieAnimationRef,\n} from './dot-lottie-types';\n\nimport { DotLottieWorker } from '@lottiefiles/dotlottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport * as Styled from './dot-lottie-animation-styled';\n\nconst DotLottieAnimation = forwardRef<IDotLottieAnimationRef, IDotLottieAnimationProps>(\n (props, ref) => {\n const {\n src,\n data,\n width = '100%',\n height = '100%',\n settings,\n eventListeners,\n onRender,\n onError,\n } = props;\n\n const canvasRef = useRef<HTMLCanvasElement>(null);\n const animationInstance = useRef<DotLottieWorker | null>(null);\n\n useImperativeHandle(\n ref,\n () => ({\n play: () => {\n animationInstance.current?.play();\n },\n pause: () => {\n animationInstance.current?.pause();\n },\n playSegments: (segments: AnimationSegment) => {\n animationInstance.current?.setSegment(segments[0], segments[1]);\n animationInstance.current?.play();\n },\n setFrame: (frame: number) => {\n animationInstance.current?.setFrame(frame);\n },\n }),\n [],\n );\n\n useEffect(() => {\n if (!canvasRef.current) return;\n\n let destroyed = false;\n\n const loadAnimation = () => {\n try {\n animationInstance.current = new DotLottieWorker({\n src,\n data,\n canvas: canvasRef.current!,\n autoplay: true,\n loop: false,\n renderConfig: {\n autoResize: true,\n devicePixelRatio: window.devicePixelRatio,\n freezeOnOffscreen: true,\n },\n ...settings,\n });\n\n requestAnimationFrame(() => {\n if (destroyed) return;\n onRender?.();\n });\n } catch (err) {\n // eslint-disable-next-line no-console\n console.log(err);\n onError?.();\n }\n };\n\n loadAnimation();\n\n return () => {\n destroyed = true;\n if (animationInstance.current) {\n animationInstance.current.destroy();\n animationInstance.current = null;\n }\n };\n }, [src, settings, onRender, onError, data]);\n\n useEffect(() => {\n eventListeners?.forEach(\n ({ name, callback }) => animationInstance.current?.addEventListener(name, callback),\n );\n\n return () => {\n eventListeners?.forEach(\n ({ name, callback }) => animationInstance.current?.removeEventListener(name, callback),\n );\n };\n }, [eventListeners]);\n\n const isNumW = typeof width === 'number';\n const isNumH = typeof height === 'number';\n\n return (\n <FlexView $width={width} $height={height}>\n <Styled.Canvas\n key={src}\n ref={canvasRef}\n $renderWidth={width}\n $renderHeight={height}\n width={isNumW ? width : undefined}\n height={isNumH ? height : undefined}\n />\n </FlexView>\n );\n },\n);\n\nexport default memo(DotLottieAnimation);\n"],"names":["DotLottieAnimation","forwardRef","props","ref","src","data","width","height","settings","eventListeners","onRender","onError","canvasRef","useRef","animationInstance","useImperativeHandle","_a","segments","_b","frame","useEffect","destroyed","DotLottieWorker","err","name","callback","jsx","FlexView","Styled.Canvas","DotLottieAnimation$1","memo"],"mappings":";;;;;AAYA,MAAMA,IAAqBC;AAAA,EACzB,CAACC,GAAOC,MAAQ;AACR,UAAA;AAAA,MACJ,KAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAC,IAAQ;AAAA,MACR,QAAAC,IAAS;AAAA,MACT,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,UAAAC;AAAA,MACA,SAAAC;AAAA,IACE,IAAAT,GAEEU,IAAYC,EAA0B,IAAI,GAC1CC,IAAoBD,EAA+B,IAAI;AAE7D,WAAAE;AAAA,MACEZ;AAAA,MACA,OAAO;AAAA,QACL,MAAM,MAAM;;AACV,WAAAa,IAAAF,EAAkB,YAAlB,QAAAE,EAA2B;AAAA,QAC7B;AAAA,QACA,OAAO,MAAM;;AACX,WAAAA,IAAAF,EAAkB,YAAlB,QAAAE,EAA2B;AAAA,QAC7B;AAAA,QACA,cAAc,CAACC,MAA+B;;AAC5C,WAAAD,IAAAF,EAAkB,YAAlB,QAAAE,EAA2B,WAAWC,EAAS,CAAC,GAAGA,EAAS,CAAC,KAC7DC,IAAAJ,EAAkB,YAAlB,QAAAI,EAA2B;AAAA,QAC7B;AAAA,QACA,UAAU,CAACC,MAAkB;;AACT,WAAAH,IAAAF,EAAA,YAAA,QAAAE,EAAS,SAASG;AAAA,QACtC;AAAA,MAAA;AAAA,MAEF,CAAC;AAAA,IAAA,GAGHC,EAAU,MAAM;AACV,UAAA,CAACR,EAAU,QAAS;AAExB,UAAIS,IAAY;AA6BF,cA3BQ,MAAM;AACtB,YAAA;AACgB,UAAAP,EAAA,UAAU,IAAIQ,EAAgB;AAAA,YAC9C,KAAAlB;AAAA,YACA,MAAAC;AAAA,YACA,QAAQO,EAAU;AAAA,YAClB,UAAU;AAAA,YACV,MAAM;AAAA,YACN,cAAc;AAAA,cACZ,YAAY;AAAA,cACZ,kBAAkB,OAAO;AAAA,cACzB,mBAAmB;AAAA,YACrB;AAAA,YACA,GAAGJ;AAAA,UAAA,CACJ,GAED,sBAAsB,MAAM;AAC1B,YAAIa,KACOX,KAAA,QAAAA;AAAA,UAAA,CACZ;AAAA,iBACMa,GAAK;AAEZ,kBAAQ,IAAIA,CAAG,GACLZ,KAAA,QAAAA;AAAA,QACZ;AAAA,MAAA,MAKK,MAAM;AACC,QAAAU,IAAA,IACRP,EAAkB,YACpBA,EAAkB,QAAQ,WAC1BA,EAAkB,UAAU;AAAA,MAC9B;AAAA,IACF,GACC,CAACV,GAAKI,GAAUE,GAAUC,GAASN,CAAI,CAAC,GAE3Ce,EAAU,OACQX,KAAA,QAAAA,EAAA;AAAA,MACd,CAAC,EAAE,MAAAe,GAAM,UAAAC,QAAe;;AAAA,gBAAAT,IAAAF,EAAkB,YAAlB,gBAAAE,EAA2B,iBAAiBQ,GAAMC;AAAA;AAAA,OAGrE,MAAM;AACK,MAAAhB,KAAA,QAAAA,EAAA;AAAA,QACd,CAAC,EAAE,MAAAe,GAAM,UAAAC,QAAe;;AAAA,kBAAAT,IAAAF,EAAkB,YAAlB,gBAAAE,EAA2B,oBAAoBQ,GAAMC;AAAA;AAAA;AAAA,IAC/E,IAED,CAAChB,CAAc,CAAC,GAMhB,gBAAAiB,EAAAC,GAAA,EAAS,QAAQrB,GAAO,SAASC,GAChC,UAAA,gBAAAmB;AAAA,MAACE;AAAAA,MAAA;AAAA,QAEC,KAAKhB;AAAA,QACL,cAAcN;AAAA,QACd,eAAeC;AAAA,QACf,OAVS,OAAOD,KAAU,WAUVA,IAAQ;AAAA,QACxB,QAVS,OAAOC,KAAW,WAUVA,IAAS;AAAA,MAAA;AAAA,MALrBH;AAAA,IAOT,EAAA,CAAA;AAAA,EAEJ;AACF,GAEeyB,IAAAC,EAAK9B,CAAkB;"}
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 ILottieAnimationProps,\n ILottieAnimationRef,\n} from './dot-lottie-types';\n\nimport { DotLottieWorker } from '@lottiefiles/dotlottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport * as Styled from './dot-lottie-animation-styled';\n\nconst DotLottieAnimation = forwardRef<ILottieAnimationRef, ILottieAnimationProps>((props, ref) => {\n const {\n src,\n width = '100%',\n height = '100%',\n settings,\n eventListeners,\n onRender,\n onError,\n } = props;\n\n const canvasRef = useRef<HTMLCanvasElement>(null);\n const animationInstance = useRef<DotLottieWorker | null>(null);\n\n useImperativeHandle(\n ref,\n () => ({\n playSegments: (segments: AnimationSegment) => {\n animationInstance.current?.setSegment(segments[0], segments[1]);\n animationInstance.current?.play();\n },\n play: () => {\n animationInstance.current?.play();\n },\n pause: () => {\n animationInstance.current?.pause();\n },\n }),\n [],\n );\n\n useEffect(() => {\n if (!canvasRef.current) return;\n\n try {\n animationInstance.current = new DotLottieWorker({\n src,\n canvas: canvasRef.current,\n autoplay: true,\n loop: false,\n renderConfig: {\n autoResize: true,\n devicePixelRatio: window.devicePixelRatio,\n freezeOnOffscreen: true,\n },\n ...settings,\n });\n\n requestAnimationFrame(() => {\n onRender?.();\n });\n } catch (err) {\n // eslint-disable-next-line no-console\n console.log(err);\n onError?.();\n }\n }, [src, settings, onRender, onError]);\n\n useEffect(() => {\n eventListeners?.forEach(\n ({ name, callback }) => animationInstance.current?.addEventListener(name, callback),\n );\n\n return () => {\n eventListeners?.forEach(\n ({ name, callback }) => animationInstance.current?.removeEventListener(name, callback),\n );\n animationInstance.current?.destroy();\n };\n }, [eventListeners]);\n\n const isNumW = typeof width === 'number';\n const isNumH = typeof height === 'number';\n\n return (\n <FlexView $width={width} $height={height}>\n <Styled.Canvas\n ref={canvasRef}\n $renderWidth={width}\n $renderHeight={height}\n width={isNumW ? width : undefined}\n height={isNumH ? height : undefined}\n />\n </FlexView>\n );\n});\n\nexport default memo(DotLottieAnimation);\n"],"names":["DotLottieAnimation","forwardRef","props","ref","src","width","height","settings","eventListeners","onRender","onError","canvasRef","useRef","animationInstance","useImperativeHandle","segments","_a","_b","useEffect","DotLottieWorker","err","name","callback","jsx","FlexView","Styled.Canvas","dotLottieAnimation","memo"],"mappings":";;;;;AAYA,MAAMA,IAAqBC,EAAuD,CAACC,GAAOC,MAAQ;AAC1F,QAAA;AAAA,IACJ,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,EACE,IAAAR,GAEES,IAAYC,EAA0B,IAAI,GAC1CC,IAAoBD,EAA+B,IAAI;AAE7D,SAAAE;AAAA,IACEX;AAAA,IACA,OAAO;AAAA,MACL,cAAc,CAACY,MAA+B;;AAC5C,SAAAC,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B,WAAWD,EAAS,CAAC,GAAGA,EAAS,CAAC,KAC7DE,IAAAJ,EAAkB,YAAlB,QAAAI,EAA2B;AAAA,MAC7B;AAAA,MACA,MAAM,MAAM;;AACV,SAAAD,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B;AAAA,MAC7B;AAAA,MACA,OAAO,MAAM;;AACX,SAAAA,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B;AAAA,MAC7B;AAAA,IAAA;AAAA,IAEF,CAAC;AAAA,EAAA,GAGHE,EAAU,MAAM;AACV,QAACP,EAAU;AAEX,UAAA;AACgB,QAAAE,EAAA,UAAU,IAAIM,EAAgB;AAAA,UAC9C,KAAAf;AAAA,UACA,QAAQO,EAAU;AAAA,UAClB,UAAU;AAAA,UACV,MAAM;AAAA,UACN,cAAc;AAAA,YACZ,YAAY;AAAA,YACZ,kBAAkB,OAAO;AAAA,YACzB,mBAAmB;AAAA,UACrB;AAAA,UACA,GAAGJ;AAAA,QAAA,CACJ,GAED,sBAAsB,MAAM;AACf,UAAAE,KAAA,QAAAA;AAAA,QAAA,CACZ;AAAA,eACMW,GAAK;AAEZ,gBAAQ,IAAIA,CAAG,GACLV,KAAA,QAAAA;AAAA,MACZ;AAAA,KACC,CAACN,GAAKG,GAAUE,GAAUC,CAAO,CAAC,GAErCQ,EAAU,OACQV,KAAA,QAAAA,EAAA;AAAA,IACd,CAAC,EAAE,MAAAa,GAAM,UAAAC,QAAe;;AAAA,cAAAN,IAAAH,EAAkB,YAAlB,gBAAAG,EAA2B,iBAAiBK,GAAMC;AAAA;AAAA,KAGrE,MAAM;;AACK,IAAAd,KAAA,QAAAA,EAAA;AAAA,MACd,CAAC,EAAE,MAAAa,GAAM,UAAAC,QAAe;;AAAA,gBAAAN,IAAAH,EAAkB,YAAlB,gBAAAG,EAA2B,oBAAoBK,GAAMC;AAAA;AAAA,QAE/EN,IAAAH,EAAkB,YAAlB,QAAAG,EAA2B;AAAA,EAAQ,IAEpC,CAACR,CAAc,CAAC,GAMhB,gBAAAe,EAAAC,GAAA,EAAS,QAAQnB,GAAO,SAASC,GAChC,UAAA,gBAAAiB;AAAA,IAACE;AAAAA,IAAA;AAAA,MACC,KAAKd;AAAA,MACL,cAAcN;AAAA,MACd,eAAeC;AAAA,MACf,OATS,OAAOD,KAAU,WASVA,IAAQ;AAAA,MACxB,QATS,OAAOC,KAAW,WASVA,IAAS;AAAA,IAAA;AAAA,EAE9B,EAAA,CAAA;AAEJ,CAAC,GAEcoB,IAAAC,EAAK3B,CAAkB;"}
@@ -1,114 +1,124 @@
1
- import { jsxs as k, jsx as t } from "react/jsx-runtime";
2
- import { useMemo as W, useRef as T, useCallback as d } from "react";
3
- import X from "../../../../assets/line-icons/icons/cross.js";
4
- import H from "../../hooks/use-context-menu-click-handler.js";
5
- import q from "../base-input/base-input.js";
6
- import { Input as G } from "../text-input/text-input-styled.js";
7
- import { Container as J, OptionsContainer as K, OptionsWrapper as N, StyledChevronDownIcon as P, StyledDownIcon as Q } from "./base-select-input-styled.js";
8
- import U from "./select-option/select-option.js";
9
- import Y from "./select-section/select-section.js";
10
- const ae = (y) => {
1
+ import { jsxs as V, jsx as t } from "react/jsx-runtime";
2
+ import { useMemo as G, useRef as A, useCallback as d } from "react";
3
+ import J from "../../../../assets/line-icons/icons/cross.js";
4
+ import K from "../../hooks/use-context-menu-click-handler.js";
5
+ import N from "../base-input/base-input.js";
6
+ import { Input as P } from "../text-input/text-input-styled.js";
7
+ import { Container as Q, OptionsContainer as U, OptionsWrapper as Y, StyledChevronDownIcon as Z, StyledDownIcon as _ } from "./base-select-input-styled.js";
8
+ import ee from "./select-option/select-option.js";
9
+ import ne from "./select-section/select-section.js";
10
+ const he = (E) => {
11
11
  const {
12
- label: C,
13
- value: r,
12
+ label: b,
13
+ value: i,
14
14
  options: u,
15
15
  searchable: n = !1,
16
16
  searchText: g,
17
- onCloseWithoutSelection: V,
18
- onSearchTextChange: o,
19
- onChange: b,
17
+ onCloseWithoutSelection: L,
18
+ onSearchTextChange: r,
19
+ onChange: v,
20
20
  renderAs: h,
21
- width: A,
22
- widthX: E,
21
+ width: R,
22
+ widthX: j,
23
23
  disabled: p,
24
- willShowMessage: R,
25
- mandatory: j,
26
- size: v = "regular",
24
+ willShowMessage: z,
25
+ mandatory: B,
26
+ size: w = "regular",
27
27
  shape: m,
28
28
  theme: f = "light",
29
- isTransparent: w = !1,
29
+ isTransparent: S = !1,
30
30
  renderOptionsAs: $ = "list",
31
- errorMessage: z
32
- } = y, i = $ === "section-list" && u, s = $ === "list" && u, I = W(() => {
33
- var e, c;
31
+ errorMessage: D,
32
+ inputLabelOverrides: C
33
+ } = E, s = $ === "section-list" && u, l = $ === "list" && u, I = G(() => {
34
+ var e;
34
35
  if (n) return g;
35
- if (i)
36
- return (e = i.flatMap((l) => l.data).find(({ id: l }) => l === r)) == null ? void 0 : e.label;
37
- if (s) return (c = s.find((l) => l.id === r)) == null ? void 0 : c.label;
38
- }, [n, g, i, s, r]), S = T(null), x = T(null), { menuVisible: a, onMenuClick: B, hideMenu: M } = H(
39
- S,
36
+ if (s) {
37
+ let o, a;
38
+ for (const T of s) {
39
+ const y = T.data.find(({ id: q }) => q === i);
40
+ if (y) {
41
+ o = T, a = y;
42
+ break;
43
+ }
44
+ }
45
+ return o && C ? C(o, a) : (a == null ? void 0 : a.label) || "";
46
+ }
47
+ if (l) return (e = l.find((o) => o.id === i)) == null ? void 0 : e.label;
48
+ }, [n, g, s, l, C, i]), k = A(null), x = A(null), { menuVisible: c, onMenuClick: F, hideMenu: O } = K(
49
+ k,
40
50
  void 0,
41
51
  !n,
42
- V,
52
+ L,
43
53
  p
44
- ), D = d(
54
+ ), W = d(
45
55
  (e) => {
46
- n && o && o(e.target.value);
56
+ n && r && r(e.target.value);
47
57
  },
48
- [o, n]
49
- ), O = d(
50
- (e, c) => {
51
- M(), b(e, c);
58
+ [r, n]
59
+ ), M = d(
60
+ (e, o) => {
61
+ O(), v(e, o);
52
62
  },
53
- [M, b]
54
- ), F = d((e) => {
63
+ [O, v]
64
+ ), X = d((e) => {
55
65
  e.target.select(), setTimeout(() => {
56
66
  e.target.scrollIntoView({
57
67
  behavior: "smooth"
58
68
  });
59
69
  }, 300);
60
- }, []), L = d(() => {
70
+ }, []), H = d(() => {
61
71
  var e;
62
- o && (o(""), (e = x.current) == null || e.focus());
63
- }, [o]);
64
- return /* @__PURE__ */ k(J, { ref: S, $width: A, $widthX: E, onClick: B, children: [
72
+ r && (r(""), (e = x.current) == null || e.focus());
73
+ }, [r]);
74
+ return /* @__PURE__ */ V(Q, { ref: k, $width: R, $widthX: j, onClick: F, children: [
65
75
  /* @__PURE__ */ t(
66
- q,
76
+ N,
67
77
  {
68
78
  renderAs: h,
69
- label: C,
79
+ label: b,
70
80
  stickyLabel: !0,
71
81
  disabled: p,
72
- willShowMessage: R,
73
- size: v,
74
- mandatory: j,
82
+ willShowMessage: z,
83
+ size: w,
84
+ mandatory: B,
75
85
  shape: m,
76
- isTransparent: w,
86
+ isTransparent: S,
77
87
  inputElement: /* @__PURE__ */ t(
78
- G,
88
+ P,
79
89
  {
80
90
  ref: x,
81
91
  $renderAs: h,
82
- $size: v,
83
- placeholder: I ? "" : C,
92
+ $size: w,
93
+ placeholder: I ? "" : b,
84
94
  disabled: p,
85
95
  readOnly: !n,
86
96
  value: I ?? "",
87
- onFocus: n ? F : void 0,
88
- onChange: n ? D : void 0,
89
- $isTransparent: w
97
+ onFocus: n ? X : void 0,
98
+ onChange: n ? W : void 0,
99
+ $isTransparent: S
90
100
  }
91
101
  ),
92
- 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" }),
93
- errorMessage: z
102
+ 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" }),
103
+ errorMessage: D
94
104
  }
95
105
  ),
96
- u.length > 0 && /* @__PURE__ */ t(K, { $visible: a, children: /* @__PURE__ */ k(N, { $renderAs: h, $theme: f, children: [
97
- i && /* @__PURE__ */ t(
98
- Y,
106
+ u.length > 0 && /* @__PURE__ */ t(U, { $visible: c, children: /* @__PURE__ */ V(Y, { $renderAs: h, $theme: f, children: [
107
+ s && /* @__PURE__ */ t(
108
+ ne,
99
109
  {
100
- sectionOptions: i,
110
+ sectionOptions: s,
101
111
  theme: f,
102
- value: r,
103
- onChange: O
112
+ value: i,
113
+ onChange: M
104
114
  }
105
115
  ),
106
- s && s.map((e) => /* @__PURE__ */ t(
107
- U,
116
+ l && l.map((e) => /* @__PURE__ */ t(
117
+ ee,
108
118
  {
109
119
  option: e,
110
- selected: e.id === r,
111
- onChange: O,
120
+ selected: e.id === i,
121
+ onChange: M,
112
122
  theme: f
113
123
  },
114
124
  e.id
@@ -117,6 +127,6 @@ const ae = (y) => {
117
127
  ] });
118
128
  };
119
129
  export {
120
- ae as default
130
+ he as default
121
131
  };
122
132
  //# sourceMappingURL=base-select-input.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"base-select-input.js","sources":["../../../../../src/features/ui/inputs/base-select-input/base-select-input.tsx"],"sourcesContent":["import type { ISectionOption } from '../../section-list/section-list-types';\nimport type { IBaseSelectInputProps, ISelectOption } from './base-select-input-types';\nimport type { ChangeEvent, FocusEvent, ReactElement } from 'react';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport useContextMenuClickHandler from '../../hooks/use-context-menu-click-handler';\nimport BaseInput from '../base-input/base-input';\nimport { Input } from '../text-input/text-input-styled';\nimport * as Styled from './base-select-input-styled';\nimport SelectOption from './select-option/select-option';\nimport SelectSection from './select-section/select-section';\n\nconst BaseSelectInput = <IDType extends string | number>(\n props: IBaseSelectInputProps<IDType>,\n): ReactElement => {\n const {\n label,\n value,\n options,\n searchable = false,\n searchText,\n onCloseWithoutSelection,\n onSearchTextChange,\n onChange,\n renderAs,\n width,\n widthX,\n disabled,\n willShowMessage,\n mandatory,\n size = 'regular',\n shape,\n theme = 'light',\n isTransparent = false,\n renderOptionsAs = 'list',\n errorMessage,\n } = props;\n\n const sectionOptions =\n renderOptionsAs === 'section-list' && (options as ISectionOption<ISelectOption<IDType>>[]);\n const selectOptions = renderOptionsAs === 'list' && (options as ISelectOption<IDType>[]);\n\n const inputValue = useMemo(() => {\n if (searchable) return searchText;\n\n if (sectionOptions) {\n return sectionOptions.flatMap(section => section.data).find(({ id }) => id === value)\n ?.label as string;\n }\n\n if (selectOptions) return selectOptions.find(option => option.id === value)?.label;\n }, [searchable, searchText, sectionOptions, selectOptions, value]);\n\n const containerRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const inputRef = useRef<HTMLInputElement>(null) as React.RefObject<HTMLInputElement>;\n const { menuVisible, onMenuClick, hideMenu } = useContextMenuClickHandler(\n containerRef,\n undefined,\n !searchable,\n onCloseWithoutSelection,\n disabled,\n );\n\n const handleTextChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n if (searchable && onSearchTextChange) {\n onSearchTextChange(e.target.value);\n }\n },\n [onSearchTextChange, searchable],\n );\n\n const handleChange = useCallback<IBaseSelectInputProps<IDType>['onChange']>(\n (id, option) => {\n hideMenu();\n onChange(id, option);\n },\n [hideMenu, onChange],\n );\n\n const handleFocus = useCallback((e: FocusEvent<HTMLInputElement>) => {\n e.target.select();\n setTimeout(() => {\n e.target.scrollIntoView({\n behavior: 'smooth',\n });\n }, 300);\n }, []);\n\n const handleClear = useCallback(() => {\n if (onSearchTextChange) {\n onSearchTextChange('');\n inputRef.current?.focus();\n }\n }, [onSearchTextChange]);\n\n const downIcon =\n shape === 'curved' || shape === 'borderLess' ? (\n <Styled.StyledChevronDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n ) : (\n <Styled.StyledDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n );\n\n return (\n <Styled.Container ref={containerRef} $width={width} $widthX={widthX} onClick={onMenuClick}>\n <BaseInput\n renderAs={renderAs}\n label={label}\n stickyLabel={true}\n disabled={disabled}\n willShowMessage={willShowMessage}\n size={size}\n mandatory={mandatory}\n shape={shape}\n isTransparent={isTransparent}\n inputElement={\n <Input\n ref={inputRef}\n $renderAs={renderAs}\n $size={size}\n placeholder={inputValue ? '' : label}\n disabled={disabled}\n readOnly={!searchable}\n value={inputValue ?? ''}\n onFocus={searchable ? handleFocus : undefined}\n onChange={searchable ? handleTextChange : undefined}\n $isTransparent={isTransparent}\n />\n }\n siblingElement={searchable && menuVisible ? <CrossIcon onClick={handleClear} /> : downIcon}\n errorMessage={errorMessage}\n />\n\n {options.length > 0 && (\n <Styled.OptionsContainer $visible={menuVisible}>\n <Styled.OptionsWrapper $renderAs={renderAs} $theme={theme}>\n {sectionOptions && (\n <SelectSection<IDType>\n sectionOptions={sectionOptions}\n theme={theme}\n value={value}\n onChange={handleChange}\n />\n )}\n\n {selectOptions &&\n selectOptions.map(option => (\n <SelectOption<IDType>\n key={option.id}\n option={option}\n selected={option.id === value}\n onChange={handleChange}\n theme={theme}\n />\n ))}\n </Styled.OptionsWrapper>\n </Styled.OptionsContainer>\n )}\n </Styled.Container>\n );\n};\n\nexport default BaseSelectInput;\n"],"names":["BaseSelectInput","props","label","value","options","searchable","searchText","onCloseWithoutSelection","onSearchTextChange","onChange","renderAs","width","widthX","disabled","willShowMessage","mandatory","size","shape","theme","isTransparent","renderOptionsAs","errorMessage","sectionOptions","selectOptions","inputValue","useMemo","_a","section","id","_b","option","containerRef","useRef","inputRef","menuVisible","onMenuClick","hideMenu","useContextMenuClickHandler","handleTextChange","useCallback","handleChange","handleFocus","handleClear","jsxs","Styled.Container","jsx","BaseInput","Input","CrossIcon","Styled.StyledChevronDownIcon","Styled.StyledDownIcon","Styled.OptionsContainer","Styled.OptionsWrapper","SelectSection","SelectOption"],"mappings":"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"}
1
+ {"version":3,"file":"base-select-input.js","sources":["../../../../../src/features/ui/inputs/base-select-input/base-select-input.tsx"],"sourcesContent":["import type { ISectionOption } from '../../section-list/section-list-types';\nimport type { IBaseSelectInputProps, ISelectOption } from './base-select-input-types';\nimport type { ChangeEvent, FocusEvent, ReactElement } from 'react';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport useContextMenuClickHandler from '../../hooks/use-context-menu-click-handler';\nimport BaseInput from '../base-input/base-input';\nimport { Input } from '../text-input/text-input-styled';\nimport * as Styled from './base-select-input-styled';\nimport SelectOption from './select-option/select-option';\nimport SelectSection from './select-section/select-section';\n\nconst BaseSelectInput = <IDType extends string | number>(\n props: IBaseSelectInputProps<IDType>,\n): ReactElement => {\n const {\n label,\n value,\n options,\n searchable = false,\n searchText,\n onCloseWithoutSelection,\n onSearchTextChange,\n onChange,\n renderAs,\n width,\n widthX,\n disabled,\n willShowMessage,\n mandatory,\n size = 'regular',\n shape,\n theme = 'light',\n isTransparent = false,\n renderOptionsAs = 'list',\n errorMessage,\n inputLabelOverrides,\n } = props;\n\n const sectionOptions =\n renderOptionsAs === 'section-list' && (options as ISectionOption<ISelectOption<IDType>>[]);\n const selectOptions = renderOptionsAs === 'list' && (options as ISelectOption<IDType>[]);\n\n const inputValue = useMemo(() => {\n if (searchable) return searchText;\n\n if (sectionOptions) {\n let foundSection, foundOption;\n\n for (const section of sectionOptions) {\n const option = section.data.find(({ id }) => id === value);\n\n if (option) {\n foundSection = section;\n foundOption = option;\n\n break;\n }\n }\n\n if (foundSection && inputLabelOverrides)\n return inputLabelOverrides(foundSection, foundOption);\n\n return foundOption?.label || '';\n }\n\n if (selectOptions) return selectOptions.find(option => option.id === value)?.label;\n }, [searchable, searchText, sectionOptions, selectOptions, inputLabelOverrides, value]);\n\n const containerRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const inputRef = useRef<HTMLInputElement>(null) as React.RefObject<HTMLInputElement>;\n const { menuVisible, onMenuClick, hideMenu } = useContextMenuClickHandler(\n containerRef,\n undefined,\n !searchable,\n onCloseWithoutSelection,\n disabled,\n );\n\n const handleTextChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n if (searchable && onSearchTextChange) {\n onSearchTextChange(e.target.value);\n }\n },\n [onSearchTextChange, searchable],\n );\n\n const handleChange = useCallback<IBaseSelectInputProps<IDType>['onChange']>(\n (id, option) => {\n hideMenu();\n onChange(id, option);\n },\n [hideMenu, onChange],\n );\n\n const handleFocus = useCallback((e: FocusEvent<HTMLInputElement>) => {\n e.target.select();\n setTimeout(() => {\n e.target.scrollIntoView({\n behavior: 'smooth',\n });\n }, 300);\n }, []);\n\n const handleClear = useCallback(() => {\n if (onSearchTextChange) {\n onSearchTextChange('');\n inputRef.current?.focus();\n }\n }, [onSearchTextChange]);\n\n const downIcon =\n shape === 'curved' || shape === 'borderLess' ? (\n <Styled.StyledChevronDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n ) : (\n <Styled.StyledDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n );\n\n return (\n <Styled.Container ref={containerRef} $width={width} $widthX={widthX} onClick={onMenuClick}>\n <BaseInput\n renderAs={renderAs}\n label={label}\n stickyLabel={true}\n disabled={disabled}\n willShowMessage={willShowMessage}\n size={size}\n mandatory={mandatory}\n shape={shape}\n isTransparent={isTransparent}\n inputElement={\n <Input\n ref={inputRef}\n $renderAs={renderAs}\n $size={size}\n placeholder={inputValue ? '' : label}\n disabled={disabled}\n readOnly={!searchable}\n value={inputValue ?? ''}\n onFocus={searchable ? handleFocus : undefined}\n onChange={searchable ? handleTextChange : undefined}\n $isTransparent={isTransparent}\n />\n }\n siblingElement={searchable && menuVisible ? <CrossIcon onClick={handleClear} /> : downIcon}\n errorMessage={errorMessage}\n />\n\n {options.length > 0 && (\n <Styled.OptionsContainer $visible={menuVisible}>\n <Styled.OptionsWrapper $renderAs={renderAs} $theme={theme}>\n {sectionOptions && (\n <SelectSection<IDType>\n sectionOptions={sectionOptions}\n theme={theme}\n value={value}\n onChange={handleChange}\n />\n )}\n\n {selectOptions &&\n selectOptions.map(option => (\n <SelectOption<IDType>\n key={option.id}\n option={option}\n selected={option.id === value}\n onChange={handleChange}\n theme={theme}\n />\n ))}\n </Styled.OptionsWrapper>\n </Styled.OptionsContainer>\n )}\n </Styled.Container>\n );\n};\n\nexport default BaseSelectInput;\n"],"names":["BaseSelectInput","props","label","value","options","searchable","searchText","onCloseWithoutSelection","onSearchTextChange","onChange","renderAs","width","widthX","disabled","willShowMessage","mandatory","size","shape","theme","isTransparent","renderOptionsAs","errorMessage","inputLabelOverrides","sectionOptions","selectOptions","inputValue","useMemo","foundSection","foundOption","section","option","id","_a","containerRef","useRef","inputRef","menuVisible","onMenuClick","hideMenu","useContextMenuClickHandler","handleTextChange","useCallback","handleChange","handleFocus","handleClear","jsxs","Styled.Container","jsx","BaseInput","Input","CrossIcon","Styled.StyledChevronDownIcon","Styled.StyledDownIcon","Styled.OptionsContainer","Styled.OptionsWrapper","SelectSection","SelectOption"],"mappings":"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"}
@@ -1,33 +1,32 @@
1
- import { jsx as A } from "react/jsx-runtime";
2
- import E from "lottie-web";
3
- import { memo as w, forwardRef as b, useRef as m, useImperativeHandle as I, useEffect as S } from "react";
1
+ import { jsx as E } from "react/jsx-runtime";
2
+ import g from "lottie-web";
3
+ import { memo as w, forwardRef as A, useRef as u, useImperativeHandle as b, useEffect as I } from "react";
4
4
  import $ from "../layout/flex-view.js";
5
5
  import { fetchLottie as x } from "./helper.js";
6
- const O = b((L, h) => {
6
+ const O = A((v, L) => {
7
7
  const {
8
- src: l,
9
- width: g = "100%",
8
+ src: m,
9
+ width: h = "100%",
10
10
  height: y = "100%",
11
- settings: d,
12
- eventListener: o,
13
- onRender: i,
14
- onError: a,
15
- animateOnIntersect: s
16
- } = L, c = m(null), r = m(null), u = m(null);
17
- return I(
18
- h,
11
+ settings: l,
12
+ eventListener: n,
13
+ onRender: o,
14
+ animateOnIntersect: c
15
+ } = v, a = u(null), r = u(null), s = u(null);
16
+ return b(
17
+ L,
19
18
  () => ({
20
- playSegments: (t, n) => {
19
+ playSegments: (t, i) => {
21
20
  var e;
22
- return (e = r.current) == null ? void 0 : e.playSegments(t, n);
21
+ return (e = r.current) == null ? void 0 : e.playSegments(t, i);
23
22
  },
24
- addEventListener: (t, n) => {
23
+ addEventListener: (t, i) => {
25
24
  var e;
26
- return (e = r.current) == null ? void 0 : e.addEventListener(t, n);
25
+ return (e = r.current) == null ? void 0 : e.addEventListener(t, i);
27
26
  },
28
- removeEventListener: (t, n) => {
27
+ removeEventListener: (t, i) => {
29
28
  var e;
30
- return (e = r.current) == null ? void 0 : e.removeEventListener(t, n);
29
+ return (e = r.current) == null ? void 0 : e.removeEventListener(t, i);
31
30
  },
32
31
  play: () => {
33
32
  var t;
@@ -36,41 +35,37 @@ const O = b((L, h) => {
36
35
  stop: () => {
37
36
  var t;
38
37
  return (t = r.current) == null ? void 0 : t.stop();
39
- },
40
- goToAndStop: (t, n) => {
41
- var e;
42
- return (e = r.current) == null ? void 0 : e.goToAndStop(t, n);
43
38
  }
44
39
  }),
45
40
  []
46
- ), S(() => {
41
+ ), I(() => {
47
42
  let t = !1;
48
43
  return (async () => {
49
44
  try {
50
- const e = await x(l);
45
+ const e = await x(m);
51
46
  requestAnimationFrame(() => {
52
- !c.current || t || (r.current = E.loadAnimation({
53
- container: c.current,
47
+ !a.current || t || (r.current = g.loadAnimation({
48
+ container: a.current,
54
49
  animationData: e,
55
50
  loop: !0,
56
51
  autoplay: !0,
57
- ...d
58
- }), s && (u.current = new IntersectionObserver(
52
+ ...l
53
+ }), c && (s.current = new IntersectionObserver(
59
54
  ([f]) => {
60
- var p, v;
61
- f && f.isIntersecting ? (p = r.current) == null || p.play() : (v = r.current) == null || v.pause();
55
+ var d, p;
56
+ f && f.isIntersecting ? (d = r.current) == null || d.play() : (p = r.current) == null || p.pause();
62
57
  },
63
58
  { threshold: 0 }
64
- ), u.current.observe(c.current)), i == null || i(), o && r.current.addEventListener(o.name, o.callback));
59
+ ), s.current.observe(a.current)), o == null || o(), n && r.current.addEventListener(n.name, n.callback));
65
60
  });
66
61
  } catch (e) {
67
- throw a == null || a(), Error(`Error loading Lottie animation: ${e}`);
62
+ throw Error(`Error loading Lottie animation: ${e}`);
68
63
  }
69
64
  })(), () => {
70
65
  var e;
71
- t = !0, r.current && (o && r.current.removeEventListener(o.name, o.callback), s && ((e = u.current) == null || e.disconnect()), r.current.destroy());
66
+ t = !0, r.current && (n && r.current.removeEventListener(n.name, n.callback), c && ((e = s.current) == null || e.disconnect()), r.current.destroy());
72
67
  };
73
- }, [l, o, i, s, d, a]), /* @__PURE__ */ A($, { ref: c, $width: g, $height: y });
68
+ }, [m, n, o, c, l]), /* @__PURE__ */ E($, { ref: a, $width: h, $height: y });
74
69
  }), D = w(O);
75
70
  export {
76
71
  D as default
@@ -1 +1 @@
1
- {"version":3,"file":"lottie-animation.js","sources":["../../../../src/features/ui/lottie-animation/lottie-animation.tsx"],"sourcesContent":["import type { ILottieAnimationProps, ILottieAnimationRef } from './types';\nimport type { AnimationEventName, AnimationItem, AnimationSegment } from 'lottie-web';\n\nimport lottie from 'lottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport { fetchLottie } from './helper';\n\nconst LottieAnimation = forwardRef<ILottieAnimationRef, ILottieAnimationProps>((props, ref) => {\n const {\n src,\n width = '100%',\n height = '100%',\n settings,\n eventListener,\n onRender,\n onError,\n animateOnIntersect,\n } = props;\n\n const container = useRef<HTMLDivElement>(null);\n const animationInstance = useRef<AnimationItem | null>(null);\n const intersectionObserver = useRef<IntersectionObserver | null>(null);\n\n useImperativeHandle(\n ref,\n () => ({\n playSegments: (segments: AnimationSegment, forceFlag?: boolean) =>\n animationInstance.current?.playSegments(segments, forceFlag),\n addEventListener: (eventName: string, callback: () => void) =>\n animationInstance.current?.addEventListener(eventName as AnimationEventName, callback),\n removeEventListener: (eventName: string, callback: () => void) =>\n animationInstance.current?.removeEventListener(eventName as AnimationEventName, callback),\n play: () => animationInstance.current?.play(),\n stop: () => animationInstance.current?.stop(),\n goToAndStop: (v, f) => animationInstance.current?.goToAndStop(v, f),\n }),\n [],\n );\n\n useEffect(() => {\n let destroyed = false;\n\n const loadAnimation = async () => {\n try {\n const animationData = await fetchLottie(src);\n\n // Wait for layout\n // NOTE: Do not remove this as this is needed to fix canvas rendering on first layout.\n requestAnimationFrame(() => {\n if (!container.current || destroyed) return;\n\n animationInstance.current = lottie.loadAnimation({\n container: container.current,\n animationData,\n loop: true,\n autoplay: true,\n ...settings,\n });\n\n if (animateOnIntersect) {\n intersectionObserver.current = new IntersectionObserver(\n ([entry]) => {\n if (entry && entry.isIntersecting) {\n animationInstance.current?.play();\n } else {\n animationInstance.current?.pause();\n }\n },\n { threshold: 0 },\n );\n\n intersectionObserver.current.observe(container.current);\n }\n\n onRender?.();\n if (eventListener) {\n animationInstance.current.addEventListener(eventListener.name, eventListener.callback);\n }\n });\n } catch (error) {\n onError?.();\n throw Error(`Error loading Lottie animation: ${error}`);\n }\n };\n\n loadAnimation();\n\n return () => {\n destroyed = true;\n if (animationInstance.current) {\n if (eventListener) {\n animationInstance.current.removeEventListener(eventListener.name, eventListener.callback);\n }\n\n if (animateOnIntersect) {\n intersectionObserver.current?.disconnect();\n }\n animationInstance.current.destroy();\n }\n };\n }, [src, eventListener, onRender, animateOnIntersect, settings, onError]);\n\n return <FlexView ref={container} $width={width} $height={height} />;\n});\n\nexport default memo(LottieAnimation);\n"],"names":["LottieAnimation","forwardRef","props","ref","src","width","height","settings","eventListener","onRender","onError","animateOnIntersect","container","useRef","animationInstance","intersectionObserver","useImperativeHandle","segments","forceFlag","_a","eventName","callback","v","f","useEffect","destroyed","animationData","fetchLottie","lottie","entry","_b","error","FlexView","LottieAnimation$1","memo"],"mappings":";;;;;AASA,MAAMA,IAAkBC,EAAuD,CAACC,GAAOC,MAAQ;AACvF,QAAA;AAAA,IACJ,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,oBAAAC;AAAA,EACE,IAAAT,GAEEU,IAAYC,EAAuB,IAAI,GACvCC,IAAoBD,EAA6B,IAAI,GACrDE,IAAuBF,EAAoC,IAAI;AAErE,SAAAG;AAAA,IACEb;AAAA,IACA,OAAO;AAAA,MACL,cAAc,CAACc,GAA4BC,MACzC;;AAAA,gBAAAC,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,aAAaF,GAAUC;AAAA;AAAA,MACpD,kBAAkB,CAACE,GAAmBC,MACpC;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,iBAAiBC,GAAiCC;AAAA;AAAA,MAC/E,qBAAqB,CAACD,GAAmBC,MACvC;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B,oBAAoBC,GAAiCC;AAAA;AAAA,MAClF,MAAM,MAAM;;AAAA,gBAAAF,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B;AAAA;AAAA,MACvC,MAAM,MAAM;;AAAA,gBAAAA,IAAAL,EAAkB,YAAlB,gBAAAK,EAA2B;AAAA;AAAA,MACvC,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;AA6CF,YA3CQ,YAAY;AAC5B,UAAA;AACI,cAAAC,IAAgB,MAAMC,EAAYvB,CAAG;AAI3C,8BAAsB,MAAM;AACtB,UAAA,CAACQ,EAAU,WAAWa,MAERX,EAAA,UAAUc,EAAO,cAAc;AAAA,YAC/C,WAAWhB,EAAU;AAAA,YACrB,eAAAc;AAAA,YACA,MAAM;AAAA,YACN,UAAU;AAAA,YACV,GAAGnB;AAAA,UAAA,CACJ,GAEGI,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,IAG7CH,KAAA,QAAAA,KACPD,KACFM,EAAkB,QAAQ,iBAAiBN,EAAc,MAAMA,EAAc,QAAQ;AAAA,QACvF,CACD;AAAA,eACMuB,GAAO;AACJ,cAAArB,KAAA,QAAAA,KACJ,MAAM,mCAAmCqB,CAAK,EAAE;AAAA,MACxD;AAAA,IAAA,MAKK,MAAM;;AACC,MAAAN,IAAA,IACRX,EAAkB,YAChBN,KACFM,EAAkB,QAAQ,oBAAoBN,EAAc,MAAMA,EAAc,QAAQ,GAGtFG,OACFQ,IAAAJ,EAAqB,YAArB,QAAAI,EAA8B,eAEhCL,EAAkB,QAAQ;IAC5B;AAAA,EACF,GACC,CAACV,GAAKI,GAAeC,GAAUE,GAAoBJ,GAAUG,CAAO,CAAC,qBAEhEsB,GAAS,EAAA,KAAKpB,GAAW,QAAQP,GAAO,SAASC,EAAQ,CAAA;AACnE,CAAC,GAEc2B,IAAAC,EAAKlC,CAAe;"}
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 }),\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;"}