1- import { useEffect , useRef , useState } from "react" ;
1+ import { useEffect , useMemo , useRef , useState } from "react" ;
22import styled , { css } from "styled-components" ;
33import { RecordConstructorToView } from "lowcoder-core" ;
44import { styleControl } from "comps/controls/styleControl" ;
@@ -34,8 +34,10 @@ import { AssetType, IconscoutControl } from "@lowcoder-ee/comps/controls/iconsco
3434import { dropdownControl } from "../controls/dropdownControl" ;
3535
3636const Container = styled . div < {
37+ $sourceMode :string ;
3738$style :IconStyleType | undefined ;
38- $animationStyle :AnimationStyleType } > `
39+ $animationStyle :AnimationStyleType ;
40+ } > `
3941 display: flex;
4042 align-items: center;
4143 justify-content: center;
@@ -59,6 +61,15 @@ const Container = styled.div<{
5961 pointer-events: auto;
6062 }
6163 ` }
64+ ${ ( props ) => props . $sourceMode === 'asset-library' && `
65+ img {
66+ max-width: 100%;
67+ max-height: 100%;
68+ width: 100%;
69+ height: 100%;
70+ object-fit: contain;
71+ }
72+ ` }
6273` ;
6374
6475const EventOptions = [ clickEvent ] as const ;
@@ -101,17 +112,28 @@ const IconView = (props: RecordConstructorToView<typeof childrenMap>) => {
101112 onResize,
102113} ) ;
103114
115+ const style = useMemo ( ( ) => {
116+ if ( props . sourceMode === 'standard' ) {
117+ return {
118+ fontSize :props . autoHeight
119+ ?`${ height < width ?height :width }
120+ :props . iconSize ,
121+ background :props . style . background ,
122+ }
123+ }
124+ return {
125+ width :props . autoHeight ?'' :props . iconSize ,
126+ background :props . style . background ,
127+ }
128+ } , [ width , height , props . autoHeight , props . iconSize , props . sourceMode , props . style . background ] ) ;
129+
104130return (
105131< Container
106132ref = { conRef }
107133$style = { props . style }
134+ $sourceMode = { props . sourceMode }
108135$animationStyle = { props . animationStyle }
109- style = { {
110- fontSize :props . autoHeight
111- ?`${ height < width ?height :width }
112- :props . iconSize ,
113- background :props . style . background ,
114- } }
136+ style = { style }
115137onClick = { ( ) => props . onEvent ( "click" ) }
116138>
117139{ props . sourceMode === 'standard'