package Ġstyled Ċ Ċ import Ġkotlin ext . js . invoke Ċ import Ġkotlin ext . js . js Object Ċ import Ġkotlinx . browser . window Ċ import Ġkotlinx . css . Css Builder Ċ import Ġkotlinx . css . Rule Set Ċ import Ġkotlinx . html .* Ċ import Ġorg . w 3 c . dom . Element Ċ import Ġreact .* Ċ import Ġreact . dom .* Ċ import Ġkotlin . js . Promise Ċ Ċ type alias ĠAny Tag Styled Builder Ġ= ĠStyled DOM Builder < Common Attribute Group Facade > Ċ type alias ĠAny Builder Ġ= ĠAny Tag Styled Builder . () Ġ-> ĠUnit Ċ Ċ type alias ĠHTML Tag Builder Ġ= ĠStyled DOM Builder < HTML Tag >. () Ġ-> ĠUnit Ċ Ċ type alias ĠA Builder Ġ= ĠStyled DOM Builder < A >. () Ġ-> ĠUnit Ċ type alias ĠDIV Builder Ġ= ĠStyled DOM Builder < DIV >. () Ġ-> ĠUnit Ċ type alias ĠSP AN Builder Ġ= ĠStyled DOM Builder < SPAN >. () Ġ-> ĠUnit Ċ type alias ĠINPUT Builder Ġ= ĠStyled DOM Builder < INPUT >. () Ġ-> ĠUnit Ċ Ċ external Ġinterface ĠCustom Styled Props Ġ: ĠR Props Ġ{ ĊĠĠĠ Ġvar Ġcss : ĠArrayList < Rule Set >? Ċ } Ċ Ċ inline Ġfun ĠCustom Styled Props . forward Css ( builder : ĠCss Builder ) Ġ{ ĊĠĠĠ Ġcss ?. forEach Ġ{ Ġit ( builder ) Ġ} Ċ } Ċ Ċ inline Ġfun ĠCustom Styled Props . forward Css ( props : ĠCustom Styled Props ) Ġ{ ĊĠĠĠ Ġcss ?. forEach Ġ{ Ġc Ġ-> ĊĠĠĠĠĠĠĠ Ġif Ġ( props . css Ġ== Ġnull ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġprops . css Ġ= ĠArrayList () ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġprops . css !!. add ( c ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ interface ĠStyled Builder < P Ġ: ĠWith ClassName > Ġ{ ĊĠĠĠ Ġval Ġcss : ĠCss Builder ĊĠĠĠ Ġval Ġtype : ĠAny Ċ } Ċ Ċ inline Ġfun ĠStyled Builder <* >. css ( handler : ĠRule Set ) Ġ= Ġcss . handler () Ċ Ċ interface ĠStyled Element Builder < P Ġ: ĠWith ClassName > Ġ: ĠR Element Builder < P >, ĠStyled Builder < P > Ġ{ ĊĠĠĠ Ġfun Ġcreate (): ĠReact Element ĊĊĠĠĠ Ġcompanion Ġobject Ġ{ ĊĠĠĠĠĠĠĠ Ġoperator Ġfun Ġ< P Ġ: ĠWith ClassName > Ġinvoke ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġtype : ĠComponent Type < P >, ĊĠĠĠĠĠĠĠĠĠĠĠ Ġattrs : ĠP Ġ= Ġjs Object (), ĊĠĠĠĠĠĠĠ Ġ): ĠStyled Element Builder < P > Ġ= ĠStyled Element Builder Impl ( type , Ġattrs ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ class ĠStyled Element Builder Impl < P Ġ: ĠWith ClassName >( ĊĠĠĠ Ġoverride Ġval Ġtype : ĠComponent Type < P >, ĊĠĠĠ Ġattrs : ĠP Ġ= Ġjs Object (), Ċ ) Ġ: ĠStyled Element Builder < P >, ĠR Element Builder Impl < P >( attrs ) Ġ{ ĊĠĠĠ Ġoverride Ġval Ġcss Ġ= ĠCss Builder () ĊĊĠĠĠ Ġoverride Ġfun Ġcreate () Ġ= ĠStyled . createElement ( type , Ġcss , Ġattrs , Ġchild List ) Ċ } Ċ Ċ @ React Dsl Ċ interface ĠStyled DOM Builder < out ĠT Ġ: ĠTag > Ġ: ĠR DOM Builder < T >, ĠStyled Builder < DOM Props > Ġ{ ĊĠĠĠ Ġoverride Ġval Ġtype Ġget () Ġ= Ġattrs . tagName ĊĊĠĠĠ Ġoverride Ġfun Ġcreate () Ġ= ĠStyled . createElement ( type , Ġcss , Ġdom Props , Ġchild List ) ĊĊĠĠĠ Ġcompanion Ġobject Ġ{ ĊĠĠĠĠĠĠĠ Ġoperator Ġfun Ġ< T Ġ: ĠTag > Ġinvoke ( factory : Ġ( Tag Consumer < Unit >) Ġ-> ĠT ): ĠStyled DOM Builder < T > Ġ= ĠStyled DOM Builder Impl ( factory ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ class ĠStyled DOM Builder Impl < out ĠT Ġ: ĠTag >( factory : Ġ( Tag Consumer < Unit >) Ġ-> ĠT ) Ġ: ĠStyled DOM Builder < T >, ĠR DOM Builder Impl < T >( factory ) Ġ{ ĊĠĠĠ Ġoverride Ġval Ġcss Ġ= ĠCss Builder () Ċ } Ċ Ċ type alias ĠStyled Handler < P > Ġ= ĠStyled Element Builder < P >. () Ġ-> ĠUnit Ċ Ċ fun Ġ< P Ġ: ĠWith ClassName > Ġstyled ( type : ĠComponent Class < P >): ĠR Builder .( Styled Handler < P >) Ġ-> ĠUnit Ġ= Ġ{ Ġhandler Ġ-> ĊĠĠĠ Ġchild ( with ( Styled Element Builder ( type )) Ġ{ ĊĠĠĠĠĠĠĠ Ġhandler () ĊĠĠĠĠĠĠĠ Ġcreate () ĊĠĠĠ Ġ}) Ċ } Ċ Ċ inline Ġfun ĠCustom Styled Props . css ( no inline Ġhandler : ĠRule Set ) Ġ{ ĊĠĠĠ Ġif Ġ( css Ġ== Ġnull ) Ġ{ ĊĠĠĠĠĠĠĠ Ġcss Ġ= ĠArrayList () ĊĠĠĠ Ġ} ĊĠĠĠ Ġcss !!. add ( handler ) Ċ } Ċ Ċ @ Suppress (" NOTH ING _ TO _ INLINE ") Ċ inline Ġfun Ġ< P Ġ: ĠCustom Styled Props > ĠR Element Builder < P >. css ( no inline Ġhandler : ĠRule Set ) Ġ= Ġattrs . css ( handler ) Ċ Ċ /** Ċ Ġ* Ġ@ deprecated ĠUse Ġ[ keyframes ] Ġand Ġ[ css ] Ġinstead Ċ Ġ*/ Ċ fun Ġkey frames Name ( string : ĠString ): ĠString Ġ{ ĊĠĠĠ Ġval Ġkey frames Ġ= Ġkey frames ( string ) ĊĠĠĠ Ġval Ġkey frames Internal Ġ= Ġcss ( keyframes . rules ). as Dynamic () ĊĠĠĠ Ġval Ġname Ġ= Ġkey frames . getName () ĊĠĠĠ Ġwhen Ġ{ ĊĠĠĠĠĠĠĠ Ġkey frames Internal Ġis ĠString Ġ-> Ġinject Global Keyframe Style ( name , Ġkey frames Internal ) ĊĠĠĠĠĠĠĠ Ġkey frames Internal Ġis ĠArray < String > Ġ-> Ġinject Global Keyframe Style ( name , Ġkey frames Internal [ 0 ]) ĊĠĠĠĠĠĠĠ Ġelse Ġ-> Ġinject Globals ( keyframes Internal ) ĊĠĠĠ Ġ} ĊĠĠĠ Ġreturn Ġkey frames . getName () Ċ } Ċ Ċ private Ġfun Ġinject Global Keyframe Style ( name : ĠString , Ġstyle : ĠString ) Ġ{ ĊĠĠĠ Ġif Ġ( style . startsWith ("@ - webkit - keyframes ") Ġ|| Ġstyle . startsWith ("@ keyframes ")) Ġ{ ĊĠĠĠĠĠĠĠ Ġinject Global ( style ) ĊĠĠĠ Ġ} Ġelse Ġ{ ĊĠĠĠĠĠĠĠ Ġinject Globals ( array Of ( ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ"@ - webkit - keyframes Ġ$ name Ġ{$ style }", ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ"@ keyframes Ġ$ name Ġ{$ style }" ĊĠĠĠĠĠĠĠ Ġ)) ĊĠĠĠ Ġ} Ċ } Ċ Ċ private Ġfun Ġinject Globals ( strings : ĠArray < String >) Ġ{ ĊĠĠĠ Ġval Ġglobal Style Ġ= Ġdev Override Use Ref Ġ{ Ġcreate Global Style ( strings ) Ġ} ĊĠĠĠ ĠPromise . resolve ( Unit ). then Ġ{ ĊĠĠĠĠĠĠĠ ĠGlobal Styles . add ( global Style ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ private Ġexternal Ġinterface ĠGlobal Styles ComponentProps Ġ: ĠR Props Ġ{ ĊĠĠĠ Ġvar Ġglobal Styles : ĠList < ComponentType < R Props >> Ċ } Ċ Ċ private Ġobject ĠGlobal Styles Ġ{ ĊĠĠĠ Ġprivate Ġval Ġcomponent Ġ= Ġfc < Global Styles ComponentProps > Ġ{ Ġprops Ġ-> ĊĠĠĠĠĠĠĠ Ġprops . global Styles . forEach Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġchild ( it ) ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} ĊĊĠĠĠ Ġprivate Ġval Ġroot Ġby Ġkotlin . lazy Ġ{ ĊĠĠĠĠĠĠĠ Ġval Ġelement Ġ= Ġwindow . document . body !!. appendChild ( window . document . createElement (" div ")) Ġas ĠElement ĊĠĠĠĠĠĠĠ Ġelement . setAttribute (" id ", Ġ" sc - global - styles ") ĊĠĠĠĠĠĠĠ Ġelement ĊĠĠĠ Ġ} ĊĊĠĠĠ Ġprivate Ġval Ġstyles Ġ= Ġmutable ListOf < ComponentType < R Props >>() ĊĊĠĠĠ Ġfun Ġadd ( global Style : ĠComponent Type < R Props >) Ġ{ ĊĠĠĠĠĠĠĠ Ġstyles . add ( global Style ) ĊĠĠĠĠĠĠĠ Ġval Ġreact Element Ġ= ĠcreateElement ( component , Ġjs Object Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġthis . global Styles Ġ= Ġstyles ĊĠĠĠĠĠĠĠ Ġ}) ĊĠĠĠĠĠĠĠ Ġrender ( react Element , Ġroot ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ fun Ġinject Global ( css : ĠCss Builder ) Ġ{ ĊĠĠĠ Ġinject Global ( css . toString ()) Ċ } Ċ Ċ /** Ċ Ġ* Ġ@ deprecated ĠUse Ġ[ create Global Style ] Ġinstead Ċ Ġ*/ Ċ fun Ġinject Global ( string : ĠString ) Ġ{ ĊĠĠĠ Ġval Ġglobal Style Ġ= Ġdev Override Use Ref Ġ{ Ġcreate Global Style ( string ) Ġ} ĊĠĠĠ ĠPromise . resolve ( Unit ). then Ġ{ ĊĠĠĠĠĠĠĠ ĠGlobal Styles . add ( global Style ) ĊĠĠĠ Ġ} Ċ } Ċ Ċ @ Js Module (" react ") Ċ @ Js Non Module Ċ external Ġobject ĠReact Module Ċ Ċ private Ġfun Ġ< T > Ġdev Override Use Ref ( action : Ġ() Ġ-> ĠT ): ĠT Ġ{ ĊĠĠĠ Ġreturn Ġif Ġ( js (" process . env . NODE _ ENV Ġ!== Ġ' production ' ")) Ġ{ ĊĠĠĠĠĠĠĠ Ġ// Ġ( Very ) Ġdirty Ġhack : Ġstyled - components Ġcalls ĠuseRef () Ġin Ġdevelopment Ġmode Ġto Ġcheck Ġif Ġa Ġcomponent ĊĠĠĠĠĠĠĠ Ġ// Ġhas Ġbeen Ġcreated Ġdynamically . ĠWe Ġcan 't Ġallow Ġthis Ġcall Ġto Ġhappen Ġbecause Ġit Ġbreaks Ġrendering , Ġso ĊĠĠĠĠĠĠĠ Ġ// Ġwe Ġtemporarily Ġre define ĠuseRef . ĊĠĠĠĠĠĠĠ Ġval ĠuseRef Ġ= ĠReact Module . as Dynamic (). use Ref ĊĠĠĠĠĠĠĠ ĠReact Module . as Dynamic (). use Ref Ġ= Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġthrow ĠError (" invalid Ġhook Ġcall ") ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġval Ġresult Ġ= Ġaction () ĊĠĠĠĠĠĠĠ ĠReact Module . as Dynamic (). use Ref Ġ= ĠuseRef ĊĠĠĠĠĠĠĠ Ġresult ĊĠĠĠ Ġ} Ġelse Ġaction () Ċ } Ċ Ċ /** Ċ Ġ* Ġ@ deprecated ĠUse Ġ[ create Global Style ] Ġinstead Ċ Ġ*/ Ċ fun Ġinject Global ( handler : ĠCss Builder . () Ġ-> ĠUnit ) Ġ{ ĊĠĠĠ Ġinject Global ( Css Builder (). apply Ġ{ Ġhandler () Ġ}. toString ()) Ċ } Ċ Ċ object ĠStyled Ġ{ ĊĠĠĠ Ġprivate Ġval Ġcache Ġ= Ġmutable Map Of < dynamic , Ġdynamic >() ĊĊĠĠĠ Ġprivate Ġfun Ġ< T > Ġwrap ( type : ĠT ): ĠT Ġ= ĊĠĠĠĠĠĠĠ Ġcache . get Or Put ( type ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġdev Override Use Ref Ġ{ Ġraw Styled ( type ) ({ Ġit . css Ġ}) Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĊĠĠĠ Ġprivate Ġfun Ġ< P Ġ: ĠWith ClassName > Ġbuild Styled Props ( css : ĠCss Builder , Ġprops : ĠP ): ĠP Ġ{ ĊĠĠĠĠĠĠĠ Ġval Ġstyled Props Ġ= Ġprops . unsafe Cast < Styled Props >() ĊĠĠĠĠĠĠĠ Ġif Ġ( css . rules . isNotEmpty () Ġ|| Ġcss . multi Rules . isNotEmpty () Ġ|| Ġcss . declarations . isNotEmpty ()) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġstyled Props . css Ġ= Ġcss . toString () ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġif Ġ( css . classes . isNotEmpty ()) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġstyled Props . className Ġ= Ġcss . classes . join ToString ( separator Ġ= Ġ" Ġ") ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġif Ġ( css . style Name . isNotEmpty ()) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġstyled Props . as Dynamic ()[" data - style "] Ġ= Ġcss . style Name . join ToString ( separator Ġ= Ġ" Ġ") ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġreturn Ġstyled Props . unsafe Cast < P >() ĊĠĠĠ Ġ} ĊĊĠĠĠ Ġfun ĠcreateElement ( type : ĠString , Ġcss : ĠCss Builder , Ġprops : ĠWith ClassName , Ġchildren : ĠList < React Node >): ĠReact Element Ġ{ ĊĠĠĠĠĠĠĠ Ġval Ġwrapped Type Ġ= Ġwrap ( type ) ĊĠĠĠĠĠĠĠ Ġval Ġstyled Props Ġ= Ġbuild Styled Props ( css , Ġprops ) ĊĠĠĠĠĠĠĠ Ġreturn ĠcreateElement ( wrapped Type , Ġstyled Props , Ġ* children . to Typed Array ()) ĊĠĠĠ Ġ} ĊĊĠĠĠ Ġfun Ġ< P Ġ: ĠWith ClassName > ĠcreateElement ( ĊĠĠĠĠĠĠĠ Ġtype : ĠComponent Type < P >, ĊĠĠĠĠĠĠĠ Ġcss : ĠCss Builder , ĊĠĠĠĠĠĠĠ Ġprops : ĠP , ĊĠĠĠĠĠĠĠ Ġchildren : ĠList < React Node >, ĊĠĠĠ Ġ): ĠReact Element Ġ{ ĊĠĠĠĠĠĠĠ Ġval Ġwrapped Type Ġ= Ġwrap ( type ) ĊĠĠĠĠĠĠĠ Ġval Ġstyled Props Ġ= Ġbuild Styled Props ( css , Ġprops ) ĊĠĠĠĠĠĠĠ Ġreturn ĠcreateElement ( wrapped Type , Ġstyled Props , Ġ* children . to Typed Array ()) ĊĠĠĠ Ġ} Ċ } Ċ