@gyramais/gyra-design 0.2.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,2 @@
1
+ "use client";import t from"react";const e="#1256FF",n="#7C4EFF",i="#6635E0",r="#F5F5F7",l="#FFFFFF",o="#1D1D1F",a="#636366",p="#8E8E93",d="#D2D2D7",s="#E8E8ED",g="#F6F4FF",c="rgba(124,78,255,0.22)",x={ok:{bg:"#E8F9ED",color:"#1A7D37"},warn:{bg:"#FFF4E0",color:"#946200"},danger:{bg:"#FFEDEC",color:"#C93430"},info:{bg:"#EBF4FF",color:"#0055D4"}},h="'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif",m=t=>String(t??"").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;");function f(t){const n="primary"===(t.variant??"primary"),i=n?"#FFFFFF":e;return`\n <table role="presentation" cellpadding="0" cellspacing="0" style="margin:8px 8px 0 0;display:inline-block;">\n <tr>\n <td style="border-radius:10px;background:${n?e:l};border:1px solid ${n?e:d};">\n <a href="${m(function(t){try{const e=new URL(String(t));return"http:"===e.protocol||"https:"===e.protocol?e.href:"#"}catch{return"#"}}(t.url))}" target="_blank"\n style="display:inline-block;padding:12px 22px;font-family:${h};font-size:14px;font-weight:600;color:${i};text-decoration:none;border-radius:10px;">\n ${m(t.label)}\n </a>\n </td>\n </tr>\n </table>`}function b(t){const{preheader:e,greeting:d,title:b,paragraphs:$=[],highlights:y=[],aiParecer:u,buttons:F=[],footerNote:w}=t,v=y.length?Math.floor(100/y.length):100,E=y.length?`<table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="margin:8px 0 4px;"><tr>${y.map(t=>function(t,e){return`\n <td width="${e}%" style="padding:6px;" valign="top">\n <table role="presentation" width="100%" cellpadding="0" cellspacing="0"\n style="background:#FAFAFA;border:1px solid ${s};border-radius:12px;">\n <tr><td style="padding:14px 16px;font-family:${h};">\n <div style="font-size:12px;color:${a};margin-bottom:4px;">${m(t.label)}</div>\n <div style="font-size:22px;font-weight:700;color:${t.color||o};font-family:'Lexend',${h};">${m(t.value)}</div>\n </td></tr>\n </table>\n </td>`}(t,v)).join("")}</tr></table>`:"",k=$.map(t=>`<p style="margin:0 0 14px;font-family:${h};font-size:15px;line-height:1.6;color:${a};">${m(t)}</p>`).join(""),z=F.length?`<div style="margin-top:18px;">${F.map(f).join("")}</div>`:"";return`<!DOCTYPE html>\n<html lang="pt-BR">\n<head>\n <meta charset="utf-8" />\n <meta name="viewport" content="width=device-width,initial-scale=1.0" />\n <meta http-equiv="X-UA-Compatible" content="IE=edge" />\n <title>${m(b)}</title>\n</head>\n<body style="margin:0;padding:0;background:${r};">\n ${e?`<div style="display:none;max-height:0;overflow:hidden;opacity:0;">${m(e)}</div>`:""}\n <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background:${r};padding:24px 0;">\n <tr>\n <td align="center">\n <table role="presentation" width="600" cellpadding="0" cellspacing="0" style="width:600px;max-width:92%;">\n <tr>\n <td style="padding:8px 4px 20px;">\n <img src="https://gyra-file-prod.s3.us-west-2.amazonaws.com/assets/gyra-logo-color.png" alt="GYRA+" height="30" style="height:30px;display:block;" />\n </td>\n </tr>\n <tr>\n <td style="background:${l};border:1px solid ${s};border-radius:16px;padding:32px;">\n ${d?`<p style="margin:0 0 6px;font-family:${h};font-size:14px;color:${a};">${m(d)}</p>`:""}\n <h1 style="margin:0 0 18px;font-family:'Lexend',${h};font-size:23px;line-height:1.3;color:${o};">${m(b)}</h1>\n ${k}\n ${E}\n ${u?function(t){const e=t.verdict?(()=>{const e=x[t.verdictTone||"info"];return`<table role="presentation" cellpadding="0" cellspacing="0" style="display:inline-block;"><tr>\n <td style="background:${e.bg};border-radius:999px;padding:4px 10px;font-family:${h};font-size:11px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:${e.color};white-space:nowrap;">${m(t.verdict)}</td></tr></table>`})():"";return`\n <table role="presentation" width="100%" cellpadding="0" cellspacing="0"\n style="margin:18px 0 4px;background:${g};border:1px solid ${c};border-radius:12px;">\n <tr><td style="padding:16px 18px;font-family:${h};">\n <table role="presentation" width="100%" cellpadding="0" cellspacing="0"><tr>\n <td valign="middle" width="28">\n <div style="width:22px;height:22px;border-radius:50%;background:${n};color:#fff;text-align:center;line-height:22px;font-size:13px;">&#10022;</div>\n </td>\n <td valign="middle" style="padding-left:8px;">\n <span style="font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:${i};">Parecer GYRA+IA</span>\n </td>\n <td valign="middle" align="right">${e}</td>\n </tr></table>\n <p style="margin:10px 0 0;font-size:14px;line-height:1.55;color:${a};">${m(t.text)}</p>\n ${t.footer?`<div style="margin-top:10px;padding-top:10px;border-top:1px dashed ${c};font-size:11px;color:${p};">${m(t.footer)}</div>`:""}\n </td></tr>\n </table>`}(u):""}\n ${z}\n </td>\n </tr>\n <tr>\n <td style="padding:20px 8px;font-family:${h};font-size:12px;line-height:1.5;color:${p};">\n ${w?`<p style="margin:0 0 8px;">${m(w)}</p>`:""}\n <p style="margin:0;">GYRA+ • Esta é uma mensagem automática, não responda este email.</p>\n </td>\n </tr>\n </table>\n </td>\n </tr>\n </table>\n</body>\n</html>`}const $=({width:e=700,height:n=1e3,...i})=>{const r=b(i);return t.createElement("iframe",{title:`Email preview — ${i.title}`,srcDoc:r,sandbox:"",style:{width:"number"==typeof e?`${e}px`:e,height:"number"==typeof n?`${n}px`:n,border:"1px solid #E8E8ED",borderRadius:8,background:"#F5F5F7"}})};export{$ as Email,$ as default};
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../../src/emails/email/index.ts","../../../src/components/Email/Email.tsx"],"sourcesContent":["/**\n * Email transacional genérico — Gyra+ design system.\n *\n * **FONTE DA VERDADE** dos layouts de email transacional. Usado por\n * qualquer fluxo que precise mandar email no padrão visual Gyra+:\n * - reset de senha, confirmação de cadastro, alertas internos\n * - finalização de processamento (Finsights, batch-report, etc)\n * - notificações de operação/crédito\n * - convites, mudança de plano, alerts de billing...\n *\n * **TS puro**: sem React, sem DOM, sem browser globals. Apenas funções que\n * retornam string HTML. Funciona igual em qualquer runtime Node (Nest) ou\n * bundle browser (Next).\n *\n * **Email-safe**: tabelas + inline-style (clients ignoram <style> externo,\n * flexbox e Material Symbols). Gradientes têm fallback sólido.\n *\n * Tokens visuais alinhados com gyra-design: azul #1256FF (acao/primary),\n * roxo #7C4EFF (IA/parecer), neutrals Apple-gray, fonte Inter.\n *\n * **Como usar:**\n * ```ts\n * import { buildEmail } from '@gyramais/gyra-design/dist/emails/email';\n *\n * const html = buildEmail({\n * preheader: 'Senha redefinida com sucesso',\n * greeting: 'Olá, Maria',\n * title: 'Sua senha foi redefinida',\n * paragraphs: ['Tudo certo. Você já pode entrar com a nova senha.'],\n * buttons: [{ label: 'Entrar', url: 'https://app.gyramais.com/login' }],\n * footerNote: 'Se não foi você, redefina novamente clicando em \"Esqueci minha senha\".',\n * });\n * ```\n *\n * Pra emails recorrentes (mesmo conteudo, payload variavel), criar um\n * **preset** em `src/emails/<preset-name>/index.ts` que monta o\n * `EmailLayoutInput` a partir de campos de dominio e delega aqui. Ver\n * `balance-sheet-finalized` como exemplo.\n */\n\n// ── Tipos publicos ─────────────────────────────────────────────────────────\n\nexport type EmailButton = {\n label: string;\n url: string;\n /** primary = botão azul preenchido, secondary = outline. Default primary. */\n variant?: 'primary' | 'secondary';\n};\n\nexport type EmailHighlight = {\n /** label pequeno em cima (ex: \"Score\", \"Nivel de risco\"). */\n label: string;\n /** valor grande em baixo (ex: \"820\", \"Baixo\"). */\n value: string;\n /** cor do valor (ex: cor do risco). Default: tinta padrao Apple-gray. */\n color?: string;\n};\n\n/** Tom semantico do chip de veredito do bloco Parecer GYRA+IA. */\nexport type AiParecerTone = 'ok' | 'warn' | 'danger' | 'info';\n\nexport type EmailAiParecer = {\n /** chip de veredito (ex: \"Médio\", \"Consistente\"). Opcional. */\n verdict?: string;\n verdictTone?: AiParecerTone;\n /** corpo do parecer. */\n text: string;\n /** rodape do bloco (ex: \"GYRA+IA · Confiança 96%\"). Opcional. */\n footer?: string;\n};\n\nexport type EmailLayoutInput = {\n /** Texto invisivel no preheader (preview no inbox). */\n preheader?: string;\n /** Linha curta acima do titulo (ex: \"Olá, Maria\"). */\n greeting?: string;\n /** Titulo principal (H1). */\n title: string;\n /** Paragrafos de corpo (sub-frases). */\n paragraphs?: string[];\n /** Cards lado-a-lado (1 a N). Largura dividida igualmente. */\n highlights?: EmailHighlight[];\n /** Bloco \"Parecer GYRA+IA\" (faixa roxa com chip + texto + rodape). */\n aiParecer?: EmailAiParecer;\n /** Botoes de acao. Multiplos viram lado-a-lado. */\n buttons?: EmailButton[];\n /** Texto pequeno no rodape do card (disclaimer, instrucoes extras). */\n footerNote?: string;\n};\n\n// ── Tokens (espelho de gyra-design CSS variables, hard-coded pra email) ────\n\nconst C = {\n blue: '#1256FF',\n teal: '#1FB58A',\n aiPurple: '#7C4EFF',\n aiPurpleText: '#6635E0',\n bg: '#F5F5F7',\n card: '#FFFFFF',\n fg1: '#1D1D1F',\n fg2: '#636366',\n fg3: '#8E8E93',\n border: '#D2D2D7',\n borderSubtle: '#E8E8ED',\n aiCardBg: '#F6F4FF',\n aiBorder: 'rgba(124,78,255,0.22)',\n};\n\nconst VERDICT: Record<AiParecerTone, { bg: string; color: string }> = {\n ok: { bg: '#E8F9ED', color: '#1A7D37' },\n warn: { bg: '#FFF4E0', color: '#946200' },\n danger: { bg: '#FFEDEC', color: '#C93430' },\n info: { bg: '#EBF4FF', color: '#0055D4' },\n};\n\nconst FONT =\n \"'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif\";\n\nconst LOGO_URL =\n 'https://gyra-file-prod.s3.us-west-2.amazonaws.com/assets/gyra-logo-color.png';\n\n// ── Helpers internos ───────────────────────────────────────────────────────\n\nconst esc = (s: string): string =>\n String(s ?? '')\n .replace(/&/g, '&amp;')\n .replace(/</g, '&lt;')\n .replace(/>/g, '&gt;')\n .replace(/\"/g, '&quot;')\n .replace(/'/g, '&#39;');\n\n/**\n * Só permite http(s). Bloqueia schemes perigosos (javascript:, data:)\n * que poderiam virar href executável. URL inválida vira '#'.\n */\nfunction safeUrl(url: string): string {\n try {\n const u = new URL(String(url));\n return u.protocol === 'http:' || u.protocol === 'https:' ? u.href : '#';\n } catch {\n return '#';\n }\n}\n\nfunction renderButton(btn: EmailButton): string {\n const isPrimary = (btn.variant ?? 'primary') === 'primary';\n const bg = isPrimary ? C.blue : C.card;\n const color = isPrimary ? '#FFFFFF' : C.blue;\n const border = isPrimary ? C.blue : C.border;\n return `\n <table role=\"presentation\" cellpadding=\"0\" cellspacing=\"0\" style=\"margin:8px 8px 0 0;display:inline-block;\">\n <tr>\n <td style=\"border-radius:10px;background:${bg};border:1px solid ${border};\">\n <a href=\"${esc(safeUrl(btn.url))}\" target=\"_blank\"\n style=\"display:inline-block;padding:12px 22px;font-family:${FONT};font-size:14px;font-weight:600;color:${color};text-decoration:none;border-radius:10px;\">\n ${esc(btn.label)}\n </a>\n </td>\n </tr>\n </table>`;\n}\n\nfunction renderHighlight(h: EmailHighlight, widthPct: number): string {\n return `\n <td width=\"${widthPct}%\" style=\"padding:6px;\" valign=\"top\">\n <table role=\"presentation\" width=\"100%\" cellpadding=\"0\" cellspacing=\"0\"\n style=\"background:#FAFAFA;border:1px solid ${C.borderSubtle};border-radius:12px;\">\n <tr><td style=\"padding:14px 16px;font-family:${FONT};\">\n <div style=\"font-size:12px;color:${C.fg2};margin-bottom:4px;\">${esc(h.label)}</div>\n <div style=\"font-size:22px;font-weight:700;color:${h.color || C.fg1};font-family:'Lexend',${FONT};\">${esc(h.value)}</div>\n </td></tr>\n </table>\n </td>`;\n}\n\nfunction renderAiParecer(p: EmailAiParecer): string {\n const v = p.verdict\n ? (() => {\n const t = VERDICT[p.verdictTone || 'info'];\n // table/td (Outlook ignora padding/border-radius em <span>).\n return `<table role=\"presentation\" cellpadding=\"0\" cellspacing=\"0\" style=\"display:inline-block;\"><tr>\n <td style=\"background:${t.bg};border-radius:999px;padding:4px 10px;font-family:${FONT};font-size:11px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:${t.color};white-space:nowrap;\">${esc(\n p.verdict,\n )}</td></tr></table>`;\n })()\n : '';\n return `\n <table role=\"presentation\" width=\"100%\" cellpadding=\"0\" cellspacing=\"0\"\n style=\"margin:18px 0 4px;background:${C.aiCardBg};border:1px solid ${C.aiBorder};border-radius:12px;\">\n <tr><td style=\"padding:16px 18px;font-family:${FONT};\">\n <table role=\"presentation\" width=\"100%\" cellpadding=\"0\" cellspacing=\"0\"><tr>\n <td valign=\"middle\" width=\"28\">\n <div style=\"width:22px;height:22px;border-radius:50%;background:${C.aiPurple};color:#fff;text-align:center;line-height:22px;font-size:13px;\">&#10022;</div>\n </td>\n <td valign=\"middle\" style=\"padding-left:8px;\">\n <span style=\"font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:${C.aiPurpleText};\">Parecer GYRA+IA</span>\n </td>\n <td valign=\"middle\" align=\"right\">${v}</td>\n </tr></table>\n <p style=\"margin:10px 0 0;font-size:14px;line-height:1.55;color:${C.fg2};\">${esc(p.text)}</p>\n ${\n p.footer\n ? `<div style=\"margin-top:10px;padding-top:10px;border-top:1px dashed ${C.aiBorder};font-size:11px;color:${C.fg3};\">${esc(\n p.footer,\n )}</div>`\n : ''\n }\n </td></tr>\n </table>`;\n}\n\n// ── API publica ────────────────────────────────────────────────────────────\n\n/**\n * Monta o HTML completo de um email no padrão Gyra+: logo no topo, card\n * principal com greeting + título + parágrafos + highlights (chips lado a\n * lado) + bloco \"Parecer GYRA+IA\" + botões, e rodapé padrão.\n *\n * Email-safe (tabelas + inline-style, sem flexbox, sem <style>). Funciona\n * em Gmail, Outlook (Windows/Web/Mac), Apple Mail, Thunderbird, mobile.\n *\n * Todas as seções (greeting, paragraphs, highlights, aiParecer, buttons,\n * footerNote) são **opcionais** — só `title` é obrigatório.\n */\nexport function buildEmail(input: EmailLayoutInput): string {\n const {\n preheader,\n greeting,\n title,\n paragraphs = [],\n highlights = [],\n aiParecer,\n buttons = [],\n footerNote,\n } = input;\n\n const highlightWidth = highlights.length\n ? Math.floor(100 / highlights.length)\n : 100;\n const highlightsRow = highlights.length\n ? `<table role=\"presentation\" width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" style=\"margin:8px 0 4px;\"><tr>${highlights\n .map((h) => renderHighlight(h, highlightWidth))\n .join('')}</tr></table>`\n : '';\n\n const paragraphsHtml = paragraphs\n .map(\n (p) =>\n `<p style=\"margin:0 0 14px;font-family:${FONT};font-size:15px;line-height:1.6;color:${C.fg2};\">${esc(\n p,\n )}</p>`,\n )\n .join('');\n\n const buttonsHtml = buttons.length\n ? `<div style=\"margin-top:18px;\">${buttons.map(renderButton).join('')}</div>`\n : '';\n\n return `<!DOCTYPE html>\n<html lang=\"pt-BR\">\n<head>\n <meta charset=\"utf-8\" />\n <meta name=\"viewport\" content=\"width=device-width,initial-scale=1.0\" />\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n <title>${esc(title)}</title>\n</head>\n<body style=\"margin:0;padding:0;background:${C.bg};\">\n ${\n preheader\n ? `<div style=\"display:none;max-height:0;overflow:hidden;opacity:0;\">${esc(preheader)}</div>`\n : ''\n }\n <table role=\"presentation\" width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" style=\"background:${C.bg};padding:24px 0;\">\n <tr>\n <td align=\"center\">\n <table role=\"presentation\" width=\"600\" cellpadding=\"0\" cellspacing=\"0\" style=\"width:600px;max-width:92%;\">\n <tr>\n <td style=\"padding:8px 4px 20px;\">\n <img src=\"${LOGO_URL}\" alt=\"GYRA+\" height=\"30\" style=\"height:30px;display:block;\" />\n </td>\n </tr>\n <tr>\n <td style=\"background:${C.card};border:1px solid ${C.borderSubtle};border-radius:16px;padding:32px;\">\n ${\n greeting\n ? `<p style=\"margin:0 0 6px;font-family:${FONT};font-size:14px;color:${C.fg2};\">${esc(\n greeting,\n )}</p>`\n : ''\n }\n <h1 style=\"margin:0 0 18px;font-family:'Lexend',${FONT};font-size:23px;line-height:1.3;color:${C.fg1};\">${esc(\n title,\n )}</h1>\n ${paragraphsHtml}\n ${highlightsRow}\n ${aiParecer ? renderAiParecer(aiParecer) : ''}\n ${buttonsHtml}\n </td>\n </tr>\n <tr>\n <td style=\"padding:20px 8px;font-family:${FONT};font-size:12px;line-height:1.5;color:${C.fg3};\">\n ${\n footerNote\n ? `<p style=\"margin:0 0 8px;\">${esc(footerNote)}</p>`\n : ''\n }\n <p style=\"margin:0;\">GYRA+ • Esta é uma mensagem automática, não responda este email.</p>\n </td>\n </tr>\n </table>\n </td>\n </tr>\n </table>\n</body>\n</html>`;\n}\n","import React from 'react';\nimport { buildEmail, EmailLayoutInput } from '../../emails/email';\n\n/**\n * Preview de email transacional Gyra+ — genérico, configurável.\n *\n * Renderiza o HTML produzido por `buildEmail(input)` dentro de um iframe\n * com `sandbox=\"\"` pra isolar do CSS do Storybook e simular Gmail/Outlook\n * com fidelidade.\n *\n * **Uso**: passe qualquer combinação de campos opcionais (greeting, title\n * obrigatório, paragraphs, highlights lado-a-lado, aiParecer, buttons,\n * footerNote). É o mesmo `EmailLayoutInput` que o `buildEmail` aceita.\n *\n * Pra previsualizar um email transacional específico (ex: reset de senha,\n * batch concluído, alerta), basta montar os props correspondentes — não\n * precisa criar um componente novo por caso.\n */\nexport type EmailProps = EmailLayoutInput & {\n /** Largura visual do iframe. Default 700px (cabe o card 600 + paddings). */\n width?: number | string;\n /** Altura visual do iframe. Default 1000px. Ajuste se o conteúdo crescer. */\n height?: number | string;\n};\n\nexport const Email: React.FC<EmailProps> = ({\n width = 700,\n height = 1000,\n ...input\n}) => {\n const html = buildEmail(input);\n return (\n <iframe\n title={`Email preview — ${input.title}`}\n srcDoc={html}\n sandbox=\"\"\n style={{\n width: typeof width === 'number' ? `${width}px` : width,\n height: typeof height === 'number' ? `${height}px` : height,\n border: '1px solid #E8E8ED',\n borderRadius: 8,\n background: '#F5F5F7',\n }}\n />\n );\n};\n\nexport default Email;\n"],"names":["C","VERDICT","ok","bg","color","warn","danger","info","FONT","esc","s","String","replace","renderButton","btn","isPrimary","variant","url","u","URL","protocol","href","safeUrl","label","buildEmail","input","preheader","greeting","title","paragraphs","highlights","aiParecer","buttons","footerNote","highlightWidth","length","Math","floor","highlightsRow","map","h","widthPct","value","renderHighlight","join","paragraphsHtml","p","buttonsHtml","v","verdict","t","verdictTone","text","footer","renderAiParecer","Email","width","height","html","React","createElement","srcDoc","sandbox","style","border","borderRadius","background"],"mappings":"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"}