https://app.stoqui.com.br/assets/ProductCardsScreen-CUtSjj7S.js

1import{C as ae,j as e,a7 as o,B as $,o as k,ab as h,T as s,ae as Q,N as ce}from"./mui-CRsYZxVY.js";import{r as E}from"./vendor-Dwao9eNC.js";import{bJ as te,aw as Y,c$ as le,d as de,fg as me,b as he,e as xe,x as pe,C as ue,D as W}from"./index-TALscxEc.js";import{d as ge}from"./RadioButtonUnchecked-BJKJ-TId.js";import{S as fe}from"./SettingsScreenLayout-BWFwVJu5.js";import{u as be}from"./useWebCatalogSettingsSave-Byg91ItV.js";import{b as ve}from"./colorUtils-BVXQm18B.js";import{S as je}from"./SwatchChip-BfTakq5s.js";import{S as ye}from"./StarRating-DwFdQkkj.js";import{F as _e,S as ee,C as z}from"./appearanceTokens-DaF_sGil.js";import"./query-8ViTdhdk.js";import"./datePickers-BIJXYOKG.js";import"./icons-D8aatgQ4.js";import"./lab-DSem1Osk.js";import"./UnsavedChangesDialog-gqy_t4YT.js";(function(){try{var a=typeof window<"u"?window:typeof global<"u"?global:typeof globalThis<"u"?globalThis:typeof self<"u"?self:{};a.SENTRY_RELEASE={id:"2ad85febf9735404429b0670d4acf56a0af5a0a2"}}catch{}})();try{(function(){var a=typeof window<"u"?window:typeof global<"u"?global:typeof globalThis<"u"?globalThis:typeof self<"u"?self:{},t=new a.Error().stack;t&&(a._sentryDebugIds=a._sentryDebugIds||{},a._sentryDebugIds[t]="ccbe0e64-83db-421a-a833-675d34ad06c8",a._sentryDebugIdIdentifier="sentry-dbid-ccbe0e64-83db-421a-a833-675d34ad06c8")})()}catch{}const Ce="/assets/demo-fit-image-BQZmyXAt.jpg",Se=[{value:"cover",label:"Recortar",hint:"Bom para fotos com fundo branco"},{value:"contain",label:"Inteira",hint:"Bom para fotos lifestyle ou variadas"}],we=({fit:a})=>e.jsx(o,{sx:{width:"100%",aspectRatio:"1 / 1",bgcolor:t=>k(t.palette.text.primary,.04),borderRadius:1.25,overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx(o,{component:"img",src:Ce,alt:"",sx:{width:"100%",height:"100%",objectFit:a}})}),ke=({value:a,onChange:t,disabled:m=!1})=>{const n=ae().palette.primary.main;return e.jsx(o,{sx:{display:"grid",gridTemplateColumns:"1fr 1fr",gap:1.25,maxWidth:360},children:Se.map(i=>{const r=a===i.value;return e.jsxs($,{disabled:m,onClick:()=>t(i.value),focusRipple:!0,sx:{display:"block",textAlign:"left",p:1.25,borderRadius:1.5,border:"1px solid",borderColor:r?n:"divider",bgcolor:r?k(n,.06):"transparent",transition:"background-color 120ms ease, border-color 120ms ease",opacity:m?.6:1,"&:hover":{bgcolor:k(n,r?.1:.04)}},children:[e.jsx(we,{fit:i.value}),e.jsxs(h,{direction:"row",alignItems:"center",justifyContent:"space-between",spacing:.75,sx:{mt:1,px:.25},children:[e.jsx(s,{variant:"body2",sx:{fontWeight:600,color:r?n:"text.primary"},children:i.label}),r&&e.jsx(te,{sx:{fontSize:22,color:"primary.main"}})]}),e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block",mt:.25,px:.25,fontSize:"0.7rem",lineHeight:1.3},children:i.hint})]},i.value)})})},Ie=[{value:"nenhum",label:"Nenhuma",hint:"Mostra só a foto principal do produto."},{value:"cores",label:"Cores",hint:"Bolinhas com as cores das variações do produto."},{value:"fotos",label:"Fotos das variações",hint:"Miniaturas das fotos das variações; tocar troca a foto do card."}],Te=({value:a,onChange:t,disabled:m=!1})=>{const d=ae();return e.jsx(h,{spacing:1,children:Ie.map(n=>{const i=a===n.value;return e.jsxs($,{disabled:m,onClick:()=>t(n.value),focusRipple:!0,sx:{display:"flex",alignItems:"center",gap:1.25,p:1.25,borderRadius:1.5,bgcolor:i?k(d.palette.primary.main,.06):"transparent",border:"1px solid",borderColor:i?"primary.main":"divider",transition:"background-color 120ms ease, border-color 120ms ease",textAlign:"left",width:"100%",opacity:m?.6:1},children:[e.jsx(o,{sx:{display:"flex",color:i?"primary.main":"text.disabled"},children:i?e.jsx(te,{sx:{fontSize:20}}):e.jsx(ge,{sx:{fontSize:20}})}),e.jsxs(o,{sx:{minWidth:0,flex:1},children:[e.jsx(s,{sx:{fontWeight:600,fontSize:"0.9375rem",color:i?"primary.main":"text.primary"},children:n.label}),e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block",mt:.25,lineHeight:1.3},children:n.hint})]})]},n.value)})})},L=16,F=4,B=34,N=4,oe=a=>a.toLocaleString("pt-BR",{style:"currency",currency:"BRL"}),Ae=({imageUrl:a,name:t,price:m,fullPrice:d,sku:n,fit:i,showProductCode:r,brandColor:I,variacaoCardModo:T="nenhum",swatches:l,swatchTotal:p,variationImages:v,variationImagesTotal:A,ratingAverage:g,ratingCount:_})=>{const M=typeof _=="number"&&_>0&&typeof g=="number",R=T==="fotos",j=R?Array.from(new Set([a,...v??[]].filter(

1Boolean))):[a],[C,P]=E.useState(a),S=C&&j.includes(C)?C:a,c=S?Y(S,{width:400,height:400,resize:i}):null,u=(v==null?void 0:v.length)??0,f=Math.max(0,(A??u)-u),H=j.length+f,q=R&&H>=2,re=H<=N?Math.min(j.length,N):N-1,K=q?j.slice(0,re):[],U=H-K.length,X=T==="cores"&&!!l&&l.length>0,O=X&&typeof p=="number"&&p>l.length?p:(l==null?void 0:l.length)??0,se=X&&O>=2,ie=O<=F?Math.min((l==null?void 0:l.length)??0,F):F-1,Z=(l==null?void 0:l.slice(0,ie))??[],G=O-Z.length,ne=ve(I),D=typeof d=="number"&&d>0&&d>m,J=D?Math.round((d-m)/d*100):0;return e.jsxs(o,{children:[e.jsx(o,{sx:{position:"relative",width:"100%",paddingBottom:"100%",backgroundColor:"#ffffff",overflow:"hidden",border:i==="contain"?"1px solid":"none",borderColor:"rgba(0, 0, 0, 0.05)",borderRadius:1.5,cursor:"pointer",transition:"border-color 0.15s","&:hover":{borderColor:"rgba(0, 0, 0, 0.12)"},"&:hover img":{transform:"scale(1.015)"}},children:c?e.jsx(o,{component:"img",src:c,alt:"",sx:{position:"absolute",top:0,left:0,width:"100%",height:"100%",objectFit:i,transition:"transform 0.25s ease, object-fit 0.2s ease-in-out"}}):e.jsx(o,{sx:{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx(le,{size:36,color:"rgba(0,0,0,0.18)"})})}),q&&e.jsxs(h,{direction:"row",alignItems:"center",spacing:.75,sx:{mt:1,minHeight:B},children:[K.map(x=>{const w=x===S;return e.jsx($,{onClick:()=>P(x),"aria-label":w?"Foto selecionada":"Ver outra foto do produto","aria-pressed":w,sx:{width:B,height:B,borderRadius:1,overflow:"hidden",flexShrink:0,border:"2px solid",borderColor:w?"primary.main":"rgba(0, 0, 0, 0.15)",transition:"border-color 0.15s"},children:e.jsx(o,{component:"img",src:Y(x,{width:80,height:80}),alt:"",loading:"lazy",decoding:"async",sx:{width:"100%",height:"100%",objectFit:"cover",borderRadius:"6px"}})},x)}),U>0&&e.jsxs(o,{component:"span",sx:{height:B,display:"inline-flex",alignItems:"center",fontSize:"12px",fontWeight:600,color:"text.secondary",lineHeight:1,pl:.25},children:["+",U]})]}),se&&e.jsxs(h,{direction:"row",alignItems:"center",spacing:.5,sx:{mt:1,minHeight:L},children:[Z.map((x,w)=>e.jsx(je,{swatch:x.swatch,size:L},`${x.valor}-${w}`)),G>0&&e.jsxs(o,{component:"span",sx:{height:L,display:"inline-flex",alignItems:"center",fontSize:"12px",fontWeight:600,color:"text.secondary",lineHeight:1,pl:.25},children:["+",G]})]}),e.jsxs(o,{sx:{mt:1.5},children:[r&&n&&e.jsxs(s,{variant:"body2",sx:{fontSize:"11px",letterSpacing:"0.04em",color:"text.disabled",display:"block",mb:.5},children:["CÓD: ",n]}),e.jsx(s,{sx:{fontSize:"16px",lineHeight:1.3,overflow:"hidden",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",mb:1,fontWeight:500},children:t}),M&&e.jsxs(h,{direction:"row",spacing:.5,alignItems:"center",sx:{mt:-.5,mb:1},children:[e.jsx(ye,{value:g,readOnly:!0,size:13}),e.jsxs(s,{component:"span",sx:{fontSize:"12px",lineHeight:1,color:"text.secondary"},children:["(",_,")"]})]}),D&&e.jsxs(h,{direction:"row",alignItems:"center",gap:.5,children:[e.jsx(s,{variant:"body2",sx:{textDecoration:"line-through",color:"text.disabled",fontSize:"13px"},children:oe(d)}),J>0&&e.jsxs(o,{sx:{bgcolor:x=>k(x.palette.success.main,.14),color:"success.main",px:.75,py:"1px",borderRadius:"6px",fontSize:"11px",fontWeight:700,lineHeight:1.5},children:[J,"%"]})]}),e.jsx(s,{sx:{fontSize:"16px",fontWeight:700,letterSpacing:"-0.01em",color:ne,mt:D?.5:0},children:oe(m)})]})]})},b=(a,t)=>`${a}&hue=${t}`,V="https://images.unsplash.com/photo-1553062407-98eeb64c6a62?auto=format&fit=crop&w=400&q=80",y="https://images.unsplash.com/photo-1523275335684-37898b6baf30?auto=format&fit=crop&w=400&q=80",Re=[{id:"mock-1",imageUrl:V,name:"Mochila urbana de couro",price:459,fullPrice:null,sku:"MOC-CR-001",swatches:[{valor:"Caramelo",swatch:{kind:"solid",color:"#9C5B2E"}},{valor:"Preto",swatch:{kind:"solid",color:"#1C1C1C"}},{valor:"Areia",swatch:{kind:"solid",color:"#D8C3A5"}}],swatchTotal:3,variationImages:[b(V,210),b(V,330)],variationImagesTotal:2,ratingAverage:5,ratingCount:12},{id:"mock-2",imageUrl:y,name:"Relógio analógico minimalista",price:199.9,fullPrice:259.9,sku:"REL-MIN-08",swatches:[{valor:"Prata",swatch:{kind:"metallic",preset:"silver"}},{valor:"Dourado",swatch:{kind:"metallic",preset:"gold"}},{valor:"Preto",swatch:{kind:"solid",color:"#1C1C1C"}},{valor:"Azul",swatch:{kind:"solid",color:"#2F5FAA"}},{valor:"Verde",swatch:{kind:"solid",color:"#3E7C59"}},{valor:"Vinho",swatch:{kind:"solid",color:"#6E2436"}}],swatchTotal:8,variationImages:[b(y,180),b(y,60),b(y,300),b(y,240),b(y,120)],variationImagesTotal:5,ratingAverage:4,ratingCount:3}],We=({fit:a,showProductCode:t,variacaoCardModo:m,showRatings:d})=>{const{data:n}=de(),i=(n==null?void 0:n.cor_principal)||_e;return e.jsxs(o,{sx:{bgcolor:"grey.100",borderRadius:2,overflow:"hidden",maxWidth:400},children:[e.jsxs(h,{direction:"row",alignItems:"center",spacing:.75,sx:{px:1.5,py:1,bgcolor:"white",borderBottom:"1px solid",borderColor:"divider"},children:[e.jsx(me,{size:14,color:"rgba(0,0,0,0.5)"}),e.jsx(s,{variant:"caption",sx:{fontWeight:600,color:"text.secondary"},children:"Prévia da página inicial"})]}),e.jsx(o,{sx:{px:2,py:2.5},children:e.jsx(o,{sx:{display:"grid",gridTemplateColumns:"1fr 1fr",columnGap:1.5,rowGap:3},children:Re.map(r=>e.jsx(Ae,{imageUrl:r.imageUrl,name:r.name,price:r.price,fullPrice:r.fullPrice,sku:r.sku,fit:a,showProductCode:t,brandColor:i,variacaoCardModo:m,swatches:r.swatches,swatchTotal:r.swatchTotal,variationImages:r.variationImages,variationImagesTotal:r.variationImagesTotal,ratingAverage:d?r.ratingAverage:null,ratingCount:d?r.ratingCount:null},r.id))})})]})},Ue=()=>{const a=he(),{catalog:t,isLoading:m,save:d}=be(),{data:n}=xe(),i=pe(n)&&!!(t!=null&&t.avaliacoes_habilitadas),[r,I]=E.useState(!1),[T,l]=E.useState(null),{control:p,handleSubmit:v,reset:A,watch:g,formState:{isDirty:_}}=ue({defaultValues:{imagem_produto_fit:"contain",mostrar_codigo_produto_card:!1,variacao_card_modo:"nenhum",avaliacoes_mostrar_nos_produtos:!1}

1}),M=t==null?void 0:t.id;E.useEffect(()=>{t&&A({imagem_produto_fit:t.imagem_produto_fit||"contain",mostrar_codigo_produto_card:!!t.mostrar_codigo_produto_card,variacao_card_modo:t.variacao_card_modo??"nenhum",avaliacoes_mostrar_nos_produtos:!!t.avaliacoes_mostrar_nos_produtos})},[M]);const R=g("imagem_produto_fit"),j=g("mostrar_codigo_produto_card"),C=g("variacao_card_modo"),P=g("avaliacoes_mostrar_nos_produtos"),S=()=>new Promise((c,u)=>{v(async f=>{l(null),I(!0);try{await d({imagem_produto_fit:f.imagem_produto_fit,mostrar_codigo_produto_card:f.mostrar_codigo_produto_card,variacao_card_modo:f.variacao_card_modo,avaliacoes_mostrar_nos_produtos:f.avaliacoes_mostrar_nos_produtos},"appearance_product_cards"),A(f),c()}catch{l("Não foi possível salvar. Tente novamente."),u(new Error("save failed"))}finally{I(!1)}})()});return e.jsx(fe,{title:"Cards dos produtos",isLoading:m,isDirty:_,isSaving:r,onSave:S,saveError:T,children:e.jsxs(h,{direction:{xs:"column",md:"row"},spacing:{xs:3,md:4},alignItems:"flex-start",children:[e.jsxs(o,{sx:{width:"100%",flex:{md:1},minWidth:0},children:[e.jsx(s,{sx:ee,children:"Ajustes"}),e.jsxs(h,{spacing:1.5,children:[e.jsx(o,{sx:z,children:e.jsxs(h,{spacing:1.5,children:[e.jsxs(o,{children:[e.jsx(s,{variant:"body1",sx:{fontWeight:600},children:"Tamanho da imagem"}),e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block",mt:.25},children:"Como a foto se ajusta ao card quadrado."})]}),e.jsx(W,{name:"imagem_produto_fit",control:p,render:({field:c})=>e.jsx(ke,{value:c.value,onChange:c.onChange,disabled:r})})]})}),e.jsx(o,{sx:z,children:e.jsxs(h,{direction:"row",alignItems:"flex-start",justifyContent:"space-between",spacing:1.5,children:[e.jsxs(o,{sx:{flex:1},children:[e.jsx(s,{variant:"body1",sx:{fontWeight:600},children:"Mostrar código do produto"}),e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block",mt:.25},children:"Exibe o SKU acima do nome. Útil para catálogos com muitas referências."})]}),e.jsx(W,{name:"mostrar_codigo_produto_card",control:p,render:({field:c})=>e.jsx(Q,{checked:c.value,onChange:u=>c.onChange(u.target.checked),disabled:r})})]})}),e.jsx(o,{sx:z,children:e.jsxs(h,{spacing:1.5,children:[e.jsxs(o,{children:[e.jsx(s,{variant:"body1",sx:{fontWeight:600},children:"Variações no card"}),e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block",mt:.25},children:"Mostre as variações do produto direto no card, em bolinhas de cor ou em miniaturas de foto."})]}),e.jsx(W,{name:"variacao_card_modo",control:p,render:({field:c})=>e.jsx(Te,{value:c.value,onChange:c.onChange,disabled:r})})]})}),e.jsx(o,{sx:z,children:e.jsxs(h,{direction:"row",alignItems:"flex-start",justifyContent:"space-between",spacing:1.5,children:[e.jsxs(o,{sx:{flex:1},children:[e.jsx(s,{variant:"body1",sx:{fontWeight:600},children:"Mostrar estrelas de avaliação"}),e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block",mt:.25},children:"Exibe a nota média e o total de avaliações abaixo do nome. Produtos sem avaliações aprovadas não mostram nada."}),!i&&e.jsxs(o,{sx:{mt:1},children:[e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block"},children:"As avaliações da loja estão desativadas, então as estrelas não aparecem por enquanto."}),e.jsx(ce,{size:"small",onClick:()=>a("/reviews/settings"),sx:{mt:.5,ml:-1},children:"Ativar avaliações"})]})]}),e.jsx(W,{name:"avaliacoes_mostrar_nos_produtos",control:p,render:({field:c})=>e.jsx(Q,{checked:c.value,onChange:u=>c.onChange(u.target.checked),disabled:r})})]})})]})]}),e.jsxs(o,{sx:{width:"100%",flex:{md:1},minWidth:0,position:{md:"sticky"},top:{md:16}},children:[e.jsx(s,{sx:ee,children:"Prévia"}),e.jsx(We,{fit:R,showProductCode:j,variacaoCardModo:C,showRatings:P&&i}),e.jsx(s,{variant:"caption",color:"text.secondary",sx:{display:"block",mt:1,px:.5},children:"As mudanças aparecem aqui em tempo real."})]})]})})};export{Ue as default};