import Ġsvg .* Ċ import Ġkotlinx . html . js .* Ċ import Ġreact .* Ċ import Ġreact . dom .* ĊĊ Ċ interface ĠM orph ing Shape Props : ĠR Props Ċ Ċ class ĠM orph ing Shape State ( var Ġhover ed : ĠBoolean , Ġvar Ġclicked : ĠBoolean ): ĠR State Ċ Ċ class ĠM orph ing Shape : ĠR Component With SVG < Morph ing Shape Props , ĠM orph ing Shape State >() Ġ{ ĊĊĠĠĠ Ġoverride Ġfun ĠcomponentDidMount () Ġ{ ĊĠĠĠĠĠĠĠ ĠsetState Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġclicked Ġ= Ġfalse ĊĠĠĠĠĠĠĠĠĠĠĠ Ġhover ed Ġ= Ġfalse ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} ĊĊĠĠĠ Ġoverride Ġfun ĠR Builder . render () Ġ{ ĊĠĠĠĠĠĠĠ Ġsvg Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġattrs Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġwidth Ġ= Ġ" 1 0 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġheight Ġ= Ġ" 1 0 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠviewBox Ġ= Ġ" 0 Ġ 0 Ġ 1 0 0 Ġ 1 0 0 " ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġattrs [" view Box "] Ġ= Ġ" 0 Ġ 0 Ġ 8 0 0 Ġ 6 0 0 " ĊĠĠĠĠĠĠĠĠĠĠĠ Ġif Ġ( state . clicked ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġrect Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġattrs Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġwidth Ġ= Ġ" 8 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġheight Ġ= Ġ" 8 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġjs Style Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġstroke Ġ= Ġ" gray " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġfill Ġ= Ġif Ġ( state . hover ed ) Ġ" alice blue " Ġelse Ġ" white " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonMouse Over Function Ġ= Ġ{ ĠsetState Ġ{ Ġhover ed Ġ= Ġtrue Ġ}} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonMouse Out Function Ġ= Ġ{ ĠsetState Ġ{ Ġhover ed Ġ= Ġfalse Ġ}} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġon MouseDown Function Ġ= Ġ{ setState Ġ{ Ġclicked Ġ= Ġtrue }} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonMouse Up Function Ġ= Ġ{ setState Ġ{ Ġclicked Ġ= Ġfalse }} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ġelse Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġcircle Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġattrs Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġcx Ġ= Ġ" 4 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġcy Ġ= Ġ" 4 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġr Ġ= Ġ" 4 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġjs Style Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġstroke Ġ= Ġ" gray " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġfill Ġ= Ġif Ġ( state . hover ed ) Ġ" alice blue " Ġelse Ġ" white " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonMouse Over Function Ġ= Ġ{ ĠsetState Ġ{ Ġhover ed Ġ= Ġtrue Ġ}} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonMouse Out Function Ġ= Ġ{ ĠsetState Ġ{ Ġhover ed Ġ= Ġfalse Ġ}} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġon MouseDown Function Ġ= Ġ{ setState Ġ{ Ġclicked Ġ= Ġtrue }} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonMouse Up Function Ġ= Ġ{ setState Ġ{ Ġclicked Ġ= Ġfalse }} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } ĊĊ Ċ fun ĠR Builder . morph ing Shape () Ġ= Ġchild ( Morph ing Shape :: class ) Ġ{ Ċ } ĊĊ