@dcl/shop 1.1.0 → 1.1.1-31102625765.commit-10fdc9c

package/_assets/index-Be1ejvaF.js

@@ -0,0 +1,625 @@
+import{j as e,b as ce,r as p,L as pe}from"./react-BYHuwl8r.js";import{t as A,s as n,w as he,y as ge,b as a,C as D,B as P,bY as re,z as O,Z as xe,bk as K,F as U,Q as me,o as ue,A as fe,bj as we,I as G,aa as be,ac as ye,bZ as ve,b_ as je,b$ as ke,E as Y}from"./index-DZSPT_NS.js";import{c as $e,i as Ce,R as Ie,u as Se}from"./useImportable-QV1qlFEy.js";import{S as Te,C as Le}from"./ManaPricingBanner.styles-Dp4OJnuy.js";import{F as H}from"./Faq-Yv2mYyMA.js";import{C as V}from"./field.styles-B3Ufd7iA.js";import"./dcl-schemas-CmtP3U6y.js";import"./sentry-Dx-KuLV3.js";import"./ethers-BDpbhgX6.js";import"./intl-CBcMB1D2.js";import"./buy-wbuVsA9p.js";import"./authorizations-BGawCoH1.js";import"./sendMetaTransaction-C0JzN9LI.js";function ze({size:s=12,...d}){return e.jsx("svg",{viewBox:"0 0 20 20",width:s,height:s,fill:"none","aria-hidden":!0,focusable:"false",...d,children:e.jsx("path",{d:"M5 10.5l3 3 7-7.5",stroke:"#fff",strokeWidth:"2.4",strokeLinecap:"round",strokeLinejoin:"round"})})}function Ae({size:s=84.837,...d}){return e.jsxs("svg",{viewBox:"0 0 84.837 84.837",width:s,height:s,fill:"none","aria-hidden":!0,focusable:"false",...d,children:[e.jsxs("g",{stroke:A.colors.errStrong,strokeWidth:"6.08696",strokeLinecap:"round",children:[e.jsx("circle",{cx:"42.4185",cy:"42.4185",r:"39.375"}),e.jsx("path",{d:"M42.4185 22.5V47.5"})]}),e.jsx("circle",{cx:"42.4185",cy:"60.75",r:"3.8",fill:A.colors.errStrong})]})}const{colors:R,radius:Re,z:Fe}=A,_e=he`
+  0% {
+    transform: scale(0);
+    opacity: 0;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+`,Z=n.div`
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  overflow-y: auto;
+  padding: 20px;
+  // Above the global DCL navbar so the backdrop dims the full viewport (navbar included).
+  z-index: ${Fe.overlay};
+`,oe=n.div`
+  background: ${R.white};
+  border-radius: ${Re.card};
+  padding: 24px;
+  width: min(420px, 92vw);
+  margin: auto;
+  /* Never taller than the (padded) viewport, and scroll inside if the content still does not fit — on a
+     short screen the actions used to sit off the bottom edge with no way to reach them. */
+  max-height: 100%;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+
+  &[data-success],
+  &[data-failure] {
+    text-align: center;
+    align-items: center;
+  }
+  &[data-success] [data-actions],
+  &[data-failure] [data-actions] {
+    justify-content: center;
+    width: 100%;
+  }
+`,J=n.h2`
+  font-size: 20px;
+`;n.img`
+  width: 140px;
+  height: 140px;
+  object-fit: contain;
+  align-self: center;
+  background: ${R.media};
+  border-radius: 10px;
+`;const Ee=n.div`
+  position: sticky;
+  bottom: 0;
+  display: flex;
+  justify-content: flex-end;
+  gap: 10px;
+  margin-top: 6px;
+  padding-top: 8px;
+  background: ${R.white};
+`;n.div`
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  background: ${R.okStrong};
+  color: ${R.white};
+  font-size: 30px;
+  font-weight: 800;
+  display: grid;
+  place-items: center;
+  margin: 4px auto 2px;
+  animation: ${_e} 0.32s cubic-bezier(0.2, 0.9, 0.3, 1.4);
+
+  @media (prefers-reduced-motion: reduce) {
+    animation: none;
+  }
+`;n.p`
+  font-weight: 700;
+  font-size: 16px;
+  margin: 2px 0 0;
+`;const{colors:u,gradients:Me,radius:Qe}=A,Pe=n(oe)`
+  width: min(460px, 94vw);
+  text-align: left;
+  align-items: stretch;
+`,Be=n.div`
+  height: 6px;
+  border-radius: 999px;
+  background: ${u.line};
+  overflow: hidden;
+  margin: 6px 0 14px;
+`,qe=n.div`
+  height: 100%;
+  width: 0;
+  background: ${Me.amethyst};
+  border-radius: 999px;
+  transition: width 0.45s ease;
+`,We=n.ul`
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  /* The elastic part of a viewport-capped modal: it gives up height before anything else. The floor is
+     explicit because a scroll container's automatic minimum size is zero — it would otherwise collapse
+     to nothing on a short screen instead of just showing fewer rows. */
+  min-height: 96px;
+  max-height: 320px;
+  overflow-y: auto;
+`,Ne=n.li`
+  display: grid;
+  grid-template-columns: 34px 1fr auto auto;
+  align-items: center;
+  gap: 10px;
+  padding: 8px;
+  border-radius: 10px;
+  transition: background 0.2s;
+
+  &[data-status='active'] {
+    background: ${u.rarityBg};
+  }
+  &[data-status='done'] {
+    opacity: 0.75;
+  }
+  &[data-status='skipped'],
+  &[data-status='failed'] {
+    opacity: 0.6;
+  }
+`,De=n.span`
+  width: 34px;
+  height: 34px;
+  border-radius: ${Qe.btn};
+  overflow: hidden;
+  background: ${u.media};
+  display: grid;
+  place-items: center;
+
+  & img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+`,Oe=n.span`
+  font-weight: 600;
+  font-size: 14px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`,Ke=n.span`
+  font-weight: 700;
+  font-size: 13px;
+  color: ${u.text2};
+`,Ue=n.span`
+  font-size: 12px;
+  font-weight: 700;
+  color: ${u.accent};
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  justify-content: flex-end;
+  min-width: 74px;
+`,Ge=n.span`
+  color: ${u.muted2};
+  font-weight: 600;
+`,Ye=n.span`
+  color: ${u.muted};
+  font-weight: 600;
+`,X=n.span`
+  color: ${u.errStrong};
+  font-weight: 600;
+`,He=n.span`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 4px;
+`,Ve=n.span`
+  width: 14px;
+  height: 14px;
+  margin: 0;
+  border-width: 2px;
+`,Ze=n.span`
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background: ${u.ok};
+  color: ${u.white};
+  display: grid;
+  place-items: center;
+  font-size: 12px;
+`,Je=n.p`
+  margin: 12px 0 0;
+`;function Xe(s,d){switch(s==null?void 0:s.step){case"cancelling":return d?a("migrate.phaseCancelConfirm"):a("migrate.phaseCancel");case"confirming-cancel":return d?a("migrate.phaseConfirmingCancel"):a("migrate.phaseConfirmingCancelManaged");case"authorising":return d?a("migrate.phaseAuthoriseConfirm"):a("migrate.phaseAuthorise");case"signing":return d?a("migrate.phaseSignConfirm"):a("migrate.phaseSign");case"publishing":return a("migrate.phasePublishing");case"indexing":return a("migrate.phaseIndexing",{attempt:s.attempt,of:s.of});default:return d?a("migrate.statusConfirm"):a("migrate.statusAdding")}}function et({queue:s,session:d,onClose:h,onDone:I}){const B=ce(),y=ge(d.providerType),[q,_]=p.useState(()=>s.map(()=>null)),[x,E]=p.useState(null),[l,b]=p.useState(()=>s.map(()=>"pending")),[v,w]=p.useState("running"),S=p.useRef(!1),j=p.useRef(!1);p.useEffect(()=>(j.current=!1,S.current||(S.current=!0,y&&$e(s.map(i=>i.item),d.address).then(i=>{i&&E({approvals:i.approvals,total:i.total})}).catch(()=>{}),(async()=>{for(let i=0;i<s.length;i++){if(j.current)return;b(r=>r.map((c,g)=>g===i?"active":c));try{await Ce(s[i].item,s[i].priceCredits,d,{onPhase:r=>_(c=>c.map((g,z)=>z===i?r:g))}),xe("Shop Migrated Listing",{item_id:s[i].item.itemId??s[i].item.oldTradeId??null,contract_address:s[i].item.contractAddress,new_price_credits:s[i].priceCredits,new_price_usd:K(s[i].priceCredits)}),b(r=>r.map((c,g)=>g===i?"done":c))}catch(r){if(r instanceof Ie)U(r,{flow:"import_listing",step:"relist",itemId:s[i].item.itemId??s[i].item.oldTradeId}),b(c=>c.map((g,z)=>z===i?"unlisted":g));else{const c=r,g=c.code===4001||/reject|denied|cancel/i.test(c.message??"");g||U(r,{flow:"import_listing",itemId:s[i].item.itemId??s[i].item.oldTradeId}),b(z=>z.map((de,le)=>le===i?g?"skipped":"failed":de))}}}w("finished")})()),()=>{j.current=!0}),[]);const k=l.filter(t=>t==="done").length,M=l.findIndex(t=>t==="active"),W=Math.round(l.filter(t=>t!=="pending"&&t!=="active").length/s.length*100),C=l.filter(t=>t==="skipped").length,T=l.filter(t=>t==="failed").length,m=l.filter(t=>t==="unlisted").length,$=T+m;function L(){I({listed:k,failed:$,cancelled:C}),h()}const Q=p.useRef(!1);return p.useEffect(()=>{v!=="finished"||Q.current||(Q.current=!0,!($>0)&&L())},[v,$]),v==="finished"?$===0?null:e.jsx(Z,{role:"presentation",children:e.jsxs(oe,{"data-failure":!0,role:"dialog","aria-modal":"true","data-testid":m>0?"migrate-unlisted":"migrate-failed",children:[e.jsx(He,{"aria-hidden":!0,children:e.jsx(Ae,{size:72})}),e.jsx(J,{children:m>0?a("migrate.unlistedTitle"):a("migrate.failedTitle")}),e.jsxs("p",{className:"muted",style:{margin:0},children:[m>0?a("migrate.unlistedSummary",{count:m}):"",T>0?(m>0?" ":"")+a("migrate.failedSummary",{count:T}):"",k>0?" "+a("migrate.listedSummary",{count:k,currency:D.name}):"",C>0?" "+a("migrate.skippedSummary",{count:C}):""]}),e.jsxs(Ee,{"data-actions":!0,children:[e.jsx(P,{variant:"ghost",onClick:L,children:a("getCredits.done")}),m>0?e.jsx(P,{variant:"purple",onClick:()=>{I({listed:k,failed:$,cancelled:C}),h(),B(re)},children:a("migrate.goToMyAssets")}):null]})]})}):e.jsx(Z,{role:"presentation",children:e.jsxs(Pe,{"data-testid":"modal",role:"dialog","aria-modal":"true","aria-live":"polite",children:[e.jsx(J,{children:a("migrate.listingTitle")}),e.jsxs("p",{className:"muted small",style:{margin:"0 0 4px"},children:[y?a("migrate.subConfirm"):a("migrate.subManaged")," ",M>=0?a("migrate.progressCount",{current:M+1,total:s.length}):""]}),e.jsx(Be,{children:e.jsx(qe,{style:{width:`${W}%`}})}),e.jsx(We,{children:s.map((t,i)=>e.jsxs(Ne,{"data-status":l[i],children:[e.jsx(De,{children:t.item.thumbnail?e.jsx("img",{src:t.item.thumbnail,alt:""}):null}),e.jsx(Oe,{title:t.item.name,children:t.item.name||a("migrate.itemFallback")}),e.jsxs(Ke,{children:[e.jsx(O,{className:"ccy-mark"})," ",t.priceCredits.toLocaleString()]}),e.jsx(Ue,{"data-testid":l[i]==="active"?"migrate-active-status":void 0,children:l[i]==="active"?e.jsxs(e.Fragment,{children:[e.jsx(Ve,{className:"spinner","aria-hidden":!0})," ",Xe(q[i],y)]}):l[i]==="done"?e.jsx(Ze,{children:e.jsx(ze,{})}):l[i]==="skipped"?e.jsx(Ye,{children:a("migrate.statusSkipped")}):l[i]==="failed"?e.jsx(X,{children:a("migrate.statusFailed")}):l[i]==="unlisted"?e.jsx(X,{title:a("migrate.unlistedTooltip"),children:a("migrate.statusUnlisted")}):e.jsx(Ge,{children:a("migrate.statusWaiting")})})]},t.item.oldTradeId))}),e.jsx(Je,{className:"muted small",children:y?x?a(x.approvals>0?"migrate.hintCountApproval":"migrate.hintCount",{total:x.total}):a("migrate.hintConfirm"):a("migrate.hintManaged")})]})})}const tt="data:image/svg+xml,%3csvg%20preserveAspectRatio='none'%20overflow='visible'%20style='display:%20block;'%20width='84.837'%20height='84.837'%20viewBox='0%200%2084.837%2084.837'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Group'%3e%3cpath%20id='Vector'%20d='M29.2935%2033.6675L43.5472%2044.36C44.4303%2045.0223%2045.5311%2045.3263%2046.6288%2045.2111C47.7266%2045.0959%2048.7403%2044.5699%2049.4666%2043.7387L77.4185%2011.7925'%20stroke='url(%23paint0_linear_0_74)'%20stroke-width='6.08696'%20stroke-linecap='round'/%3e%3cpath%20id='Vector_2'%20d='M81.7935%2042.4178C81.7936%2050.6451%2079.2167%2058.6658%2074.4245%2065.3533C69.6323%2072.0409%2062.8657%2077.0594%2055.075%2079.7039C47.2843%2082.3485%2038.8609%2082.4862%2030.9879%2080.0978C23.1149%2077.7094%2016.1878%2072.9149%2011.1796%2066.3876C6.17126%2059.8603%203.33339%2051.9282%203.06452%2043.7053C2.79565%2035.4824%205.10927%2027.3818%209.68046%2020.5413C14.2516%2013.7008%2020.8507%208.46394%2028.5509%205.56634C36.251%202.66875%2044.6654%202.25594%2052.6122%204.38589'%20stroke='url(%23paint1_linear_0_74)'%20stroke-width='6.08696'%20stroke-linecap='round'/%3e%3c/g%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_0_74'%20x1='27.7771'%20y1='28.5159'%20x2='111.866'%20y2='17.1154'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23FF2D55'/%3e%3cstop%20offset='1'%20stop-color='%23FFBC5B'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_0_74'%20x1='0.562175'%20y1='42.4235'%20x2='139.458'%20y2='29.3377'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23FF2D55'/%3e%3cstop%20offset='1'%20stop-color='%23FFBC5B'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e",{colors:o,font:it,media:f,radius:F}=A,nt=n.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 24px;
+  padding: 24px 20px 80px;
+`,at=n.div`
+  /* Full width, so it lines up with the FAQ block below it rather than sitting narrower than everything
+     else on the page. */
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 24px;
+  padding: 16px;
+  border-radius: ${F.modal};
+  background: ${o.white};
+  text-align: center;
+`,st=n.span`
+  flex-shrink: 0;
+  width: 105px;
+  height: 105px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+
+  img {
+    width: 84.837px;
+    height: 84.837px;
+  }
+`,rt=n.div`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+  padding-bottom: 16px;
+  line-height: 1.6;
+  color: ${o.text};
+`,ot=n.h2`
+  margin: 0;
+  font-size: 20px;
+  font-weight: 700;
+`,dt=n.p`
+  margin: 0;
+  font-size: 16px;
+  font-weight: 400;
+`,lt=n.div`
+  width: 310px;
+  max-width: 100%;
+  padding-bottom: 16px;
+`,ct=n(P)`
+  width: 100%;
+  height: 56px;
+  border-radius: 12px;
+  font-size: 15px;
+  /* The variant sets 0.046em, which at 15px is 0.69px; the design asks for 0.46px flat. */
+  letter-spacing: 0.46px;
+  /* Filled FLAT with the accent here, not with the purple variant's amethyst gradient. Doubled ampersand
+     because the variant's own fill is an attribute selector, which outranks a plain declaration — and the
+     variant's hover overlay is that same accent, so it steps up a shade to still read as a hover. */
+  &&[data-variant='purple'] {
+    background: ${o.accent};
+  }
+
+  &:hover:not(:disabled)::before,
+  &:active:not(:disabled)::before {
+    background: ${o.accentHover};
+  }
+`,ee=n.div`
+  max-width: 1003px;
+  margin: 0 auto;
+  padding-bottom: 120px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  font-family: ${it.sans};
+`,pt=n.header`
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  padding: 10px 12px;
+`,ht=n.div`
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+`,gt=n.h2`
+  margin: 0;
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 24px;
+  letter-spacing: 0.46px;
+  color: ${o.white};
+`,xt=n.p`
+  margin: 0;
+  font-weight: 500;
+  font-size: 14px;
+  line-height: 1.334;
+  color: ${o.gray4};
+`,mt=n.a`
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  font-weight: 600;
+  font-size: 14px;
+  line-height: 30px;
+  text-decoration: underline;
+  color: ${o.white};
+
+  .ico {
+    width: 13px;
+    height: 13px;
+  }
+  &:focus-visible {
+    outline: 2px solid ${o.white};
+    outline-offset: 2px;
+  }
+`,te=n.hr`
+  width: 100%;
+  height: 0;
+  margin: 0;
+  border: 0;
+  border-top: 1px solid rgba(255, 255, 255, 0.25);
+`,ut=n.div`
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 12px;
+`,ft=n(Te)`
+  font-size: 14px;
+  line-height: 1.334;
+  color: ${o.text2};
+`,wt=n.span`
+  flex: none;
+  display: grid;
+  place-items: center;
+  width: 20px;
+  height: 20px;
+  border-radius: ${F.pill};
+  background: ${o.dclRed};
+  font-weight: 600;
+  font-size: 12px;
+  line-height: 1.6;
+  color: ${o.white};
+`,bt=n.div`
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+`,yt=n.label`
+  display: flex;
+  align-items: center;
+  align-self: flex-start;
+  font-size: 14px;
+  line-height: 1.2;
+  color: ${o.white};
+  cursor: pointer;
+`,ie=n.span`
+  flex: none;
+  display: grid;
+  place-items: center;
+  width: 40px;
+  height: 40px;
+
+  & input:checked,
+  & input[data-indeterminate='true'] {
+    background: ${o.dclRed};
+    border-color: ${o.dclRed};
+  }
+
+  &[data-tone='on-dark'] input {
+    background: transparent;
+    border-color: ${o.white};
+  }
+  &[data-tone='on-dark'] input:checked,
+  &[data-tone='on-dark'] input[data-indeterminate='true'] {
+    background: ${o.dclRed};
+    border-color: ${o.dclRed};
+  }
+  &[data-tone='on-dark'] input:focus-visible {
+    outline-color: ${o.white};
+  }
+`,vt=n.div`
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+`,jt=n.article`
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 12px;
+  row-gap: 8px;
+  padding: 12px 24px 12px 0;
+  border: 1px solid ${o.gray4};
+  border-radius: ${F.card};
+  background: ${o.white};
+  overflow: hidden;
+  transition: opacity 0.25s ease;
+`,kt=n.div`
+  flex: none;
+  display: flex;
+  align-items: center;
+
+  /* On a phone the design tops the checkbox against the thumbnail instead of centring it — the card is
+     three lines tall there, and a centred tick drifts away from the item it belongs to. */
+  ${f.maxWidth("mobile")} {
+    align-items: flex-start;
+  }
+`,$t=n.div`
+  flex: none;
+  display: grid;
+  place-items: center;
+  width: 74.289px;
+  height: 74px;
+  border-radius: 6.482px;
+  background: ${o.media};
+  overflow: hidden;
+
+  & img {
+    width: 61.57px;
+    height: 61.281px;
+    object-fit: contain;
+    filter: drop-shadow(0.303px 1.212px 1.516px rgba(0, 0, 0, 0.1));
+  }
+`,Ct=n.div`
+  /* Basis (not min-width) is what makes the price column wrap to its own line on a phone; min-width: 0
+     then lets the name ellipsize once it is on a line of its own. */
+  flex: 1 1 150px;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: 8px;
+  padding: 16px 8px;
+
+  /* A smaller basis on a phone, where the name and chips have to STAY beside the thumbnail: at 150px the
+     pair no longer fits the line on the narrowest handsets and the block dropped below the artwork. */
+  ${f.maxWidth("mobile")} {
+    flex-basis: 100px;
+  }
+`,It=n.div`
+  font-weight: 600;
+  font-size: 16px;
+  line-height: 1.2;
+  color: ${o.text};
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`,St=n.div`
+  display: flex;
+  align-items: flex-end;
+  gap: 4px;
+`,ne=n(me)`
+  padding: 1.623px 6.491px;
+  font-weight: 600;
+  font-size: 8.56px;
+  line-height: 11.851px;
+
+  /* Same padding as the rarity chip beside it — the design sets the category chip flush with it, and
+     only the narrower gender chip (which this row does not carry) gets the tighter inset. Restated
+     rather than inherited because the shared chip's own icon variant is a more specific selector. */
+  &[data-variant='icon'] {
+    padding: 1.623px 6.491px;
+  }
+  &[data-variant='icon'] .ico {
+    width: 14.605px;
+    height: 14.605px;
+  }
+`,Tt=n.div`
+  flex: none;
+  /* Right-aligns the block on the desktop row. */
+  margin-left: auto;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  justify-content: center;
+  gap: 4px;
+
+  /* The phone card gives the price a line of its own, running the full width of the row — but indented by
+     the checkbox slot, so it starts under the thumbnail rather than under the tick. */
+  ${f.maxWidth("mobile")} {
+    flex: 1 1 100%;
+    margin-left: 40px;
+    align-items: stretch;
+  }
+`,Lt=n.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  width: 144px;
+  height: 42px;
+  padding: 8px;
+  border: 0.5px solid ${o.muted2};
+  border-radius: ${F.btn};
+  background: ${o.panel};
+
+  /* The OUTLINED credit glyph, not the filled gradient mark: the filled one is right for a price you are
+     being shown, and this is a price you are typing. The design still draws it in the currency's own red
+     rather than in the input's ink, so the unit stays legible as a unit. 17px is the size it draws at. */
+  & .ico {
+    flex: 0 0 auto;
+    width: 17px;
+    height: 17px;
+    color: ${o.dclRed};
+  }
+  transition:
+    border-color 0.15s,
+    box-shadow 0.15s;
+
+  &:focus-within {
+    border-color: ${o.accent};
+    box-shadow: 0 0 0 3px ${o.rarityBg};
+  }
+
+  ${f.maxWidth("mobile")} {
+    width: 100%;
+  }
+`,zt=n.input`
+  flex: 1 1 auto;
+  min-width: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  font: inherit;
+  font-weight: 600;
+  font-size: 16px;
+  color: ${o.text};
+  text-align: right;
+  font-variant-numeric: tabular-nums;
+`,At=n.div`
+  display: flex;
+  align-items: baseline;
+  gap: 4px;
+  font-weight: 500;
+  font-size: 12px;
+  color: ${o.gray0};
+
+  /* Centred under the full-width field it converts, not parked at its right edge. */
+  ${f.maxWidth("mobile")} {
+    justify-content: center;
+  }
+`,Rt=n.span`
+  font-weight: 300;
+  font-size: 10px;
+  color: ${o.muted};
+`,Ft=n.div`
+  height: 101px;
+  border: 1px solid transparent;
+  border-radius: ${F.card};
+  background: linear-gradient(100deg, #ededed 30%, #f7f7f7 50%, #ededed 70%);
+  background-size: 200% 100%;
+  animation: shimmer 1.3s infinite linear;
+`,_t=n.div`
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 30;
+  background: ${o.white};
+  backdrop-filter: blur(12px);
+  border-top: 1px solid ${o.line};
+`,Et=n.div`
+  max-width: 1003px;
+  margin: 0 auto;
+  padding: 15px 20px;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+
+  /* On a phone the design stacks the bar: the summary line, then the cta across the full width. */
+  ${f.maxWidth("mobile")} {
+    flex-direction: column;
+    align-items: stretch;
+    padding: 12px 16px;
+    gap: 12px;
+  }
+`,Mt=n.div`
+  ${f.maxWidth("mobile")} {
+    display: flex;
+    flex-direction: row-reverse;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+  }
+`,Qt=n.div`
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-weight: 600;
+  font-size: 16px;
+  color: ${o.text};
+
+  & .ico {
+    width: 17px;
+    height: 17px;
+  }
+`,Pt=n.div`
+  font-size: 13px;
+  color: ${o.muted};
+`,Bt=n.span`
+  flex: 1 1 auto;
+
+  ${f.maxWidth("mobile")} {
+    display: none;
+  }
+`,qt=n(P)`
+  flex: none;
+  min-width: 260px;
+  padding: 13px 24px;
+
+  ${f.maxWidth("mobile")} {
+    min-width: 0;
+  }
+`,ae=n.div`
+  padding: 16px 12px 0;
+
+  /* The outlined dark rows, but NOT the credits page's centred 32px heading that ships with them: here
+     the section is one more block in the tool's left-aligned column, so the heading keeps the light
+     skin's size and alignment. The doubled ampersand is what outranks Faq's own tone selectors, which
+     Emotion inserts after this block (the Faq renders inside it). */
+  && [data-tone='on-dark'] {
+    align-items: stretch;
+  }
+  && [data-testid='faq-title'] {
+    font-size: 20px;
+    text-align: left;
+
+    ${f.maxWidth("mobile")} {
+      font-size: 18px;
+    }
+  }
+`,N=[5e3,15e3,35e3],se=[{question:"faq.sellers.whatAreQ",answer:"faq.sellers.whatAreA"},{question:"faq.sellers.whyCreditsQ",answer:"faq.sellers.whyCreditsA"},{question:"faq.sellers.receiveCreditsQ",answer:"faq.sellers.receiveCreditsA"},{question:"faq.sellers.changePriceQ",answer:"faq.sellers.changePriceA"},{question:"faq.sellers.mustSwitchQ",answer:"faq.sellers.mustSwitchA"},{question:"faq.sellers.suggestedPriceQ",answer:"faq.sellers.suggestedPriceA"}],Wt="https://docs.decentraland.org";function Nt(s){try{return ke(BigInt(s))}catch{return null}}function ii(){const{session:s}=ue(),d=fe(),{items:h,isLoading:I}=Se(),[B,y]=p.useState({}),[q,_]=p.useState(new Set),[x,E]=p.useState(null),l=p.useRef({timer:null,alive:!0,migrated:new Set});p.useEffect(()=>{const t=l.current;return t.alive=!0,()=>{t.alive=!1,t.timer&&clearTimeout(t.timer)}},[]),p.useEffect(()=>{h.length&&y(t=>{const i={...t};for(const r of h)i[r.oldTradeId]==null&&(i[r.oldTradeId]=r.suggestedCredits);return i})},[h]);const b=t=>!q.has(t),v=t=>B[t.oldTradeId]??t.suggestedCredits,w=h.filter(t=>b(t.oldTradeId)),S=w.reduce((t,i)=>t+v(i),0),j=h.length>0&&w.length===h.length,k=w.length>0&&!j;function M(t,i){const r=i.replace(/[^\d]/g,"");y(c=>({...c,[t]:r===""?0:parseInt(r,10)}))}function W(t){_(i=>{const r=new Set(i);return r.has(t)?r.delete(t):r.add(t),r})}function C(){_(j?new Set(h.map(t=>t.oldTradeId)):new Set)}function T(t){return t.map(i=>({item:i,priceCredits:Math.max(1,v(i))}))}function m(t){const i=(r=[])=>r.filter(c=>!t.has(c.oldTradeId));d.setQueriesData({queryKey:["importable"]},r=>r&&{creations:i(r.creations),owned:i(r.owned)})}function $(t){return d.getQueriesData({queryKey:["importable"]}).flatMap(([,i])=>[...(i==null?void 0:i.creations)??[],...(i==null?void 0:i.owned)??[]]).some(i=>t.has(i.oldTradeId))}function L(t){const i=l.current;i.timer&&clearTimeout(i.timer),i.timer=setTimeout(()=>{d.refetchQueries({queryKey:["importable"]}).then(()=>{if(i.alive){if(!$(i.migrated)||t+1>=N.length){i.migrated.clear();return}m(i.migrated),L(t+1)}})},N[t]-(N[t-1]??0))}function Q(t){if(t.failed===0&&t.cancelled===0&&t.listed>0&&(x!=null&&x.length)){const{migrated:i}=l.current;for(const r of x)i.add(r.item.oldTradeId);m(i),L(0)}else d.invalidateQueries({queryKey:["importable"]});d.invalidateQueries({queryKey:["shop-items"]}),d.invalidateQueries({queryKey:["catalog-items"]}),d.invalidateQueries({queryKey:["overview-listings"]}),d.invalidateQueries({queryKey:["upsell-listings"]}),d.invalidateQueries({queryKey:["my-assets"]}),d.invalidateQueries({queryKey:["collection-sale-state"]}),t.failed>0?Y.error(a(t.listed>0?"importListings.toastPartial":"importListings.toastFailed")):t.listed>0&&Y.success(a("importListings.toastUpdated"))}return!I&&h.length===0?e.jsxs(ee,{children:[e.jsx(nt,{"data-testid":"import-empty",children:e.jsxs(at,{children:[e.jsx(st,{"aria-hidden":!0,children:e.jsx("img",{src:tt,alt:"",width:85,height:85})}),e.jsxs(rt,{children:[e.jsx(ot,{children:a("importListings.emptyTitle")}),e.jsx(dt,{children:a("importListings.emptyBody")})]}),e.jsx(lt,{children:e.jsx(ct,{as:pe,to:re,variant:"purple",children:a("importListings.goToMyAssets")})})]})}),e.jsx(ae,{children:e.jsx(H,{title:"faq.title",entries:se,tone:"on-dark"})})]}):e.jsxs(ee,{children:[e.jsxs(pt,{children:[e.jsxs(ht,{children:[e.jsx(gt,{children:a("importListings.title")}),e.jsxs("div",{children:[e.jsx(xt,{children:a("importListings.lede",{currency:we(D.name)})}),e.jsxs(mt,{href:Wt,target:"_blank",rel:"noopener noreferrer",children:[a("importListings.learnMore"),e.jsx(G,{name:"external-link",className:"ico","aria-hidden":!0})]})]})]}),e.jsx(Le,{tone:"on-dark"})]}),e.jsx(te,{}),e.jsxs(ut,{children:[e.jsxs(ft,{"data-testid":"import-progress",children:[e.jsx(wt,{"data-testid":"import-count",children:h.length}),a("importListings.updatePricing")]}),e.jsxs(bt,{children:[e.jsxs(yt,{children:[e.jsx(ie,{"data-tone":"on-dark",children:e.jsx(V,{type:"checkbox",checked:j,ref:t=>{t&&(t.indeterminate=k)},"data-indeterminate":k,onChange:C,"data-testid":"import-select-all","aria-label":a("importListings.selectAllAria")})}),a("importListings.selectAll")]}),e.jsx(vt,{children:I?Array.from({length:4}).map((t,i)=>e.jsx(Ft,{},i)):h.map(t=>{const i=v(t),r=be({...t,wearableCategory:t.wearableCategory??void 0}),c=Nt(t.manaWei);return e.jsxs(jt,{"data-off":b(t.oldTradeId)?void 0:!0,children:[e.jsxs(kt,{children:[e.jsx(ie,{children:e.jsx(V,{type:"checkbox",checked:b(t.oldTradeId),onChange:()=>W(t.oldTradeId),"data-testid":"import-row-check","aria-label":a("importListings.includeItem",{name:t.name})})}),e.jsx($t,{children:t.thumbnail?e.jsx("img",{src:t.thumbnail,alt:""}):null})]}),e.jsxs(Ct,{children:[e.jsx(It,{title:t.name,children:t.name||a("importListings.itemFallback")}),e.jsxs(St,{children:[e.jsx(ne,{"data-variant":"rarity",style:{background:je(t.rarity),color:ve(t.rarity)},children:ye(t.rarity)}),r?e.jsx(ne,{"data-variant":"icon",children:e.jsx(G,{name:r,"aria-hidden":!0})}):null]})]}),e.jsxs(Tt,{children:[e.jsxs(Lt,{children:[e.jsx(O,{}),e.jsx(zt,{"data-testid":"imp-price-input",inputMode:"numeric",value:i.toLocaleString(),onChange:g=>M(t.oldTradeId,g.target.value),"aria-label":a("importListings.priceAria",{currency:D.name,name:t.name})})]}),e.jsxs(At,{children:[e.jsxs("span",{children:["$",K(i).toFixed(2)]}),c?e.jsx(Rt,{children:a("importListings.wasMana",{amount:c})}):null]})]})]},t.oldTradeId)})})]})]}),e.jsx(te,{}),e.jsx(ae,{children:e.jsx(H,{title:"faq.title",entries:se,tone:"on-dark"})}),e.jsx(_t,{children:e.jsxs(Et,{children:[e.jsxs(Mt,{children:[e.jsxs(Qt,{children:[e.jsx(O,{})," ",S.toLocaleString()]}),e.jsx(Pt,{children:a("importListings.selectedSummary",{count:w.length,usd:K(S).toFixed(2)})})]}),e.jsx(Bt,{}),e.jsx(qt,{variant:"red","data-testid":"import-list-all",disabled:w.length===0,onClick:()=>E(T(w)),children:a("importListings.listAll",{count:w.length})})]})}),x&&s?e.jsx(et,{queue:x,session:s,onClose:()=>E(null),onDone:Q}):null]})}export{ii as ImportListings};

package/_assets/{index-x3VfqdWM.js → index-Be2OPswD.js}

@@ -1,4 +1,4 @@
-import{w as k,i as W,b as v}from"./lit-element-B3y9oplH.js";import{n as y}from"./class-map-CxwNmq0D.js";import{c as I}from"./index-DgtAwbud.js";import"./index-Btabzvt2.js";import{Q as M}from"./browser-DxF-qILS.js";import{d as O,r as N}from"./index-CX3BY9Sg.js";const Q=.1,_=2.5,$=7;function x(t,a,d){return t===a?!1:(t-a<0?a-t:t-a)<=d+Q}function A(t,a){const d=Array.prototype.slice.call(M.create(t,{errorCorrectionLevel:a}).modules.data,0),l=Math.sqrt(d.length);return d.reduce((h,f,p)=>(p%l===0?h.push([f]):h[h.length-1].push(f))&&h,[])}const q={generate({uri:t,size:a,logoSize:d,padding:l=8,dotColor:h="var(--apkt-colors-black)"}){const p=[],u=A(t,"Q"),n=(a-2*l)/u.length,E=[{x:0,y:0},{x:1,y:0},{x:0,y:1}];E.forEach(({x:i,y:e})=>{const s=(u.length-$)*n*i+l,r=(u.length-$)*n*e+l,c=.45;for(let o=0;o<E.length;o+=1){const m=n*($-o*2);p.push(k`
+import{w as k,i as W,b as v}from"./lit-element-B3y9oplH.js";import{n as y}from"./class-map-CxwNmq0D.js";import{c as I}from"./index-C4Icjsra.js";import"./index-DjTkGsKb.js";import{Q as M}from"./browser-DxF-qILS.js";import{d as O,r as N}from"./index-jUk6xFSZ.js";const Q=.1,_=2.5,$=7;function x(t,a,d){return t===a?!1:(t-a<0?a-t:t-a)<=d+Q}function A(t,a){const d=Array.prototype.slice.call(M.create(t,{errorCorrectionLevel:a}).modules.data,0),l=Math.sqrt(d.length);return d.reduce((h,f,p)=>(p%l===0?h.push([f]):h[h.length-1].push(f))&&h,[])}const q={generate({uri:t,size:a,logoSize:d,padding:l=8,dotColor:h="var(--apkt-colors-black)"}){const p=[],u=A(t,"Q"),n=(a-2*l)/u.length,E=[{x:0,y:0},{x:1,y:0},{x:0,y:1}];E.forEach(({x:i,y:e})=>{const s=(u.length-$)*n*i+l,r=(u.length-$)*n*e+l,c=.45;for(let o=0;o<E.length;o+=1){const m=n*($-o*2);p.push(k`
             <rect
               fill=${o===2?"var(--apkt-colors-black)":"var(--apkt-colors-white)"}
               width=${o===0?m-10:m}