@tonconnect/ui 2.0.1-beta.2 → 2.0.1-beta.3

package/dist/tonconnect-ui.min.js

@@ -732,7 +732,7 @@ var __defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnP
     width: 32px;
     height: 32px;
     border-radius: ${e=>Nl[e.theme.borderRadius]};
-`,Ql=e=>{const[t]=yi();return et((()=>{var n;return t(e.translationKey,e.translationValues,null==(n=e.children)?void 0:n.toString())}))};function Jl(e,t){let n;n="string"==typeof t?t:ro()?t.twaReturnUrl||t.returnStrategy:"none";const r=function(e,t,n){const r=new URL(e);return r.searchParams.append(t,n),r.toString()}(e,"ret",n);if(!re(e))return r;const o=r.slice(r.lastIndexOf("&")+1);return r.slice(0,r.lastIndexOf("&"))+"-"+oe(o)}function Xl(e,t){t=__spreadValues({},t);const n=function(e){const t=new URL(e);t.searchParams.has("attach")&&(t.searchParams.delete("attach"),t.pathname+="/start");return t.toString()}(e),r=new URL(n);if(r.searchParams.has("startapp")||r.searchParams.append("startapp","tonconnect"),ro())no("ios","android")?(t.returnStrategy="back",t.twaReturnUrl=void 0,io(Jl(r.toString(),t))):no("macos","tdesktop")||no("weba")?io(Jl(r.toString(),t)):no("web")?(t.returnStrategy="back",t.twaReturnUrl=void 0,io(Jl(r.toString(),t))):Kn(Jl(r.toString(),t));else if(Gn("ios","android")){"back"===t.returnStrategy&&(t.returnStrategy=location.href);const e=Yn("chrome"),n=Yn("firefox");if((e||n)&&!t.forceRedirect){const e=Jl(r.toString(),t.returnStrategy);Vn(tc(e),(()=>Kn(e)))}else{Kn(Jl(r.toString(),t.returnStrategy))}}else if(Gn("macos","windows","linux"))if(t.returnStrategy="none",t.twaReturnUrl=void 0,t.forceRedirect)Kn(Jl(r.toString(),t));else{const e=Jl(r.toString(),t);Vn(tc(e),(()=>Kn(e)))}else Kn(Jl(r.toString(),t))}function ec(e,t,n,r){if(n=__spreadValues({},n),ro())if(no("ios","android")){"back"===n.returnStrategy&&(n.returnStrategy="tg://resolve"),r("universal-link");const t=Jl(e,n.returnStrategy);io(t,(()=>{r("universal-link"),Kn(t)}))}else if(no("macos","tdesktop")){"back"===n.returnStrategy&&(n.returnStrategy="tg://resolve");const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else if(no("weba")){"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy=location.href:Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href);const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else if(no("web")){"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy=location.href:Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href);const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else{r("universal-link");Kn(Jl(e,n.returnStrategy))}else if(Gn("ios"))"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy=location.href:Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href),Yn("chrome")?(r("universal-link"),Hn(Jl(e,n.returnStrategy),"_self")):(r("universal-link"),Kn(Jl(e,n.returnStrategy)));else if(Gn("android"))"back"===n.returnStrategy&&(Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href),r("universal-link"),Kn(Jl(e,n.returnStrategy));else if(Gn("macos","windows","linux")){"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy="none":Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy="none");const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else r("universal-link"),Kn(Jl(e,n.returnStrategy))}function tc(e){const t=new URL(e),[,n,r]=t.pathname.split("/");return`tg://resolve?domain=${n}&appname=${r}&startapp=${t.searchParams.get("startapp")}`}const nc=e=>{const[t,n]=Ye("mobile"),[r,o]=Ye(!1),[i,s]=Ye(),[a,l]=Ye(!0),c=at(mr);ot(c.onStatusChange((()=>{}),(()=>{e.wallet.appName!==Ns&&o(!0)})));const u=()=>{s(c.connect({universalLink:e.wallet.universalLink,bridgeUrl:e.wallet.bridgeUrl},e.additionalRequest))};Xe((()=>{"extension"!==rt(t)&&(Sl(e.wallet)||kl(e.wallet))&&u()}));const d=()=>{o(!1),"extension"===t()&&u(),n("mobile"),dr(__spreadProps(__spreadValues({},e.wallet),{openMethod:"qrcode"}))},h=()=>{o(!1),"extension"===t()&&u(),n("desktop");const r=!a();l(!1),ec(i(),e.wallet.deepLink,{returnStrategy:bl.returnStrategy,forceRedirect:r},(t=>{dr(__spreadProps(__spreadValues({},e.wallet),{openMethod:t}))}))},f=()=>{const t=!a();l(!1),dr(__spreadProps(__spreadValues({},e.wallet),{openMethod:"universal-link"})),Xl(i(),{returnStrategy:bl.returnStrategy,twaReturnUrl:bl.twaReturnUrl,forceRedirect:t})},g=()=>{o(!1),n("extension"),ye(e.wallet)&&(dr(e.wallet),c.connect({jsBridgeKey:e.wallet.jsBridgeKey},e.additionalRequest))};return Sl(e.wallet)?d():El(e.wallet)?g():h(),Rt(Ul,{"data-tc-wallets-modal-connection-desktop":"true",get children(){return[Rt(Pt,{get when(){return!e.backDisabled},get children(){return Rt(Kl,{icon:"arrow",onClick:()=>e.onBackClick()})}}),Rt(Bl,{get children(){return e.wallet.name}}),Rt(Pt,{get when(){return"mobile"===t()},get children(){return Rt(Hl,{translationKey:"walletModal.desktopConnectionModal.scanQR",get translationValues(){return{name:e.wallet.name}},get children(){return["Scan the QR code below with your phone’s or ",et((()=>e.wallet.name)),"’s camera"]}})}}),Rt(Wl,{get qr(){return"mobile"===t()},get children(){return Rt(It,{get children(){return[Rt(Nt,{get when(){return"mobile"===t()},get children(){return Rt(jl,{disableCopy:!1,get sourceUrl(){return Jl(i(),"none")},get imageUrl(){return e.wallet.imageUrl}})}}),Rt(Nt,{get when(){return r()},get children(){return[Rt(zl,{size:"s"}),Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.connectionDeclined",children:"Connection declined"}),Rt(Vl,{get children(){return Rt(yo,{get leftIcon(){return Rt(hs,{})},get onClick(){return"extension"===t()?g:h},get children(){return Rt(Ql,{translationKey:"common.retry",children:"Retry"})}})}})]}}),Rt(Nt,{get when(){return"extension"===t()},get children(){return[Rt(Pt,{get when(){return ye(e.wallet)},get children(){return[Rt(ql,{size:"s"}),Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.continueInExtension",get translationValues(){return{name:e.wallet.name}},get children(){return["Continue in ",et((()=>e.wallet.name))," browser extension…"]}}),Rt(Vl,{get children(){return Rt(yo,{get leftIcon(){return Rt(hs,{})},onClick:g,get children(){return Rt(Ql,{translationKey:"common.retry",children:"Retry"})}})}})]}}),Rt(Pt,{get when(){return!ye(e.wallet)},get children(){return[Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.dontHaveExtension",get translationValues(){return{name:e.wallet.name}},get children(){return["Seems you don't have installed ",et((()=>e.wallet.name))," browser extension"]}}),Rt(Vl,{get children(){return Rt(Gs,{get href(){return e.wallet.aboutUrl},blank:!0,get children(){return Rt(yo,{get rightIcon(){return Rt(gs,{})},onClick:g,get children(){return Rt(Ql,{translationKey:"walletModal.desktopConnectionModal.getWallet",get translationValues(){return{name:e.wallet.name}},get children(){return["Get ",et((()=>e.wallet.name))]}})}})}})}})]}})]}}),Rt(Nt,{get when(){return"desktop"===t()},get children(){return[Rt(es,{size:"m"}),Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.continueOnDesktop",get translationValues(){return{name:e.wallet.name}},get children(){return["Continue in ",et((()=>e.wallet.name))," on desktop…"]}}),Rt(Vl,{get children(){return[Rt(yo,{get leftIcon(){return Rt(hs,{})},onClick:h,get children(){return Rt(Ql,{translationKey:"common.retry",children:"Retry"})}}),Rt(Gs,{get href(){return e.wallet.aboutUrl},blank:!0,get children(){return Rt(yo,{get rightIcon(){return Rt(gs,{})},get children(){return Rt(Ql,{translationKey:"walletModal.desktopConnectionModal.getWallet",get translationValues(){return{name:e.wallet.name}},get children(){return["Get ",et((()=>e.wallet.name))]}})}})}})]}})]}})]}})}}),Rt(Pt,{get when(){return e.wallet.appName===Ns},get children(){return Rt(Gl,{get rightIcon(){return Rt(Yl,{get src(){return Ws}})},scale:"s",onClick:f,get children(){return Rt(Ql,{translationKey:"walletModal.desktopConnectionModal.openWalletOnTelegram",children:"Open Wallet in Telegram on desktop"})}})}}),Rt(Pt,{get when(){return e.wallet.appName!==Ns},get children(){return Rt(Fl,{get children(){return[Rt(Pt,{get when(){return et((()=>"mobile"!==t()))()&&Sl(e.wallet)},get children(){return Rt(Dl,{appearance:"secondary",get leftIcon(){return Rt(ls,{})},onClick:d,get children(){return Rt(Ql,{translationKey:"common.mobile",children:"Mobile"})}})}}),Rt(Pt,{get when(){return et((()=>"extension"!==t()))()&&El(e.wallet)},get children(){return Rt(Dl,{appearance:"secondary",get leftIcon(){return Rt(ss,{})},onClick:g,get children(){return Rt(Ql,{translationKey:"common.browserExtension",children:"Browser Extension"})}})}}),Rt(Pt,{get when(){return et((()=>"desktop"!==t()))()&&kl(e.wallet)},get children(){return Rt(Dl,{appearance:"secondary",get leftIcon(){return Rt(us,{})},onClick:h,get children(){return Rt(Ql,{translationKey:"common.desktop",children:"Desktop"})}})}})]}})}})]}})},rc=Rn.div``,oc=Rn(Po)`
+`,Ql=e=>{const[t]=yi();return et((()=>{var n;return t(e.translationKey,e.translationValues,null==(n=e.children)?void 0:n.toString())}))};function Jl(e,t){let n;n="string"==typeof t?t:ro()?t.twaReturnUrl||t.returnStrategy:"none";const r=function(e,t,n){const r=new URL(e);return r.searchParams.append(t,n),r.toString()}(e,"ret",n);if(!re(e))return r;const o=r.slice(r.lastIndexOf("&")+1);return r.slice(0,r.lastIndexOf("&"))+"-"+oe(o)}function Xl(e,t){t=__spreadValues({},t);const n=function(e){const t=new URL(e);t.searchParams.has("attach")&&(t.searchParams.delete("attach"),t.pathname+="/start");return t.toString()}(e),r=new URL(n);if(r.searchParams.has("startapp")||r.searchParams.append("startapp","tonconnect"),ro())no("ios","android")?(t.returnStrategy="back",t.twaReturnUrl=void 0,io(Jl(r.toString(),t))):no("macos","tdesktop")||no("weba")?io(Jl(r.toString(),t)):no("web")?(t.returnStrategy="back",t.twaReturnUrl=void 0,io(Jl(r.toString(),t))):Kn(Jl(r.toString(),t));else if(Gn("ios")){"back"===t.returnStrategy&&(t.returnStrategy=location.href);const e=Yn("chrome"),n=Yn("firefox");if((e||n)&&!t.forceRedirect){const e=Jl(r.toString(),t.returnStrategy);Vn(tc(e),(()=>Kn(e)))}else{Kn(Jl(r.toString(),t.returnStrategy))}}else if(Gn("android")){t.returnStrategy="none";const e=Yn("chrome"),n=Yn("firefox");if((e||n)&&!t.forceRedirect){const e=Jl(r.toString(),t.returnStrategy);Vn(tc(e),(()=>Kn(e)))}else{Kn(Jl(r.toString(),t.returnStrategy))}}else if(Gn("macos","windows","linux"))if(t.returnStrategy="none",t.twaReturnUrl=void 0,t.forceRedirect)Kn(Jl(r.toString(),t));else{const e=Jl(r.toString(),t);Vn(tc(e),(()=>Kn(e)))}else Kn(Jl(r.toString(),t))}function ec(e,t,n,r){if(n=__spreadValues({},n),ro())if(no("ios","android")){"back"===n.returnStrategy&&(n.returnStrategy="tg://resolve"),r("universal-link");const t=Jl(e,n.returnStrategy);io(t,(()=>{r("universal-link"),Kn(t)}))}else if(no("macos","tdesktop")){"back"===n.returnStrategy&&(n.returnStrategy="tg://resolve");const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else if(no("weba")){"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy=location.href:Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href);const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else if(no("web")){"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy=location.href:Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href);const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else{r("universal-link");Kn(Jl(e,n.returnStrategy))}else if(Gn("ios"))"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy=location.href:Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href),Yn("chrome")?(r("universal-link"),Hn(Jl(e,n.returnStrategy),"_self")):(r("universal-link"),Kn(Jl(e,n.returnStrategy)));else if(Gn("android"))"back"===n.returnStrategy&&(Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy=location.href),r("universal-link"),Kn(Jl(e,n.returnStrategy));else if(Gn("macos","windows","linux")){"back"===n.returnStrategy&&(Yn("safari")?n.returnStrategy="none":Yn("chrome")?n.returnStrategy="googlechrome://":Yn("firefox")?n.returnStrategy="firefox://":Yn("opera")?n.returnStrategy="opera-http://":n.returnStrategy="none");const o=Jl(e,n.returnStrategy);!!t&&!n.forceRedirect?(r("custom-deeplink"),Vn(Qn(o,t),(()=>{r("universal-link"),Kn(o)}))):(r("universal-link"),Kn(o))}else r("universal-link"),Kn(Jl(e,n.returnStrategy))}function tc(e){const t=new URL(e),[,n,r]=t.pathname.split("/");return`tg://resolve?domain=${n}&appname=${r}&startapp=${t.searchParams.get("startapp")}`}const nc=e=>{const[t,n]=Ye("mobile"),[r,o]=Ye(!1),[i,s]=Ye(),[a,l]=Ye(!0),c=at(mr);ot(c.onStatusChange((()=>{}),(()=>{e.wallet.appName!==Ns&&o(!0)})));const u=()=>{s(c.connect({universalLink:e.wallet.universalLink,bridgeUrl:e.wallet.bridgeUrl},e.additionalRequest))};Xe((()=>{"extension"!==rt(t)&&(Sl(e.wallet)||kl(e.wallet))&&u()}));const d=()=>{o(!1),"extension"===t()&&u(),n("mobile"),dr(__spreadProps(__spreadValues({},e.wallet),{openMethod:"qrcode"}))},h=()=>{o(!1),"extension"===t()&&u(),n("desktop");const r=!a();l(!1),ec(i(),e.wallet.deepLink,{returnStrategy:bl.returnStrategy,forceRedirect:r},(t=>{dr(__spreadProps(__spreadValues({},e.wallet),{openMethod:t}))}))},f=()=>{const t=!a();l(!1),dr(__spreadProps(__spreadValues({},e.wallet),{openMethod:"universal-link"})),Xl(i(),{returnStrategy:bl.returnStrategy,twaReturnUrl:bl.twaReturnUrl,forceRedirect:t})},g=()=>{o(!1),n("extension"),ye(e.wallet)&&(dr(e.wallet),c.connect({jsBridgeKey:e.wallet.jsBridgeKey},e.additionalRequest))};return Sl(e.wallet)?d():El(e.wallet)?g():h(),Rt(Ul,{"data-tc-wallets-modal-connection-desktop":"true",get children(){return[Rt(Pt,{get when(){return!e.backDisabled},get children(){return Rt(Kl,{icon:"arrow",onClick:()=>e.onBackClick()})}}),Rt(Bl,{get children(){return e.wallet.name}}),Rt(Pt,{get when(){return"mobile"===t()},get children(){return Rt(Hl,{translationKey:"walletModal.desktopConnectionModal.scanQR",get translationValues(){return{name:e.wallet.name}},get children(){return["Scan the QR code below with your phone’s or ",et((()=>e.wallet.name)),"’s camera"]}})}}),Rt(Wl,{get qr(){return"mobile"===t()},get children(){return Rt(It,{get children(){return[Rt(Nt,{get when(){return"mobile"===t()},get children(){return Rt(jl,{disableCopy:!1,get sourceUrl(){return Jl(i(),"none")},get imageUrl(){return e.wallet.imageUrl}})}}),Rt(Nt,{get when(){return r()},get children(){return[Rt(zl,{size:"s"}),Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.connectionDeclined",children:"Connection declined"}),Rt(Vl,{get children(){return Rt(yo,{get leftIcon(){return Rt(hs,{})},get onClick(){return"extension"===t()?g:h},get children(){return Rt(Ql,{translationKey:"common.retry",children:"Retry"})}})}})]}}),Rt(Nt,{get when(){return"extension"===t()},get children(){return[Rt(Pt,{get when(){return ye(e.wallet)},get children(){return[Rt(ql,{size:"s"}),Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.continueInExtension",get translationValues(){return{name:e.wallet.name}},get children(){return["Continue in ",et((()=>e.wallet.name))," browser extension…"]}}),Rt(Vl,{get children(){return Rt(yo,{get leftIcon(){return Rt(hs,{})},onClick:g,get children(){return Rt(Ql,{translationKey:"common.retry",children:"Retry"})}})}})]}}),Rt(Pt,{get when(){return!ye(e.wallet)},get children(){return[Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.dontHaveExtension",get translationValues(){return{name:e.wallet.name}},get children(){return["Seems you don't have installed ",et((()=>e.wallet.name))," browser extension"]}}),Rt(Vl,{get children(){return Rt(Gs,{get href(){return e.wallet.aboutUrl},blank:!0,get children(){return Rt(yo,{get rightIcon(){return Rt(gs,{})},onClick:g,get children(){return Rt(Ql,{translationKey:"walletModal.desktopConnectionModal.getWallet",get translationValues(){return{name:e.wallet.name}},get children(){return["Get ",et((()=>e.wallet.name))]}})}})}})}})]}})]}}),Rt(Nt,{get when(){return"desktop"===t()},get children(){return[Rt(es,{size:"m"}),Rt(Zl,{translationKey:"walletModal.desktopConnectionModal.continueOnDesktop",get translationValues(){return{name:e.wallet.name}},get children(){return["Continue in ",et((()=>e.wallet.name))," on desktop…"]}}),Rt(Vl,{get children(){return[Rt(yo,{get leftIcon(){return Rt(hs,{})},onClick:h,get children(){return Rt(Ql,{translationKey:"common.retry",children:"Retry"})}}),Rt(Gs,{get href(){return e.wallet.aboutUrl},blank:!0,get children(){return Rt(yo,{get rightIcon(){return Rt(gs,{})},get children(){return Rt(Ql,{translationKey:"walletModal.desktopConnectionModal.getWallet",get translationValues(){return{name:e.wallet.name}},get children(){return["Get ",et((()=>e.wallet.name))]}})}})}})]}})]}})]}})}}),Rt(Pt,{get when(){return e.wallet.appName===Ns},get children(){return Rt(Gl,{get rightIcon(){return Rt(Yl,{get src(){return Ws}})},scale:"s",onClick:f,get children(){return Rt(Ql,{translationKey:"walletModal.desktopConnectionModal.openWalletOnTelegram",children:"Open Wallet in Telegram on desktop"})}})}}),Rt(Pt,{get when(){return e.wallet.appName!==Ns},get children(){return Rt(Fl,{get children(){return[Rt(Pt,{get when(){return et((()=>"mobile"!==t()))()&&Sl(e.wallet)},get children(){return Rt(Dl,{appearance:"secondary",get leftIcon(){return Rt(ls,{})},onClick:d,get children(){return Rt(Ql,{translationKey:"common.mobile",children:"Mobile"})}})}}),Rt(Pt,{get when(){return et((()=>"extension"!==t()))()&&El(e.wallet)},get children(){return Rt(Dl,{appearance:"secondary",get leftIcon(){return Rt(ss,{})},onClick:g,get children(){return Rt(Ql,{translationKey:"common.browserExtension",children:"Browser Extension"})}})}}),Rt(Pt,{get when(){return et((()=>"desktop"!==t()))()&&kl(e.wallet)},get children(){return Rt(Dl,{appearance:"secondary",get leftIcon(){return Rt(us,{})},onClick:h,get children(){return Rt(Ql,{translationKey:"common.desktop",children:"Desktop"})}})}})]}})}})]}})},rc=Rn.div``,oc=Rn(Po)`
     position: absolute;
     top: 16px;
     left: 16px;