@salifbiaye/create-boutique 0.1.1

package/cli/dist/project.js

@@ -0,0 +1,119 @@
+import fs from "node:fs";
+import path from "node:path";
+import { z } from "zod";
+import { themeIds } from "./themes.js";
+/**
+ * config/project.json : source de vérité unique d'un projet généré.
+ * Même règles que le storefront (src/lib/boutique/schema.ts) et le backend (src/lib/project.ts).
+ */
+export const SLUG = /^[a-z0-9]+(?:-[a-z0-9]+)*$/;
+const code2 = z.string().regex(/^[a-z]{2}$/, "code pays ISO à 2 lettres en minuscules (ex. us)");
+const code3 = z.string().regex(/^[a-z]{3}$/, "code devise ISO à 3 lettres en minuscules (ex. usd)");
+const shipsTo = z.union([z.literal("all"), z.array(code2).min(1)]);
+export const projectSchema = z.object({
+    $schema: z.string().optional(),
+    project: z.string().regex(SLUG),
+    templateVersion: z.string().optional(),
+    apiPort: z.number().int().min(1).max(65535).default(9000),
+    storagePort: z.number().int().min(1).max(65535).default(9100),
+    defaults: z.looseObject({
+        storeName: z.string().min(1).max(60),
+        currency: code3,
+        country: code2,
+        language: z.string().regex(/^[a-z]{2}$/).default("en"),
+        shipsTo: shipsTo.default("all"),
+        merchantEmail: z.email().optional(),
+        email: z.object({ mode: z.enum(["platform", "merchant"]), from: z.email().optional() }).optional(),
+    }),
+    boutiques: z
+        .array(z.strictObject({
+        slug: z.string().regex(SLUG, "slug : minuscules, chiffres et tirets"),
+        theme: z.string(),
+        port: z.number().int().min(1).max(65535),
+        url: z.url().optional(),
+        storeName: z.string().min(1).max(60).optional(),
+        currency: code3.optional(),
+        country: code2.optional(),
+        shipsTo: shipsTo.optional(),
+        language: z.never({ error: "la langue se règle dans defaults, pas par boutique" }).optional(),
+    }))
+        .min(1, "au moins une boutique"),
+});
+export const projectFile = (dir) => path.join(dir, "config", "project.json");
+export class ProjectError extends Error {
+}
+/** Valide le fichier : schéma, slugs uniques, thèmes existants, ports uniques, un pays = une devise. */
+export function validateProject(raw) {
+    const res = projectSchema.safeParse(raw);
+    if (!res.success)
+        throw new ProjectError(z.prettifyError(res.error));
+    const p = res.data;
+    const errors = [];
+    const slugs = p.boutiques.map((b) => b.slug);
+    for (const s of new Set(slugs))
+        if (slugs.filter((x) => x === s).length > 1)
+            errors.push(`slug en double : ${s}`);
+    const themes = themeIds();
+    for (const b of p.boutiques)
+        if (!themes.includes(b.theme))
+            errors.push(`${b.slug} : thème inconnu « ${b.theme} » (disponibles : ${themes.join(", ")})`);
+    const ports = [p.apiPort, p.storagePort, ...p.boutiques.map((b) => b.port)];
+    for (const port of new Set(ports))
+        if (ports.filter((x) => x === port).length > 1)
+            errors.push(`port utilisé deux fois : ${port}`);
+    // Un pays ne peut appartenir qu'à une devise (une région Medusa par devise).
+    const owner = new Map();
+    for (const b of p.boutiques) {
+        const currency = b.currency ?? p.defaults.currency;
+        const country = b.country ?? p.defaults.country;
+        const list = b.shipsTo ?? p.defaults.shipsTo;
+        for (const c of [country, ...(Array.isArray(list) ? list : [])]) {
+            const o = owner.get(c);
+            if (o && o !== currency) {
+                const pair = [o, currency].sort().map((x) => x.toUpperCase());
+                errors.push(`le pays « ${c} » est demandé en ${pair[0]} et en ${pair[1]} : un pays = une devise`);
+            }
+            else
+                owner.set(c, currency);
+        }
+        if (Array.isArray(list) && !list.includes(country))
+            errors.push(`${b.slug} : le pays principal « ${country} » doit faire partie de shipsTo`);
+    }
+    if (errors.length)
+        throw new ProjectError([...new Set(errors)].map((e) => `- ${e}`).join("\n"));
+    return p;
+}
+export function readProject(dir) {
+    const file = projectFile(dir);
+    if (!fs.existsSync(file))
+        throw new ProjectError(`${file} introuvable : est-ce bien un dossier de projet ?`);
+    let raw;
+    try {
+        raw = JSON.parse(fs.readFileSync(file, "utf8"));
+    }
+    catch (e) {
+        throw new ProjectError(`${file} : JSON invalide (${e.message})`);
+    }
+    return validateProject(raw);
+}
+export function writeProject(dir, p) {
+    fs.mkdirSync(path.dirname(projectFile(dir)), { recursive: true });
+    const { $schema: _ignored, ...rest } = p;
+    fs.writeFileSync(projectFile(dir), JSON.stringify({ $schema: "./project.schema.json", ...rest }, null, 2) + "\n");
+}
+/** Valeurs effectives d'une boutique (defaults + surcharge). */
+export function effective(p, b) {
+    return {
+        ...b,
+        storeName: b.storeName ?? p.defaults.storeName,
+        currency: b.currency ?? p.defaults.currency,
+        country: b.country ?? p.defaults.country,
+        shipsTo: b.shipsTo ?? p.defaults.shipsTo,
+    };
+}
+export const currencies = (p) => [...new Set([p.defaults.currency, ...p.boutiques.map((b) => b.currency ?? p.defaults.currency)])];
+/** Schéma JSON pour l'autocomplétion de project.json dans VS Code. */
+export function writeJsonSchema(dir) {
+    const schema = z.toJSONSchema(projectSchema, { io: "input", unrepresentable: "any" });
+    fs.writeFileSync(path.join(dir, "config", "project.schema.json"), JSON.stringify(schema, null, 2) + "\n");
+}

package/cli/dist/themes.js

@@ -0,0 +1,24 @@
+import fs from "node:fs";
+import path from "node:path";
+import { THEMES_DIR } from "./paths.js";
+// Ordre des saisons ; un thème ajouté plus tard se range après, par ordre alphabétique.
+const SEASONS = ["halloween", "thanksgiving", "black-friday", "cyber-monday", "noel", "nouvel-an"];
+const rank = (id) => (SEASONS.includes(id) ? SEASONS.indexOf(id) : SEASONS.length);
+/** Registre des thèmes : un dossier templates/storefront/themes/<id>/ avec theme.json. */
+export function listThemes() {
+    if (!fs.existsSync(THEMES_DIR))
+        return [];
+    return fs
+        .readdirSync(THEMES_DIR, { withFileTypes: true })
+        .filter((d) => d.isDirectory() && fs.existsSync(path.join(THEMES_DIR, d.name, "theme.json")))
+        .map((d) => {
+        const theme = JSON.parse(fs.readFileSync(path.join(THEMES_DIR, d.name, "theme.json"), "utf8"));
+        const languages = fs
+            .readdirSync(path.join(THEMES_DIR, d.name))
+            .map((f) => f.match(/^campaign\.([a-z]{2})\.json$/)?.[1])
+            .filter((l) => !!l);
+        return { id: d.name, name: theme.name ?? d.name, languages };
+    })
+        .sort((a, b) => rank(a.id) - rank(b.id) || a.id.localeCompare(b.id));
+}
+export const themeIds = () => listThemes().map((t) => t.id);

package/docs/fiche-client.en.html

@@ -0,0 +1,137 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<title>Manage your store in 3 screens</title>
+<style>
+  @page { size: A4; margin: 0; }
+  :root{
+    --ink:#16181d; --muted:#5b616e; --line:#e3e5ea; --soft:#f5f6f8;
+    --accent:#2b4fd8; --accent-soft:#eef1fd; --warn:#9a4a07; --warn-soft:#fdf3e7;
+  }
+  *{box-sizing:border-box}
+  html,body{margin:0;padding:0}
+  body{font-family:"Carlito","Liberation Sans",Arial,sans-serif;color:var(--ink);font-size:10.2pt;line-height:1.36;-webkit-print-color-adjust:exact;print-color-adjust:exact}
+  .page{width:210mm;height:296mm;overflow:hidden;padding:13mm 15mm 10mm;display:flex;flex-direction:column}
+  header{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2px solid var(--ink);padding-bottom:4mm;margin-bottom:4mm}
+  h1{font-size:23pt;line-height:1.05;margin:0 0 1.5mm;letter-spacing:-.01em}
+  .sub{color:var(--muted);font-size:11pt;margin:0}
+  .login{background:var(--soft);border-radius:3mm;padding:3mm 4mm;font-size:9.6pt;min-width:74mm}
+  .login span{white-space:nowrap}
+  .login b{display:block;font-size:8.4pt;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:1mm}
+  .login div{display:flex;justify-content:space-between;gap:4mm}
+  .login span{color:var(--muted)}
+  .fill{border-bottom:1px dotted #9aa0ab;min-width:36mm;display:inline-block}
+  .screens{display:flex;flex-direction:column;gap:3mm}
+  .screen{display:grid;grid-template-columns:11mm 1fr;gap:4mm;border:1px solid var(--line);border-radius:3mm;padding:3.2mm 5mm}
+  .num{width:11mm;height:11mm;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14pt}
+  h2{font-size:14pt;margin:0;display:flex;align-items:baseline;gap:3mm}
+  h2 small{font-size:9.4pt;font-weight:400;color:var(--muted)}
+  .where{font-size:9.2pt;color:var(--accent);background:var(--accent-soft);display:inline-block;padding:.4mm 2.2mm;border-radius:1.5mm;margin:1mm 0 1.5mm}
+  ol,ul{margin:0;padding-left:5mm}
+  li{margin:.3mm 0}
+  .flow{display:flex;align-items:center;gap:1.6mm;flex-wrap:wrap;margin:1.5mm 0 2mm;font-size:9.2pt}
+  .flow span{border:1px solid var(--line);background:var(--soft);border-radius:1.5mm;padding:.6mm 2mm;white-space:nowrap}
+  .flow i{font-style:normal;color:var(--muted)}
+  .tip{margin-top:2mm;font-size:9.4pt;color:var(--muted)}
+  .tip b{color:var(--ink)}
+  .warn{background:var(--warn-soft);color:var(--warn);border-radius:2mm;padding:1.6mm 3mm;font-size:9.4pt;margin-top:2mm}
+  .bottom{display:grid;grid-template-columns:1fr 1fr;gap:4mm;margin-top:3mm}
+  .box{border-radius:3mm;padding:3mm 4.5mm;font-size:9.6pt}
+  .box h3{font-size:11pt;margin:0 0 1.5mm}
+  .ok{background:var(--soft)}
+  .no{border:1px solid var(--line)}
+  footer{margin-top:auto;padding-bottom:0;border-top:1px solid var(--line);padding-top:3mm;display:flex;justify-content:space-between;font-size:9.2pt;color:var(--muted)}
+  footer b{color:var(--ink)}
+</style>
+</head>
+<body>
+<div class="page">
+  <header>
+    <div>
+      <h1>Manage your store<br>in 3 screens</h1>
+      <p class="sub">Everything happens in your admin. The rest is already set up for you.</p>
+    </div>
+    <div class="login">
+      <b>Your access</b>
+      <div><span>Address</span><span class="fill">{{ADMIN_URL}}</span></div>
+      <div><span>Email</span><span class="fill">{{ADMIN_EMAIL}}</span></div>
+      <div><span>Password</span><span class="fill">&nbsp;</span></div>
+    </div>
+  </header>
+
+  <section class="screens">
+    <div class="screen">
+      <div class="num">1</div>
+      <div>
+        <h2>Orders <small>view, ship, refund</small></h2>
+        <div class="where">Menu: Orders</div>
+        <div class="flow">
+          <span>Paid</span><i>→</i><span>Fulfilled</span><i>→</i><span>Shipped</span><i>→</i><span>Delivered (optional)</span>
+        </div>
+        <ol>
+          <li>Open the order: customer, address, items and total are shown. Card payments are captured automatically.</li>
+          <li><b>Fulfill</b>: in “Fulfillment”, click <b>Create fulfillment</b> and pick the items.</li>
+          <li><b>Ship</b>: click <b>Mark as shipped</b> and enter the tracking number. The customer gets an email with it.</li>
+          <li><b>Deliver</b>: <b>Mark as delivered</b> once the carrier confirms delivery.</li>
+        </ol>
+        <p class="tip"><b>Cancel or refund:</b> buttons at the top of the order and in the Payment section. The customer is notified by email.</p>
+      </div>
+    </div>
+
+    <div class="screen">
+      <div class="num">2</div>
+      <div>
+        <h2>Products <small>add, edit, manage stock</small></h2>
+        <div class="where">Menu: Products</div>
+        <ol>
+          <li><b>Create</b>: title, description, photos (drop them into “Media”).</li>
+          <li><b>Variants</b>: add options (size, color) and a <b>price for each variant</b> in each currency.</li>
+          <li><b>Stores</b>: in “Sales channels”, tick the stores where the product must appear.</li>
+          <li><b>Publish</b>: status <b>Published</b>. A draft does not appear on the site.</li>
+          <li><b>Stock</b>: menu <b>Inventory</b>, enter the available quantity.</li>
+        </ol>
+        <div class="warn">Product not visible on the site? Check it is Published, has a price in the store's currency and is ticked for the right store.</div>
+      </div>
+    </div>
+
+    <div class="screen">
+      <div class="num">3</div>
+      <div>
+        <h2>Campaigns <small>texts and images of each store</small></h2>
+        <div class="where">Menu: Campaigns</div>
+        <ol>
+          <li>Pick the store (Halloween, Black Friday, Christmas…) and click <b>Edit</b>.</li>
+          <li>Change the title, text, button, hero image, logo and the offer dates.</li>
+          <li>Click <b>Save</b>: the site is updated within about a minute.</li>
+        </ol>
+        <p class="tip"><b>Undo:</b> “Reset to theme texts” restores the original texts (images and dates are kept).</p>
+      </div>
+    </div>
+  </section>
+
+  <div class="bottom">
+    <div class="box ok">
+      <h3>Also useful</h3>
+      <ul>
+        <li><b>Discount codes</b>: menu Promotions (e.g. “BF20” = −20%).</li>
+        <li><b>Admin language</b>: Settings → Profile → Language.</li>
+        <li>Your customers' replies to emails reach your address.</li>
+      </ul>
+    </div>
+    <div class="box no">
+      <h3>No need to touch</h3>
+      <ul>
+        <li>Settings: regions, payments, shipping, sales channels, API keys.</li>
+        <li>They are configured for you. Need a change? Contact us.</li>
+      </ul>
+    </div>
+  </div>
+
+  <footer>
+    <span>Need help: <b class="fill" style="min-width:60mm">{{SUPPORT}}</b></span>
+    <span>Never share your password.</span>
+  </footer>
+</div>
+</body>
+</html>

package/docs/fiche-client.html

@@ -0,0 +1,137 @@
+<!doctype html>
+<html lang="fr">
+<head>
+<meta charset="utf-8">
+<title>Gérer votre boutique en 3 écrans</title>
+<style>
+  @page { size: A4; margin: 0; }
+  :root{
+    --ink:#16181d; --muted:#5b616e; --line:#e3e5ea; --soft:#f5f6f8;
+    --accent:#2b4fd8; --accent-soft:#eef1fd; --warn:#9a4a07; --warn-soft:#fdf3e7;
+  }
+  *{box-sizing:border-box}
+  html,body{margin:0;padding:0}
+  body{font-family:"Carlito","Liberation Sans",Arial,sans-serif;color:var(--ink);font-size:10.2pt;line-height:1.36;-webkit-print-color-adjust:exact;print-color-adjust:exact}
+  .page{width:210mm;height:296mm;overflow:hidden;padding:13mm 15mm 10mm;display:flex;flex-direction:column}
+  header{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2px solid var(--ink);padding-bottom:4mm;margin-bottom:4mm}
+  h1{font-size:23pt;line-height:1.05;margin:0 0 1.5mm;letter-spacing:-.01em}
+  .sub{color:var(--muted);font-size:11pt;margin:0}
+  .login{background:var(--soft);border-radius:3mm;padding:3mm 4mm;font-size:9.6pt;min-width:74mm}
+  .login span{white-space:nowrap}
+  .login b{display:block;font-size:8.4pt;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:1mm}
+  .login div{display:flex;justify-content:space-between;gap:4mm}
+  .login span{color:var(--muted)}
+  .fill{border-bottom:1px dotted #9aa0ab;min-width:36mm;display:inline-block}
+  .screens{display:flex;flex-direction:column;gap:3mm}
+  .screen{display:grid;grid-template-columns:11mm 1fr;gap:4mm;border:1px solid var(--line);border-radius:3mm;padding:3.2mm 5mm}
+  .num{width:11mm;height:11mm;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14pt}
+  h2{font-size:14pt;margin:0;display:flex;align-items:baseline;gap:3mm}
+  h2 small{font-size:9.4pt;font-weight:400;color:var(--muted)}
+  .where{font-size:9.2pt;color:var(--accent);background:var(--accent-soft);display:inline-block;padding:.4mm 2.2mm;border-radius:1.5mm;margin:1mm 0 1.5mm}
+  ol,ul{margin:0;padding-left:5mm}
+  li{margin:.3mm 0}
+  .flow{display:flex;align-items:center;gap:1.6mm;flex-wrap:wrap;margin:1.5mm 0 2mm;font-size:9.2pt}
+  .flow span{border:1px solid var(--line);background:var(--soft);border-radius:1.5mm;padding:.6mm 2mm;white-space:nowrap}
+  .flow i{font-style:normal;color:var(--muted)}
+  .tip{margin-top:2mm;font-size:9.4pt;color:var(--muted)}
+  .tip b{color:var(--ink)}
+  .warn{background:var(--warn-soft);color:var(--warn);border-radius:2mm;padding:1.6mm 3mm;font-size:9.4pt;margin-top:2mm}
+  .bottom{display:grid;grid-template-columns:1fr 1fr;gap:4mm;margin-top:3mm}
+  .box{border-radius:3mm;padding:3mm 4.5mm;font-size:9.6pt}
+  .box h3{font-size:11pt;margin:0 0 1.5mm}
+  .ok{background:var(--soft)}
+  .no{border:1px solid var(--line)}
+  footer{margin-top:auto;padding-bottom:0;border-top:1px solid var(--line);padding-top:3mm;display:flex;justify-content:space-between;font-size:9.2pt;color:var(--muted)}
+  footer b{color:var(--ink)}
+</style>
+</head>
+<body>
+<div class="page">
+  <header>
+    <div>
+      <h1>Gérer votre boutique<br>en 3 écrans</h1>
+      <p class="sub">Tout se passe dans votre espace d'administration. Le reste est déjà configuré pour vous.</p>
+    </div>
+    <div class="login">
+      <b>Votre accès</b>
+      <div><span>Adresse</span><span class="fill">{{ADMIN_URL}}</span></div>
+      <div><span>E-mail</span><span class="fill">{{ADMIN_EMAIL}}</span></div>
+      <div><span>Mot de passe</span><span class="fill">&nbsp;</span></div>
+    </div>
+  </header>
+
+  <section class="screens">
+    <div class="screen">
+      <div class="num">1</div>
+      <div>
+        <h2>Commandes <small>voir, expédier, rembourser</small></h2>
+        <div class="where">Menu : Orders (Commandes)</div>
+        <div class="flow">
+          <span>Payée</span><i>→</i><span>Préparée</span><i>→</i><span>Expédiée</span><i>→</i><span>Livrée (facultatif)</span>
+        </div>
+        <ol>
+          <li>Ouvrez la commande : client, adresse, articles et total sont affichés. Le paiement par carte est encaissé automatiquement.</li>
+          <li><b>Préparer</b> : dans « Fulfillment », cliquez sur <b>Créer un traitement</b> et choisissez les articles.</li>
+          <li><b>Expédier</b> : cliquez sur <b>Marquer comme expédié</b> et saisissez le numéro de suivi. Le client reçoit un e-mail avec ce numéro.</li>
+          <li><b>Livrer</b> : <b>Marquer comme livré</b> quand le transporteur confirme la livraison.</li>
+        </ol>
+        <p class="tip"><b>Annuler ou rembourser :</b> boutons en haut de la commande et dans la partie Paiement. Le client est prévenu par e-mail.</p>
+      </div>
+    </div>
+
+    <div class="screen">
+      <div class="num">2</div>
+      <div>
+        <h2>Produits <small>ajouter, modifier, gérer le stock</small></h2>
+        <div class="where">Menu : Products (Produits)</div>
+        <ol>
+          <li><b>Créer</b> : titre, description, photos (glissez-les dans « Media »).</li>
+          <li><b>Variantes</b> : ajoutez les options (taille, couleur) et un <b>prix pour chaque variante</b>.</li>
+          <li><b>Boutiques</b> : dans « Canaux de vente », cochez les boutiques où le produit doit apparaître.</li>
+          <li><b>Publier</b> : statut <b>Publié</b>. Un brouillon n'apparaît pas sur le site.</li>
+          <li><b>Stock</b> : menu <b>Inventory</b>, indiquez la quantité disponible.</li>
+        </ol>
+        <div class="warn">Un produit invisible sur le site ? Vérifiez qu'il est Publié, qu'il a un prix et qu'il est coché dans la bonne boutique.</div>
+      </div>
+    </div>
+
+    <div class="screen">
+      <div class="num">3</div>
+      <div>
+        <h2>Campagnes <small>textes et images de chaque boutique</small></h2>
+        <div class="where">Menu : Campagnes</div>
+        <ol>
+          <li>Choisissez la boutique (Halloween, Black Friday, Noël…) et cliquez sur <b>Modifier</b>.</li>
+          <li>Changez le titre, le texte, le bouton, l'image principale, le logo et les dates de l'offre.</li>
+          <li>Cliquez sur <b>Enregistrer</b> : le site est à jour en environ une minute.</li>
+        </ol>
+        <p class="tip"><b>Retour en arrière :</b> « Réinitialiser aux textes du thème » restaure les textes d'origine (images et dates gardées).</p>
+      </div>
+    </div>
+  </section>
+
+  <div class="bottom">
+    <div class="box ok">
+      <h3>Utile aussi</h3>
+      <ul>
+        <li><b>Codes promo</b> : menu Promotions (ex. « BF20 » = −20 %).</li>
+        <li><b>Langue de l'admin</b> : Paramètres → Profil → Langue.</li>
+        <li>Les réponses de vos clients aux e-mails arrivent sur votre adresse.</li>
+      </ul>
+    </div>
+    <div class="box no">
+      <h3>Inutile d'y toucher</h3>
+      <ul>
+        <li>Paramètres : régions, paiements, livraison, canaux de vente, clés API.</li>
+        <li>Ils sont configurés pour vous. Un changement ? Contactez-nous.</li>
+      </ul>
+    </div>
+  </div>
+
+  <footer>
+    <span>Besoin d'aide : <b class="fill" style="min-width:60mm">{{SUPPORT}}</b></span>
+    <span>Ne partagez jamais votre mot de passe.</span>
+  </footer>
+</div>
+</body>
+</html>