create-dokio 0.1.1

package/README.md

@@ -0,0 +1,137 @@
+# create-dokio
+
+CLI scaffold for Dokio templates. Generates the correct file structure, `data.yaml`, HTML boilerplate, and SCSS partials for PDF, General, Email, and Video template types.
+
+## Usage
+
+```bash
+# Interactive — prompts for everything
+npx create-dokio
+
+# Pre-fill the template name
+npx create-dokio pool-care
+```
+
+> Using pnpm? `pnpm dlx create-dokio`
+
+---
+
+## Template types
+
+### PDF
+PrinceXML-rendered print documents. Supports multi-page, resizable layouts, orderable exports, and proof downloads.
+
+```
+dokio-pool-care/
+├── CHANGELOG.md
+├── data.yaml
+├── index.html
+├── assets/
+├── partials/
+│   ├── page1-cover.html
+│   ├── page2-content.html
+│   └── page3-cta.html
+└── scss/
+    ├── style.scss.hbs
+    ├── _fonts.scss
+    ├── _mixins.scss
+    ├── _variables.scss
+    └── pages/
+        ├── _page1.scss
+        ├── _page2.scss
+        └── _page3.scss
+```
+
+**Prompts:**
+- Page dimensions (mm)
+- Page count
+- PrinceXML version (11 or 15 — use 15 for flexbox)
+- Resizable template
+- Proof downloads (`draft_proofable`)
+- Orderable export (Print from Snap)
+
+---
+
+### General (image)
+Chrome-rendered image output — JPG and/or PNG. Single or multi-section layouts.
+
+**Prompts:**
+- Dimensions (px)
+- Page/section count
+- Export formats (JPG, PNG, or both)
+
+---
+
+### Email
+HTML email scaffold. Includes Outlook conditional comments, `{{{___assembled_css}}}` injection, `{{{subject}}}` title, and Gmail-safe table structure.
+
+**Prompts:**
+- Subdomain only — email structure is fixed at 600px
+
+---
+
+### Video *(WIP)*
+1920×1080 video template scaffold. `data.yaml` includes duration and highlight point fields.
+
+---
+
+## What gets generated
+
+| File | Description |
+|---|---|
+| `data.yaml` | Dokio template config — set your template ID and subdomain before upload |
+| `index.html` | Entry HTML with Handlebars partial includes |
+| `partials/*.html` | Per-page/section HTML fragments |
+| `scss/style.scss.hbs` | Main SCSS entry — supports Handlebars syntax |
+| `scss/_fonts.scss` | Empty with commented `@font-face` example |
+| `scss/_variables.scss` | Dimension, colour, and typography variables |
+| `scss/_mixins.scss` | `absolute()`, `flex()`, `truncate()` mixins |
+| `scss/pages/_pageN.scss` | Per-page style partials |
+| `assets/` | Drop fonts, images, and local assets here |
+| `CHANGELOG.md` | Template-level changelog |
+
+---
+
+## After scaffolding
+
+```bash
+cd dokio-<name>
+
+# 1. Set your template ID in data.yaml
+#    name: TEMPLATEID - dokio-<name>  ← replace TEMPLATEID
+
+# 2. Change subdomain from 'test' before uploading
+#    subdomain: your-hub-subdomain
+
+# 3. Add fonts/images to assets/
+#    Declare fonts in scss/_fonts.scss
+```
+
+---
+
+## Development
+
+```bash
+git clone <repo>
+pnpm install
+pnpm dev       # watch mode
+pnpm build     # compile to dist/
+```
+
+### Commit format
+
+This repo uses [Conventional Commits](https://www.conventionalcommits.org/):
+
+```
+feat: add resizable PDF option
+fix: correct page count in data.yaml
+chore: update dependencies
+```
+
+`CHANGELOG.md` updates automatically on `git push`.
+
+---
+
+## License
+
+MIT

package/dist/index.js

@@ -0,0 +1,846 @@
+#!/usr/bin/env node
+
+// src/index.ts
+import kleur3 from "kleur";
+
+// src/prompts.ts
+import prompts from "prompts";
+import kleur from "kleur";
+
+// src/utils.ts
+function toKebab(str) {
+  return str.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");
+}
+function getPageName(index, total) {
+  if (total === 1) return "page1";
+  if (index === 0) return "page1-cover";
+  if (index === total - 1) return `page${index + 1}-cta`;
+  return `page${index + 1}-content`;
+}
+function buildPages(pageCount) {
+  return Array.from({ length: pageCount }, (_, i) => getPageName(i, pageCount));
+}
+
+// src/prompts.ts
+var onCancel = () => {
+  console.log(kleur.yellow("\n  Cancelled.\n"));
+  process.exit(0);
+};
+async function runPrompts(nameArg) {
+  const base = await prompts(
+    [
+      {
+        type: nameArg ? null : "text",
+        name: "name",
+        message: 'Template name (kebab-case, no "dokio-" prefix)',
+        initial: "my-template",
+        validate: (v) => /^[a-z0-9-]+$/.test(v) || "Lowercase letters, numbers, hyphens only"
+      },
+      {
+        type: "select",
+        name: "mode",
+        message: "Template type",
+        choices: [
+          { title: "PDF", value: "pdf" },
+          { title: "General  (image/JPG/PNG)", value: "general" },
+          { title: kleur.dim("Video  [WIP]"), value: "video" },
+          { title: "Email", value: "email" }
+        ]
+      },
+      {
+        type: "text",
+        name: "subdomain",
+        message: "Subdomain",
+        initial: "test"
+      }
+    ],
+    { onCancel }
+  );
+  const name = nameArg ? toKebab(nameArg) : base.name;
+  const fullName = `dokio-${name}`;
+  const subdomain = base.subdomain;
+  if (base.mode === "pdf") {
+    const pdf = await prompts(
+      [
+        { type: "number", name: "width", message: "Page width (mm)", initial: 210, min: 1 },
+        { type: "number", name: "height", message: "Page height (mm)", initial: 297, min: 1 },
+        { type: "number", name: "pageCount", message: "Number of pages", initial: 1, min: 1 },
+        {
+          type: "select",
+          name: "princeVersion",
+          message: "PrinceXML version",
+          choices: [
+            { title: "15  (flexbox support \u2014 recommended)", value: 15 },
+            { title: "11  (legacy)", value: 11 }
+          ]
+        },
+        {
+          type: "toggle",
+          name: "resizable",
+          message: "Resizable template?",
+          initial: false,
+          active: "yes",
+          inactive: "no"
+        },
+        {
+          type: "toggle",
+          name: "proofable",
+          message: "Enable proof downloads (draft_proofable)?",
+          initial: true,
+          active: "yes",
+          inactive: "no"
+        },
+        {
+          type: "toggle",
+          name: "orderable",
+          message: "Include orderable export (Print from Snap)?",
+          initial: false,
+          active: "yes",
+          inactive: "no"
+        }
+      ],
+      { onCancel }
+    );
+    return {
+      mode: "pdf",
+      name,
+      fullName,
+      subdomain,
+      width: pdf.width,
+      height: pdf.height,
+      pageCount: pdf.pageCount,
+      princeVersion: pdf.princeVersion,
+      resizable: pdf.resizable,
+      proofable: pdf.proofable,
+      orderable: pdf.orderable
+    };
+  }
+  if (base.mode === "general") {
+    const gen = await prompts(
+      [
+        { type: "number", name: "width", message: "Width (px)", initial: 400, min: 1 },
+        { type: "number", name: "height", message: "Height (px)", initial: 400, min: 1 },
+        {
+          type: "number",
+          name: "pageCount",
+          message: "Number of pages / sections",
+          initial: 1,
+          min: 1
+        },
+        {
+          type: "multiselect",
+          name: "exportFormats",
+          message: "Export formats",
+          choices: [
+            { title: "JPG", value: "jpg", selected: true },
+            { title: "PNG", value: "png", selected: true }
+          ],
+          min: 1
+        }
+      ],
+      { onCancel }
+    );
+    return {
+      mode: "general",
+      name,
+      fullName,
+      subdomain,
+      width: gen.width,
+      height: gen.height,
+      pageCount: gen.pageCount,
+      exportFormats: gen.exportFormats
+    };
+  }
+  if (base.mode === "video") {
+    return { mode: "video", name, fullName, subdomain };
+  }
+  return { mode: "email", name, fullName, subdomain };
+}
+
+// src/scaffold.ts
+import { join } from "path";
+import fse from "fs-extra";
+import kleur2 from "kleur";
+
+// src/templates/shared.ts
+function changelog(fullName) {
+  return `# Changelog
+
+All notable changes to **${fullName}** will be documented here.
+
+## [Unreleased]
+
+### Added
+- Initial scaffold
+`;
+}
+function gitkeep() {
+  return "";
+}
+function fontsScss() {
+  const weights = [
+    ["Regular", 400],
+    ["Light", 300],
+    ["Medium", 500],
+    ["SemiBold", 600],
+    ["Bold", 700],
+    ["Black", 900]
+  ];
+  return weights.map(
+    ([variant, weight]) => `@font-face {
+  font-family: 'Montserrat';
+  src: url('../assets/Montserrat-${variant}.ttf') format('truetype');
+  font-weight: ${weight};
+  font-style: normal;
+}`
+  ).join("\n\n") + "\n";
+}
+function fontsScssEmpty() {
+  return `// Add custom fonts here.
+// Place font files in assets/ and declare them below.
+//
+// Example:
+//
+// @font-face {
+//   font-family: 'Montserrat';
+//   src: url('../assets/Montserrat-Regular.ttf') format('truetype');
+//   font-weight: 400;
+//   font-style: normal;
+// }
+//
+// @font-face {
+//   font-family: 'Montserrat';
+//   src: url('../assets/Montserrat-Bold.ttf') format('truetype');
+//   font-weight: 700;
+//   font-style: normal;
+// }
+`;
+}
+function mixinsScss() {
+  return `@mixin absolute($top: auto, $right: auto, $bottom: auto, $left: auto) {
+  position: absolute;
+  top: $top;
+  right: $right;
+  bottom: $bottom;
+  left: $left;
+}
+
+@mixin flex($align: center, $justify: center, $direction: row) {
+  display: flex;
+  align-items: $align;
+  justify-content: $justify;
+  flex-direction: $direction;
+}
+
+@mixin truncate($lines: 1) {
+  @if $lines == 1 {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  } @else {
+    display: -webkit-box;
+    -webkit-line-clamp: $lines;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+}
+`;
+}
+
+// src/templates/pdf.ts
+function pdfFiles(config, pages) {
+  return {
+    "CHANGELOG.md": changelog(config.fullName),
+    "data.yaml": pdfYaml(config),
+    "index.html": pdfHtml(pages),
+    "assets/.gitkeep": gitkeep(),
+    ...pdfPartials(pages),
+    "scss/style.scss.hbs": pdfStyleSass(config, pages),
+    "scss/_fonts.scss": fontsScssEmpty(),
+    "scss/_variables.scss": pdfVariables(config),
+    "scss/_mixins.scss": mixinsScss(),
+    ...pdfPageScss(pages)
+  };
+}
+function pdfYaml(config) {
+  const { fullName, subdomain, width, height, pageCount, princeVersion, resizable, proofable, orderable } = config;
+  const lines = [
+    `name: TEMPLATEID - ${fullName}`,
+    `mode: pdf`,
+    `prince_version: ${princeVersion}`,
+    `status: 0`,
+    `subdomain: ${subdomain}`,
+    `dimension_mode: mm`,
+    `page_count: ${pageCount}`,
+    `dimension_width: ${width}`,
+    `dimension_height: ${height}`,
+    `compositing_data: {}`
+  ];
+  if (proofable) lines.push(`draft_proofable: true`);
+  if (resizable) lines.push(`resizable: true`);
+  lines.push(`export_options:`);
+  if (orderable) {
+    lines.push(
+      `  orderable:`,
+      `    title: Print order`,
+      `    description: Order from Snap`,
+      `    description_complete: Ordered from Snap`,
+      `    title_download: Download for your own printer`,
+      `    description_download: Download for your own printer`,
+      `    description_download_complete: Downloaded for your own printer`,
+      `    marks: true`,
+      `    bleed: true`,
+      `    supplier_choice: true`
+    );
+  }
+  lines.push(
+    `  downloadables:`,
+    `    hi_res:`,
+    `      title: Hi-res Download`,
+    `      renderer: pdf`,
+    `      marks: true`,
+    `      bleed: true`,
+    `      slug: false`,
+    `      approval_required: false`,
+    `      disable_printing: false`,
+    `    low-res-pdf:`,
+    `      title: Local Printer PDF - Use this version when emailing or printing in-house.`,
+    `      renderer: pdf`,
+    `      bleed: false`,
+    `      slug: false`,
+    `      marks: false`,
+    `      approval_required: false`,
+    `      disable_printing: false`,
+    `      resolution: 200`,
+    `fields_data:`
+  );
+  return lines.join("\n") + "\n";
+}
+function pdfHtml(pages) {
+  const partialIncludes = pages.map((p) => `  {{> ${p}}}`).join("\n");
+  return `{{ pragma "disable-legacy-nesting" }}
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+</head>
+<body>
+${partialIncludes}
+</body>
+</html>
+`;
+}
+function pdfPartials(pages) {
+  return Object.fromEntries(
+    pages.map((pageName, i) => {
+      const label = pageName.includes("-") ? pageName.split("-").slice(1).join(" ") : `page ${i + 1}`;
+      return [
+        `partials/${pageName}.html`,
+        `<div class="page ${pageName}">
+  {{! ${label} }}
+</div>
+`
+      ];
+    })
+  );
+}
+function pdfStyleSass(config, pages) {
+  const { width, height, resizable } = config;
+  const pageImports = pages.map((_, i) => `@import 'pages/page${i + 1}';`).join("\n");
+  if (resizable) {
+    return `@import 'fonts';
+@import 'variables';
+@import 'mixins';
+
+${pageImports}
+
+{{! Add resizable page sizes below \u2014 update data.yaml select field to match }}
+{{#if_eq page-size 'A4'}}
+  @page { size: ${width}mm ${height}mm; }
+  $multiplier: 1;
+{{/if_eq}}
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+.page {
+  width: ${width}mm * $multiplier;
+  height: ${height}mm * $multiplier;
+  position: relative;
+  overflow: hidden;
+  page-break-after: always;
+
+  &:last-child {
+    page-break-after: avoid;
+  }
+}
+`;
+  }
+  return `@import 'fonts';
+@import 'variables';
+@import 'mixins';
+
+${pageImports}
+
+@page {
+  size: ${width}mm ${height}mm;
+  padding: 0;
+  margin: 0;
+}
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  width: ${width}mm;
+}
+
+.page {
+  width: ${width}mm;
+  height: ${height}mm;
+  position: relative;
+  overflow: hidden;
+  page-break-after: always;
+
+  &:last-child {
+    page-break-after: avoid;
+  }
+}
+`;
+}
+function pdfVariables(config) {
+  return `// Dimensions
+$page-width: ${config.width}mm;
+$page-height: ${config.height}mm;
+
+// Typography
+$font-primary: 'Montserrat', Arial, sans-serif;
+
+// Colors \u2014 update to match brand
+$color-primary: #000000;
+$color-secondary: #ffffff;
+$color-accent: #0079C8;
+`;
+}
+function pdfPageScss(pages) {
+  return Object.fromEntries(
+    pages.map((pageName, i) => {
+      const label = pageName.includes("-") ? pageName.split("-").slice(1).join(" ") : `page ${i + 1}`;
+      return [`scss/pages/_page${i + 1}.scss`, `.${pageName} {
+  // ${label} styles
+}
+`];
+    })
+  );
+}
+
+// src/templates/general.ts
+function generalFiles(config, pages) {
+  return {
+    "CHANGELOG.md": changelog(config.fullName),
+    "data.yaml": generalYaml(config),
+    "index.html": generalHtml(pages),
+    "assets/.gitkeep": gitkeep(),
+    ...generalPartials(pages),
+    "scss/style.scss.hbs": generalStyleSass(config, pages),
+    "scss/_fonts.scss": fontsScssEmpty(),
+    "scss/_variables.scss": generalVariables(config),
+    "scss/_mixins.scss": mixinsScss(),
+    ...generalPageScss(pages)
+  };
+}
+function generalYaml(config) {
+  const { fullName, subdomain, width, height, pageCount, exportFormats } = config;
+  const lines = [
+    `name: TEMPLATEID - ${fullName}`,
+    `mode: general`,
+    `subdomain: ${subdomain}`,
+    `dimension_mode: px`,
+    `page_count: ${pageCount}`,
+    `dimension_width: ${width}`,
+    `dimension_height: ${height}`,
+    `compositing_data: {}`,
+    `export_options:`,
+    `  downloadables:`
+  ];
+  if (exportFormats.includes("jpg")) {
+    lines.push(
+      `    jpg_chrome:`,
+      `      title: JPG`,
+      `      renderer: image`,
+      `      format: jpg`
+    );
+  }
+  if (exportFormats.includes("png")) {
+    lines.push(
+      `    png_chrome:`,
+      `      title: PNG`,
+      `      renderer: image`,
+      `      format: png`
+    );
+  }
+  lines.push(`fields_data:`);
+  return lines.join("\n") + "\n";
+}
+function generalHtml(pages) {
+  if (pages.length > 1) {
+    const partialIncludes = pages.map((p) => `  {{> ${p}}}`).join("\n");
+    return `{{ pragma "disable-legacy-nesting" }}
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+</head>
+<body>
+${partialIncludes}
+</body>
+</html>
+`;
+  }
+  return `{{ pragma "disable-legacy-nesting" }}
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+</head>
+<body>
+  <div class="page">
+    {{! Template content here }}
+  </div>
+</body>
+</html>
+`;
+}
+function generalPartials(pages) {
+  if (pages.length <= 1) return {};
+  return Object.fromEntries(
+    pages.map((pageName, i) => {
+      const label = pageName.includes("-") ? pageName.split("-").slice(1).join(" ") : `section ${i + 1}`;
+      return [
+        `partials/${pageName}.html`,
+        `<div class="page ${pageName}">
+  {{! ${label} }}
+</div>
+`
+      ];
+    })
+  );
+}
+function generalStyleSass(config, pages) {
+  const { width, height } = config;
+  const pageImports = pages.map((_, i) => `@import 'pages/page${i + 1}';`).join("\n");
+  return `@import 'fonts';
+@import 'variables';
+@import 'mixins';
+
+${pageImports}
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  width: ${width}px;
+  height: ${height}px;
+}
+
+.page {
+  width: ${width}px;
+  height: ${height}px;
+  position: relative;
+  overflow: hidden;
+}
+`;
+}
+function generalVariables(config) {
+  return `// Dimensions
+$page-width: ${config.width}px;
+$page-height: ${config.height}px;
+
+// Typography
+$font-primary: 'Montserrat', Arial, sans-serif;
+
+// Colors \u2014 use hex or rgb only (no CMYK in general templates)
+$color-primary: #000000;
+$color-secondary: #ffffff;
+$color-accent: #0079C8;
+`;
+}
+function generalPageScss(pages) {
+  return Object.fromEntries(
+    pages.map((pageName, i) => {
+      const label = pageName.includes("-") ? pageName.split("-").slice(1).join(" ") : `section ${i + 1}`;
+      return [`scss/pages/_page${i + 1}.scss`, `.${pageName} {
+  // ${label} styles
+}
+`];
+    })
+  );
+}
+
+// src/templates/video.ts
+function videoFiles(config) {
+  return {
+    "CHANGELOG.md": changelog(config.fullName),
+    "data.yaml": videoYaml(config),
+    "index.html": videoHtml(),
+    "assets/.gitkeep": gitkeep(),
+    "scss/style.scss.hbs": videoStyleSass(),
+    "scss/_fonts.scss": fontsScss(),
+    "scss/_variables.scss": videoVariables(),
+    "scss/_mixins.scss": mixinsScss(),
+    "scss/pages/_page1.scss": `.page {
+  // video frame styles
+}
+`
+  };
+}
+function videoYaml(config) {
+  return `# TODO: Video template support is WIP
+name: TEMPLATEID - ${config.fullName}
+mode: video
+subdomain: ${config.subdomain}
+duration: '30'
+highlight_point: '27'
+dimension_height: 1080
+dimension_width: 1920
+export_options:
+  downloadables:
+    hi-res:
+      title: 1080p
+fields_data:
+`;
+}
+function videoHtml() {
+  return `{{ pragma "disable-legacy-nesting" }}
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+</head>
+<body>
+  <div class="page">
+    {{! TODO: Video template content }}
+  </div>
+</body>
+</html>
+`;
+}
+function videoStyleSass() {
+  return `@import 'fonts';
+@import 'variables';
+@import 'mixins';
+@import 'pages/page1';
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  width: 1920px;
+  height: 1080px;
+}
+
+.page {
+  width: 1920px;
+  height: 1080px;
+  position: relative;
+  overflow: hidden;
+}
+`;
+}
+function videoVariables() {
+  return `$page-width: 1920px;
+$page-height: 1080px;
+
+$font-primary: 'Montserrat', Arial, sans-serif;
+
+$color-primary: #000000;
+$color-secondary: #ffffff;
+$color-accent: #0079C8;
+`;
+}
+
+// src/templates/email.ts
+function emailFiles(config) {
+  return {
+    "CHANGELOG.md": changelog(config.fullName),
+    "data.yaml": emailYaml(config),
+    "index.html": emailHtml(),
+    "assets/.gitkeep": gitkeep(),
+    "scss/style.scss.hbs": emailStyleSass(),
+    "scss/_fonts.scss": fontsScss(),
+    "scss/_variables.scss": emailVariables(),
+    "scss/_mixins.scss": mixinsScss(),
+    "scss/pages/_page1.scss": `.email-body {
+  // email body styles
+}
+`
+  };
+}
+function emailYaml(config) {
+  return `name: TEMPLATEID - ${config.fullName}
+mode: email
+status: 0
+subdomain: ${config.subdomain}
+export_options:
+  downloadables:
+    a:
+      local_zip:
+      title: Standalone Download (local assets)
+      host_files: false
+      output: zip
+    b:
+      hosted_download:
+      title: HTML Download (hosted assets)
+      host_files: true
+      output: zip
+fields_data:
+`;
+}
+function emailHtml() {
+  return `<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
+  <head>
+    <!--[if gte mso 9]>
+      <xml>
+        <o:OfficeDocumentSettings>
+        <o:AllowPNG/>
+        <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+      </xml>
+    <![endif]-->
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>{{{subject}}}</title>
+    <style type="text/css">{{{___assembled_css}}}</style>
+  </head>
+  <body style="margin: 0 0 0 0; padding: 0 0 0 0;" bgcolor="#ededed">
+    <table role="none" width="100%" cellpadding="0" cellspacing="0" border="0">
+      <tr>
+        <td>
+          <center>
+            <table role="none" width="600" class="full-wd" cellpadding="0" cellspacing="0" border="0">
+              <tr>
+                <td>
+                  {{! TODO: Email content here }}
+                </td>
+              </tr>
+            </table>
+          </center>
+        </td>
+      </tr>
+    </table>
+  </body>
+</html>
+`;
+}
+function emailStyleSass() {
+  return `@import 'fonts';
+@import 'variables';
+@import 'mixins';
+@import 'pages/page1';
+
+// Use hex/rgb only \u2014 no CMYK in email
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  background-color: #f4f4f4;
+}
+
+img {
+  display: block;
+  border: 0;
+  outline: none;
+  text-decoration: none;
+}
+
+@media screen and (max-width: 599px) {
+  .mobileOff {
+    width: 0px !important;
+    display: none !important;
+  }
+}
+`;
+}
+function emailVariables() {
+  return `$email-width: 600px;
+
+// Use hex/rgb only (no CMYK)
+$font-primary: 'Montserrat', Arial, sans-serif;
+
+$color-primary: #000000;
+$color-secondary: #ffffff;
+$color-background: #f4f4f4;
+$color-accent: #0079C8;
+`;
+}
+
+// src/scaffold.ts
+async function scaffold(config) {
+  const outDir = join(process.cwd(), config.fullName);
+  if (await fse.pathExists(outDir)) {
+    console.error(kleur2.red(`
+  Error: directory "${config.fullName}" already exists.
+`));
+    process.exit(1);
+  }
+  let files;
+  if (config.mode === "pdf") {
+    files = pdfFiles(config, buildPages(config.pageCount));
+  } else if (config.mode === "general") {
+    files = generalFiles(config, buildPages(config.pageCount));
+  } else if (config.mode === "video") {
+    files = videoFiles(config);
+  } else {
+    files = emailFiles(config);
+  }
+  console.log("");
+  for (const [rel, content] of Object.entries(files)) {
+    const fullPath = join(outDir, rel);
+    await fse.ensureDir(join(fullPath, ".."));
+    await fse.writeFile(fullPath, content, "utf8");
+    console.log(kleur2.dim(`  + ${rel}`));
+  }
+}
+
+// src/index.ts
+async function run(nameArg) {
+  console.log(kleur3.bold().cyan("\n  \u25C6 dokio create\n"));
+  const config = await runPrompts(nameArg);
+  await scaffold(config);
+  const isWip = config.mode === "video";
+  console.log(kleur3.green(`
+  \u2713 Created ${kleur3.bold(config.fullName)}
+`));
+  if (isWip) {
+    console.log(
+      kleur3.yellow(`  \u26A0  ${config.mode} support is WIP \u2014 check data.yaml for TODOs
+`)
+    );
+  }
+  console.log(kleur3.dim(`  Next steps:`));
+  console.log(kleur3.dim(`    cd ${config.fullName}`));
+  console.log(kleur3.dim(`    Edit data.yaml \u2014 set your template ID and subdomain`));
+  console.log(kleur3.dim(`    Add assets to assets/`));
+  console.log("");
+}
+
+// bin/index.ts
+run(process.argv[2]);

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "create-dokio",
+  "version": "0.1.1",
+  "description": "CLI scaffold for Dokio templates",
+  "type": "module",
+  "bin": {
+    "create-dokio": "./dist/index.js"
+  },
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "dependencies": {
+    "fs-extra": "^11.2.0",
+    "kleur": "^4.1.5",
+    "prompts": "^2.4.2"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^19.0.0",
+    "@commitlint/config-conventional": "^19.0.0",
+    "@commitlint/types": "^19.0.0",
+    "@types/fs-extra": "^11.0.4",
+    "@types/node": "^20.0.0",
+    "@types/prompts": "^2.4.9",
+    "changelogen": "^0.6.2",
+    "husky": "^9.0.0",
+    "tsup": "^8.0.0",
+    "typescript": "^5.4.0"
+  },
+  "tsup": {
+    "entry": {
+      "index": "bin/index.ts"
+    },
+    "format": [
+      "esm"
+    ],
+    "clean": true,
+    "banner": {
+      "js": "#!/usr/bin/env node"
+    }
+  },
+  "keywords": [
+    "dokio",
+    "scaffold",
+    "template",
+    "cli"
+  ],
+  "license": "MIT",
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "changelog": "changelogen --bump --output CHANGELOG.md"
+  }
+}