https://www.growthconf.com.br/assets/VitrineDoAssistir-DDcnVKOh.js

1import{r as i,j as e}from"./react-daO8XSXc.js";import{B as L}from"./Button-8-UveMcL.js";import{c as w}from"./Escolhas-BH21sbXZ.js";import{E as b}from"./EmptyState-DyDBtv_o.js";import{A as f,F as q}from"./AutorDaMensagem-P2wi7Pkm.js";import{C as x,B as h,a as F}from"./Comentario-B-3557nA.js";import{C as O}from"./CaixaDoChat-DqX6SCt_.js";import{C as z,a as T,b as B}from"./CardDeRanking-D9risSjb.js";import{C as V,a as $}from"./CardDeColecao-DyxJ9F55.js";import{C as P,a as S}from"./CardDeConteudo-DM1Ku_Hg.js";import{C as A}from"./ChipAoVivo-BR9xFV77.js";import{C as _,a as I}from"./CirculoDeExpert-BJo28qcq.js";import{L as R,a as U}from"./LinhaDeConteudo-CAifVGDN.js";import{T as p}from"./Trilho--rViPMJh.js";import{a as W}from"./carregarExemplo-BcwMFVMO.js";import{h as H}from"./formatosDoAssistir-DMtKHOyc.js";import{F as Q}from"./XMarkIcon-BbNpXEGa.js";import{F as Z}from"./ArrowTopRightOnSquareIcon-BzmiEPyI.js";import{F as G}from"./PlayCircleIcon-f-RZr5YV.js";import"./basicos-CJBwiWJx.js";import"./index-B58ZFblL.js";import"./supabase-CWGMQrOR.js";import"./framer-CJI0BPWU.js";import"./lucide-DgiROqw5.js";import"./index-Bx8Owg57.js";import"./index-BSdpKbQ6.js";import"./index-Be0SzB96.js";import"./aoVivo.pt-n7LDFWH-.js";import"./Avatar-MiXW_CSz.js";import"./iniciais-brqoj07o.js";import"./UserIcon-CXi3wo9O.js";import"./CheckBadgeIcon-CAnmg9ho.js";import"./Skeleton-DB-ilhXe.js";import"./MenuDeAcoes-rMG9Gjg3.js";import"./DropdownMenu-54rCGvm0.js";import"./index-BkA-a7YQ.js";import"./index-C2a1wRcO.js";import"./useMenosMovimento-QKuRP1q4.js";import"./Input-BWXNKslz.js";import"./ChevronDownIcon-C1xiHESR.js";import"./traducaoService-DuRCLS-G.js";import"./BarraDeProgresso-CFMNbttH.js";import"./evento-_qg0cpiw.js";import"./contagem-DU2ULy9R.js";import"./estilos-DgSpzT3f.js";import"./ChevronLeftIcon-B0VLUa4f.js";import"./ChevronRightIcon-CD0fb681.js";import"./Capa-B-c4iIgH.js";import"./LockClosedIcon-DWPW8gUs.js";import"./LogoDaEmpresa-DSr9CmB1.js";import"./modalidades-CUNE9lCl.js";function J({title:a,titleId:s,...r},t){return i.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor","aria-hidden":"true","data-slot":"icon",ref:t,"aria-labelledby":s},r),a?i.createElement("title",{id:s},a):null,i.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 20.25c4.97 0 9-3.694 9-8.25s-4.03-8.25-9-8.25S3 7.444 3 12c0 2.104.859 4.023 2.273 5.48.432.447.74 1.04.586 1.641a4.483 4.483 0 0 1-.923 1.785A5.969 5.969 0 0 0 6 21c1.282 0 2.47-.402 3.445-1.087.81.22 1.668.337 2.555.337Z"}))}const y=i.forwardRef(J);function K({title:a,titleId:s,...r},t){return i.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor","aria-hidden":"true","data-slot":"icon",ref:t,"aria-labelledby":s},r),a?i.createElement("title",{id:s},a):null,i.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"m4.5 12.75 6 6 9-13.5"}))}const X=i.forwardRef(K);function d({titulo:a,descricao:s,children:r}){return e.jsxs("div",{className:"border-t border-painel-linha pt-6",children:[e.jsx("h3",{className:"font-mono text-[13px] font-medium text-painel-texto",children:a}),s&&e.jsx("p",{className:"mt-1 max-w-2xl text-[13px] text-painel-texto-2",children:s}),e.jsx("div",{className:"mt-4",children:r})]})}function l({children:a}){return e.jsx("p",{className:"mb-2 text-[11px] font-semibold uppercase tracking-[0.14em] text-painel-texto-3",children:a})}const Y=[{id:"remover",rotulo:"Remover da fila",icone:Q,aoEscolher:()=>{}},{id:"assistido",rotulo:"Marcar como assistido",icone:X,aoEscolher:()=>{}},{id:"colecao",rotulo:"Ir para a coleção",icone:Z,aoEscolher:()=>{}}],ee=[{id:"denunciar",rotulo:"Denunciar",icone:q,perigo:!0,aoEscolher:()=>{}}],k=(a,s)=>a.map(r=>r.id===s?{...r,curtidoPorMim:!r.curtidoPorMim,curtidas:r.curtidas+(r.curtidoPorMim?-1:1)}:{...r,respostas:r.respostas&&k(r.respostas,s)});function ae({exemplo:a}){const[s,r]=i.useState(a.comentarios),t=new Date(a.agora);return e.jsx("div",{className:"max-w-2xl space-y-6",children:s.map(n=>e.jsx(F,{comentario:n,agora:t,aoCurtir:c=>r(o=>k(o,c)),aoResponder:()=>{},acoesDe:()=>ee},n.id))})}function oe({exemplo:a}){const[s,r]=i.useState(a.reacoes),t=n=>r(c=>c.map(o=>o.id===n?{...o,minha:!o.minha,contagem:o.contagem+(o.minha?-1:1)}:o));return e.jsx(h,{reacoes:s,aoReagir:t})}const re=[{valor:"aberto",rotulo:"Aberto"},{valor:"lento",rotulo:"Lento"},{valor:"fechado",rotulo:"Fechado"},{valor:"silenciado",rotulo:"Silenciado"},{valor:"reconectando",rotulo:"Reconectando"}];function se({exemplo:a}){const[s,r]=i.useState(a.mensagens),[t,n]=i.useState("aberto"),[c,o]=i.useState("normal"),[m,v]=i.useState(0);i.useEffect(()=>{if(m<=0)return;const u=setTimeout(()=>v(j=>j-1),1e3);return()=>clearTimeout(u)},[m]);const[M,...C]=a.autores,D=(u,j)=>r(g=>{var N;const E=new Date(((N=g.at(-1))==null?void 0:N.enviadaEm)??a.agora);return[...g,{id:`mensagem-${g.length+1}-${E.getTime()}

1`,autor:u,enviadaEm:new Date(E.getTime()+6e4).toISOString(),texto:j}]});return e.jsxs("div",{className:"space-y-3",children:[e.jsxs("div",{className:"flex flex-wrap items-center gap-2",children:[e.jsx(w,{rotulo:"Estado do chat",className:"flex-wrap",opcoes:re,valor:t,aoMudar:u=>n(u)}),e.jsx(w,{rotulo:"Mensagens",opcoes:[{valor:"normal",rotulo:"Com mensagens"},{valor:"vazio",rotulo:"Vazio"},{valor:"carregando",rotulo:"Carregando"}],valor:c,aoMudar:o}),e.jsxs(L,{variant:"secondary",size:"sm",onClick:()=>D(C[s.length%C.length],a.mensagemQueChega),children:[e.jsx(y,{"aria-hidden":!0}),"Receber mensagem"]})]}),e.jsx("p",{className:"text-[13px] text-painel-texto-3",children:"Role a lista para cima e receba uma mensagem: a lista fica onde está e aparece o aviso."}),e.jsx("div",{className:"h-[28rem] max-w-sm overflow-hidden rounded-cartao border border-painel-linha bg-painel-superficie",children:e.jsx(O,{className:"h-full",mensagens:c==="vazio"?[]:s,carregando:c==="carregando",estado:t,aguardarS:t==="lento"?m:0,intervaloS:10,aoEnviar:u=>{D(M,u),t==="lento"&&v(10)}})})]})}function oa(){const[a,s]=i.useState(null),[r,t]=i.useState(!1);i.useEffect(()=>{let o=!0;return W().then(m=>{o&&(s(m),t(!0))}),()=>{o=!1}},[]);const n=!a,c=a==null?void 0:a.experts[0];return e.jsxs("div",{className:"space-y-8",children:[!1,e.jsx(d,{titulo:"CapaEmSlides",descricao:"A capa do topo: 4:5 no celular, 16:9 no meio e 3:1 no computador. Passa sozinha a cada 7 s e para com o mouse em cima, com o foco dentro ou na pausa.",children:e.jsx(z,{slides:(a==null?void 0:a.slides)??[],carregando:n})}),e.jsx(d,{titulo:"Trilho + CardDeConteudo",descricao:"Setas do teclado andam de card em card; as de clique andam uma página. Os cards: com progresso, NOVO, AO VIVO, trancado e com o menu.",children:e.jsxs("div",{className:"space-y-8",children:[e.jsx(p,{titulo:"Continue assistindo",href:"#assistir",largura:"conteudo",carregando:n,esqueleto:e.jsx(S,{}),children:a==null?void 0:a.conteudos.map(o=>e.jsx(P,{conteudo:o,acoes:Y},o.id))}),e.jsxs("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-2",children:[e.jsxs("div",{children:[e.jsx(l,{children:"Carregando"}),e.jsx(p,{titulo:"Continue assistindo",largura:"conteudo",carregando:!0,esqueleto:e.jsx(S,{})})]}),e.jsxs("div",{children:[e.jsx(l,{children:"Vazio"}),e.jsx(p,{titulo:"Minha lista",largura:"conteudo",vazio:e.jsx(b,{icone:G,titulo:"Nada salvo ainda",descricao:"O que você salvar aparece aqui.",className:"py-8"})})]})]})]})}),e.jsx(d,{titulo:"CardDeColecao",descricao:'As nove edições. A 9ª ainda não tem vídeo: a linha de números some, e nunca aparece "0 vídeos".',children:e.jsx(p,{titulo:"Edições",href:"#assistir",largura:"colecao",carregando:n,esqueleto:e.jsx($,{}),children:a==null?void 0:a.colecoes.map(o=>e.jsx(V,{colecao:o},o.id))})}),e.jsx(d,{titulo:"CirculoDeExpert",descricao:"Foto, nome e a logo da empresa. Sem logo, a empresa em texto; sem foto, as iniciais.",children:e.jsx(p,{titulo:"Experts",href:"#assistir",largura:"expert",carregando:n,esqueleto:e.jsx(I,{}),children:a==null?void 0:a.experts.map(o=>e.jsx(_,{expert:o},o.id))})}),e.jsx(d,{titulo:"CardDeRanking",descricao:"O número da posição, grande, à esquerda do card.",children:e.jsx(p,{titulo:"Mais assistidos",largura:"ranking",carregando:n,esqueleto:e.jsx(B,{}),children:a==null?void 0:a.conteudos.slice(0,5).map((o,m)=>e.jsx(T,{posicao:m+1,conteudo:o},o.id))})}),e.jsx(d,{titulo:"ChipAoVivo",descricao:"O ponto pulsa, e para com “reduzir movimento”. O compacto é o do item Assistir no menu; o ponto, o da lateral recolhida; o parado, o do player.",children:e.jsxs("div",{className:"flex flex-wrap items-center gap-6",children:[["normal","solido","compacto","ponto"].map(o=>e.jsxs("div",{children:[e.jsx(l,{children:o}),e.jsx(A,{variante:o})]},o)),e.jsxs("div",{children:[e.jsx(l,{children:"parado"}),e.jsx(A,{pulsa:!1})]})]})}),e.jsx(d,{titulo:"LinhaDeConteudo",descricao:"A lista da coleção e os relacionados. A marcada é a que está tocando.",children:e.jsxs("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-2",children:[e.jsx("div",{className:"space-y-1",children:n?[0,1,2].map(o=>e.jsx(R,{},o)):a.linhas.map((o,m)=>e.jsx(U,{conteudo:o,numero:m+1,ativo:m===1},o.id))}),e.jsxs("div",{children:[e.jsx(l,{children:"Carregando"}),[0,1,2].map(o=>e.jsx(R,{},o))]})]})}),e.jsx(d,{titulo:"Comentario",descricao:"Curtir com a contagem, responder e o menu. A resposta de uma resposta fica no mesmo recuo.",children:e.jsxs("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-2",children:[a?e.jsx(ae,{exemplo:a}):e.jsxs("div",{className:"space-y-6",children:[e.jsx(x,{}),e.jsx(x,{})]}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{children:[e.jsx(l,{children:"Carregando"}),e.jsx(x,{})]}),e.jsxs("div",{children:[e.jsx(l,{children:"Vazio"}),e.jsx(b,{icone:y,titulo:"Nenhum comentário ainda",className:"py-8"})]})]})]})}),e.jsx(d,{titulo:"CaixaDoChat",descricao:"Presa ao fim até a pessoa rolar para cima. Enter envia; Shift+Enter quebra a linha; limite de 500. A lista não é anunciada mensagem a mensagem.",children:a?e.jsx(se,{exemplo:a}):e.jsx("div",{className:"h-[28rem] max-w-sm overflow-hidden rounded-cartao border border-painel-linha bg-painel-superficie",children:e.jsx(O,{className:"h-full",mensagens:[],carregando:!0,estado:"aberto",aoEnviar:()=>{}})})}),e.jsx(d,{titulo:"BarraDeReacoes",descricao:"A minha fica marcada. O emoji cresce um pouco no toque — e não cresce com “reduzir movimento”.",children:e.jsxs("div",{className:"space-y-5",children:[a?e.jsx(oe,{exemplo:a}):e.jsx(h,{reacoes:[],carregando:!0}),e.jsxs("div",{children:[e.jsx(l,{children:"Só mostrar (sem poder reagir)"}),e.jsx(h,{reacoes:(a==null?void 0:a.reacoes)??[],carregando:n})]}),e.jsxs("div",{children:[e.jsx(l,{children:"Carregando"}),e.jsx(h,{reacoes:[],carregando:!0})]})]})}),e.jsx(d,{titulo:"AutorDaMensagem",descricao:"No chat, cargo e empresa na linha do nome; no comentário, embaixo. Sem foto, as iniciais.",children:a&&c?e.jsxs("div",{className:"grid max-w-3xl grid-cols-1 gap-6 sm:grid-cols-2",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsx(l,{children:"Chat"}),a.autores.slice(0,3).map(o=>e.jsx(f,{autor:o,aoLado:H(a.agora)},o.id))]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(l,{children:"Comentário"}

1),e.jsx(f,{tamanho:"comentario",autor:{id:c.id,nome:c.nome,fotoUrl:c.fotoUrl,empresa:c.empresa,expert:!0},aoLado:"há 2 h"}),e.jsx(f,{tamanho:"comentario",autor:a.autores[3],aoLado:"há 3 dias"})]})]}):e.jsx("div",{className:"max-w-sm space-y-3",children:e.jsx(x,{})})})]})}export{oa as default};