@@ -257,34 +257,64 @@ function UIView(props: {
257
257
boxShadowVal = defaultChildren . style ?. children ?. boxShadow ?. valueAndMsg ?. value ;
258
258
restrictPaddingOnRotationVal = defaultChildren ?. restrictPaddingOnRotation ?. valueAndMsg ?. value ;
259
259
}
260
- const getPadding = ( ) => ( rotationVal === null ||
261
- rotationVal === undefined ||
262
- restrictPaddingOnRotation ) &&
263
- ( boxShadowVal === null ||
264
- boxShadowVal === undefined ||
265
- boxShadowVal === '0px' )
266
- ? restrictPaddingOnRotationVal === 'qrCode'
267
- ? rotationVal !== '' && rotationVal !== '0deg' ?'35% 0px' :'0px'
268
- : restrictPaddingOnRotationVal === 'image'
269
- ? rotationVal !== '' && rotationVal !== '0deg' ?'10% 0px' :'0px'
270
- : restrictPaddingOnRotationVal === 'controlButton'
271
- ? rotationVal !== '' && rotationVal !== '0deg' ?'10% 0px' :'0px'
272
- : '0px' // Both rotation and box-shadow are empty or restricted
273
- : rotationVal !== '' && rotationVal !== '0deg' // Rotation applied
274
- ? boxShadowVal === null ||
275
- boxShadowVal === undefined ||
276
- boxShadowVal === '0px'
277
- ? `calc(min(50%, ${ Math . abs ( rotationVal . replace ( 'deg' , '' ) ) / 90 } * 100%)) 0px`
278
- : boxShadowVal !== '' && boxShadowVal !== '0px' // Both rotation and box-shadow applied
279
- ? `calc(min(50%, ${ Math . abs ( rotationVal . replace ( 'deg' , '' ) + parseFloat ( boxShadowVal . replace ( 'px' , '' ) ) ) / 90 } * 100%)) 0px`
280
- : `calc(min(50%, ${ Math . abs ( rotationVal . replace ( 'deg' , '' ) ) / 90 } * 100%)) 0px` // Only rotation applied
281
- : boxShadowVal === null ||
282
- boxShadowVal === undefined ||
283
- boxShadowVal === '0px'
284
- ? '0px'
285
- : boxShadowVal !== '' && boxShadowVal !== '0px' // Box-shadow applied
286
- ? `calc(min(50%, ${ Math . abs ( parseFloat ( boxShadowVal . replace ( 'px' , '' ) ) ) / 90 } * 100%)) 0px`
287
- : '0px' // Default value if neither rotation nor box-shadow is applied
260
+ const getPadding = ( ) => {
261
+ if (
262
+ ( rotationVal === null ||
263
+ rotationVal === undefined ||
264
+ restrictPaddingOnRotation ) &&
265
+ ( boxShadowVal === null ||
266
+ boxShadowVal === undefined ||
267
+ boxShadowVal === '0px' )
268
+ ) {
269
+ if ( restrictPaddingOnRotationVal === 'qrCode' ) {
270
+ if ( rotationVal !== '' && rotationVal !== '0deg' ) {
271
+ return '35% 0px' ;
272
+ } else {
273
+ return '0px' ;
274
+ }
275
+ } else if ( restrictPaddingOnRotationVal === 'image' ) {
276
+ if ( rotationVal !== '' && rotationVal !== '0deg' ) {
277
+ return '10% 0px' ;
278
+ } else {
279
+ return '0px' ;
280
+ }
281
+ } else if ( restrictPaddingOnRotationVal === 'controlButton' ) {
282
+ if ( rotationVal !== '' && rotationVal !== '0deg' ) {
283
+ return '10% 0px' ;
284
+ } else {
285
+ return '0px' ;
286
+ }
287
+ } else {
288
+ return '0px' ; // Both rotation and box-shadow are empty or restricted
289
+ }
290
+ } else if ( rotationVal !== '' && rotationVal !== '0deg' ) {
291
+ // Rotation applied
292
+ if (
293
+ boxShadowVal === null ||
294
+ boxShadowVal === undefined ||
295
+ boxShadowVal === '0px'
296
+ ) {
297
+ return `calc(min(50%, ${ Math . abs ( rotationVal . replace ( 'deg' , '' ) ) / 90 } * 100%)) 0px` ;
298
+ } else if ( boxShadowVal !== '' && boxShadowVal !== '0px' ) {
299
+ // Both rotation and box-shadow applied
300
+ return `calc(min(50%, ${ Math . abs ( rotationVal . replace ( 'deg' , '' ) + parseFloat ( boxShadowVal . replace ( 'px' , '' ) ) ) / 90 } * 100%)) 0px` ;
301
+ } else {
302
+ return `calc(min(50%, ${ Math . abs ( rotationVal . replace ( 'deg' , '' ) ) / 90 } * 100%)) 0px` ; // Only rotation applied
303
+ }
304
+ } else if (
305
+ boxShadowVal === null ||
306
+ boxShadowVal === undefined ||
307
+ boxShadowVal === '0px'
308
+ ) {
309
+ return '0px' ;
310
+ } else if ( boxShadowVal !== '' && boxShadowVal !== '0px' ) {
311
+ // Box-shadow applied
312
+ return `calc(min(50%, ${ Math . abs ( parseFloat ( boxShadowVal . replace ( 'px' , '' ) ) ) / 90 } * 100%)) 0px` ;
313
+ } else {
314
+ return '0px' ; // Default value if neither rotation nor box-shadow is applied
315
+ }
316
+ } ;
317
+
288
318
return (
289
319
< div
290
320
ref = { props . innerRef }
0 commit comments