@@ -129,7 +129,10 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
129129 { items . map ( ( item : any , index : number ) => {
130130 if ( typeof item === "string" ) {
131131 return (
132- < div key = { `${ item } -${ index } ` } style = { { flex : "1 1 0" , minWidth : 0 } } >
132+ < div
133+ key = { `${ item } -${ index } ` }
134+ style = { { flex : "1 1 0" , minWidth : 0 } }
135+ >
133136 { children ( item ) }
134137 </ div >
135138 ) ;
@@ -165,7 +168,11 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
165168 >
166169 { items . map ( ( item : any , index : number ) => {
167170 if ( typeof item === "string" ) {
168- return < React . Fragment key = { `${ item } -${ index } ` } > { children ( item ) } </ React . Fragment > ;
171+ return (
172+ < React . Fragment key = { `${ item } -${ index } ` } >
173+ { children ( item ) }
174+ </ React . Fragment >
175+ ) ;
169176 }
170177
171178 if ( item && typeof item === "object" && "id" in item ) {
@@ -265,7 +272,14 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
265272 ) ;
266273 } ,
267274 PieChart : ( { props } ) => {
268- const colors = [ "#3b82f6" , "#8b5cf6" , "#ec4899" , "#f59e0b" , "#10b981" , "#6366f1" ] ;
275+ const colors = [
276+ "#3b82f6" ,
277+ "#8b5cf6" ,
278+ "#ec4899" ,
279+ "#f59e0b" ,
280+ "#10b981" ,
281+ "#6366f1" ,
282+ ] ;
269283 const data = props . data ?? [ ] ;
270284
271285 return (
@@ -283,7 +297,10 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
283297 paddingAngle = { 2 }
284298 >
285299 { data . map ( ( entry : any , index : number ) => (
286- < Cell key = { index } fill = { entry . color ?? colors [ index % colors . length ] } />
300+ < Cell
301+ key = { index }
302+ fill = { entry . color ?? colors [ index % colors . length ] }
303+ />
287304 ) ) }
288305 </ Pie >
289306 < Tooltip />
@@ -375,9 +392,15 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
375392 </ thead >
376393 < tbody >
377394 { rows . map ( ( row : any , index : number ) => (
378- < tr key = { index } style = { { borderBottom : `1px solid ${ c . divider } ` } } >
395+ < tr
396+ key = { index }
397+ style = { { borderBottom : `1px solid ${ c . divider } ` } }
398+ >
379399 { columns . map ( ( column : any ) => (
380- < td key = { column . key } style = { { padding : "8px 12px" , color : c . cardFg } } >
400+ < td
401+ key = { column . key }
402+ style = { { padding : "8px 12px" , color : c . cardFg } }
403+ >
381404 { String ( row [ column . key ] ?? "" ) }
382405 </ td >
383406 ) ) }
@@ -400,7 +423,8 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
400423 Delayed : "#eab308" ,
401424 Cancelled : "#ef4444" ,
402425 } ;
403- const dotColor = props . statusColor ?? statusColors [ props . status ] ?? "#22c55e" ;
426+ const dotColor =
427+ props . statusColor ?? statusColors [ props . status ] ?? "#22c55e" ;
404428
405429 return (
406430 < div
@@ -430,11 +454,20 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
430454 < img
431455 src = { props . airlineLogo }
432456 alt = { props . airline }
433- style = { { width : 28 , height : 28 , borderRadius : "50%" , objectFit : "contain" } }
457+ style = { {
458+ width : 28 ,
459+ height : 28 ,
460+ borderRadius : "50%" ,
461+ objectFit : "contain" ,
462+ } }
434463 />
435- < span style = { { fontWeight : 600 , fontSize : "0.95rem" } } > { props . airline } </ span >
464+ < span style = { { fontWeight : 600 , fontSize : "0.95rem" } } >
465+ { props . airline }
466+ </ span >
436467 </ div >
437- < span style = { { fontWeight : 700 , fontSize : "1.15rem" } } > { props . price } </ span >
468+ < span style = { { fontWeight : 700 , fontSize : "1.15rem" } } >
469+ { props . price }
470+ </ span >
438471 </ div >
439472 < div
440473 style = { {
@@ -447,17 +480,29 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
447480 < span > { props . flightNumber } </ span >
448481 < span > { props . date } </ span >
449482 </ div >
450- < hr style = { { border : "none" , borderTop : `1px solid ${ c . divider } ` , margin : 0 } } />
483+ < hr
484+ style = { {
485+ border : "none" ,
486+ borderTop : `1px solid ${ c . divider } ` ,
487+ margin : 0 ,
488+ } }
489+ />
451490 < div
452491 style = { {
453492 display : "flex" ,
454493 justifyContent : "space-between" ,
455494 alignItems : "center" ,
456495 } }
457496 >
458- < span style = { { fontWeight : 700 , fontSize : "1.1rem" } } > { props . departureTime } </ span >
459- < span style = { { fontSize : "0.75rem" , color : c . muted } } > { props . duration } </ span >
460- < span style = { { fontWeight : 700 , fontSize : "1.1rem" } } > { props . arrivalTime } </ span >
497+ < span style = { { fontWeight : 700 , fontSize : "1.1rem" } } >
498+ { props . departureTime }
499+ </ span >
500+ < span style = { { fontSize : "0.75rem" , color : c . muted } } >
501+ { props . duration }
502+ </ span >
503+ < span style = { { fontWeight : 700 , fontSize : "1.1rem" } } >
504+ { props . arrivalTime }
505+ </ span >
461506 </ div >
462507 < div
463508 style = { {
@@ -480,7 +525,13 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
480525 gap : "12px" ,
481526 } }
482527 >
483- < hr style = { { border : "none" , borderTop : `1px solid ${ c . divider } ` , margin : 0 } } />
528+ < hr
529+ style = { {
530+ border : "none" ,
531+ borderTop : `1px solid ${ c . divider } ` ,
532+ margin : 0 ,
533+ } }
534+ />
484535 < div style = { { display : "flex" , alignItems : "center" , gap : "6px" } } >
485536 < span
486537 style = { {
@@ -491,9 +542,15 @@ const demonstrationCatalogRenderers: CatalogRenderers<DemonstrationCatalogDefini
491542 display : "inline-block" ,
492543 } }
493544 />
494- < span style = { { fontSize : "0.8rem" , color : c . muted } } > { props . status } </ span >
545+ < span style = { { fontSize : "0.8rem" , color : c . muted } } >
546+ { props . status }
547+ </ span >
495548 </ div >
496- < ActionButton label = "Select" doneLabel = "Selected" action = { props . action } />
549+ < ActionButton
550+ label = "Select"
551+ doneLabel = "Selected"
552+ action = { props . action }
553+ />
497554 </ div >
498555 </ div >
499556 ) ;
0 commit comments