@@ -10,7 +10,7 @@ import { styleControl } from "comps/controls/styleControl";
1010import { AnimationStyle , LottieStyle } from "comps/controls/styleControlConstants" ;
1111import { trans } from "i18n" ;
1212import { Section , sectionNames } from "lowcoder-design" ;
13- import { useContext , lazy , useEffect , useState } from "react" ;
13+ import { useContext , lazy , useEffect , useState , useCallback } from "react" ;
1414import { stateComp , UICompBuilder , withDefault } from "../../generators" ;
1515import {
1616NameConfig ,
@@ -23,9 +23,10 @@ import { AssetType, IconscoutControl } from "@lowcoder-ee/comps/controls/iconsco
2323import { DotLottie } from "@lottiefiles/dotlottie-react" ;
2424import { AutoHeightControl } from "@lowcoder-ee/comps/controls/autoHeightControl" ;
2525import { useResizeDetector } from "react-resize-detector" ;
26- import { eventHandlerControl } from "@lowcoder-ee/comps/controls/eventHandlerControl" ;
26+ import { eventHandlerControl , clickEvent , doubleClickEvent } from "@lowcoder-ee/comps/controls/eventHandlerControl" ;
2727import { withMethodExposing } from "@lowcoder-ee/comps/generators/withMethodExposing" ;
2828import { changeChildAction } from "lowcoder-core" ;
29+ import { useCompClickEventHandler } from "@lowcoder-ee/comps/utils/useCompClickEventHandler" ;
2930
3031// const Player = lazy(
3132// () => import('@lottiefiles/react-lottie-player')
@@ -128,6 +129,8 @@ const ModeOptions = [
128129] as const ;
129130
130131const EventOptions = [
132+ clickEvent ,
133+ doubleClickEvent ,
131134{ label :trans ( "jsonLottie.load" ) , value :"load" , description :trans ( "jsonLottie.load" ) } ,
132135{ label :trans ( "jsonLottie.play" ) , value :"play" , description :trans ( "jsonLottie.play" ) } ,
133136{ label :trans ( "jsonLottie.pause" ) , value :"pause" , description :trans ( "jsonLottie.pause" ) } ,
@@ -160,6 +163,10 @@ let JsonLottieTmpComp = (function () {
160163} ;
161164return new UICompBuilder ( childrenMap , ( props , dispatch ) => {
162165const [ dotLottie , setDotLottie ] = useState < DotLottie | null > ( null ) ;
166+ const handleClickEvent = useCompClickEventHandler ( { onEvent :props . onEvent } ) ;
167+ const handleClick = useCallback ( ( ) => {
168+ handleClickEvent ( ) ;
169+ } , [ handleClickEvent ] ) ;
163170
164171const setLayoutAndResize = ( ) => {
165172const align = props . align . split ( ',' ) ;
@@ -244,6 +251,7 @@ let JsonLottieTmpComp = (function () {
244251padding :`${ props . container . padding } ,
245252rotate :props . container . rotation ,
246253} }
254+ onClick = { handleClick }
247255>
248256< DotLottiePlayer
249257key = {