[{"data":1,"prerenderedAt":2363},["ShallowReactive",2],{"docs-nav":3,"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fsveltekit":316},[4,9,15,19,24,28,33,37,41,45,49,53,57,60,63,67,70,74,77,81,85,89,93,97,101,105,109,113,117,121,125,129,133,137,141,145,149,153,156,159,162,165,168,171,175,178,181,184,186,189,192,195,198,201,204,207,210,213,216,219,222,225,228,231,234,237,240,244,247,250,253,257,261,264,267,270,273,276,279,282,285,287,290,293,296,299,302,305,308,311,313],{"path":5,"title":6,"section":7,"order":7,"sidebar":8},"\u002Fbrand","Brand",null,false,{"path":10,"title":11,"section":12,"order":13,"sidebar":14},"\u002Fdocs\u002Fapi\u002Fcomposables","Composables","API",2,true,{"path":16,"title":17,"section":12,"order":18,"sidebar":14},"\u002Fdocs\u002Fapi\u002Futilities","Utilities",1,{"path":20,"title":21,"section":22,"order":23,"sidebar":14},"\u002Fdocs\u002Fcli","CLI","Getting Started",9,{"path":25,"title":26,"section":22,"order":27,"sidebar":14},"\u002Fdocs\u002Fcompatibility","Compatibility",4,{"path":29,"title":30,"section":31,"order":32,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fbody","Body","Components",3,{"path":34,"title":35,"section":31,"order":36,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fbutton","Button",13,{"path":38,"title":39,"section":31,"order":40,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fcodeblock","CodeBlock",18,{"path":42,"title":43,"section":31,"order":44,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fcodeinline","CodeInline",19,{"path":46,"title":47,"section":31,"order":48,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fcolumn","Column",8,{"path":50,"title":51,"section":31,"order":52,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fcontainer","Container",5,{"path":54,"title":55,"section":31,"order":56,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Ffont","Font",11,{"path":58,"title":59,"section":31,"order":13,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fhead","Head",{"path":61,"title":62,"section":31,"order":23,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fheading","Heading",{"path":64,"title":65,"section":31,"order":66,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fhr","Hr",16,{"path":68,"title":69,"section":31,"order":18,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fhtml","Html",{"path":71,"title":72,"section":31,"order":73,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fimg","Img",14,{"path":75,"title":76,"section":31,"order":27,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Flayout","Layout",{"path":78,"title":79,"section":31,"order":80,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Flink","Link",12,{"path":82,"title":83,"section":31,"order":84,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fmarkdown","Markdown",20,{"path":86,"title":87,"section":31,"order":88,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fnotoutlook","NotOutlook",22,{"path":90,"title":91,"section":31,"order":92,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fnowidows","NoWidows",26,{"path":94,"title":95,"section":31,"order":96,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Foutlook","Outlook",21,{"path":98,"title":99,"section":31,"order":100,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Foutlookbg","OutlookBg",23,{"path":102,"title":103,"section":31,"order":104,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Foverview","Overview",0,{"path":106,"title":107,"section":31,"order":108,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fplaintext","Plaintext",31,{"path":110,"title":111,"section":31,"order":112,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fpreheader","Preheader",17,{"path":114,"title":115,"section":31,"order":116,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fqrcode","QrCode",30,{"path":118,"title":119,"section":31,"order":120,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fraw","Raw",28,{"path":122,"title":123,"section":31,"order":124,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Frow","Row",7,{"path":126,"title":127,"section":31,"order":128,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fsection","Section",6,{"path":130,"title":131,"section":31,"order":132,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fspacer","Spacer",15,{"path":134,"title":135,"section":31,"order":136,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Ftailwind","Tailwind",29,{"path":138,"title":139,"section":31,"order":140,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Ftext","Text",10,{"path":142,"title":143,"section":31,"order":144,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fvml","Vml",24,{"path":146,"title":147,"section":31,"order":148,"sidebar":14},"\u002Fdocs\u002Fcomponents\u002Fwithurl","WithUrl",27,{"path":150,"title":151,"section":152,"order":128,"sidebar":14},"\u002Fdocs\u002Fdeploy\u002Faws-ses","AWS SES","Deploy",{"path":154,"title":155,"section":152,"order":124,"sidebar":14},"\u002Fdocs\u002Fdeploy\u002Fcloudflare","Cloudflare",{"path":157,"title":158,"section":152,"order":32,"sidebar":14},"\u002Fdocs\u002Fdeploy\u002Fmailgun","Mailgun",{"path":160,"title":161,"section":152,"order":18,"sidebar":14},"\u002Fdocs\u002Fdeploy\u002Fnodemailer","Nodemailer",{"path":163,"title":164,"section":152,"order":27,"sidebar":14},"\u002Fdocs\u002Fdeploy\u002Fpostmark","Postmark",{"path":166,"title":167,"section":152,"order":52,"sidebar":14},"\u002Fdocs\u002Fdeploy\u002Fresend","Resend",{"path":169,"title":170,"section":152,"order":13,"sidebar":14},"\u002Fdocs\u002Fdeploy\u002Fsendgrid","SendGrid",{"path":172,"title":173,"section":174,"order":32,"sidebar":14},"\u002Fdocs\u002Fdevelopment\u002Fconfiguration","Configuration","Development",{"path":176,"title":177,"section":174,"order":52,"sidebar":14},"\u002Fdocs\u002Fdevelopment\u002Fevents","Events",{"path":179,"title":180,"section":174,"order":128,"sidebar":14},"\u002Fdocs\u002Fdevelopment\u002Fi18n","i18n",{"path":182,"title":183,"section":174,"order":13,"sidebar":14},"\u002Fdocs\u002Fdevelopment\u002Flocal","Dev Server",{"path":185,"title":107,"section":174,"order":27,"sidebar":14},"\u002Fdocs\u002Fdevelopment\u002Fplaintext",{"path":187,"title":188,"section":174,"order":18,"sidebar":14},"\u002Fdocs\u002Fdevelopment\u002Ftemplates","Templates",{"path":190,"title":191,"section":22,"order":32,"sidebar":14},"\u002Fdocs\u002Feditor-setup","Editor Setup",{"path":193,"title":194,"section":22,"order":48,"sidebar":14},"\u002Fdocs\u002Fglossary","Glossary",{"path":196,"title":197,"section":22,"order":128,"sidebar":8},"\u002Fdocs\u002Finstallation\u002Fframeworks","Framework Guides",{"path":199,"title":200,"section":197,"order":52,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fadonisjs","AdonisJS",{"path":202,"title":203,"section":197,"order":32,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fastro","Astro",{"path":205,"title":206,"section":197,"order":18,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Flaravel","Laravel",{"path":208,"title":209,"section":197,"order":48,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fnextjs","Next.js",{"path":211,"title":212,"section":197,"order":13,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fnuxt","Nuxt",{"path":214,"title":215,"section":197,"order":124,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fqwik","Qwik",{"path":217,"title":218,"section":197,"order":128,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fsolid","Solid",{"path":220,"title":221,"section":197,"order":27,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fsveltekit","SvelteKit",{"path":223,"title":224,"section":197,"order":23,"sidebar":14},"\u002Fdocs\u002Finstallation\u002Fframeworks\u002Ftanstack","TanStack Start",{"path":226,"title":227,"section":22,"order":13,"sidebar":14},"\u002Fdocs\u002Finstallation","Installation",{"path":229,"title":230,"section":22,"order":32,"sidebar":8},"\u002Fdocs\u002Finstallation\u002Fmanual","Manual Installation",{"path":232,"title":233,"section":22,"order":27,"sidebar":8},"\u002Fdocs\u002Finstallation\u002Fmonorepo","Monorepo Installation",{"path":235,"title":236,"section":22,"order":52,"sidebar":8},"\u002Fdocs\u002Finstallation\u002Fvite","Vite Plugin",{"path":238,"title":239,"section":22,"order":18,"sidebar":14},"\u002Fdocs\u002Fintroduction","What is Maizzle?",{"path":241,"title":242,"section":243,"order":13,"sidebar":14},"\u002Fdocs\u002Fmigrate\u002Fmjml","MJML","Migrate to Maizzle",{"path":245,"title":246,"section":243,"order":18,"sidebar":14},"\u002Fdocs\u002Fmigrate\u002Freact-email","React Email",{"path":248,"title":249,"section":22,"order":124,"sidebar":14},"\u002Fdocs\u002Fresources","Resources",{"path":251,"title":252,"section":22,"order":128,"sidebar":14},"\u002Fdocs\u002Fskill","Agent Skill",{"path":254,"title":255,"section":256,"order":18,"sidebar":14},"\u002Fdocs\u002Ftailwindcss","Tailwind CSS","Core Concepts",{"path":258,"title":259,"section":260,"order":13,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fadd-attributes","Add Attributes","Transformers",{"path":262,"title":263,"section":260,"order":48,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fattribute-to-style","Attribute to Style",{"path":265,"title":266,"section":260,"order":36,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fbase-url","Base URL",{"path":268,"title":269,"section":260,"order":66,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fentities","Entities",{"path":271,"title":272,"section":260,"order":80,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Ffilters","Filters",{"path":274,"title":275,"section":260,"order":112,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fformat","Format",{"path":277,"title":278,"section":260,"order":32,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Finline-css","Inline CSS",{"path":280,"title":281,"section":260,"order":56,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Finline-link","Inline Link",{"path":283,"title":284,"section":260,"order":40,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fminify","Minify",{"path":286,"title":103,"section":260,"order":18,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Foverview",{"path":288,"title":289,"section":260,"order":27,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fpurge-css","Purge CSS",{"path":291,"title":292,"section":260,"order":140,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fremove-attributes","Remove Attributes",{"path":294,"title":295,"section":260,"order":132,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Freplace-strings","Replace Strings",{"path":297,"title":298,"section":260,"order":52,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fsafe-selectors","Safe Selectors",{"path":300,"title":301,"section":260,"order":128,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fshorthand-css","Shorthand CSS",{"path":303,"title":304,"section":260,"order":124,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Fsix-hex","Six-digit HEX",{"path":306,"title":307,"section":260,"order":73,"sidebar":14},"\u002Fdocs\u002Ftransformers\u002Furl-parameters","URL Parameters",{"path":309,"title":310,"section":22,"order":52,"sidebar":14},"\u002Fdocs\u002Fupgrade-guide","Upgrade Guide",{"path":312,"title":236,"section":256,"order":13,"sidebar":14},"\u002Fdocs\u002Fvite-plugin",{"path":314,"title":315,"section":7,"order":7,"sidebar":8},"\u002Fprivacy","Privacy Policy",{"id":317,"title":221,"body":318,"description":2357,"extension":2358,"meta":2359,"navigation":14,"order":27,"path":220,"section":197,"seo":2360,"sidebar":14,"stem":2361,"toc":14,"__hash__":2362},"docs\u002Fdocs\u002Finstallation\u002Fframeworks\u002Fsveltekit.md",{"type":319,"value":320,"toc":2338},"minimark",[321,325,329,333,336,361,365,370,381,444,448,455,692,699,703,710,912,916,930,1130,1133,1140,1155,1172,1175,1179,1192,1206,1210,1217,1221,1224,1369,1372,1509,1513,1516,1733,1737,1746,2105,2109,2116,2321,2324,2328,2331,2334],[322,323,221],"h1",{"id":324},"sveltekit",[326,327,328],"p",{},"Add email templating to your SvelteKit project with Maizzle's Vite plugin. Author templates as Vue SFCs and preview them in dedicated dev server; on build, they compile to static HTML.",[330,331,227],"h2",{"id":332},"installation",[326,334,335],{},"Install Maizzle in your SvelteKit project:",[337,338,343],"pre",{"className":339,"code":340,"language":341,"meta":342,"style":342},"language-bash shiki shiki-themes laserwave","npm install @maizzle\u002Fframework\n","bash","",[344,345,346],"code",{"__ignoreMap":342},[347,348,350,354,358],"span",{"class":349,"line":18},"line",[347,351,353],{"class":352},"sZNF3","npm",[347,355,357],{"class":356},"sXiT_"," install",[347,359,360],{"class":356}," @maizzle\u002Fframework\n",[330,362,364],{"id":363},"setup","Setup",[366,367,369],"h3",{"id":368},"project-structure","Project structure",[326,371,372,373,376,377,380],{},"Create an ",[344,374,375],{},"emails"," directory inside ",[344,378,379],{},"src"," for your email templates:",[337,382,388],{"className":383,"code":384,"filename":385,"highlights":386,"language":387,"meta":342,"style":342},"language-text shiki shiki-themes laserwave","├── src\u002F\n│   ├── emails\u002F\n│   │   ├── welcome.vue\n│   │   └── tsconfig.json\n│   ├── routes\u002F\n│   └── app.html\n├── svelte.config.js\n├── vite.config.ts\n├── tsconfig.json\n└── package.json\n","your-sveltekit-app",[13,32,27],"text",[344,389,390,395,402,408,414,419,424,429,434,439],{"__ignoreMap":342},[347,391,392],{"class":349,"line":18},[347,393,394],{},"├── src\u002F\n",[347,396,399],{"class":397,"line":13},[349,398],"highlight",[347,400,401],{},"│   ├── emails\u002F\n",[347,403,405],{"class":404,"line":32},[349,398],[347,406,407],{},"│   │   ├── welcome.vue\n",[347,409,411],{"class":410,"line":27},[349,398],[347,412,413],{},"│   │   └── tsconfig.json\n",[347,415,416],{"class":349,"line":52},[347,417,418],{},"│   ├── routes\u002F\n",[347,420,421],{"class":349,"line":128},[347,422,423],{},"│   └── app.html\n",[347,425,426],{"class":349,"line":124},[347,427,428],{},"├── svelte.config.js\n",[347,430,431],{"class":349,"line":48},[347,432,433],{},"├── vite.config.ts\n",[347,435,436],{"class":349,"line":23},[347,437,438],{},"├── tsconfig.json\n",[347,440,441],{"class":349,"line":140},[347,442,443],{},"└── package.json\n",[366,445,447],{"id":446},"vite-config","Vite config",[326,449,450,451,454],{},"Register the Maizzle Vite plugin in your ",[344,452,453],{},"vite.config.ts",":",[337,456,460],{"className":457,"code":458,"filename":453,"language":459,"meta":342,"style":342},"language-ts shiki shiki-themes laserwave has-diff","import tailwindcss from '@tailwindcss\u002Fvite'\nimport { sveltekit } from '@sveltejs\u002Fkit\u002Fvite'\nimport { defineConfig } from 'vite'\nimport { maizzle } from '@maizzle\u002Fframework' \u002F\u002F [!code ++]\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss(),\n    sveltekit(),\n    maizzle({ \u002F\u002F [!code ++]\n      root: 'src\u002Femails', \u002F\u002F [!code ++]\n      content: ['**\u002F*.vue'], \u002F\u002F [!code ++]\n      output: { \u002F\u002F [!code ++]\n        path: 'dist\u002Femails', \u002F\u002F [!code ++]\n      }, \u002F\u002F [!code ++]\n    }), \u002F\u002F [!code ++]\n  ],\n})\n","ts",[344,461,462,485,507,527,551,556,569,580,588,595,604,622,643,653,670,676,682,687],{"__ignoreMap":342},[347,463,464,468,472,475,479,482],{"class":349,"line":18},[347,465,467],{"class":466},"s0ZPN","import",[347,469,471],{"class":470},"sU-n2"," tailwindcss",[347,473,474],{"class":466}," from",[347,476,478],{"class":477},"sGGKt"," '",[347,480,481],{"class":356},"@tailwindcss\u002Fvite",[347,483,484],{"class":477},"'\n",[347,486,487,489,492,495,498,500,502,505],{"class":349,"line":13},[347,488,467],{"class":466},[347,490,491],{"class":477}," {",[347,493,494],{"class":470}," sveltekit",[347,496,497],{"class":477}," }",[347,499,474],{"class":466},[347,501,478],{"class":477},[347,503,504],{"class":356},"@sveltejs\u002Fkit\u002Fvite",[347,506,484],{"class":477},[347,508,509,511,513,516,518,520,522,525],{"class":349,"line":32},[347,510,467],{"class":466},[347,512,491],{"class":477},[347,514,515],{"class":470}," defineConfig",[347,517,497],{"class":477},[347,519,474],{"class":466},[347,521,478],{"class":477},[347,523,524],{"class":356},"vite",[347,526,484],{"class":477},[347,528,532,534,536,539,541,543,545,548],{"class":529,"line":27},[349,530,531],"diff","add",[347,533,467],{"class":466},[347,535,491],{"class":477},[347,537,538],{"class":470}," maizzle",[347,540,497],{"class":477},[347,542,474],{"class":466},[347,544,478],{"class":477},[347,546,547],{"class":356},"@maizzle\u002Fframework",[347,549,550],{"class":477},"'",[347,552,553],{"class":349,"line":52},[347,554,555],{"emptyLinePlaceholder":14},"\n",[347,557,558,561,564,566],{"class":349,"line":128},[347,559,560],{"class":466},"export",[347,562,563],{"class":466}," default",[347,565,515],{"class":352},[347,567,568],{"class":477},"({\n",[347,570,571,575,577],{"class":349,"line":124},[347,572,574],{"class":573},"sLaUg","  plugins",[347,576,454],{"class":477},[347,578,579],{"class":477}," [\n",[347,581,582,585],{"class":349,"line":48},[347,583,584],{"class":352},"    tailwindcss",[347,586,587],{"class":477},"(),\n",[347,589,590,593],{"class":349,"line":23},[347,591,592],{"class":352},"    sveltekit",[347,594,587],{"class":477},[347,596,598,601],{"class":597,"line":140},[349,530,531],[347,599,600],{"class":352},"    maizzle",[347,602,603],{"class":477},"({",[347,605,607,610,612,614,617,619],{"class":606,"line":56},[349,530,531],[347,608,609],{"class":573},"      root",[347,611,454],{"class":477},[347,613,478],{"class":477},[347,615,616],{"class":356},"src\u002Femails",[347,618,550],{"class":477},[347,620,621],{"class":477},",",[347,623,625,628,630,633,635,638,640],{"class":624,"line":80},[349,530,531],[347,626,627],{"class":573},"      content",[347,629,454],{"class":477},[347,631,632],{"class":477}," [",[347,634,550],{"class":477},[347,636,637],{"class":356},"**\u002F*.vue",[347,639,550],{"class":477},[347,641,642],{"class":477},"],",[347,644,646,649,651],{"class":645,"line":36},[349,530,531],[347,647,648],{"class":573},"      output",[347,650,454],{"class":477},[347,652,491],{"class":477},[347,654,656,659,661,663,666,668],{"class":655,"line":73},[349,530,531],[347,657,658],{"class":573},"        path",[347,660,454],{"class":477},[347,662,478],{"class":477},[347,664,665],{"class":356},"dist\u002Femails",[347,667,550],{"class":477},[347,669,621],{"class":477},[347,671,673],{"class":672,"line":132},[349,530,531],[347,674,675],{"class":477},"      },",[347,677,679],{"class":678,"line":66},[349,530,531],[347,680,681],{"class":477},"    }),",[347,683,684],{"class":349,"line":112},[347,685,686],{"class":477},"  ],\n",[347,688,689],{"class":349,"line":40},[347,690,691],{"class":477},"})\n",[326,693,694,695,698],{},"See ",[696,697,173],"a",{"href":172}," for all available options.",[366,700,702],{"id":701},"typescript","TypeScript",[326,704,705,706,709],{},"Maizzle generates type declarations for auto-imported components and composables in ",[344,707,708],{},"src\u002Femails\u002F.maizzle\u002F",". To enable type checking for your email templates, add a config:",[337,711,716],{"className":712,"code":713,"filename":714,"language":715,"meta":342,"style":342},"language-json shiki shiki-themes laserwave","{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"noEmit\": true,\n    \"strict\": true,\n    \"esModuleInterop\": true,\n    \"skipLibCheck\": true\n  },\n  \"include\": [\n    \".\u002F**\u002F*.vue\",\n    \".\u002F.maizzle\u002F*.d.ts\"\n  ]\n}\n","src\u002Femails\u002Ftsconfig.json","json",[344,717,718,723,739,762,782,802,819,834,849,863,868,881,892,902,907],{"__ignoreMap":342},[347,719,720],{"class":349,"line":18},[347,721,722],{"class":477},"{\n",[347,724,725,728,731,734,736],{"class":349,"line":13},[347,726,727],{"class":477},"  \"",[347,729,730],{"class":466},"compilerOptions",[347,732,733],{"class":477},"\"",[347,735,454],{"class":477},[347,737,738],{"class":477}," {\n",[347,740,741,744,747,749,751,754,757,759],{"class":349,"line":32},[347,742,743],{"class":477},"    \"",[347,745,746],{"class":466},"target",[347,748,733],{"class":477},[347,750,454],{"class":477},[347,752,753],{"class":477}," \"",[347,755,756],{"class":356},"ES2022",[347,758,733],{"class":477},[347,760,761],{"class":477},",\n",[347,763,764,766,769,771,773,775,778,780],{"class":349,"line":27},[347,765,743],{"class":477},[347,767,768],{"class":466},"module",[347,770,733],{"class":477},[347,772,454],{"class":477},[347,774,753],{"class":477},[347,776,777],{"class":356},"ESNext",[347,779,733],{"class":477},[347,781,761],{"class":477},[347,783,784,786,789,791,793,795,798,800],{"class":349,"line":52},[347,785,743],{"class":477},[347,787,788],{"class":466},"moduleResolution",[347,790,733],{"class":477},[347,792,454],{"class":477},[347,794,753],{"class":477},[347,796,797],{"class":356},"bundler",[347,799,733],{"class":477},[347,801,761],{"class":477},[347,803,804,806,809,811,813,817],{"class":349,"line":128},[347,805,743],{"class":477},[347,807,808],{"class":466},"noEmit",[347,810,733],{"class":477},[347,812,454],{"class":477},[347,814,816],{"class":815},"skd8d"," true",[347,818,761],{"class":477},[347,820,821,823,826,828,830,832],{"class":349,"line":124},[347,822,743],{"class":477},[347,824,825],{"class":466},"strict",[347,827,733],{"class":477},[347,829,454],{"class":477},[347,831,816],{"class":815},[347,833,761],{"class":477},[347,835,836,838,841,843,845,847],{"class":349,"line":48},[347,837,743],{"class":477},[347,839,840],{"class":466},"esModuleInterop",[347,842,733],{"class":477},[347,844,454],{"class":477},[347,846,816],{"class":815},[347,848,761],{"class":477},[347,850,851,853,856,858,860],{"class":349,"line":23},[347,852,743],{"class":477},[347,854,855],{"class":466},"skipLibCheck",[347,857,733],{"class":477},[347,859,454],{"class":477},[347,861,862],{"class":815}," true\n",[347,864,865],{"class":349,"line":140},[347,866,867],{"class":477},"  },\n",[347,869,870,872,875,877,879],{"class":349,"line":56},[347,871,727],{"class":477},[347,873,874],{"class":466},"include",[347,876,733],{"class":477},[347,878,454],{"class":477},[347,880,579],{"class":477},[347,882,883,885,888,890],{"class":349,"line":80},[347,884,743],{"class":477},[347,886,887],{"class":356},".\u002F**\u002F*.vue",[347,889,733],{"class":477},[347,891,761],{"class":477},[347,893,894,896,899],{"class":349,"line":36},[347,895,743],{"class":477},[347,897,898],{"class":356},".\u002F.maizzle\u002F*.d.ts",[347,900,901],{"class":477},"\"\n",[347,903,904],{"class":349,"line":73},[347,905,906],{"class":477},"  ]\n",[347,908,909],{"class":349,"line":132},[347,910,911],{"class":477},"}\n",[330,913,915],{"id":914},"usage","Usage",[326,917,918,919,921,922,924,925,924,927,929],{},"Create Vue SFC email templates in your ",[344,920,616],{}," directory. Maizzle components like ",[344,923,76],{},", ",[344,926,51],{},[344,928,35],{},", etc. are auto-imported:",[337,931,936],{"className":932,"code":933,"filename":934,"language":935,"meta":342,"style":342},"language-vue shiki shiki-themes laserwave","\u003Cscript setup>\n  const name = 'World'\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CLayout>\n    \u003CContainer class=\"max-w-xl\">\n      \u003CHeading class=\"text-2xl\">Hello, {{ name }}!\u003C\u002FHeading>\n      \u003CButton\n        href=\"https:\u002F\u002Fexample.com\"\n        class=\"bg-slate-950 hover:bg-slate-800\"\n      >Get Started\u003C\u002FButton>\n    \u003C\u002FContainer>\n  \u003C\u002FLayout>\n\u003C\u002Ftemplate>\n\n","src\u002Femails\u002Fwelcome.vue","vue",[344,937,938,953,972,981,985,994,1003,1025,1055,1062,1076,1090,1104,1113,1122],{"__ignoreMap":342},[347,939,940,943,947,950],{"class":349,"line":18},[347,941,942],{"class":477},"\u003C",[347,944,946],{"class":945},"sb4Pa","script",[347,948,949],{"class":352}," setup",[347,951,952],{"class":477},">\n",[347,954,955,959,962,965,967,970],{"class":349,"line":13},[347,956,958],{"class":957},"sIihq","  const",[347,960,961],{"class":815}," name",[347,963,964],{"class":945}," =",[347,966,478],{"class":477},[347,968,969],{"class":356},"World",[347,971,484],{"class":477},[347,973,974,977,979],{"class":349,"line":32},[347,975,976],{"class":477},"\u003C\u002F",[347,978,946],{"class":945},[347,980,952],{"class":477},[347,982,983],{"class":349,"line":27},[347,984,555],{"emptyLinePlaceholder":14},[347,986,987,989,992],{"class":349,"line":52},[347,988,942],{"class":477},[347,990,991],{"class":945},"template",[347,993,952],{"class":477},[347,995,996,999,1001],{"class":349,"line":128},[347,997,998],{"class":477},"  \u003C",[347,1000,76],{"class":945},[347,1002,952],{"class":477},[347,1004,1005,1008,1010,1013,1016,1018,1021,1023],{"class":349,"line":124},[347,1006,1007],{"class":477},"    \u003C",[347,1009,51],{"class":945},[347,1011,1012],{"class":352}," class",[347,1014,1015],{"class":477},"=",[347,1017,733],{"class":477},[347,1019,1020],{"class":356},"max-w-xl",[347,1022,733],{"class":477},[347,1024,952],{"class":477},[347,1026,1027,1030,1032,1034,1036,1038,1041,1043,1046,1049,1051,1053],{"class":349,"line":48},[347,1028,1029],{"class":477},"      \u003C",[347,1031,62],{"class":945},[347,1033,1012],{"class":352},[347,1035,1015],{"class":477},[347,1037,733],{"class":477},[347,1039,1040],{"class":356},"text-2xl",[347,1042,733],{"class":477},[347,1044,1045],{"class":477},">",[347,1047,1048],{"class":573},"Hello, {{ name }}!",[347,1050,976],{"class":477},[347,1052,62],{"class":945},[347,1054,952],{"class":477},[347,1056,1057,1059],{"class":349,"line":23},[347,1058,1029],{"class":477},[347,1060,1061],{"class":945},"Button\n",[347,1063,1064,1067,1069,1071,1074],{"class":349,"line":140},[347,1065,1066],{"class":352},"        href",[347,1068,1015],{"class":477},[347,1070,733],{"class":477},[347,1072,1073],{"class":356},"https:\u002F\u002Fexample.com",[347,1075,901],{"class":477},[347,1077,1078,1081,1083,1085,1088],{"class":349,"line":56},[347,1079,1080],{"class":352},"        class",[347,1082,1015],{"class":477},[347,1084,733],{"class":477},[347,1086,1087],{"class":356},"bg-slate-950 hover:bg-slate-800",[347,1089,901],{"class":477},[347,1091,1092,1095,1098,1100,1102],{"class":349,"line":80},[347,1093,1094],{"class":477},"      >",[347,1096,1097],{"class":573},"Get Started",[347,1099,976],{"class":477},[347,1101,35],{"class":945},[347,1103,952],{"class":477},[347,1105,1106,1109,1111],{"class":349,"line":36},[347,1107,1108],{"class":477},"    \u003C\u002F",[347,1110,51],{"class":945},[347,1112,952],{"class":477},[347,1114,1115,1118,1120],{"class":349,"line":73},[347,1116,1117],{"class":477},"  \u003C\u002F",[347,1119,76],{"class":945},[347,1121,952],{"class":477},[347,1123,1124,1126,1128],{"class":349,"line":132},[347,1125,976],{"class":477},[347,1127,991],{"class":945},[347,1129,952],{"class":477},[366,1131,174],{"id":1132},"development",[326,1134,1135,1136,1139],{},"Run ",[344,1137,1138],{},"vite dev"," as usual. Maizzle starts its own dev server alongside SvelteKit:",[337,1141,1143],{"className":339,"code":1142,"language":341,"meta":342,"style":342},"npm run dev\n",[344,1144,1145],{"__ignoreMap":342},[347,1146,1147,1149,1152],{"class":349,"line":18},[347,1148,353],{"class":352},[347,1150,1151],{"class":356}," run",[347,1153,1154],{"class":356}," dev\n",[1156,1157,1158,1166],"ul",{},[1159,1160,1161,1162,1165],"li",{},"Your SvelteKit app runs on its default port (typically ",[344,1163,1164],{},"5173",")",[1159,1167,1168,1169,1165],{},"The Maizzle email preview UI runs on the port you configured (default ",[344,1170,1171],{},"3000",[326,1173,1174],{},"Changes to email templates are automatically reflected in the Maizzle preview UI.",[366,1176,1178],{"id":1177},"production-build","Production build",[326,1180,1181,1182,1185,1186,1189,1190,454],{},"When you run ",[344,1183,1184],{},"vite build",", Maizzle compiles your email templates to static HTML files in the configured ",[344,1187,1188],{},"output.path",", which in our example is ",[344,1191,665],{},[337,1193,1195],{"className":339,"code":1194,"language":341,"meta":342,"style":342},"npm run build\n",[344,1196,1197],{"__ignoreMap":342},[347,1198,1199,1201,1203],{"class":349,"line":18},[347,1200,353],{"class":352},[347,1202,1151],{"class":356},[347,1204,1205],{"class":356}," build\n",[330,1207,1209],{"id":1208},"server-api","Server API",[326,1211,1212,1213,1216],{},"You can render email templates on-demand using Maizzle's ",[344,1214,1215],{},"render"," function in a SvelteKit server route. This is useful when you need to render emails dynamically, for example with user data from a database.",[366,1218,1220],{"id":1219},"api-route","API route",[326,1222,1223],{},"Create a server route that reads and renders an email template:",[337,1225,1229],{"className":1226,"code":1227,"filename":1228,"language":459,"meta":342,"style":342},"language-ts shiki shiki-themes laserwave","import { resolve } from 'node:path'\nimport { json } from '@sveltejs\u002Fkit'\nimport { render } from '@maizzle\u002Fframework'\n\nexport async function POST() {\n  const { html } = await render(resolve('src\u002Femails\u002Fwelcome.vue'))\n\n  return json({ html })\n}\n","src\u002Froutes\u002Fapi\u002Frender\u002F+server.ts",[344,1230,1231,1251,1271,1290,1294,1312,1347,1351,1365],{"__ignoreMap":342},[347,1232,1233,1235,1237,1240,1242,1244,1246,1249],{"class":349,"line":18},[347,1234,467],{"class":466},[347,1236,491],{"class":477},[347,1238,1239],{"class":470}," resolve",[347,1241,497],{"class":477},[347,1243,474],{"class":466},[347,1245,478],{"class":477},[347,1247,1248],{"class":356},"node:path",[347,1250,484],{"class":477},[347,1252,1253,1255,1257,1260,1262,1264,1266,1269],{"class":349,"line":13},[347,1254,467],{"class":466},[347,1256,491],{"class":477},[347,1258,1259],{"class":470}," json",[347,1261,497],{"class":477},[347,1263,474],{"class":466},[347,1265,478],{"class":477},[347,1267,1268],{"class":356},"@sveltejs\u002Fkit",[347,1270,484],{"class":477},[347,1272,1273,1275,1277,1280,1282,1284,1286,1288],{"class":349,"line":32},[347,1274,467],{"class":466},[347,1276,491],{"class":477},[347,1278,1279],{"class":470}," render",[347,1281,497],{"class":477},[347,1283,474],{"class":466},[347,1285,478],{"class":477},[347,1287,547],{"class":356},[347,1289,484],{"class":477},[347,1291,1292],{"class":349,"line":27},[347,1293,555],{"emptyLinePlaceholder":14},[347,1295,1296,1298,1301,1304,1307,1310],{"class":349,"line":52},[347,1297,560],{"class":466},[347,1299,1300],{"class":573}," async ",[347,1302,1303],{"class":957},"function",[347,1305,1306],{"class":352}," POST",[347,1308,1309],{"class":477},"()",[347,1311,738],{"class":477},[347,1313,1314,1316,1318,1321,1323,1325,1328,1330,1333,1336,1338,1340,1342,1344],{"class":349,"line":128},[347,1315,958],{"class":957},[347,1317,491],{"class":477},[347,1319,1320],{"class":470}," html",[347,1322,497],{"class":477},[347,1324,964],{"class":945},[347,1326,1327],{"class":466}," await",[347,1329,1279],{"class":352},[347,1331,1332],{"class":477},"(",[347,1334,1335],{"class":352},"resolve",[347,1337,1332],{"class":477},[347,1339,550],{"class":477},[347,1341,934],{"class":356},[347,1343,550],{"class":477},[347,1345,1346],{"class":477},"))\n",[347,1348,1349],{"class":349,"line":124},[347,1350,555],{"emptyLinePlaceholder":14},[347,1352,1353,1356,1358,1360,1362],{"class":349,"line":48},[347,1354,1355],{"class":466},"  return",[347,1357,1259],{"class":352},[347,1359,603],{"class":477},[347,1361,1320],{"class":470},[347,1363,1364],{"class":477}," })\n",[347,1366,1367],{"class":349,"line":23},[347,1368,911],{"class":477},[326,1370,1371],{},"Or accept an SFC string in the request body:",[337,1373,1375],{"className":1226,"code":1374,"filename":1228,"language":459,"meta":342,"style":342},"import { json } from '@sveltejs\u002Fkit'\nimport { render } from '@maizzle\u002Fframework'\n\nexport async function POST({ request }) {\n  const { template } = await request.json()\n\n  const { html } = await render(template)\n\n  return json({ html })\n}\n",[344,1376,1377,1395,1413,1417,1437,1462,1466,1489,1493,1505],{"__ignoreMap":342},[347,1378,1379,1381,1383,1385,1387,1389,1391,1393],{"class":349,"line":18},[347,1380,467],{"class":466},[347,1382,491],{"class":477},[347,1384,1259],{"class":470},[347,1386,497],{"class":477},[347,1388,474],{"class":466},[347,1390,478],{"class":477},[347,1392,1268],{"class":356},[347,1394,484],{"class":477},[347,1396,1397,1399,1401,1403,1405,1407,1409,1411],{"class":349,"line":13},[347,1398,467],{"class":466},[347,1400,491],{"class":477},[347,1402,1279],{"class":470},[347,1404,497],{"class":477},[347,1406,474],{"class":466},[347,1408,478],{"class":477},[347,1410,547],{"class":356},[347,1412,484],{"class":477},[347,1414,1415],{"class":349,"line":32},[347,1416,555],{"emptyLinePlaceholder":14},[347,1418,1419,1421,1423,1425,1427,1429,1432,1435],{"class":349,"line":27},[347,1420,560],{"class":466},[347,1422,1300],{"class":573},[347,1424,1303],{"class":957},[347,1426,1306],{"class":352},[347,1428,603],{"class":477},[347,1430,1431],{"class":470}," request",[347,1433,1434],{"class":477}," })",[347,1436,738],{"class":477},[347,1438,1439,1441,1443,1446,1448,1450,1452,1454,1457,1459],{"class":349,"line":52},[347,1440,958],{"class":957},[347,1442,491],{"class":477},[347,1444,1445],{"class":470}," template",[347,1447,497],{"class":477},[347,1449,964],{"class":945},[347,1451,1327],{"class":466},[347,1453,1431],{"class":470},[347,1455,1456],{"class":945},".",[347,1458,715],{"class":352},[347,1460,1461],{"class":477},"()\n",[347,1463,1464],{"class":349,"line":128},[347,1465,555],{"emptyLinePlaceholder":14},[347,1467,1468,1470,1472,1474,1476,1478,1480,1482,1484,1486],{"class":349,"line":124},[347,1469,958],{"class":957},[347,1471,491],{"class":477},[347,1473,1320],{"class":470},[347,1475,497],{"class":477},[347,1477,964],{"class":945},[347,1479,1327],{"class":466},[347,1481,1279],{"class":352},[347,1483,1332],{"class":477},[347,1485,991],{"class":470},[347,1487,1488],{"class":477},")\n",[347,1490,1491],{"class":349,"line":48},[347,1492,555],{"emptyLinePlaceholder":14},[347,1494,1495,1497,1499,1501,1503],{"class":349,"line":23},[347,1496,1355],{"class":466},[347,1498,1259],{"class":352},[347,1500,603],{"class":477},[347,1502,1320],{"class":470},[347,1504,1364],{"class":477},[347,1506,1507],{"class":349,"line":140},[347,1508,911],{"class":477},[366,1510,1512],{"id":1511},"displaying-the-result","Displaying the result",[326,1514,1515],{},"Since the rendered email is a full HTML document, use an iframe to display it in your SvelteKit app:",[337,1517,1522],{"className":1518,"code":1519,"filename":1520,"language":1521,"meta":342,"style":342},"language-html shiki shiki-themes laserwave","\u003Cscript lang=\"ts\">\n  import { onMount } from 'svelte'\n\n  let iframeEl: HTMLIFrameElement\n\n  onMount(async () => {\n    const res = await fetch('\u002Fapi\u002Frender', { method: 'POST' })\n    const { html } = await res.json()\n    iframeEl.srcdoc = html\n  })\n\u003C\u002Fscript>\n\n\u003Ciframe bind:this={iframeEl} style=\"width: 100%; height: 100vh; border: none;\">\u003C\u002Fiframe>\n","src\u002Froutes\u002F+page.svelte","html",[344,1523,1524,1543,1564,1568,1581,1585,1603,1645,1667,1682,1687,1695,1699],{"__ignoreMap":342},[347,1525,1526,1528,1530,1533,1535,1537,1539,1541],{"class":349,"line":18},[347,1527,942],{"class":477},[347,1529,946],{"class":945},[347,1531,1532],{"class":352}," lang",[347,1534,1015],{"class":477},[347,1536,733],{"class":477},[347,1538,459],{"class":356},[347,1540,733],{"class":477},[347,1542,952],{"class":477},[347,1544,1545,1548,1550,1553,1555,1557,1559,1562],{"class":349,"line":13},[347,1546,1547],{"class":466},"  import",[347,1549,491],{"class":477},[347,1551,1552],{"class":470}," onMount",[347,1554,497],{"class":477},[347,1556,474],{"class":466},[347,1558,478],{"class":477},[347,1560,1561],{"class":356},"svelte",[347,1563,484],{"class":477},[347,1565,1566],{"class":349,"line":32},[347,1567,555],{"emptyLinePlaceholder":14},[347,1569,1570,1573,1576,1578],{"class":349,"line":27},[347,1571,1572],{"class":957},"  let",[347,1574,1575],{"class":470}," iframeEl",[347,1577,454],{"class":945},[347,1579,1580],{"class":957}," HTMLIFrameElement\n",[347,1582,1583],{"class":349,"line":52},[347,1584,555],{"emptyLinePlaceholder":14},[347,1586,1587,1590,1592,1595,1598,1601],{"class":349,"line":128},[347,1588,1589],{"class":352},"  onMount",[347,1591,1332],{"class":477},[347,1593,1594],{"class":957},"async",[347,1596,1597],{"class":477}," ()",[347,1599,1600],{"class":945}," =>",[347,1602,738],{"class":477},[347,1604,1605,1608,1611,1613,1615,1618,1620,1622,1625,1627,1629,1631,1634,1636,1638,1641,1643],{"class":349,"line":124},[347,1606,1607],{"class":957},"    const",[347,1609,1610],{"class":815}," res",[347,1612,964],{"class":945},[347,1614,1327],{"class":466},[347,1616,1617],{"class":352}," fetch",[347,1619,1332],{"class":477},[347,1621,550],{"class":477},[347,1623,1624],{"class":356},"\u002Fapi\u002Frender",[347,1626,550],{"class":477},[347,1628,621],{"class":477},[347,1630,491],{"class":477},[347,1632,1633],{"class":466}," method",[347,1635,454],{"class":477},[347,1637,478],{"class":477},[347,1639,1640],{"class":356},"POST",[347,1642,550],{"class":477},[347,1644,1364],{"class":477},[347,1646,1647,1649,1651,1653,1655,1657,1659,1661,1663,1665],{"class":349,"line":48},[347,1648,1607],{"class":957},[347,1650,491],{"class":477},[347,1652,1320],{"class":815},[347,1654,497],{"class":477},[347,1656,964],{"class":945},[347,1658,1327],{"class":466},[347,1660,1610],{"class":470},[347,1662,1456],{"class":477},[347,1664,715],{"class":352},[347,1666,1461],{"class":477},[347,1668,1669,1672,1674,1677,1679],{"class":349,"line":23},[347,1670,1671],{"class":470},"    iframeEl",[347,1673,1456],{"class":477},[347,1675,1676],{"class":466},"srcdoc",[347,1678,964],{"class":945},[347,1680,1681],{"class":470}," html\n",[347,1683,1684],{"class":349,"line":140},[347,1685,1686],{"class":477},"  })\n",[347,1688,1689,1691,1693],{"class":349,"line":56},[347,1690,976],{"class":477},[347,1692,946],{"class":945},[347,1694,952],{"class":477},[347,1696,1697],{"class":349,"line":80},[347,1698,555],{"emptyLinePlaceholder":14},[347,1700,1701,1703,1706,1709,1711,1714,1717,1719,1721,1724,1726,1729,1731],{"class":349,"line":36},[347,1702,942],{"class":477},[347,1704,1705],{"class":945},"iframe",[347,1707,1708],{"class":352}," bind:this",[347,1710,1015],{"class":477},[347,1712,1713],{"class":356},"{iframeEl}",[347,1715,1716],{"class":352}," style",[347,1718,1015],{"class":477},[347,1720,733],{"class":477},[347,1722,1723],{"class":356},"width: 100%; height: 100vh; border: none;",[347,1725,733],{"class":477},[347,1727,1728],{"class":477},">\u003C\u002F",[347,1730,1705],{"class":945},[347,1732,952],{"class":477},[366,1734,1736],{"id":1735},"sending-emails","Sending emails",[326,1738,1739,1740,454],{},"You can use the rendered HTML to send emails directly from a server route. Here's an example using ",[696,1741,161],{"href":1742,"rel":1743,"target":1745},"https:\u002F\u002Fnodemailer.com\u002F",[1744],"nofollow","_blank",[337,1747,1750],{"className":1226,"code":1748,"filename":1749,"language":459,"meta":342,"style":342},"import { resolve } from 'node:path'\nimport { json } from '@sveltejs\u002Fkit'\nimport { render } from '@maizzle\u002Fframework'\nimport { createTransport } from 'nodemailer'\n\nconst transporter = createTransport({\n  host: 'smtp.example.com',\n  port: 587,\n  auth: {\n    user: process.env.SMTP_USER,\n    pass: process.env.SMTP_PASS,\n  },\n})\n\nexport async function POST({ request }) {\n  const { to } = await request.json()\n\n  const { html } = await render(resolve('src\u002Femails\u002Fwelcome.vue'))\n\n  await transporter.sendMail({\n    from: 'no-reply@example.com',\n    to,\n    subject: 'Welcome!',\n    html,\n  })\n\n  return json({ success: true })\n}\n","src\u002Froutes\u002Fapi\u002Fsend\u002F+server.ts",[344,1751,1752,1770,1788,1806,1826,1830,1844,1860,1873,1882,1904,1924,1928,1932,1936,1954,1977,1981,2011,2015,2029,2045,2052,2068,2075,2080,2084,2101],{"__ignoreMap":342},[347,1753,1754,1756,1758,1760,1762,1764,1766,1768],{"class":349,"line":18},[347,1755,467],{"class":466},[347,1757,491],{"class":477},[347,1759,1239],{"class":470},[347,1761,497],{"class":477},[347,1763,474],{"class":466},[347,1765,478],{"class":477},[347,1767,1248],{"class":356},[347,1769,484],{"class":477},[347,1771,1772,1774,1776,1778,1780,1782,1784,1786],{"class":349,"line":13},[347,1773,467],{"class":466},[347,1775,491],{"class":477},[347,1777,1259],{"class":470},[347,1779,497],{"class":477},[347,1781,474],{"class":466},[347,1783,478],{"class":477},[347,1785,1268],{"class":356},[347,1787,484],{"class":477},[347,1789,1790,1792,1794,1796,1798,1800,1802,1804],{"class":349,"line":32},[347,1791,467],{"class":466},[347,1793,491],{"class":477},[347,1795,1279],{"class":470},[347,1797,497],{"class":477},[347,1799,474],{"class":466},[347,1801,478],{"class":477},[347,1803,547],{"class":356},[347,1805,484],{"class":477},[347,1807,1808,1810,1812,1815,1817,1819,1821,1824],{"class":349,"line":27},[347,1809,467],{"class":466},[347,1811,491],{"class":477},[347,1813,1814],{"class":470}," createTransport",[347,1816,497],{"class":477},[347,1818,474],{"class":466},[347,1820,478],{"class":477},[347,1822,1823],{"class":356},"nodemailer",[347,1825,484],{"class":477},[347,1827,1828],{"class":349,"line":52},[347,1829,555],{"emptyLinePlaceholder":14},[347,1831,1832,1835,1838,1840,1842],{"class":349,"line":128},[347,1833,1834],{"class":957},"const",[347,1836,1837],{"class":470}," transporter",[347,1839,964],{"class":945},[347,1841,1814],{"class":352},[347,1843,568],{"class":477},[347,1845,1846,1849,1851,1853,1856,1858],{"class":349,"line":124},[347,1847,1848],{"class":573},"  host",[347,1850,454],{"class":477},[347,1852,478],{"class":477},[347,1854,1855],{"class":356},"smtp.example.com",[347,1857,550],{"class":477},[347,1859,761],{"class":477},[347,1861,1862,1865,1867,1871],{"class":349,"line":48},[347,1863,1864],{"class":573},"  port",[347,1866,454],{"class":477},[347,1868,1870],{"class":1869},"s0EtI"," 587",[347,1872,761],{"class":477},[347,1874,1875,1878,1880],{"class":349,"line":23},[347,1876,1877],{"class":573},"  auth",[347,1879,454],{"class":477},[347,1881,738],{"class":477},[347,1883,1884,1887,1889,1892,1894,1897,1899,1902],{"class":349,"line":140},[347,1885,1886],{"class":573},"    user",[347,1888,454],{"class":477},[347,1890,1891],{"class":470}," process",[347,1893,1456],{"class":945},[347,1895,1896],{"class":470},"env",[347,1898,1456],{"class":945},[347,1900,1901],{"class":470},"SMTP_USER",[347,1903,761],{"class":477},[347,1905,1906,1909,1911,1913,1915,1917,1919,1922],{"class":349,"line":56},[347,1907,1908],{"class":573},"    pass",[347,1910,454],{"class":477},[347,1912,1891],{"class":470},[347,1914,1456],{"class":945},[347,1916,1896],{"class":470},[347,1918,1456],{"class":945},[347,1920,1921],{"class":470},"SMTP_PASS",[347,1923,761],{"class":477},[347,1925,1926],{"class":349,"line":80},[347,1927,867],{"class":477},[347,1929,1930],{"class":349,"line":36},[347,1931,691],{"class":477},[347,1933,1934],{"class":349,"line":73},[347,1935,555],{"emptyLinePlaceholder":14},[347,1937,1938,1940,1942,1944,1946,1948,1950,1952],{"class":349,"line":132},[347,1939,560],{"class":466},[347,1941,1300],{"class":573},[347,1943,1303],{"class":957},[347,1945,1306],{"class":352},[347,1947,603],{"class":477},[347,1949,1431],{"class":470},[347,1951,1434],{"class":477},[347,1953,738],{"class":477},[347,1955,1956,1958,1960,1963,1965,1967,1969,1971,1973,1975],{"class":349,"line":66},[347,1957,958],{"class":957},[347,1959,491],{"class":477},[347,1961,1962],{"class":470}," to",[347,1964,497],{"class":477},[347,1966,964],{"class":945},[347,1968,1327],{"class":466},[347,1970,1431],{"class":470},[347,1972,1456],{"class":945},[347,1974,715],{"class":352},[347,1976,1461],{"class":477},[347,1978,1979],{"class":349,"line":112},[347,1980,555],{"emptyLinePlaceholder":14},[347,1982,1983,1985,1987,1989,1991,1993,1995,1997,1999,2001,2003,2005,2007,2009],{"class":349,"line":40},[347,1984,958],{"class":957},[347,1986,491],{"class":477},[347,1988,1320],{"class":470},[347,1990,497],{"class":477},[347,1992,964],{"class":945},[347,1994,1327],{"class":466},[347,1996,1279],{"class":352},[347,1998,1332],{"class":477},[347,2000,1335],{"class":352},[347,2002,1332],{"class":477},[347,2004,550],{"class":477},[347,2006,934],{"class":356},[347,2008,550],{"class":477},[347,2010,1346],{"class":477},[347,2012,2013],{"class":349,"line":44},[347,2014,555],{"emptyLinePlaceholder":14},[347,2016,2017,2020,2022,2024,2027],{"class":349,"line":84},[347,2018,2019],{"class":466},"  await",[347,2021,1837],{"class":470},[347,2023,1456],{"class":945},[347,2025,2026],{"class":352},"sendMail",[347,2028,568],{"class":477},[347,2030,2031,2034,2036,2038,2041,2043],{"class":349,"line":96},[347,2032,2033],{"class":573},"    from",[347,2035,454],{"class":477},[347,2037,478],{"class":477},[347,2039,2040],{"class":356},"no-reply@example.com",[347,2042,550],{"class":477},[347,2044,761],{"class":477},[347,2046,2047,2050],{"class":349,"line":88},[347,2048,2049],{"class":470},"    to",[347,2051,761],{"class":477},[347,2053,2054,2057,2059,2061,2064,2066],{"class":349,"line":100},[347,2055,2056],{"class":573},"    subject",[347,2058,454],{"class":477},[347,2060,478],{"class":477},[347,2062,2063],{"class":356},"Welcome!",[347,2065,550],{"class":477},[347,2067,761],{"class":477},[347,2069,2070,2073],{"class":349,"line":144},[347,2071,2072],{"class":470},"    html",[347,2074,761],{"class":477},[347,2076,2078],{"class":349,"line":2077},25,[347,2079,1686],{"class":477},[347,2081,2082],{"class":349,"line":92},[347,2083,555],{"emptyLinePlaceholder":14},[347,2085,2086,2088,2090,2092,2095,2097,2099],{"class":349,"line":148},[347,2087,1355],{"class":466},[347,2089,1259],{"class":352},[347,2091,603],{"class":477},[347,2093,2094],{"class":573}," success",[347,2096,454],{"class":477},[347,2098,816],{"class":815},[347,2100,1364],{"class":477},[347,2102,2103],{"class":349,"line":120},[347,2104,911],{"class":477},[330,2106,2108],{"id":2107},"static-assets","Static assets",[326,2110,2111,2112,2115],{},"To include images or other static files with your emails, configure the ",[344,2113,2114],{},"static"," option:",[337,2117,2119],{"className":457,"code":2118,"filename":453,"language":459,"meta":342,"style":342},"import tailwindcss from '@tailwindcss\u002Fvite'\nimport { sveltekit } from '@sveltejs\u002Fkit\u002Fvite'\nimport { defineConfig } from 'vite'\nimport { maizzle } from '@maizzle\u002Fframework'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss(),\n    sveltekit(),\n    maizzle({\n      content: ['.\u002Fsrc\u002Femails\u002F**\u002F*.vue'],\n      output: {\n        path: 'dist\u002Femails',\n      },\n      static: { \u002F\u002F [!code ++]\n        source: ['src\u002Femails\u002Fimages'], \u002F\u002F [!code ++]\n      }, \u002F\u002F [!code ++]\n    }),\n  ],\n})\n",[344,2120,2121,2135,2153,2171,2189,2193,2203,2211,2217,2223,2229,2247,2255,2269,2274,2284,2303,2308,2313,2317],{"__ignoreMap":342},[347,2122,2123,2125,2127,2129,2131,2133],{"class":349,"line":18},[347,2124,467],{"class":466},[347,2126,471],{"class":470},[347,2128,474],{"class":466},[347,2130,478],{"class":477},[347,2132,481],{"class":356},[347,2134,484],{"class":477},[347,2136,2137,2139,2141,2143,2145,2147,2149,2151],{"class":349,"line":13},[347,2138,467],{"class":466},[347,2140,491],{"class":477},[347,2142,494],{"class":470},[347,2144,497],{"class":477},[347,2146,474],{"class":466},[347,2148,478],{"class":477},[347,2150,504],{"class":356},[347,2152,484],{"class":477},[347,2154,2155,2157,2159,2161,2163,2165,2167,2169],{"class":349,"line":32},[347,2156,467],{"class":466},[347,2158,491],{"class":477},[347,2160,515],{"class":470},[347,2162,497],{"class":477},[347,2164,474],{"class":466},[347,2166,478],{"class":477},[347,2168,524],{"class":356},[347,2170,484],{"class":477},[347,2172,2173,2175,2177,2179,2181,2183,2185,2187],{"class":349,"line":27},[347,2174,467],{"class":466},[347,2176,491],{"class":477},[347,2178,538],{"class":470},[347,2180,497],{"class":477},[347,2182,474],{"class":466},[347,2184,478],{"class":477},[347,2186,547],{"class":356},[347,2188,484],{"class":477},[347,2190,2191],{"class":349,"line":52},[347,2192,555],{"emptyLinePlaceholder":14},[347,2194,2195,2197,2199,2201],{"class":349,"line":128},[347,2196,560],{"class":466},[347,2198,563],{"class":466},[347,2200,515],{"class":352},[347,2202,568],{"class":477},[347,2204,2205,2207,2209],{"class":349,"line":124},[347,2206,574],{"class":573},[347,2208,454],{"class":477},[347,2210,579],{"class":477},[347,2212,2213,2215],{"class":349,"line":48},[347,2214,584],{"class":352},[347,2216,587],{"class":477},[347,2218,2219,2221],{"class":349,"line":23},[347,2220,592],{"class":352},[347,2222,587],{"class":477},[347,2224,2225,2227],{"class":349,"line":140},[347,2226,600],{"class":352},[347,2228,568],{"class":477},[347,2230,2231,2233,2235,2237,2239,2242,2244],{"class":349,"line":56},[347,2232,627],{"class":573},[347,2234,454],{"class":477},[347,2236,632],{"class":477},[347,2238,550],{"class":477},[347,2240,2241],{"class":356},".\u002Fsrc\u002Femails\u002F**\u002F*.vue",[347,2243,550],{"class":477},[347,2245,2246],{"class":477},"],\n",[347,2248,2249,2251,2253],{"class":349,"line":80},[347,2250,648],{"class":573},[347,2252,454],{"class":477},[347,2254,738],{"class":477},[347,2256,2257,2259,2261,2263,2265,2267],{"class":349,"line":36},[347,2258,658],{"class":573},[347,2260,454],{"class":477},[347,2262,478],{"class":477},[347,2264,665],{"class":356},[347,2266,550],{"class":477},[347,2268,761],{"class":477},[347,2270,2271],{"class":349,"line":73},[347,2272,2273],{"class":477},"      },\n",[347,2275,2277,2280,2282],{"class":2276,"line":132},[349,530,531],[347,2278,2279],{"class":573},"      static",[347,2281,454],{"class":477},[347,2283,491],{"class":477},[347,2285,2287,2290,2292,2294,2296,2299,2301],{"class":2286,"line":66},[349,530,531],[347,2288,2289],{"class":573},"        source",[347,2291,454],{"class":477},[347,2293,632],{"class":477},[347,2295,550],{"class":477},[347,2297,2298],{"class":356},"src\u002Femails\u002Fimages",[347,2300,550],{"class":477},[347,2302,642],{"class":477},[347,2304,2306],{"class":2305,"line":112},[349,530,531],[347,2307,675],{"class":477},[347,2309,2310],{"class":349,"line":40},[347,2311,2312],{"class":477},"    }),\n",[347,2314,2315],{"class":349,"line":44},[347,2316,686],{"class":477},[347,2318,2319],{"class":349,"line":84},[347,2320,691],{"class":477},[326,2322,2323],{},"Static files are copied to the output directory during production builds.",[330,2325,2327],{"id":2326},"other-frameworks","Other frameworks",[326,2329,2330],{},"Not using SvelteKit? Check out the other framework guides:",[2332,2333],"framework-guides",{":exclude":324},[2335,2336,2337],"style",{},"html pre.shiki code .sZNF3, html code.shiki .sZNF3{--shiki-default:#EB64B9}html pre.shiki code .sXiT_, html code.shiki .sXiT_{--shiki-default:#B4DCE7}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html pre.shiki code .s0ZPN, html code.shiki .s0ZPN{--shiki-default:#40B4C4}html pre.shiki code .sU-n2, html code.shiki .sU-n2{--shiki-default:#FFF}html pre.shiki code .sGGKt, html code.shiki .sGGKt{--shiki-default:#7B6995}html pre.shiki code .sLaUg, html code.shiki .sLaUg{--shiki-default:#FFFFFF}html pre.shiki code .skd8d, html code.shiki .skd8d{--shiki-default:#FFE261}html pre.shiki code .sb4Pa, html code.shiki .sb4Pa{--shiki-default:#74DFC4}html pre.shiki code .sIihq, html code.shiki .sIihq{--shiki-default:#A96BC0}html pre.shiki code .s0EtI, html code.shiki .s0EtI{--shiki-default:#B381C5}",{"title":342,"searchDepth":13,"depth":13,"links":2339},[2340,2341,2346,2350,2355,2356],{"id":332,"depth":13,"text":227},{"id":363,"depth":13,"text":364,"children":2342},[2343,2344,2345],{"id":368,"depth":32,"text":369},{"id":446,"depth":32,"text":447},{"id":701,"depth":32,"text":702},{"id":914,"depth":13,"text":915,"children":2347},[2348,2349],{"id":1132,"depth":32,"text":174},{"id":1177,"depth":32,"text":1178},{"id":1208,"depth":13,"text":1209,"children":2351},[2352,2353,2354],{"id":1219,"depth":32,"text":1220},{"id":1511,"depth":32,"text":1512},{"id":1735,"depth":32,"text":1736},{"id":2107,"depth":13,"text":2108},{"id":2326,"depth":13,"text":2327},"How to use Maizzle with SvelteKit to build email templates alongside your web application.","md",{},{"title":221,"description":2357},"docs\u002Finstallation\u002Fframeworks\u002Fsveltekit","cWaWn4rwNag_kH60vDOV6MhtJ1rGNqbGy3PaSj5Xee4",1781015475649]