[{"data":1,"prerenderedAt":38},["ShallowReactive",2],{"components-code-block":3,"$f148199gmhdfq7":37},{"category":4,"components":20},{"name":5,"description":6,"components":7},"Code Block","Code block components with options for themes, line numbers, and customization.",[8,11,14,17],{"slug":9,"title":10},"code-block-without-theme","Code Block without theme",{"slug":12,"title":13},"code-block-with-predefined-theme","Code Block with predefined theme",{"slug":15,"title":16},"code-block-with-custom-theme","Code Block with custom theme",{"slug":18,"title":19},"code-block-with-line-numbers","Code Block with line numbers",[21,25,29,33],{"slug":9,"title":10,"code":22},{"html":23,"vue":24},"\u003C!DOCTYPE html PUBLIC \"-\u002F\u002FW3C\u002F\u002FDTD XHTML 1.0 Transitional\u002F\u002FEN\" \"http:\u002F\u002Fwww.w3.org\u002FTR\u002Fxhtml1\u002FDTD\u002Fxhtml1-transitional.dtd\">\n\u003Chtml dir=\"ltr\" lang=\"en\">\n  \u003Chead>\n    \u003Cmeta content=\"text\u002Fhtml; charset=UTF-8\" http-equiv=\"Content-Type\" \u002F>\n    \u003Cmeta name=\"x-apple-disable-message-reformatting\" \u002F>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 400;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hiA.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 600;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50PDca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 700;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50BTca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n  \u003C\u002Fhead>\n  \u003Cbody dir=\"ltr\" lang=\"en\" style=\"margin:0;margin-right:0;margin-left:0\">\n    \u003Ctable\n      border=\"0\"\n      width=\"100%\"\n      cellpadding=\"0\"\n      cellspacing=\"0\"\n      role=\"presentation\"\n      align=\"center\">\n      \u003Ctbody>\n        \u003Ctr>\n          \u003Ctd\n            dir=\"ltr\"\n            lang=\"en\"\n            style=\"margin:0;margin-left:12px;margin-right:12px\">\n            \u003Ctable\n              align=\"center\"\n              width=\"100%\"\n              border=\"0\"\n              cellpadding=\"0\"\n              cellspacing=\"0\"\n              role=\"presentation\"\n              style=\"max-width:37.5em;margin-left:auto;margin-right:auto;box-sizing:border-box;height:100vh\">\n              \u003Ctbody>\n                \u003Ctr style=\"width:100%\">\n                  \u003Ctd style=\"padding-top:1rem;padding-bottom:1rem\">\n                    \u003Cstyle>\n                      @font-face {\n                        font-family: 'CommitMono';\n                        font-style: normal;\n                        font-weight: 400;\n                        mso-font-alt: 'monospace';\n                        src: url(\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf) format('truetype');\n                      }\n\n                      * {\n                        font-family: 'CommitMono', monospace;\n                      }\n                    \u003C\u002Fstyle>\n                    \u003Cpre\n                      style=\"width:100%\">\u003Ccode>\u003Cspan style=\"font-family:'CommitMono', monospace\">await\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​resend\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">emails\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">send\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">{\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">from\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">'you@example.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">to\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">'user@gmail.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">subject\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">'hello world'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">react\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">EmailTemplate\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">{\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">firstName\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">'John'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">;\u003C\u002Fspan>\u003Cbr>\u003C\u002Fcode>\u003C\u002Fpre>\n                  \u003C\u002Ftd>\n                \u003C\u002Ftr>\n              \u003C\u002Ftbody>\n            \u003C\u002Ftable>\n          \u003C\u002Ftd>\n        \u003C\u002Ftr>\n      \u003C\u002Ftbody>\n    \u003C\u002Ftable>\n  \u003C\u002Fbody>\n\u003C\u002Fhtml>\n","\u003Cscript setup lang=\"ts\">\nimport { CodeBlock, Font } from '@vuemaildev\u002Fvuemail';\n\nconst code = `await resend.emails.send({\n  from: 'you@example.com',\n  to: 'user@gmail.com',\n  subject: 'hello world',\n  react: EmailTemplate({ firstName: 'John' }),\n});`;\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CFont\n    fallback-font-family=\"monospace\"\n    font-family=\"CommitMono\"\n    font-style=\"normal\"\n    :font-weight=\"400\"\n    :web-font=\"{\n      url: '\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf',\n      format: 'truetype',\n    }\"\n  \u002F>\n  \u003CCodeBlock\n    :code=\"code\"\n    font-family=\"'CommitMono', monospace\"\n    language=\"javascript\"\n    :theme=\"{}\"\n  \u002F>\n\u003C\u002Ftemplate>\n",{"slug":12,"title":13,"code":26},{"html":27,"vue":28},"\u003C!DOCTYPE html PUBLIC \"-\u002F\u002FW3C\u002F\u002FDTD XHTML 1.0 Transitional\u002F\u002FEN\" \"http:\u002F\u002Fwww.w3.org\u002FTR\u002Fxhtml1\u002FDTD\u002Fxhtml1-transitional.dtd\">\n\u003Chtml dir=\"ltr\" lang=\"en\">\n  \u003Chead>\n    \u003Cmeta content=\"text\u002Fhtml; charset=UTF-8\" http-equiv=\"Content-Type\" \u002F>\n    \u003Cmeta name=\"x-apple-disable-message-reformatting\" \u002F>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 400;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hiA.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 600;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50PDca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 700;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50BTca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n  \u003C\u002Fhead>\n  \u003Cbody dir=\"ltr\" lang=\"en\" style=\"margin:0;margin-right:0;margin-left:0\">\n    \u003Ctable\n      border=\"0\"\n      width=\"100%\"\n      cellpadding=\"0\"\n      cellspacing=\"0\"\n      role=\"presentation\"\n      align=\"center\">\n      \u003Ctbody>\n        \u003Ctr>\n          \u003Ctd\n            dir=\"ltr\"\n            lang=\"en\"\n            style=\"margin:0;margin-left:12px;margin-right:12px\">\n            \u003Ctable\n              align=\"center\"\n              width=\"100%\"\n              border=\"0\"\n              cellpadding=\"0\"\n              cellspacing=\"0\"\n              role=\"presentation\"\n              style=\"max-width:37.5em;margin-left:auto;margin-right:auto;box-sizing:border-box;height:100vh\">\n              \u003Ctbody>\n                \u003Ctr style=\"width:100%\">\n                  \u003Ctd style=\"padding-top:1rem;padding-bottom:1rem\">\n                    \u003Cstyle>\n                      @font-face {\n                        font-family: 'CommitMono';\n                        font-style: normal;\n                        font-weight: 400;\n                        mso-font-alt: 'monospace';\n                        src: url(\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf) format('truetype');\n                      }\n\n                      * {\n                        font-family: 'CommitMono', monospace;\n                      }\n                    \u003C\u002Fstyle>\n                    \u003Cpre\n                      style=\"color:#f8f8f2;background:#282a36;text-shadow:0 1px rgba(0, 0, 0, 0.3);font-family:Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;hyphens:none;padding:1em;margin:.5em 0;overflow:auto;border-radius:0.3em;width:100%\">\u003Ccode>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#8be9fd\">await\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​resend\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">emails\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f1fa8c\">send\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">{\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#8be9fd\">from\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'you@example.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">to\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'user@gmail.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">subject\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'hello world'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">react\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f1fa8c\">EmailTemplate\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">{\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">firstName\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'John'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">;\u003C\u002Fspan>\u003Cbr>\u003C\u002Fcode>\u003C\u002Fpre>\n                  \u003C\u002Ftd>\n                \u003C\u002Ftr>\n              \u003C\u002Ftbody>\n            \u003C\u002Ftable>\n          \u003C\u002Ftd>\n        \u003C\u002Ftr>\n      \u003C\u002Ftbody>\n    \u003C\u002Ftable>\n  \u003C\u002Fbody>\n\u003C\u002Fhtml>\n","\u003Cscript setup lang=\"ts\">\nimport { CodeBlock, dracula, Font } from '@vuemaildev\u002Fvuemail';\n\nconst code = `await resend.emails.send({\n  from: 'you@example.com',\n  to: 'user@gmail.com',\n  subject: 'hello world',\n  react: EmailTemplate({ firstName: 'John' }),\n});`;\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CFont\n    fallback-font-family=\"monospace\"\n    font-family=\"CommitMono\"\n    font-style=\"normal\"\n    :font-weight=\"400\"\n    :web-font=\"{\n      url: '\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf',\n      format: 'truetype',\n    }\"\n  \u002F>\n  \u003CCodeBlock\n    :code=\"code\"\n    font-family=\"'CommitMono', monospace\"\n    language=\"javascript\"\n    :theme=\"dracula\"\n  \u002F>\n\u003C\u002Ftemplate>\n",{"slug":15,"title":16,"code":30},{"html":31,"vue":32},"\u003C!DOCTYPE html PUBLIC \"-\u002F\u002FW3C\u002F\u002FDTD XHTML 1.0 Transitional\u002F\u002FEN\" \"http:\u002F\u002Fwww.w3.org\u002FTR\u002Fxhtml1\u002FDTD\u002Fxhtml1-transitional.dtd\">\n\u003Chtml dir=\"ltr\" lang=\"en\">\n  \u003Chead>\n    \u003Cmeta content=\"text\u002Fhtml; charset=UTF-8\" http-equiv=\"Content-Type\" \u002F>\n    \u003Cmeta name=\"x-apple-disable-message-reformatting\" \u002F>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 400;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hiA.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 600;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50PDca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 700;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50BTca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n  \u003C\u002Fhead>\n  \u003Cbody dir=\"ltr\" lang=\"en\" style=\"margin:0;margin-right:0;margin-left:0\">\n    \u003Ctable\n      border=\"0\"\n      width=\"100%\"\n      cellpadding=\"0\"\n      cellspacing=\"0\"\n      role=\"presentation\"\n      align=\"center\">\n      \u003Ctbody>\n        \u003Ctr>\n          \u003Ctd\n            dir=\"ltr\"\n            lang=\"en\"\n            style=\"margin:0;margin-left:12px;margin-right:12px\">\n            \u003Ctable\n              align=\"center\"\n              width=\"100%\"\n              border=\"0\"\n              cellpadding=\"0\"\n              cellspacing=\"0\"\n              role=\"presentation\"\n              style=\"max-width:37.5em;margin-left:auto;margin-right:auto;box-sizing:border-box;height:100vh\">\n              \u003Ctbody>\n                \u003Ctr style=\"width:100%\">\n                  \u003Ctd style=\"padding-top:1rem;padding-bottom:1rem\">\n                    \u003Cstyle>\n                      @font-face {\n                        font-family: 'CommitMono';\n                        font-style: normal;\n                        font-weight: 400;\n                        mso-font-alt: 'monospace';\n                        src: url(\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf) format('truetype');\n                      }\n\n                      * {\n                        font-family: 'CommitMono', monospace;\n                      }\n                    \u003C\u002Fstyle>\n                    \u003Cpre\n                      style=\"color:#839496;text-shadow:0 1px rgba(0, 0, 0, 0.3);font-family:Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;hyphens:none;padding:1em;margin:.5em 0;overflow:auto;border-radius:0.3em;background:#002b36;width:100%\">\u003Ccode>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">await\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​resend\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">emails\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">send\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">{\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">from\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#EDEDED\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#859900\">'you@example.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">to\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#EDEDED\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#859900\">'user@gmail.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">subject\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#EDEDED\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#859900\">'hello world'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">react\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#EDEDED\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">EmailTemplate\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">{\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#268bd2\">firstName\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#EDEDED\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#859900\">'John'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#93a1a1\">;\u003C\u002Fspan>\u003Cbr>\u003C\u002Fcode>\u003C\u002Fpre>\n                  \u003C\u002Ftd>\n                \u003C\u002Ftr>\n              \u003C\u002Ftbody>\n            \u003C\u002Ftable>\n          \u003C\u002Ftd>\n        \u003C\u002Ftr>\n      \u003C\u002Ftbody>\n    \u003C\u002Ftable>\n  \u003C\u002Fbody>\n\u003C\u002Fhtml>\n","\u003Cscript setup lang=\"ts\">\nimport { CodeBlock, Font, type Theme } from '@vuemaildev\u002Fvuemail';\n\nconst code = `await resend.emails.send({\n  from: 'you@example.com',\n  to: 'user@gmail.com',\n  subject: 'hello world',\n  react: EmailTemplate({ firstName: 'John' }),\n});`;\n\nconst customTheme: Theme = {\n  base: {\n    color: '#839496',\n    textShadow: '0 1px rgba(0, 0, 0, 0.3)',\n    fontFamily:\n      \"Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace\",\n    direction: 'ltr',\n    textAlign: 'left',\n    whiteSpace: 'pre',\n    wordSpacing: 'normal',\n    wordBreak: 'normal',\n    lineHeight: '1.5',\n    MozTabSize: '4',\n    OTabSize: '4',\n    tabSize: '4',\n    WebkitHyphens: 'none',\n    MozHyphens: 'none',\n    hyphens: 'none',\n    padding: '1em',\n    margin: '.5em 0',\n    overflow: 'auto',\n    borderRadius: '0.3em',\n    background: '#002b36',\n  },\n  comment: {\n    color: '#586e75',\n  },\n  prolog: {\n    color: '#586e75',\n  },\n  doctype: {\n    color: '#586e75',\n  },\n  cdata: {\n    color: '#586e75',\n  },\n  punctuation: {\n    color: '#93a1a1',\n  },\n  property: {\n    color: '#268bd2',\n  },\n  keyword: {\n    color: '#268bd2',\n  },\n  tag: {\n    color: '#268bd2',\n  },\n  'class-name': {\n    color: '#FFFFB6',\n    textDecoration: 'underline',\n  },\n  boolean: {\n    color: '#b58900',\n  },\n  constant: {\n    color: '#b58900',\n  },\n  symbol: {\n    color: '#dc322f',\n  },\n  deleted: {\n    color: '#dc322f',\n  },\n  number: {\n    color: '#859900',\n  },\n  selector: {\n    color: '#859900',\n  },\n  'attr-name': {\n    color: '#859900',\n  },\n  string: {\n    color: '#859900',\n  },\n  char: {\n    color: '#859900',\n  },\n  builtin: {\n    color: '#859900',\n  },\n  inserted: {\n    color: '#859900',\n  },\n  variable: {\n    color: '#268bd2',\n  },\n  operator: {\n    color: '#EDEDED',\n  },\n  function: {\n    color: '#268bd2',\n  },\n  regex: {\n    color: '#E9C062',\n  },\n  important: {\n    color: '#fd971f',\n    fontWeight: 'bold',\n  },\n  entity: {\n    color: '#FFFFB6',\n    cursor: 'help',\n  },\n  url: {\n    color: '#96CBFE',\n  },\n  bold: {\n    fontWeight: 'bold',\n  },\n  italic: {\n    fontStyle: 'italic',\n  },\n  atrule: {\n    color: '#F9EE98',\n  },\n  'attr-value': {\n    color: '#F9EE98',\n  },\n};\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CFont\n    fallback-font-family=\"monospace\"\n    font-family=\"CommitMono\"\n    font-style=\"normal\"\n    :font-weight=\"400\"\n    :web-font=\"{\n      url: '\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf',\n      format: 'truetype',\n    }\"\n  \u002F>\n  \u003CCodeBlock\n    :code=\"code\"\n    font-family=\"'CommitMono', monospace\"\n    language=\"javascript\"\n    :theme=\"customTheme\"\n  \u002F>\n\u003C\u002Ftemplate>\n",{"slug":18,"title":19,"code":34},{"html":35,"vue":36},"\u003C!DOCTYPE html PUBLIC \"-\u002F\u002FW3C\u002F\u002FDTD XHTML 1.0 Transitional\u002F\u002FEN\" \"http:\u002F\u002Fwww.w3.org\u002FTR\u002Fxhtml1\u002FDTD\u002Fxhtml1-transitional.dtd\">\n\u003Chtml dir=\"ltr\" lang=\"en\">\n  \u003Chead>\n    \u003Cmeta content=\"text\u002Fhtml; charset=UTF-8\" http-equiv=\"Content-Type\" \u002F>\n    \u003Cmeta name=\"x-apple-disable-message-reformatting\" \u002F>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 400;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hiA.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 600;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50PDca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n    \u003Cstyle>\n      @font-face {\n        font-family: 'Inter';\n        font-style: normal;\n        font-weight: 700;\n        mso-font-alt: 'Helvetica';\n        src: url(https:\u002F\u002Ffonts.gstatic.com\u002Fs\u002Finter\u002Fv18\u002FUcC73FwrK3iLTeHuS_fjbvMwCp50BTca1ZL7.woff2) format('woff2');\n      }\n\n      * {\n        font-family: 'Inter', Helvetica;\n      }\n    \u003C\u002Fstyle>\n  \u003C\u002Fhead>\n  \u003Cbody dir=\"ltr\" lang=\"en\" style=\"margin:0;margin-right:0;margin-left:0\">\n    \u003Ctable\n      border=\"0\"\n      width=\"100%\"\n      cellpadding=\"0\"\n      cellspacing=\"0\"\n      role=\"presentation\"\n      align=\"center\">\n      \u003Ctbody>\n        \u003Ctr>\n          \u003Ctd\n            dir=\"ltr\"\n            lang=\"en\"\n            style=\"margin:0;margin-left:12px;margin-right:12px\">\n            \u003Ctable\n              align=\"center\"\n              width=\"100%\"\n              border=\"0\"\n              cellpadding=\"0\"\n              cellspacing=\"0\"\n              role=\"presentation\"\n              style=\"max-width:37.5em;margin-left:auto;margin-right:auto;box-sizing:border-box;height:100vh\">\n              \u003Ctbody>\n                \u003Ctr style=\"width:100%\">\n                  \u003Ctd style=\"padding-top:1rem;padding-bottom:1rem\">\n                    \u003Cstyle>\n                      @font-face {\n                        font-family: 'CommitMono';\n                        font-style: normal;\n                        font-weight: 400;\n                        mso-font-alt: 'monospace';\n                        src: url(\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf) format('truetype');\n                      }\n\n                      * {\n                        font-family: 'CommitMono', monospace;\n                      }\n                    \u003C\u002Fstyle>\n                    \u003Cpre\n                      style=\"color:#f8f8f2;background:#282a36;text-shadow:0 1px rgba(0, 0, 0, 0.3);font-family:Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;hyphens:none;padding:1em;margin:.5em 0;overflow:auto;border-radius:0.3em;width:100%\">\u003Ccode>\u003Cspan style=\"width:2em;height:1em;display:inline-block;font-family:'CommitMono', monospace\">1\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#8be9fd\">await\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​resend\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\">emails\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">.\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f1fa8c\">send\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">{\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"width:2em;height:1em;display:inline-block;font-family:'CommitMono', monospace\">2\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#8be9fd\">from\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'you@example.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"width:2em;height:1em;display:inline-block;font-family:'CommitMono', monospace\">3\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">to\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'user@gmail.com'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"width:2em;height:1em;display:inline-block;font-family:'CommitMono', monospace\">4\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">subject\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'hello world'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"width:2em;height:1em;display:inline-block;font-family:'CommitMono', monospace\">5\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​ ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">react\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f1fa8c\">EmailTemplate\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">(\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">{\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#ff79c6\">firstName\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">:\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#50fa7b\">'John'\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace\"> ‍​\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">,\u003C\u002Fspan>\u003Cbr>\u003Cspan style=\"width:2em;height:1em;display:inline-block;font-family:'CommitMono', monospace\">6\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">}\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">)\u003C\u002Fspan>\u003Cspan style=\"font-family:'CommitMono', monospace;color:#f8f8f2\">;\u003C\u002Fspan>\u003Cbr>\u003C\u002Fcode>\u003C\u002Fpre>\n                  \u003C\u002Ftd>\n                \u003C\u002Ftr>\n              \u003C\u002Ftbody>\n            \u003C\u002Ftable>\n          \u003C\u002Ftd>\n        \u003C\u002Ftr>\n      \u003C\u002Ftbody>\n    \u003C\u002Ftable>\n  \u003C\u002Fbody>\n\u003C\u002Fhtml>\n","\u003Cscript setup lang=\"ts\">\nimport { CodeBlock, dracula, Font } from '@vuemaildev\u002Fvuemail';\n\nconst code = `await resend.emails.send({\n  from: 'you@example.com',\n  to: 'user@gmail.com',\n  subject: 'hello world',\n  react: EmailTemplate({ firstName: 'John' }),\n});`;\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CFont\n    fallback-font-family=\"monospace\"\n    font-family=\"CommitMono\"\n    font-style=\"normal\"\n    :font-weight=\"400\"\n    :web-font=\"{\n      url: '\u002Ffonts\u002Fcommit-mono\u002Fcommit-mono-regular.ttf',\n      format: 'truetype',\n    }\"\n  \u002F>\n  \u003CCodeBlock\n    :code=\"code\"\n    font-family=\"'CommitMono', monospace\"\n    language=\"javascript\"\n    line-numbers\n    :theme=\"dracula\"\n  \u002F>\n\u003C\u002Ftemplate>\n","1",1790606429728]