@dcl/shop 1.19.0 → 1.19.1-36725100317.commit-9ad1d65

package/_assets/Assets-DElD46e4.js

@@ -0,0 +1,990 @@
+import{r as u,b as Ze,j as e,a as yt,u as wt}from"./react-BFIm3j2a.js";import{c as ie,r as jt,b as vt,bG as Ct,h as Xe,j as Ye,bD as $t,bd as kt,bb as St,w as Et,cW as Rt,cX as Tt,s as i,a as t,x as dt,bm as _t,X as Mt,F as ht,t as s,cY as At,bJ as We,D as Nt,I,z as X,cZ as ze,E as me,bl as Lt,l as It,O as Re,bx as Je,Z as Wt,bF as zt,B as pt,a0 as ut,m as mt,cd as Pt,ce as Bt,y as Ft,bS as Ot,ay as Ut,a2 as Ht,a4 as et,a5 as fe,aJ as Dt,bT as Gt,bU as qt}from"./index-DTrZkeIu.js";import{u as Kt,s as Vt}from"./search-empty-ClovaM0p.js";import{u as Zt,l as Qt,m as Xt,S as Yt,F as Jt,a as en}from"./Filters-CEz8bjG2.js";import{R as tn,S as nn,a as sn,D as an,b as on,C as rn,c as ln,d as cn,e as dn,M as hn}from"./browseLayout.styles-Bgc_8ycQ.js";import{L as pn}from"./LoadMore-BTzn9wsv.js";import{u as un}from"./useInfiniteGrid-Cv5x7S43.js";import{E as mn}from"./ErrorNotice-l-B8k9a3.js";import{d as fn}from"./dcl-schemas-FmJ72SB7.js";import{s as xn,G as gn,w as bn,S as yn}from"./buy-gasless-_RaoHNGk.js";import{s as wn}from"./buy-GBacz4js.js";import{u as jn,A as vn,C as Cn}from"./trade-encoding-CmoxrKUz.js";import{f as $n}from"./errors-BxIUc_Lk.js";import{J as kn,C as Sn,B as Te}from"./ethers-CoY9-2x5.js";import{z as En,D as Rn,w as Tn,W as _n,m as Mn,n as An,o as Nn,v as Ln,j as tt}from"./CreditPackPicker-IzExNyem.js";import{u as In,M as Wn,o as zn,l as Pn,R as Bn,c as Fn}from"./loader-logo-BBzKPg1y.js";import{P as On}from"./PaymentMethodStep-DM8c-3bT.js";import{R as nt}from"./resume-name-1aj-wXcn.js";import{R as Un}from"./resume-buy-C9bQiOkt.js";import{n as Hn}from"./name-glyph-aUugT8vq.js";import{c as Dn}from"./crumbs.styles-CHgrOACG.js";import{n as Gn}from"./Tooltip-DlenNQy2.js";import{G as qn}from"./grid.styles-DdTmyIUo.js";import"./sentry-B6w4u-W-.js";import"./intl-AKLEHPeO.js";import"./skeleton.styles-bqklkUaQ.js";import"./sendMetaTransaction-yPqWszKC.js";import"./mana-matic-CEqvSwrJ.js";(function(){try{var n=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},a=new n.Error().stack;a&&(n._sentryDebugIds=n._sentryDebugIds||{},n._sentryDebugIds[a]="5cb3e364-7800-4145-a532-079d39be887a",n._sentryDebugIdIdentifier="sentry-dbid-5cb3e364-7800-4145-a532-079d39be887a")}catch{}})();function xe(n){const a=n.source??"item",r=n.tradeId||`${n.contractAddress}-${n.tokenId??n.itemId??""}`;return`${a}:${r}`}const Y="100000000000000000000",ft=2,_e=15,Kn=/^[a-zA-Z0-9]+$/;function st(n){const a=n.trim();return a.length===0?{ok:!1,reason:"empty"}:Kn.test(a)?a.length<ft?{ok:!1,reason:"too-short"}:a.length>_e?{ok:!1,reason:"too-long"}:{ok:!0}:{ok:!1,reason:"invalid-chars"}}function Vn(n){return n.replace(/[^a-zA-Z0-9]/g,"").slice(0,_e)}const Zn=["function available(string _subdomain) view returns (bool)"],it={mainnet:{rpc:"https://rpc.decentraland.org/mainnet",address:"0x2a187453064356c898cae034eaed119e1663acb8"},sepolia:{rpc:"https://rpc.decentraland.org/sepolia",address:"0x7518456ae93eb98f3e64571b689c626616bb7f30"}};function Qn(){return ie.chainId===Number(fn.ChainId.MATIC_MAINNET)?it.mainnet:it.sepolia}async function Xn(n,a={}){var c;const{rpc:r,address:d}=Qn(),h=new kn(r),b=new Sn(d,Zn,h);console.info(`[names] availability check → DCLRegistrar(${d}).available("${n}") on ${r}`);const j=await b.available(n);if((c=a.signal)!=null&&c.aborted)throw new DOMException("Aborted","AbortError");return console.info(`[names] "${n}" available=${j}`),j?"available":"taken"}const Yn="https://app.across.to/api";class Qe extends Error{constructor(){super("Name registration is temporarily unavailable due to high network costs"),this.name="NameRouteCostTooHighError"}}class Ke extends Error{constructor(){super("The name could not be registered on Ethereum; your funds were recovered."),this.name="NameNotRegisteredError"}}class Ve extends Error{constructor(){super("We couldn't confirm whether the purchase went through."),this.name="NameSettlementUnknownError"}}function Jn(n){return kt(Y,n)}async function es(n,a,r={}){var c;const d=r.chainId??ie.chainId,h=r.provider??"across",b=`${ie.creditsServerUrl}/credits-name-route?name=${encodeURIComponent(a)}&chainId=${d}&provider=${h}`,j=await St(b,{method:"GET",identity:n,metadata:{}});if(!j.ok){let l;try{l=(c=await j.json())==null?void 0:c.code}catch{}throw l==="ROUTE_COST_TOO_HIGH"?new Qe:new Error(`fetchNameCreditRoute ${j.status}`)}return j.json()}function ts(n,a){const r=Te.from(n.availableAmount),h=Te.from(Y).sub(r);return{credits:[{value:n.amount,expiresAt:Number(n.expiresAt),salt:Cn(n.id)}],creditsSignatures:[n.signature],externalCall:{target:a.externalCall.target,selector:a.externalCall.selector,data:a.externalCall.data,expiresAt:a.externalCall.expiresAt,salt:a.externalCall.salt},customExternalCallSignature:a.customExternalCallSignature,maxUncreditedValue:h.isNegative()?"0":h.toString(),maxCreditedValue:Y}}async function ns(n,a={}){const r=Yn,d=a.intervalMs??1e4,h=a.maxAttempts??60;let b={status:"pending",destinationTxHash:null,actionsSucceeded:null};for(let j=0;j<h;j++){try{const c=await fetch(`${r}/deposit/status?originChainId=137&depositTxHash=${n}`);if(c.ok){const l=await c.json(),w=(l.status??"pending").toLowerCase(),g=l.fillTx??l.fillTxnRef??null,C=typeof l.actionsSucceeded=="boolean"?l.actionsSucceeded:null;if(w==="filled")return{status:"filled",destinationTxHash:g,actionsSucceeded:C};if(w==="refunded"||w==="expired")return{status:w,destinationTxHash:null,actionsSucceeded:!1};b={status:"pending",destinationTxHash:g,actionsSucceeded:C}}}catch{}j<h-1&&await new Promise(c=>setTimeout(c,d))}return b}async function ss(n){const{name:a,identity:r,signer:d}=n,h=g=>{var C;try{(C=n.onProgress)==null||C.call(n,g)}catch{}},b=n.chainId??ie.chainId,j=n.provider??"across",c=(n.beneficiary??await d.getAddress()).toLowerCase();let l=null,w="unconfirmed";console.info("[names] register start",{name:a,buyer:c,chainId:b,provider:j}),h("preparing");try{const g=await jt(vt(ie.chainId).address),C=Jn(g),y=n.creditsCents!=null?Math.max(1,Math.min(Math.trunc(n.creditsCents),C)):C,A=y<C;console.info("[names] step 1/6 sized reservation",{usdCents:y,fullPriceCents:C,payingWithMana:A,manaRate:g});const p=await es(r,a,{chainId:b,provider:j});console.info("[names] step 2/6 route fetched",{target:p.externalCall.target,selector:p.externalCall.selector,provider:p.provider,quoteId:p.quoteId});const v=await Ct(r,y,void 0,void 0,a);if(l=v.credit.id,console.info("[names] step 3/6 credit authorized",{creditId:v.credit.id,maxCreditedValue:v.maxCreditedValue}),!A&&Te.from(v.maxCreditedValue).lt(Y))throw new Error("Credit under-sized for the name price");if(A){const x=Te.from(Y).sub(v.credit.availableAmount);if(n.maxManaWei!=null&&x.gt(n.maxManaWei.toString()))throw new Error("The MANA needed moved past what was agreed");x.gt(0)&&(h("awaiting-confirmation"),await jn({auth:{kind:vn.Allowance,contractAddress:Xe(Ye.MANAToken,b).address,spenderAddress:Xe(Ye.CreditsManager,b).address,chainId:b},signer:d,requiredWei:BigInt(x.toString())}),console.info("[names] step 3b/6 mana allowance ensured",{gapWei:x.toString()}))}h("awaiting-confirmation");const f=ts(v.credit,p);let $;try{$=await xn({chainId:b,buyer:c,signer:d,args:f})}catch(x){if(!(x instanceof gn))throw x;if(x.reason==="relayer-unreachable"){w="unobservable";const T=new Ve;throw T.cause=x,T}$=await wn(b,f,d)}if(console.info("[names] step 4/6 useCredits submitted (Polygon origin tx)",{originTxHash:$}),h("confirming"),await bn($),w="confirmed",console.info("[names] step 5/6 origin tx confirmed",{originTxHash:$}),j==="across"){h("registering");const x=await ns($,n.acrossPoll);if(console.info("[names] step 6/6 across status",x),x.status==="pending")return{status:"pending",originTxHash:$};if(x.status==="filled"&&x.actionsSucceeded===null)return console.warn("[names] across filled without reporting actionsSucceeded — reporting pending",{originTxHash:$}),{status:"pending",originTxHash:$};if(x.status!=="filled"||x.actionsSucceeded!==!0)throw new Ke;return{status:"registered",originTxHash:$,destinationTxHash:x.destinationTxHash}}return{status:"pending",originTxHash:$}}catch(g){if(console.error("[names] register failed — raw error:",g,{name:a,buyer:c,originState:w}),g instanceof yn)return{status:"pending",originTxHash:g.txHash};if(l&&w==="unconfirmed"&&await $t(r,[l]).catch(()=>{}),g instanceof Qe||g instanceof Ke||g instanceof Ve)throw g;const C=new Error($n(g,"Couldn't register the name. Please try again.",{sale:!0}));throw C.cause=g,C}}function is(){const{data:n}=Et({queryKey:["feature-flag","shop-names"],queryFn:()=>Rt(Tt.SHOP_NAMES),staleTime:6e4,refetchOnWindowFocus:!0,retry:1});return n===!0}const as=60,os=700,rs=25;function ls(n){if(!n)return[];const a=[];for(let r=1;r<=n.length;r++)a.push({text:n.slice(0,r),delay:as});a[a.length-1]={text:n,delay:os};for(let r=n.length-1;r>=1;r--)a.push({text:n.slice(0,r),delay:rs});return a}function cs(n){return n.flatMap(ls)}function ds(n,a){const r=u.useMemo(()=>cs(n),[n]),[d,h]=u.useState(0);return u.useEffect(()=>{if(!a||r.length===0)return;const b=setTimeout(()=>h(j=>(j+1)%r.length),r[d%r.length].delay);return()=>clearTimeout(b)},[d,a,r]),!a||r.length===0?"":r[d%r.length].text}const hs="https://cdn.decentraland.org/@dcl/shop/1.19.1-36725100317.commit-9ad1d65/_assets/name-verified-oGwQ3ntb.svg",ps="#34fee6",us=i.div`
+  position: fixed;
+  inset: 0;
+  z-index: 10000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 16px;
+  background: rgba(22, 21, 24, 0.55);
+`,ms=i.div`
+  width: 560px;
+  max-width: 100%;
+  max-height: 92vh;
+  overflow-y: auto;
+  background: ${t.colors.white};
+  border-radius: 16px;
+  padding: 20px 24px 24px;
+  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3);
+
+  ${t.media.maxWidth("mobile")} {
+    padding: 16px;
+  }
+`,Pe=i.div`
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 12px;
+`,Be=i.h2`
+  margin: 0;
+  font-family: ${t.font.sans};
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 1.6;
+  color: ${t.colors.text};
+`,Fe=i.button`
+  flex: none;
+  display: grid;
+  place-items: center;
+  width: 28px;
+  height: 28px;
+  border: 0;
+  background: none;
+  cursor: pointer;
+  color: ${t.colors.text};
+
+  .ico {
+    width: 18px;
+    height: 18px;
+  }
+  &:disabled {
+    opacity: 0.4;
+    cursor: default;
+  }
+  &:focus-visible {
+    outline: 2px solid ${t.colors.accent};
+    outline-offset: 2px;
+  }
+`,Oe=i.div`
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 4px;
+  font-family: ${t.font.sans};
+  font-size: 14px;
+  color: ${t.colors.text2};
+
+  .ico {
+    width: 16px;
+    height: 16px;
+    color: ${t.colors.text};
+  }
+`,Ue=i.hr`
+  border: 0;
+  border-top: 1px solid ${t.colors.line};
+  margin: 16px 0;
+`,ge=i.div`
+  display: flex;
+  align-items: center;
+  gap: 16px;
+`,fs=i.div`
+  flex: none;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  width: 137px;
+  height: 137px;
+  padding: 20px 0;
+  border-radius: 12px;
+  overflow: hidden;
+  background: ${t.gradients.amethyst};
+`,xs=i.img`
+  display: block;
+  width: 47px;
+  height: 47px;
+`,gs=i.span`
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  max-width: 100%;
+  padding: 0 8px;
+  font-family: ${t.font.sans};
+  font-size: 18px;
+  font-weight: 600;
+  /* The design's cyan — it has to read against the purple, which the body text colour would not. */
+  color: ${ps};
+  white-space: nowrap;
+  overflow: hidden;
+
+  /* Truncation belongs on the flex item, not this box: text-overflow is inert on a flex container, and
+     the zero min-width is what lets the name shrink instead of pushing the tick out. */
+  > span {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+`,bs=i.img`
+  flex: none;
+  display: block;
+  width: 14px;
+  height: 14px;
+`,He=i.div`
+  flex: none;
+  display: grid;
+  place-items: center;
+  width: 56px;
+  height: 56px;
+  border-radius: 10px;
+  background: ${t.gradients.amethyst};
+  color: ${t.colors.white};
+
+  .ico {
+    width: 30px;
+    height: 30px;
+  }
+`,be=i.div`
+  flex: 1;
+  min-width: 0;
+`,ye=i.div`
+  font-family: ${t.font.sans};
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 1.3;
+  color: ${t.colors.text};
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+
+  span {
+    font-weight: 400;
+    color: ${t.colors.muted2};
+  }
+`,we=i.div`
+  font-family: ${t.font.sans};
+  font-size: 14px;
+  color: ${t.colors.muted2};
+`,je=i.div`
+  flex: none;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-family: ${t.font.sans};
+  font-weight: 600;
+  font-size: 24px;
+  color: ${t.colors.text};
+
+  .ico {
+    width: 22px;
+    height: 22px;
+    color: ${t.colors.text};
+  }
+`,ys=i.div`
+  margin-top: 16px;
+  padding: 16px;
+  border-radius: 12px;
+  background: ${t.colors.promptLilac};
+`,ws=i.div`
+  font-family: ${t.font.sans};
+  font-weight: 700;
+  font-size: 16px;
+  color: ${t.colors.text};
+`,js=i.p`
+  margin: 8px 0 16px;
+  font-family: ${t.font.sans};
+  font-size: 14px;
+  line-height: 1.5;
+  color: ${t.colors.text2};
+
+  /* The chosen NAME is filled with the gradient the design runs through it (1356:335140), not a flat
+     violet — background-clip is the only way to paint a text run with one. */
+  b {
+    font-weight: 700;
+    background: linear-gradient(180deg, ${t.colors.dclRed}, ${t.colors.magenta});
+    background-clip: text;
+    -webkit-background-clip: text;
+    color: transparent;
+  }
+`,vs=i.label`
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 12px 14px;
+  background: ${t.colors.softWhite};
+  /* A hairline in Gray 2, not a full pixel of soft-black: this field sits INSIDE the lilac panel and
+     the heavier edge made it read as the modal's primary control (Figma 1356:335172). */
+  border: 0.5px solid ${t.colors.muted};
+  border-radius: 8px;
+  cursor: text;
+
+  &:focus-within {
+    border-color: ${t.colors.magenta};
+  }
+`,Cs=i.span`
+  flex: none;
+  font-family: ${t.font.sans};
+  font-size: 18px;
+  color: ${t.colors.muted2};
+`,$s=i.input`
+  flex: 0 1 auto;
+  min-width: 0;
+  border: 0;
+  outline: none;
+  background: transparent;
+  font-family: ${t.font.sans};
+  font-size: 16px;
+  font-weight: 600;
+  color: ${t.colors.text};
+
+  &::placeholder {
+    color: ${t.colors.muted2};
+    font-weight: 400;
+  }
+`,ks=i.span`
+  flex: none;
+  font-family: ${t.font.sans};
+  font-size: 16px;
+  color: ${t.colors.muted2};
+`,De=i.button`
+  margin-top: 16px;
+  width: 100%;
+  height: 46px;
+  border: 0;
+  border-radius: 12px;
+  cursor: pointer;
+  background: ${t.gradients.buyBtn};
+  color: ${t.colors.softWhite};
+  font-family: ${t.font.sans};
+  font-weight: 600;
+  font-size: 15px;
+  letter-spacing: 0.46px;
+  text-transform: uppercase;
+  transition: background-image 0.15s ease;
+
+  /* Both ends stay on background-IMAGE: a gradient cannot interpolate to a plain colour, so swapping
+     the shorthand instead blanks the button for the length of the transition. */
+  &:hover:not(:disabled),
+  &:active:not(:disabled) {
+    background-image: linear-gradient(${t.colors.dclRed}, ${t.colors.dclRed});
+  }
+  &:focus-visible {
+    outline: 2px solid ${t.colors.accent};
+    outline-offset: 2px;
+  }
+  &:disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+`,Ss=i.div`
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 32px;
+  padding: 32px 0 8px;
+`,Es=i.img`
+  width: 61px;
+  height: 61px;
+`,Rs=i.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+`,Ts=i.div`
+  font-family: ${t.font.sans};
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 1.6;
+  color: ${t.colors.text2};
+  text-align: center;
+`,_s=i.p`
+  max-width: 400px;
+  font-family: ${t.font.sans};
+  font-size: 14px;
+  line-height: 1.57;
+  color: ${t.colors.muted};
+  text-align: center;
+`,Ms=i.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  width: 100%;
+`,As=i.div`
+  flex: 1;
+  max-width: 400px;
+  height: 10px;
+  border-radius: 100px;
+  background: rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+
+  span {
+    display: block;
+    height: 100%;
+    width: 33%;
+    border-radius: 100px;
+    background: ${t.gradients.buyBtn};
+    animation: nameProgress 1.1s ease-in-out infinite;
+  }
+
+  @keyframes nameProgress {
+    0% {
+      transform: translateX(-100%);
+    }
+    100% {
+      transform: translateX(320%);
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    span {
+      width: 33%;
+      animation: none;
+    }
+  }
+`,Ns=i.span`
+  flex: none;
+  font-family: ${t.font.sans};
+  font-size: 16px;
+  line-height: 22px;
+  color: ${t.colors.text2};
+`,Ls=i.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+  padding: 24px;
+  border-radius: 12px;
+  background: #e2f5ea;
+  text-align: center;
+`,Is=i.div`
+  display: grid;
+  place-items: center;
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  background: ${t.colors.ok};
+  color: ${t.colors.white};
+
+  .ico {
+    width: 30px;
+    height: 30px;
+  }
+`,Ws=i.p`
+  margin: 0;
+  font-family: ${t.font.sans};
+  font-size: 16px;
+  line-height: 1.4;
+  color: ${t.colors.text};
+
+  b {
+    font-weight: 700;
+  }
+`,at=i.div`
+  display: flex;
+  gap: 16px;
+  margin-top: 20px;
+
+  ${t.media.maxWidth("mobile")} {
+    flex-direction: column;
+  }
+`,ot=i.button`
+  flex: 1;
+  height: 48px;
+  border: 1px solid ${t.colors.accent};
+  border-radius: 8px;
+  background: ${t.colors.white};
+  color: ${t.colors.accent};
+  cursor: pointer;
+  font-family: ${t.font.sans};
+  font-weight: 600;
+  font-size: 13px;
+  letter-spacing: 0.46px;
+  text-transform: uppercase;
+
+  &:hover {
+    background: rgba(105, 31, 169, 0.06);
+  }
+  &:focus-visible {
+    outline: 2px solid ${t.colors.accent};
+    outline-offset: 2px;
+  }
+`,zs=i.a`
+  flex: 1;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 48px;
+  border-radius: 8px;
+  background: ${t.colors.dclRed};
+  color: ${t.colors.softWhite};
+  cursor: pointer;
+  text-decoration: none;
+  font-family: ${t.font.sans};
+  font-weight: 600;
+  font-size: 13px;
+  letter-spacing: 0.46px;
+  text-transform: uppercase;
+
+  &:hover {
+    filter: brightness(1.05);
+  }
+  &:focus-visible {
+    outline: 2px solid ${t.colors.accent};
+    outline-offset: 2px;
+  }
+`,Ge=i.div`
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  padding: 16px;
+  margin-top: 8px;
+  border-radius: 12px;
+  background: rgba(255, 45, 85, 0.1);
+  font-family: ${t.font.sans};
+  font-size: 14px;
+  line-height: 1.5;
+  color: ${t.colors.text};
+
+  .ico {
+    width: 22px;
+    height: 22px;
+    flex: none;
+    color: ${t.colors.dclRed};
+  }
+
+  /**
+   * Informational, not a failure. Used for "your payment went through, the NAME is on its way" and for the
+   * reason a purchase is not available yet (no price, not enough credits) — none of which is an error, and
+   * all of which would contradict themselves rendered in the red error treatment.
+   */
+  &[data-tone='info'] {
+    background: ${t.colors.panel};
+
+    .ico {
+      color: ${t.colors.accent};
+    }
+  }
+`,Ps=i.div`
+  display: flex;
+  flex-direction: column;
+  gap: 24px;
+  margin-top: 16px;
+`;i(En)`
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 28px 12px;
+
+  ${t.media.maxWidth("mobile")} {
+    gap: 24px 12px;
+  }
+`;i(Rn)`
+  position: relative;
+`;i.span`
+  position: absolute;
+  top: -12px;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 2;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 4px 12px 4px 8px;
+  border-radius: ${t.radius.pill};
+  background: ${t.gradients.flare};
+  font-family: ${t.font.sans};
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 18px;
+  color: ${t.colors.white};
+  white-space: nowrap;
+
+  .ico {
+    width: 16px;
+    height: 16px;
+  }
+`;const Bs=i.div`
+  display: flex;
+  gap: 12px;
+`,Fs=i.span`
+  display: grid;
+  place-items: center;
+  width: 100%;
+  height: 100%;
+  background: ${t.gradients.amethyst};
+  font-family: ${t.font.sans};
+  font-size: 32px;
+  font-weight: 700;
+  color: ${t.colors.white};
+`;function Os({name:n,priceCredits:a,onClose:r}){const{session:d}=dt(),{data:h,isError:b}=_t(d),j=Mt(),c=Ze(),[l,w]=u.useState("confirm"),[g,C]=u.useState(""),[y,A]=u.useState(""),[p,v]=u.useState(!1),[f,$]=u.useState(null),x=(f==null?void 0:f.rail)??"credits",[T,B]=u.useState(null),[V,ae]=u.useState(!1),[S,_]=u.useState("preparing"),F=u.useRef(!1),H=g.trim().toLowerCase()===n.toLowerCase(),W=l==="completing"||p,N=a!=null?ht(a):"—",L=a==null,O=h==null?void 0:h.credits,D=a!=null&&O!=null?a-O:0,z=D>0,U=L?s("names.priceUnavailable"):null,{data:Z}=At(d),Q=(Z==null?void 0:Z.matic)??0n,G=Tn({priceCents:a!=null?a*We:0,priceManaWei:BigInt(Y),balanceCents:(h==null?void 0:h.balanceCents)??0,manaBalanceWei:Q,manaOnlyRail:!1}),E=G.options.some(m=>m.method!=="credits"),M=G.options.find(m=>m.method==="combined"),P=f==null&&E&&!L,R=In().packs.slice(0,Wn),{packs:q,recommended:J,closesGap:Me}=zn(R,D),K=q.find(m=>m.id===y)??J;u.useEffect(()=>{const m=k=>{k.key==="Escape"&&!W&&r()};return document.addEventListener("keydown",m),()=>document.removeEventListener("keydown",m)},[W,r]);async function Ae(){if(!d||!H||L||F.current||x==="credits"&&z)return;F.current=!0;const m=x==="combined"?Math.floor(((f==null?void 0:f.creditsCents)??0)/We):a??null;w("completing"),B(null),_("preparing");try{const k=await ss({name:n,identity:d.identity,signer:d.signer,creditsCents:f==null?void 0:f.creditsCents,maxManaWei:f==null?void 0:f.manaWei,onProgress:_});Re("Shop Completed Purchase",{items:[{item_id:null,contract_address:null,token_id:null,price_usd:Je(a??0),category:"name",is_smart:!1}],purchase_type:"name",is_primary:!0,payment_type:x==="combined"?"credits_and_mana":"credits",value_credits:m,value_usd:Je(m??0),transaction_hash:k.originTxHash??null,settlement:k.status}),j.invalidateQueries({queryKey:["usd-balance"]}),j.invalidateQueries({queryKey:["my-assets"]}),w(k.status==="registered"?"success":"pending")}catch(k){Re(zt(k)?"Shop Purchase Cancelled":"Shop Purchase Failed",{step:"submit",error_code:Wt(k),purchase_type:"name"});const ce=k instanceof Ke,de=k instanceof Ve;B(k instanceof Qe?s("names.errorRouteCost"):ce?s("names.errorNotRegistered"):de?s("names.errorSettlementUnknown"):(k==null?void 0:k.message)||s("names.errorGeneric")),ae(ce||de),w("error")}finally{F.current=!1}}u.useEffect(()=>{const m=k=>{k.persisted&&v(!1)};return window.addEventListener("pageshow",m),()=>window.removeEventListener("pageshow",m)},[]);async function Ne(){if(!(!d||!K||p)){v(!0);try{sessionStorage.removeItem(Bn),sessionStorage.removeItem(Un),sessionStorage.setItem(nt,n)}catch{}try{const m=await Fn(K.id,{address:d.address,identity:d.identity});if(m.url){window.location.href=m.url;return}if(!m.orderId)throw new Error("Checkout returned neither a redirect url nor an order id");c(`/credits?order=${encodeURIComponent(m.orderId)}`)}catch(m){It(m,{flow:"name_buy_credits"});try{sessionStorage.removeItem(nt)}catch{}B(s("buyModal.error.creditsCheckout")),ae(!1),w("error"),v(!1)}}}const te=l!=="success"&&l!=="pending"&&!P,oe=Nt(d==null?void 0:d.providerType),he=oe?2:1,pe=oe&&(S==="preparing"||S==="awaiting-confirmation"),Le=pe?1:he,Ie=pe?s("names.confirming"):S==="registering"?s("names.registering"):s("names.completing"),re=S==="registering"?s("names.processingRegistering"):null,ne=l==="confirm"&&z&&!E,le=l==="error"?s("names.errorTitle"):ne?s("names.buyCreditsTitle"):s("names.buyTitle");return e.jsx(us,{onClick:W?void 0:r,role:"presentation",children:e.jsxs(ms,{role:"dialog","aria-modal":"true","aria-label":le,onClick:m=>m.stopPropagation(),children:[te&&e.jsxs(e.Fragment,{children:[e.jsxs(Pe,{children:[e.jsx(Be,{children:le}),e.jsx(Fe,{onClick:r,disabled:W,"aria-label":s("buyModal.close"),children:e.jsx(I,{name:"close"})})]}),e.jsxs(Oe,{children:[s("names.myCreditsBalance")," ",e.jsx(X,{})," ",ze(h,b)]}),e.jsx(Ue,{})]}),ne&&e.jsxs(Ps,{children:[e.jsxs(_n,{children:[e.jsx(Mn,{}),e.jsxs(An,{children:[e.jsx("b",{children:s("buyModal.insufficientFunds")})," ",s("buyModal.warningNeedToBuy")," ",e.jsx("b",{children:s("buyModal.warningCreditsAmount",{count:D})})," ",s("names.warningToPurchase"),me()?null:e.jsxs(e.Fragment,{children:[" ",e.jsx(Nn,{href:Lt("/credits"),target:"_blank",rel:"noopener noreferrer",children:s("buyModal.warningLearnMore")})]})]})]}),me()?e.jsxs(ge,{"data-testid":"name-row-iap",children:[e.jsx(He,{"aria-hidden":!0,children:"@"}),e.jsxs(be,{children:[e.jsxs(ye,{children:[n,e.jsx("span",{children:".dcl.eth"})]}),e.jsx(we,{children:s("names.subtitle")})]}),e.jsxs(je,{children:[e.jsx(X,{}),N]})]}):null,me()?null:e.jsx(e.Fragment,{children:e.jsx(Ln,{packs:q,selectedId:K==null?void 0:K.id,onSelect:A,recommendedId:Me?J==null?void 0:J.id:void 0})}),e.jsxs(Bs,{children:[e.jsx(tt,{"data-variant":"outline",onClick:r,disabled:W,"data-testid":"name-topup-cancel",children:s("buyModal.cancel")}),me()?null:e.jsx(tt,{"data-variant":"gradient","data-testid":"name-buy-credits",disabled:!d||!K||p,onClick:()=>void Ne(),children:s("buyModal.buy")})]})]}),l==="confirm"&&!ne&&P&&e.jsx(On,{asset:{name:`${n}.dcl.eth`,caption:s("names.subtitle"),thumb:e.jsx(Fs,{"aria-hidden":!0,children:"@"})},priceCredits:a??0,priceCents:(a??0)*We,options:G.options,priceManaWei:BigInt(Y),balanceCredits:(h==null?void 0:h.credits)??0,manaBalanceWei:Q,onBuy:m=>{$(m==="combined"&&M?{rail:"combined",creditsCents:M.creditsCents,manaWei:M.manaWei}:{rail:"credits"})},onClose:r,busy:W}),(l==="confirm"||l==="error")&&!ne&&!P&&e.jsxs(e.Fragment,{children:[e.jsxs(ge,{children:[e.jsx(He,{"aria-hidden":!0,children:"@"}),e.jsxs(be,{children:[e.jsxs(ye,{children:[n,e.jsx("span",{children:".dcl.eth"})]}),e.jsx(we,{children:s("names.subtitle")})]}),e.jsxs(je,{children:[e.jsx(X,{}),N]})]}),l==="error"?e.jsxs(e.Fragment,{children:[e.jsxs(Ge,{children:[e.jsx(I,{name:"info","aria-hidden":!0}),e.jsx("span",{children:T})]}),V?e.jsx(De,{onClick:r,children:s("names.errorSpentDismiss")}):e.jsx(De,{onClick:()=>w("confirm"),children:s("names.tryAgain")})]}):e.jsxs(e.Fragment,{children:[e.jsxs(ys,{children:[e.jsx(ws,{children:s("names.confirmTitle")}),e.jsx(js,{dangerouslySetInnerHTML:{__html:s("names.confirmBody",{name:`<b>@${Us(n)}</b>`})}}),e.jsxs(vs,{children:[e.jsx(Cs,{"aria-hidden":!0,children:"@"}),e.jsx($s,{value:g,onChange:m=>C(m.target.value.replace(/[^a-zA-Z0-9]/g,"")),placeholder:"yourname","aria-label":s("names.reenterAria"),autoComplete:"off",spellCheck:!1,style:{width:`${Math.max(g.length,8)}ch`}}),e.jsx(ks,{children:".dcl.eth"})]})]}),U?e.jsxs(Ge,{"data-tone":"info","data-testid":"name-blocked-reason",children:[e.jsx(I,{name:"info","aria-hidden":!0}),e.jsx("span",{children:U})]}):null,e.jsx(De,{onClick:()=>void Ae(),disabled:!H||!d||L||x==="credits"&&z,children:s("names.buyCta")})]})]}),l==="completing"&&e.jsxs(Ss,{children:[e.jsx(Es,{src:Pn,alt:"",width:61,height:61}),e.jsxs(Rs,{children:[e.jsx(Ts,{children:Ie}),e.jsxs(Ms,{children:[e.jsx(As,{"aria-hidden":!0,children:e.jsx("span",{})}),e.jsx(Ns,{"data-testid":"name-progress-count",children:`${Le}/${he}`})]}),re?e.jsx(_s,{children:re}):null]})]}),l==="pending"&&e.jsxs(e.Fragment,{children:[e.jsxs(Pe,{children:[e.jsx(Be,{children:s("names.pendingHeaderTitle")}),e.jsx(Fe,{onClick:r,"aria-label":s("buyModal.close"),children:e.jsx(I,{name:"close"})})]}),e.jsxs(Oe,{children:[s("names.myCreditsBalance")," ",e.jsx(X,{})," ",ze(h,b)]}),e.jsx(Ue,{}),e.jsxs(Ge,{"data-tone":"info",children:[e.jsx(I,{name:"info","aria-hidden":!0}),e.jsxs("span",{children:[e.jsx("b",{children:s("names.pendingBannerBold")})," ",s("names.pendingBannerRest")]})]}),e.jsxs(ge,{style:{marginTop:20},children:[e.jsx(He,{"aria-hidden":!0,children:"@"}),e.jsxs(be,{children:[e.jsxs(ye,{children:[n,e.jsx("span",{children:".dcl.eth"})]}),e.jsx(we,{children:s("names.subtitle")})]}),e.jsxs(je,{children:[e.jsx(X,{}),N]})]}),e.jsx(at,{children:e.jsx(ot,{onClick:()=>{r(),c("/my-items")},children:s("names.myItems")})})]}),l==="success"&&e.jsxs(e.Fragment,{children:[e.jsxs(Pe,{children:[e.jsx(Be,{children:s("names.successHeaderTitle")}),e.jsx(Fe,{onClick:r,"aria-label":s("buyModal.close"),children:e.jsx(I,{name:"close"})})]}),e.jsxs(Oe,{children:[s("names.myCreditsBalance")," ",e.jsx(X,{})," ",ze(h,b)]}),e.jsx(Ue,{}),e.jsxs(Ls,{children:[e.jsx(Is,{"aria-hidden":!0,children:e.jsx(I,{name:"check"})}),e.jsxs(Ws,{children:[e.jsx("b",{children:s("names.successBannerBold")})," ",s("names.successBannerRest")]})]}),e.jsxs(ge,{style:{marginTop:20},children:[e.jsxs(fs,{"data-testid":"name-success-tile",children:[e.jsx(xs,{src:Hn,alt:"","aria-hidden":!0,width:47,height:47}),e.jsxs(gs,{children:[e.jsx("span",{"aria-hidden":!0,children:n}),e.jsx(bs,{src:hs,alt:"","aria-hidden":!0,width:14,height:14})]})]}),e.jsxs(be,{children:[e.jsxs(ye,{children:[n,e.jsx("span",{children:".dcl.eth"})]}),e.jsx(we,{children:s("names.subtitle")})]}),e.jsxs(je,{children:[e.jsx(X,{}),N]})]}),e.jsxs(at,{children:[e.jsx(ot,{onClick:()=>{r(),c("/my-items")},children:s("names.myItems")}),e.jsx(zs,{href:ie.profileUrl,target:"_blank",rel:"noopener noreferrer",children:s("names.assignToAvatar")})]})]})]})})}function Us(n){return n.replace(/[&<>"']/g,a=>({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"})[a])}const Hs="https://cdn.decentraland.org/@dcl/shop/1.19.1-36725100317.commit-9ad1d65/_assets/identity-icon-C8yAW_Gq.svg",Ds="https://cdn.decentraland.org/@dcl/shop/1.19.1-36725100317.commit-9ad1d65/_assets/world-icon-6xQ-PmmW.svg",Gs="https://cdn.decentraland.org/@dcl/shop/1.19.1-36725100317.commit-9ad1d65/_assets/invite-icon-Bz6lCTuB.svg",qs="data:image/svg+xml,%3csvg%20width='55.6797'%20height='63.6174'%20viewBox='0%200%2055.6797%2063.6174'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Vote'%3e%3cpath%20id='Vector'%20d='M0.055012%2039.1045C1.61191%2039.4989%202.83757%2039.3938%204.4307%2039.392L8.27108%2039.3878L20.7762%2039.3883L42.8819%2039.3904L50.0954%2039.3907C51.793%2039.3907%2054.0562%2039.5509%2055.6466%2039.0843C55.5909%2040.7931%2055.647%2042.8581%2055.6469%2044.5864L55.6479%2055.616L55.6559%2059.5618C55.6583%2060.6219%2055.8213%2061.9838%2055.261%2062.8837C55.2205%2062.9265%2055.1794%2062.9688%2055.1377%2063.0104C54.7986%2063.3482%2054.3791%2063.5594%2053.9021%2063.5761C52.0714%2063.642%2050.1544%2063.6097%2048.3241%2063.6078L37.4452%2063.6066L2.97352%2063.6103C2.2022%2063.6084%201.15943%2063.6718%200.589171%2063.0576C-0.204857%2062.2037%200.0327979%2060.3244%200.0349529%2059.1687L0.0414734%2054.3929C0.0413119%2049.3191%20-0.00749456%2044.1727%200.055012%2039.1045Z'%20fill='white'%20fill-opacity='0.8'/%3e%3cpath%20id='Subtract'%20d='M37.1168%200.00495927C38.1773%200.00461149%2039.2888%20-0.0284991%2040.3433%200.0811311C41.0714%200.15695%2041.7266%200.914583%2041.7857%201.63484C41.853%202.45491%2041.8268%203.31926%2041.8258%204.15144L41.8189%208.70418L41.8199%2023.9639L40.1099%2023.9659L13.8726%2023.963L13.8678%209.0909L13.8648%204.29793C13.8644%202.52652%2013.3942%200.34203%2015.6754%200.0342561C15.8907%200.016712%2016.237%200.0120998%2016.4557%200.0117952C21.6059%200.00480262%2026.761%200.0117634%2031.9107%200.00788896L37.1168%200.00495927ZM33.3834%206.17293C32.439%206.55612%2031.0531%208.12922%2030.3014%208.88191L25.8297%2013.3634C25.3537%2012.824%2023.3455%2010.7605%2022.8209%2010.4239C22.5581%2010.2549%2022.2566%2010.1546%2021.9449%2010.1329C21.4563%2010.1008%2020.9754%2010.2879%2020.6139%2010.6134C20.2442%2010.9428%2020.0227%2011.4077%2020.0006%2011.9024C19.9561%2013.0748%2021.3406%2014.1198%2022.1256%2014.8868C22.9429%2015.714%2024.1669%2017.1028%2025.1168%2017.67C26.1632%2018.2949%2027.3471%2017.2145%2027.9723%2016.4942C30.25%2014.2025%2032.5393%2011.9456%2034.8101%209.64949C35.2937%209.16062%2035.7138%208.69126%2035.6851%207.96199C35.6419%206.86558%2034.7821%206.09682%2033.6959%206.14656C33.5914%206.15085%2033.4872%206.16001%2033.3834%206.17293Z'%20fill='%23FF7439'/%3e%3cpath%20id='Vector_2'%20d='M45.5498%2015.976C46.6399%2015.986%2049.9504%2015.7705%2050.7361%2016.241C51.0104%2016.4053%2051.2831%2016.6446%2051.4181%2016.9397C51.892%2017.9763%2052.1015%2019.357%2052.3802%2020.4819L54.0582%2027.2308C54.5046%2028.9073%2054.9023%2030.6043%2055.3338%2032.2824C55.6029%2033.329%2055.9417%2034.4293%2054.9705%2035.2255C54.8158%2035.359%2054.4427%2035.5934%2054.2329%2035.6091C52.7731%2035.7184%2051.1693%2035.6701%2049.7108%2035.6679L39.4635%2035.6649L14.5239%2035.6632C10.471%2035.6631%206.41808%2035.6665%202.36531%2035.6698C1.79359%2035.6657%201.33794%2035.6604%200.844568%2035.337C-0.57365%2034.4073%200.381076%2032.2112%200.72189%2030.8501L1.93462%2025.9936L3.28579%2020.566C3.53371%2019.5688%203.77194%2018.5694%204.04289%2017.5781C4.30559%2016.6172%204.74298%2016.1492%205.73966%2015.9892C7.15095%2015.9419%208.72017%2015.9778%2010.1434%2015.9809L10.1451%2023.9585C7.37011%2024.097%207.74242%2027.5535%209.84963%2027.6469C11.6268%2027.7258%2013.6164%2027.6909%2015.4098%2027.691L26.229%2027.6915L39.1339%2027.691L43.273%2027.6909C44.748%2027.6909%2047.2174%2028.0848%2047.3773%2025.9908C47.4212%2025.4807%2047.2565%2024.9745%2046.9209%2024.5879C46.5265%2024.141%2046.1143%2024.0046%2045.5418%2023.9673L45.5498%2015.976Z'%20fill='white'/%3e%3c/g%3e%3c/svg%3e",Ks=i.div`
+  width: 100%;
+  min-width: 0;
+`,Vs=i.nav`
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  margin: 4px 0 16px;
+  font-family: ${t.font.sans};
+  font-size: 12px;
+  line-height: 1;
+  color: ${t.colors.gray4};
+  ${Dn};
+`,Zs=i.button`
+  border: 0;
+  background: none;
+  padding: 0;
+  cursor: pointer;
+  font: inherit;
+  color: ${t.colors.gray4};
+
+  &:hover {
+    color: ${t.colors.white};
+    text-decoration: underline;
+  }
+  &:focus-visible {
+    outline: 2px solid ${t.colors.white};
+    outline-offset: 2px;
+  }
+`,Qs=i.span`
+  font-weight: 700;
+  color: ${t.colors.softWhite};
+`,Xs=i.div`
+  display: flex;
+  flex-direction: column;
+  gap: 48px;
+  padding-bottom: 48px;
+
+  ${t.media.maxWidth("mobile")} {
+    gap: 32px;
+    padding-bottom: 32px;
+  }
+`,Ys=i.div`
+  position: relative;
+  border: 1px solid ${t.colors.magenta};
+  border-radius: 24px;
+  overflow: hidden;
+  padding: 88px 48px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 48px;
+  text-align: center;
+  background: ${t.colors.overlay};
+
+  ${t.media.maxWidth("mobile")} {
+    padding: 40px 20px;
+    gap: 28px;
+  }
+`,Js=i.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+`,ei=i.h1`
+  margin: 0;
+  font-family: ${t.font.sans};
+  font-weight: 600;
+  font-size: 40px;
+  line-height: 1.167;
+  color: ${t.colors.white};
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 26px;
+  }
+`,ti=i.p`
+  margin: 0;
+  max-width: 760px;
+  font-family: ${t.font.sans};
+  font-weight: 500;
+  font-size: 24px;
+  line-height: 1.334;
+  color: #ecebed;
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 16px;
+  }
+`,ni=i.div`
+  width: min(785px, 100%);
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+`,si=i.div`
+  position: relative;
+`,ii=i("div",Gn("invalid"))`
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 8px 8px 16px;
+  background: ${t.colors.softWhite};
+  /* Figma 1368:349148 gives the field a 3px Orange edge — it is the page's one input, and the design
+     leans on that weight to carry it. Red only when what has been typed cannot be claimed. */
+  border: 3px solid ${({invalid:n})=>n?t.colors.dclRed:t.colors.orange};
+  border-radius: 20px;
+
+  &:focus-within {
+    border-color: ${({invalid:n})=>n?t.colors.dclRed:t.colors.magenta};
+  }
+
+  ${t.media.maxWidth("mobile")} {
+    border-radius: 16px;
+  }
+`,ai=i.span`
+  position: absolute;
+  left: -9999px;
+  top: 0;
+  visibility: hidden;
+  pointer-events: none;
+  white-space: pre;
+  font-family: ${t.font.sans};
+  font-size: 20px;
+  font-weight: 600;
+  line-height: 1.6;
+
+  /* An empty field paints the PLACEHOLDER, which is lighter than a typed value — so the mirror has to
+     be lighter too. Measuring the placeholder at the value's weight made the box a few pixels wider
+     than the text in it, and ".dcl.eth" sat that far off the end of the word. */
+  &[data-placeholder] {
+    font-weight: 400;
+  }
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 16px;
+  }
+`,oi=i.div`
+  position: absolute;
+  top: calc(100% + 8px);
+  left: 0;
+  right: 0;
+  z-index: 2;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 12px;
+  border-radius: 8px;
+  background: #ffcdd4;
+  color: #ec303a;
+  font-family: ${t.font.sans};
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 1.2;
+  text-align: left;
+
+  ${t.media.maxWidth("mobile")} {
+    position: static;
+    margin-top: 8px;
+    align-items: flex-start;
+    flex-wrap: wrap;
+  }
+`,xt=i.a`
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  margin-left: auto;
+  font-weight: 600;
+  text-decoration: underline;
+  text-transform: uppercase;
+  white-space: nowrap;
+
+  ${t.media.maxWidth("mobile")} {
+    margin-left: 0;
+  }
+`,ri=i(xt)`
+  color: #ec303a;
+`,li=i.label`
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  gap: 0;
+  cursor: text;
+  overflow: hidden;
+`,ci=i.span`
+  flex: none;
+  margin-right: 8px;
+  font-family: ${t.font.sans};
+  font-size: 26px;
+  font-weight: 500;
+  line-height: 1;
+  color: ${t.colors.muted2};
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 20px;
+  }
+`,di=i.input`
+  flex: 0 1 auto;
+  min-width: 0;
+  max-width: 100%;
+  border: 0;
+  outline: none;
+  background: transparent;
+  font-family: ${t.font.sans};
+  font-size: 20px;
+  font-weight: 600;
+  line-height: 1.6;
+  color: ${t.colors.text};
+  padding: 0;
+
+  &::placeholder {
+    color: ${t.colors.muted1};
+    font-weight: 400;
+  }
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 16px;
+  }
+`,hi=i.span`
+  flex: none;
+  /* Flush against the name: "yourname.dcl.eth" has to read as one address, and at 20px even a couple of
+     pixels here look like a space someone typed by mistake. */
+  margin-left: 0;
+  /* Not selectable: it is the fixed part of the address, not something the reader typed. */
+  user-select: none;
+  -webkit-user-select: none;
+  font-family: ${t.font.sans};
+  font-size: 20px;
+  font-weight: 400;
+  line-height: 1.6;
+  color: ${t.colors.muted1};
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 16px;
+  }
+`,pi=i.span`
+  flex: none;
+  font-family: ${t.font.sans};
+  font-size: 14px;
+  line-height: 1.43;
+  color: ${t.colors.muted2};
+  white-space: nowrap;
+`,gt=i.button`
+  flex: none;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  height: 52px;
+  padding: 0 24px;
+  border: 0;
+  border-radius: 12px;
+  cursor: pointer;
+  background: ${t.gradients.buyBtn};
+  color: ${t.colors.softWhite};
+  font-family: ${t.font.sans};
+  font-weight: 600;
+  font-size: 15px;
+  letter-spacing: 0.46px;
+  line-height: 24px;
+  text-transform: uppercase;
+  transition: background-image 0.15s ease;
+
+  /* Both ends stay on background-IMAGE: a gradient cannot interpolate to a plain colour, so swapping
+     the background shorthand instead blanks the button for the length of the transition. */
+  &:hover:not(:disabled),
+  &:active:not(:disabled) {
+    background-image: linear-gradient(${t.colors.dclRed}, ${t.colors.dclRed});
+  }
+  &:focus-visible {
+    outline: 2px solid ${t.colors.white};
+    outline-offset: 2px;
+  }
+  &:disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+
+  ${t.media.maxWidth("mobile")} {
+    display: none;
+  }
+`,ui=i(gt)`
+  display: none;
+
+  ${t.media.maxWidth("mobile")} {
+    display: inline-flex;
+    width: 100%;
+    height: 48px;
+    border-radius: 12px;
+  }
+`,mi=i.span`
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 18px;
+  font-weight: 600;
+
+  .ico {
+    width: 13.26px;
+    height: 14px;
+  }
+`,fi=i.div`
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 14px;
+  border-radius: 8px;
+  font-family: ${t.font.sans};
+  font-size: 13px;
+  font-weight: 500;
+  text-align: left;
+
+  background: ${({tone:n})=>n==="error"?"rgba(255, 45, 85, 0.12)":n==="ok"?"rgba(30, 166, 114, 0.14)":"rgba(255,255,255,0.14)"};
+  color: ${({tone:n})=>n==="error"?t.colors.dclRed:n==="ok"?"#0f7a4f":"#ecebed"};
+
+  .ico {
+    width: 16px;
+    height: 16px;
+    flex: none;
+  }
+`,ve=i(fi)`
+  position: absolute;
+  top: calc(100% + 8px);
+  left: 0;
+  right: 0;
+  z-index: 2;
+
+  /* Static on mobile, as TakenBanner is: the claim button sits below InputWrap there, so anything
+     floating out of the input lands on top of it. */
+  ${t.media.maxWidth("mobile")} {
+    position: static;
+    margin-top: 8px;
+  }
+`,xi=i(xt)`
+  color: inherit;
+`,gi=i.section`
+  display: flex;
+  flex-direction: column;
+  gap: 48px;
+  padding: 0 48px;
+
+  ${t.media.maxWidth("mobile")} {
+    gap: 32px;
+    padding: 0 20px;
+  }
+`,bi=i.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 24px;
+`,yi=i.h2`
+  margin: 0;
+  text-align: center;
+  font-family: ${t.font.sans};
+  font-weight: 600;
+  font-size: 32px;
+  line-height: 1.167;
+  color: ${t.colors.white};
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 22px;
+  }
+`,wi=i.p`
+  margin: 0;
+  max-width: 907px;
+  text-align: center;
+  font-family: ${t.font.sans};
+  font-weight: 400;
+  font-size: 20px;
+  line-height: 1.57;
+  color: ${t.colors.gray4};
+
+  ${t.media.maxWidth("mobile")} {
+    font-size: 16px;
+  }
+`,ji=i.div`
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 24px;
+  align-items: stretch;
+
+  ${t.media.maxWidth("lg")} {
+    grid-template-columns: repeat(2, 1fr);
+  }
+  ${t.media.maxWidth("mobile")} {
+    grid-template-columns: 1fr;
+  }
+`,Ce=i.article`
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+  background: ${t.colors.overlay};
+  border-radius: 24px;
+
+  @media (forced-colors: active) {
+    outline: 1px solid CanvasText;
+  }
+
+  ${t.media.maxWidth("mobile")} {
+    gap: 20px;
+    padding: 20px;
+  }
+`,$e=i.img`
+  display: block;
+  align-self: flex-start;
+  height: 55px;
+  width: auto;
+`,ke=i.div`
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+`,Se=i.h3`
+  margin: 0;
+  font-family: ${t.font.sans};
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 1.57;
+  text-transform: uppercase;
+  color: ${t.colors.white};
+`,Ee=i.p`
+  margin: 0;
+  font-family: ${t.font.sans};
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 1.57;
+  color: ${t.colors.media};
+`,vi=i.span`
+  font-weight: 700;
+  color: ${t.colors.white};
+`,rt=i.a`
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  margin-top: auto;
+  font-family: ${t.font.sans};
+  font-weight: 500;
+  font-size: 14px;
+  line-height: 30px;
+  color: ${t.colors.softWhite};
+  text-decoration: underline;
+
+  &:focus-visible {
+    outline: 2px solid ${t.colors.softWhite};
+    outline-offset: 2px;
+  }
+
+  .ico {
+    width: 13px;
+    height: 13px;
+  }
+`,Ci=i.span`
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+`,$i="https://docs.decentraland.org/creator/worlds/about/",ki="https://governance.decentraland.org";function lt(n){const a=typeof window<"u"?window.location.hostname:"";return`${a.endsWith("decentraland.org")?"https://decentraland.org":a.endsWith("decentraland.today")?"https://decentraland.today":"https://decentraland.zone"}/marketplace/names/browse?search=${encodeURIComponent(n)}`}function Si({onBack:n}){pt({title:s("seo.names.title"),description:s("seo.names.description")});const{session:a,signIn:r}=dt(),d=Ze(),h=yt(),{pathname:b,search:j}=h,c=h.state,l=typeof(c==null?void 0:c.resumeName)=="string"?c:void 0,w=is(),{data:g}=ut(),C=g?mt(Y,g):null,[y,A]=u.useState((l==null?void 0:l.resumeName)??""),[p,v]=u.useState("idle"),[f,$]=u.useState(!1),[x,T]=u.useState((l==null?void 0:l.resumeName)??""),[B,V]=u.useState(!!(l!=null&&l.resumeName)),[ae,S]=u.useState(()=>{var E;return typeof window<"u"&&!!((E=window.matchMedia)!=null&&E.call(window,"(prefers-reduced-motion: reduce)").matches)});u.useEffect(()=>{var P;const E=(P=window.matchMedia)==null?void 0:P.call(window,"(prefers-reduced-motion: reduce)");if(!E)return;const M=R=>S(R.matches);return E.addEventListener("change",M),()=>E.removeEventListener("change",M)},[]);const _=s("names.placeholderExamples"),F=u.useMemo(()=>_.split(",").map(E=>E.trim()).filter(Boolean),[_]),W=ds(F,!B&&!y&&!ae)||s("names.inputPlaceholder"),N=u.useRef(null),[L,O]=u.useState(void 0);u.useLayoutEffect(()=>{N.current&&O(N.current.getBoundingClientRect().width)},[y,W]),u.useEffect(()=>{if(!st(y).ok){v(y.length===0?"idle":"invalid");return}v("checking");const M=new AbortController,P=setTimeout(()=>{(async()=>{try{const R=await Xn(y,{signal:M.signal});v(R)}catch(R){if((R==null?void 0:R.name)==="AbortError")return;v("error")}})()},400);return()=>{clearTimeout(P),M.abort()}},[y]);const D=st(y),z=D.ok&&(p==="available"||p==="error"),U=w&&z,Z=!w&&z;function Q(){if(U){if(!a){r();return}$(!0)}}u.useEffect(()=>{l!=null&&l.resumeName&&d(`${b}${j}`,{replace:!0,state:null})},[l==null?void 0:l.resumeName,d,b,j]),u.useEffect(()=>{if(x){if(y.toLowerCase()!==x.toLowerCase()){T("");return}if(!(p==="idle"||p==="checking")){if(!z){T("");return}!w||!a||(T(""),$(!0))}}},[x,y,p,z,w,a]);const G=e.jsxs(e.Fragment,{children:[s("names.claim"),C!=null?e.jsxs(mi,{children:[e.jsx(X,{}),ht(C)]}):null]});return e.jsxs(Ks,{"data-testid":"names-page",children:[e.jsxs(Vs,{"aria-label":s("names.breadcrumbAria"),children:[e.jsx(Zs,{onClick:n,children:s("names.breadcrumbCollectibles")}),e.jsx("span",{"aria-hidden":!0,children:">"}),e.jsx(Qs,{children:s("names.breadcrumbCurrent")})]}),e.jsxs(Xs,{children:[e.jsxs(Ys,{children:[e.jsxs(Js,{children:[e.jsx(ei,{children:s("names.heroTitle")}),e.jsx(ti,{children:s("names.heroSubtitle")})]}),e.jsxs(ni,{children:[e.jsxs(si,{"data-testid":"names-input-wrap",children:[e.jsxs(ii,{invalid:p==="taken",children:[e.jsxs(li,{children:[e.jsx(ci,{"aria-hidden":!0,children:"@"}),e.jsx(di,{value:y,onChange:E=>A(Vn(E.target.value)),placeholder:W,"aria-label":s("names.inputAria"),autoComplete:"off",spellCheck:!1,maxLength:_e,onFocus:()=>V(!0),style:{width:L!=null?`${L}px`:void 0}}),e.jsx(ai,{ref:N,"aria-hidden":!0,"data-placeholder":!y||void 0,children:y||W}),e.jsx(hi,{children:s("names.suffix")})]}),y.length>0?e.jsxs(pi,{"aria-hidden":!0,children:[y.length,"/",_e]}):null,e.jsx(gt,{onClick:Q,disabled:!U,"data-testid":"names-claim",children:G})]}),p==="taken"?e.jsxs(oi,{role:"status","data-testid":"names-taken",children:[e.jsx(I,{name:"info",size:16,"aria-hidden":!0}),e.jsx("span",{children:s("names.taken")}),e.jsxs(ri,{href:lt(y),target:"_blank",rel:"noopener noreferrer",children:[s("names.takenMakeOffer"),e.jsx(I,{name:"external-link",size:13,"aria-hidden":!0})]})]}):null,p==="checking"?e.jsx(ve,{tone:"muted",role:"status","data-testid":"names-checking",children:s("names.checking")}):Z?e.jsxs(ve,{tone:"muted",role:"status","data-testid":"names-disabled",children:[e.jsx(I,{name:"info",size:16,"aria-hidden":!0}),e.jsx("span",{children:s("names.registrationDisabled")}),e.jsxs(xi,{href:lt(y),target:"_blank",rel:"noopener noreferrer",children:[s("names.registrationDisabledLink"),e.jsx(I,{name:"external-link",size:13,"aria-hidden":!0})]})]}):p==="error"?e.jsx(ve,{tone:"muted",role:"status",children:s("names.checkError")}):p==="invalid"&&!D.ok&&D.reason==="too-short"?e.jsx(ve,{tone:"muted",role:"status",children:s("names.tooShort",{min:ft})}):null]}),e.jsx(ui,{onClick:Q,disabled:!U,children:G}),e.jsx(Ci,{role:"status","aria-live":"polite",children:p==="available"?s("names.available",{name:y}):""})]})]}),e.jsxs(gi,{children:[e.jsxs(bi,{children:[e.jsx(yi,{children:s("names.whyTitle")}),e.jsx(wi,{children:s("names.whyIntro")})]}),e.jsxs(ji,{children:[e.jsxs(Ce,{children:[e.jsx($e,{src:Hs,alt:""}),e.jsxs(ke,{children:[e.jsx(Se,{children:s("names.why1Title")}),e.jsx(Ee,{children:s("names.why1")})]})]}),e.jsxs(Ce,{children:[e.jsx($e,{src:Ds,alt:""}),e.jsxs(ke,{children:[e.jsx(Se,{children:s("names.why2Title")}),e.jsxs(Ee,{children:[s("names.why2")," ",e.jsx(vi,{children:s("names.why2Address")})]}),e.jsxs(rt,{href:$i,target:"_blank",rel:"noopener noreferrer",children:[s("names.learnMore"),e.jsx(I,{name:"external-link","aria-hidden":!0})]})]})]}),e.jsxs(Ce,{children:[e.jsx($e,{src:Gs,alt:""}),e.jsxs(ke,{children:[e.jsx(Se,{children:s("names.why3Title")}),e.jsx(Ee,{children:s("names.why3")})]})]}),e.jsxs(Ce,{children:[e.jsx($e,{src:qs,alt:""}),e.jsxs(ke,{children:[e.jsx(Se,{children:s("names.why4Title")}),e.jsx(Ee,{children:s("names.why4")}),e.jsxs(rt,{href:ki,target:"_blank",rel:"noopener noreferrer",children:[s("names.learnMore"),e.jsx(I,{name:"external-link","aria-hidden":!0})]})]})]})]})]})]}),f?e.jsx(Os,{name:y,priceCredits:C,onClose:()=>$(!1)}):null]})}const Ei=i.p`
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  background: ${t.colors.rarityBg};
+  color: ${t.colors.accent};
+  border-radius: 12px;
+  padding: 12px 16px;
+  margin-bottom: 14px;
+  font-weight: 600;
+  font-size: 14px;
+
+  &[data-variant='warn'] {
+    background: rgba(211, 51, 51, 0.1);
+    color: ${t.colors.err};
+  }
+`,ct=48,Ri=["all","on_sale","not_for_sale"],Ti=n=>n?"all":"on_sale",qe=(n,a)=>n?"relevance":a?"discount":"newest";function ia({contracts:n,itemIds:a,hideNames:r=!1,seo:d,lockStatus:h}={}){const[b]=wt(),j=Ze(),c=(b.get("q")??"").trim().toLowerCase(),l=(b.get("q")??"").trim();pt(d??{title:l?s("seo.collectibles.searchTitle",{query:l}):s("seo.collectibles.title"),description:s("seo.collectibles.description")});const w=Ti(!!c),g=Pt(),C=g&&b.get("deals")==="true",y=u.useMemo(()=>({category:"all",status:w,subCategory:null,rarities:[],priceMin:"",priceMax:"",smart:!1,deals:!1,sort:qe(!!c,C)}),[w,C,c]),[A,p]=Kt(y),{subCategory:v,rarities:f,priceMin:$,priceMax:x,smart:T,sort:B}=A,V=g&&A.deals,S=Bt.map(o=>o.key).filter(o=>!(r&&o==="names")).includes(A.category)?A.category:"all",_=h??(Ri.includes(A.status)?A.status:w);Zt(`${S}:${v??""}`);const[F,H]=u.useState(!1);u.useEffect(()=>{if(!F)return;const o=ue=>{ue.key==="Escape"&&H(!1)};document.addEventListener("keydown",o);const ee=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.removeEventListener("keydown",o),document.body.style.overflow=ee}},[F]);const W=(n!==void 0||a!==void 0)&&!(n!=null&&n.length)&&!(a!=null&&a.length),N=_==="on_sale",L=$&&!Number.isNaN(Number($))?Number($):void 0,O=x&&!Number.isNaN(Number(x))?Number(x):void 0,D=Ft(),z=v?qt[v]:void 0,U=[...c?[Qt]:[],...V?Xt:Yt],Z=U.find(o=>o.key===B)??U[0],Q=Z.server,G={category:S,rarities:f.length?f:void 0,wearableCategories:z,minPriceCredits:L,maxPriceCredits:O,search:c||void 0,sortBy:Q,isSmart:T||void 0,onSale:!0,discounted:V||void 0,listingType:D?void 0:"primary",contractAddresses:n!=null&&n.length?n:void 0,itemIds:a!=null&&a.length?a:void 0},E={category:S,rarities:f.length?f:void 0,wearableCategories:z,search:c||void 0,sortBy:Q,isWearableSmart:T||void 0,isOnSale:_==="not_for_sale"?!1:void 0,contractAddresses:n!=null&&n.length?n:void 0},{items:M,total:P,isLoading:R,isPlaceholderData:q,error:J,hasNextPage:Me,isFetchingNextPage:K,isFetchNextPageError:Ae,fetchNextPage:Ne}=un(N?["shop-items",G]:["catalog-items",E],o=>N?Dt({...G,first:ct,skip:o}):Gt({...E,first:ct,skip:o}),{enabled:S!=="names"&&!W}),te=P,{data:oe,isError:he,isPending:pe}=ut(),Le=o=>oe&&o.manaWei?mt(o.manaWei,oe):null,Ie=N&&pe&&M.some(o=>o.source==="legacy"),re=R||q||Ie,ne=R?15:Math.max(M.length,1),le=u.useRef(null);u.useEffect(()=>{R||q||!c||le.current===c||(le.current=c,Re("Shop Searched",{query:c,result_count:te}))},[c,R,q,te]);const m=u.useRef("__init__");u.useEffect(()=>{if(R||q)return;const o=JSON.stringify({category:S,subCategory:v,rarities:f,min:L,max:O,sort:B,status:_,smart:T});if(m.current==="__init__"||m.current===o){m.current=o;return}m.current=o,Re("Shop Applied Filter",{filters:{category:S,sub_category:v,rarities:f,min_price_credits:L??null,max_price_credits:O??null,status:_,smart:T,sort:B},result_count:te})},[S,v,f,L,O,B,_,T,R,q,te]);function k(o){p({category:o,subCategory:null})}function ce(o){p({status:o})}function de(o){p({rarities:f.includes(o)?f.filter(ee=>ee!==o):[...f,o]})}function bt(){p(y)}const se=[];(L!=null||O!=null)&&se.push({key:"price",label:s("filter.price"),onRemove:()=>{p({priceMin:"",priceMax:""})}});for(const o of Ot)f.includes(o)&&se.push({key:`rarity-${o}`,label:Ut(o),onRemove:()=>de(o)});return T&&se.push({key:"smart",label:s("filter.smart"),onRemove:()=>p({smart:!1})}),V&&se.push({key:"deals",label:s("filter.deals"),onRemove:()=>p({deals:!1,sort:qe(!!c,!1)})}),_!==w&&se.push({key:"status",label:_==="all"?s("filter.statusAll"):_==="on_sale"?s("filter.onSale"):s("filter.notForSale"),onRemove:()=>ce(w)}),e.jsxs(tn,{"data-testid":"browse",children:[S!=="names"&&e.jsxs(e.Fragment,{children:[F?e.jsx(nn,{onClick:()=>H(!1),"aria-hidden":!0}):null,e.jsxs(sn,{"data-open":F||void 0,"data-testid":"browse-sidebar",children:[e.jsxs(an,{children:[e.jsx(on,{children:s("assets.filters")}),e.jsx(rn,{onClick:()=>H(!1),"aria-label":s("assets.closeFilters"),children:"✕"})]}),e.jsx(ln,{children:e.jsx(Jt,{category:S,subCategory:v,onCategory:k,onSub:o=>p({subCategory:o}),priceMin:$,priceMax:x,onPriceMin:o=>p({priceMin:o}),onPriceMax:o=>p({priceMax:o}),rarities:f,onToggleRarity:de,status:_,onStatus:ce,hideNames:r,smart:T,onSmart:o=>p({smart:o}),deals:V,onDeals:g?o=>p({deals:o,sort:qe(!!c,o)}):void 0})}),e.jsx(cn,{children:e.jsx(dn,{type:"button",onClick:()=>H(!1),children:s("assets.showItems")})})]})]}),e.jsx(hn,{children:S==="names"?e.jsx(Si,{onBack:()=>k("all")}):e.jsxs(e.Fragment,{children:[e.jsx(en,{sort:Z.key,sortOptions:U,onSort:o=>p({sort:o}),total:P,loading:R||q,query:c,onOpenFilters:()=>H(!0),chips:se,onClearChips:bt}),he&&N&&M.some(o=>o.source==="legacy")?e.jsx(Ei,{"data-variant":"warn",children:s("assets.marketUnavailable")}):null,J?e.jsx(mn,{message:s("assets.loadError"),testId:"browse-error"}):null,!re&&M.length===0&&!J?e.jsx(Ht,{testId:"browse-empty",icon:Vt,title:s("assets.empty.title"),body:l?e.jsxs(e.Fragment,{children:[s("assets.empty.searchBefore"),e.jsx("b",{children:l}),s("assets.empty.searchAfter")]}):s("assets.empty.filters"),cta:{label:s("assets.empty.cta"),onClick:()=>j("/overview")}}):e.jsxs(e.Fragment,{children:[e.jsx(qn,{"data-testid":"grid",children:re?e.jsx(et,{count:ne}):e.jsxs(e.Fragment,{children:[M.map(o=>{if(!N)return e.jsx(fe,{item:o,mode:"view"},xe(o));const ee=o;if(ee.source!=="legacy")return e.jsx(fe,{item:o},xe(o));const ue=Le(ee);return ue==null?e.jsx(fe,{item:o,mode:"view"},xe(o)):e.jsx(fe,{item:{...ee,priceCredits:ue}},xe(o))}),K?e.jsx(et,{count:6}):null]})}),e.jsx(pn,{hasNextPage:Me,isFetching:K,isError:Ae,onLoadMore:()=>void Ne()})]})]})})]})}export{ia as Assets};
+//# sourceMappingURL=Assets-DElD46e4.js.map