@cosmicdrift/kumiko-samples 0.361.0 → 0.363.0

package/samples/apps/ui-walkthrough/src/app/template-seed-data.ts

@@ -0,0 +1,354 @@
+// Template content for the Nordlicht document-designer walkthrough. Pure data,
+// no framework import: seed-templates.ts feeds it through the template write
+// handlers, so every body here goes through the real sanitizer and placeholder
+// validation.
+
+export type SeedTemplate = {
+  readonly slug: string;
+  readonly kind: "mail" | "mail-layout" | "document-pdf" | "pdf-layout";
+  readonly locale: string;
+  readonly title?: string;
+  readonly content: string;
+  readonly meta?: Record<string, unknown>;
+  readonly variableSchema?: Record<string, unknown>;
+};
+
+// Document HTML marks a variable as an empty span; only link targets take {{name}}.
+const v = (name: string): string => `<span data-variable="${name}"></span>`;
+
+const AUTH_VARIABLE_SCHEMA = {
+  appName: { type: "text", required: true },
+  actionUrl: { type: "link", required: true },
+  validFor: { type: "text", required: true },
+  validUntil: { type: "text", required: true },
+} as const;
+
+const INVOICE_VARIABLE_SCHEMA = {
+  customerName: { type: "text", required: true },
+  invoiceNumber: { type: "text", required: true },
+  amount: { type: "money", required: true },
+  dueDate: { type: "date", required: true },
+  invoiceUrl: { type: "link", required: true },
+} as const;
+
+const DOCUMENT_LINES_SCHEMA = {
+  tenantName: { type: "text" },
+  customerName: { type: "text", required: true },
+  invoiceNumber: { type: "text", required: true },
+  invoiceDate: { type: "date", required: true },
+  total: { type: "money", required: true },
+  lines: {
+    type: "list",
+    required: true,
+    item: { description: { type: "text" }, amount: { type: "money" } },
+  },
+} as const;
+
+export const SYSTEM_PDF_LAYOUT: SeedTemplate = {
+  slug: "default",
+  kind: "pdf-layout",
+  locale: "en",
+  title: "Briefpapier",
+  content: [
+    `<div data-header><p><strong>${v("tenantName")}</strong></p></div>`,
+    "<div data-content></div>",
+    "<div data-signature></div>",
+    `<div data-footer><p>${v("tenantName")} · Seite ${v("page")} von ${v("pages")}</p></div>`,
+  ].join(""),
+};
+
+export const TENANT_MAIL_LAYOUT_VERSIONS: readonly string[] = [
+  [
+    `<div data-header><p><strong>${v("tenantName")}</strong></p></div>`,
+    "<div data-content></div>",
+    "<div data-signature><p>Mit freundlichen Grüßen</p></div>",
+    `<div data-footer><p>${v("tenantName")}</p></div>`,
+  ].join(""),
+  [
+    `<div data-header><p><strong>${v("tenantName")}</strong></p><p>Ihre Hausverwaltung in Kiel</p></div>`,
+    "<div data-content></div>",
+    `<div data-signature><p>Mit freundlichen Grüßen</p><p>${v("signature")}</p><p>${v("tenantName")}</p></div>`,
+    `<div data-footer><p>${v("imprint")}</p><p><a href="https://nordlicht-immobilien.de/datenschutz">Datenschutz</a> · <a href="{{unsubscribeUrl}}">Abmelden</a></p></div>`,
+  ].join(""),
+];
+
+const LINES_TABLE = `<table><tbody><tr><th><p>Position</p></th><th><p>Betrag</p></th></tr><tr data-each="lines" data-repeat-header=""><td><p>${v("description")}</p></td><td><p>${v("amount")}</p></td></tr></tbody></table>`;
+
+// The registry of the billing notifications declares the variables, so these
+// templates carry no variableSchema of their own.
+function invoiceIssuedBody(args: {
+  readonly intro: string;
+  readonly withDueDate: boolean;
+}): string {
+  const due = args.withDueDate ? ` Bitte überweisen Sie den Betrag bis zum ${v("dueDate")}.` : "";
+  return [
+    "<h2>Ihre Rechnung ist da</h2>",
+    `<p>Guten Tag ${v("recipientName")},</p>`,
+    `<p>${args.intro} <strong>${v("invoiceNumber")}</strong> über <strong>${v("invoiceTotal")}</strong>.${due}</p>`,
+    '<a data-button href="{{invoiceUrl}}">Rechnung öffnen</a>',
+    LINES_TABLE,
+    "<hr>",
+    "<p>Mit freundlichen Grüßen</p>",
+    `<p>${v("tenantName")}</p>`,
+  ].join("");
+}
+
+const INVOICE_ISSUED_SLUG = "billing:notify:invoice-issued";
+const INVOICE_CORRECTED_SLUG = "billing:notify:invoice-corrected";
+
+const invoiceIssuedMeta = (subject: string) => ({
+  subject,
+  previewText: "Rechnung {{invoiceNumber}} über {{invoiceTotal}}, online abrufbar",
+});
+
+// The platform default has a due date; the tenant drafts below drop it, which
+// is what blocks publishing in the walkthrough.
+export const SYSTEM_INVOICE_ISSUED: SeedTemplate = {
+  slug: INVOICE_ISSUED_SLUG,
+  kind: "mail",
+  locale: "de",
+  title: "Rechnung versendet",
+  content: invoiceIssuedBody({ intro: "anbei senden wir Ihnen die Rechnung", withDueDate: true }),
+  meta: invoiceIssuedMeta("Rechnung {{invoiceNumber}} von {{tenantName}}"),
+};
+
+// Saved in order: each entry becomes the next version of the same draft.
+export const INVOICE_ISSUED_DRAFT_VERSIONS: readonly SeedTemplate[] = [
+  {
+    slug: INVOICE_ISSUED_SLUG,
+    kind: "mail",
+    locale: "de",
+    title: "Rechnung versendet",
+    content: invoiceIssuedBody({
+      intro: "anbei senden wir Ihnen die Rechnung",
+      withDueDate: false,
+    }),
+    meta: invoiceIssuedMeta("Ihre Rechnung {{invoiceNumber}}"),
+  },
+  {
+    slug: INVOICE_ISSUED_SLUG,
+    kind: "mail",
+    locale: "de",
+    title: "Rechnung versendet",
+    content: invoiceIssuedBody({ intro: "anbei erhalten Sie die Rechnung", withDueDate: false }),
+    meta: invoiceIssuedMeta("Ihre Rechnung {{invoiceNumber}} von {{tenantName}}"),
+  },
+];
+
+// Separate draft for the screenshot spec, so the mail-editor e2e can change
+// "Rechnung versendet" without touching what the screenshots show.
+export const INVOICE_CORRECTED_DRAFT: SeedTemplate = {
+  slug: INVOICE_CORRECTED_SLUG,
+  kind: "mail",
+  locale: "de",
+  title: "Korrigierte Rechnung",
+  content: invoiceIssuedBody({
+    intro: "anbei erhalten Sie die korrigierte Rechnung",
+    withDueDate: false,
+  }),
+  meta: invoiceIssuedMeta("Ihre Rechnung {{invoiceNumber}} von {{tenantName}}"),
+};
+
+export const PAYMENT_REMINDER_TEMPLATES: readonly SeedTemplate[] = [
+  {
+    slug: "billing:notify:payment-reminder",
+    kind: "mail",
+    locale: "de",
+    title: "Zahlungserinnerung",
+    content: [
+      `<p>Guten Tag ${v("customerName")},</p>`,
+      `<p>zu unserer Rechnung <strong>${v("invoiceNumber")}</strong> über <strong>${v("amount")}</strong> konnten wir bis heute keinen Zahlungseingang feststellen. Fällig war der Betrag am ${v("dueDate")}.</p>`,
+      `<p>Bitte überweisen Sie den offenen Betrag in den nächsten Tagen. Die Rechnung finden Sie hier: <a href="{{invoiceUrl}}">Rechnung öffnen</a></p>`,
+      "<p>Sollten Sie bereits gezahlt haben, betrachten Sie diese Nachricht bitte als gegenstandslos.</p>",
+    ].join(""),
+    meta: { subject: "Zahlungserinnerung zu Rechnung {{invoiceNumber}}" },
+    variableSchema: INVOICE_VARIABLE_SCHEMA,
+  },
+  {
+    slug: "billing:notify:payment-reminder",
+    kind: "mail",
+    locale: "en",
+    title: "Payment reminder",
+    content: [
+      `<p>Hello ${v("customerName")},</p>`,
+      `<p>we have not received a payment for invoice <strong>${v("invoiceNumber")}</strong> of <strong>${v("amount")}</strong>, which was due on ${v("dueDate")}.</p>`,
+      `<p>Please transfer the open amount in the next few days. You can find the invoice here: <a href="{{invoiceUrl}}">Open invoice</a></p>`,
+      "<p>If you have already paid, please disregard this message.</p>",
+    ].join(""),
+    meta: { subject: "Payment reminder for invoice {{invoiceNumber}}" },
+    variableSchema: INVOICE_VARIABLE_SCHEMA,
+  },
+];
+
+function authMail(
+  notification: string,
+  locale: "de" | "en",
+  title: string,
+  subject: string,
+  paragraphs: readonly string[],
+  extraSchema: Record<string, unknown> = {},
+): SeedTemplate {
+  return {
+    slug: `auth-email-password:notify:${notification}`,
+    kind: "mail",
+    locale,
+    title,
+    content: paragraphs.join(""),
+    meta: { subject },
+    variableSchema: { ...AUTH_VARIABLE_SCHEMA, ...extraSchema },
+  };
+}
+
+export const SYSTEM_AUTH_MAILS: readonly SeedTemplate[] = [
+  authMail(
+    "password-reset",
+    "de",
+    "Passwort zurücksetzen",
+    "Passwort für {{appName}} zurücksetzen",
+    [
+      "<p>Hallo,</p>",
+      `<p>für Ihr Konto bei ${v("appName")} wurde ein neues Passwort angefordert. Über den folgenden Link können Sie es festlegen: <a href="{{actionUrl}}">Passwort zurücksetzen</a></p>`,
+      `<p>Der Link ist ${v("validFor")} gültig, bis ${v("validUntil")}. Haben Sie das nicht angefordert, können Sie diese Nachricht ignorieren.</p>`,
+    ],
+  ),
+  authMail("password-reset", "en", "Reset password", "Reset your {{appName}} password", [
+    "<p>Hello,</p>",
+    `<p>a new password was requested for your ${v("appName")} account. You can set it with this link: <a href="{{actionUrl}}">Reset password</a></p>`,
+    `<p>The link is valid for ${v("validFor")}, until ${v("validUntil")}. If you did not ask for this, you can ignore this message.</p>`,
+  ]),
+  authMail(
+    "invite",
+    "de",
+    "Einladung ins Team",
+    "Einladung zu {{appName}}",
+    [
+      "<p>Hallo,</p>",
+      `<p>Sie wurden zu ${v("appName")} eingeladen, mit der Rolle <strong>${v("role")}</strong>. Mit dem folgenden Link nehmen Sie die Einladung an: <a href="{{actionUrl}}">Einladung annehmen</a></p>`,
+      `<p>Die Einladung ist ${v("validFor")} gültig, bis ${v("validUntil")}.</p>`,
+    ],
+    { role: { type: "text", required: true } },
+  ),
+  authMail(
+    "invite",
+    "en",
+    "Team invitation",
+    "You are invited to {{appName}}",
+    [
+      "<p>Hello,</p>",
+      `<p>You have been invited to ${v("appName")} with the role <strong>${v("role")}</strong>. Accept the invitation with this link: <a href="{{actionUrl}}">Accept invitation</a></p>`,
+      `<p>The invitation is valid for ${v("validFor")}, until ${v("validUntil")}.</p>`,
+    ],
+    { role: { type: "text", required: true } },
+  ),
+  authMail(
+    "signup-activation",
+    "de",
+    "Registrierung bestätigen",
+    "Registrierung bei {{appName}} bestätigen",
+    [
+      "<p>Willkommen,</p>",
+      `<p>vielen Dank für Ihre Registrierung bei ${v("appName")}. Bitte bestätigen Sie Ihre E-Mail-Adresse: <a href="{{actionUrl}}">Registrierung bestätigen</a></p>`,
+      `<p>Der Link ist ${v("validFor")} gültig, bis ${v("validUntil")}.</p>`,
+    ],
+  ),
+  authMail(
+    "email-verification",
+    "de",
+    "E-Mail-Adresse bestätigen",
+    "E-Mail-Adresse für {{appName}} bestätigen",
+    [
+      "<p>Hallo,</p>",
+      `<p>bitte bestätigen Sie Ihre E-Mail-Adresse für ${v("appName")}: <a href="{{actionUrl}}">E-Mail-Adresse bestätigen</a></p>`,
+      `<p>Der Link ist ${v("validFor")} gültig, bis ${v("validUntil")}.</p>`,
+    ],
+  ),
+  authMail("email-verification", "en", "Confirm email address", "Confirm your {{appName}} email", [
+    "<p>Hello,</p>",
+    `<p>please confirm your email address for ${v("appName")}: <a href="{{actionUrl}}">Confirm email address</a></p>`,
+    `<p>The link is valid for ${v("validFor")}, until ${v("validUntil")}.</p>`,
+  ]),
+  authMail("account-unlock", "de", "Konto entsperren", "Ihr Konto bei {{appName}} entsperren", [
+    "<p>Hallo,</p>",
+    `<p>Ihr Konto bei ${v("appName")} wurde nach mehreren fehlgeschlagenen Anmeldungen gesperrt. Mit dem folgenden Link entsperren Sie es: <a href="{{actionUrl}}">Konto entsperren</a></p>`,
+    `<p>Der Link ist ${v("validFor")} gültig, bis ${v("validUntil")}.</p>`,
+  ]),
+  authMail("account-unlock", "en", "Unlock account", "Unlock your {{appName}} account", [
+    "<p>Hello,</p>",
+    `<p>your ${v("appName")} account was locked after several failed sign-ins. Unlock it with this link: <a href="{{actionUrl}}">Unlock account</a></p>`,
+    `<p>The link is valid for ${v("validFor")}, until ${v("validUntil")}.</p>`,
+  ]),
+];
+
+const INVOICE_DOCUMENT_ROWS = `<table><tbody><tr><th><p>Leistung</p></th><th><p>Betrag</p></th></tr><tr data-each="lines" data-repeat-header=""><td><p>${v("description")}</p></td><td><p>${v("amount")}</p></td></tr></tbody></table>`;
+
+export const SYSTEM_INVOICE_DOCUMENTS: readonly SeedTemplate[] = [
+  {
+    slug: "billing:invoice",
+    kind: "document-pdf",
+    locale: "de",
+    title: "Rechnung",
+    content: [
+      `<h1>Rechnung ${v("invoiceNumber")}</h1>`,
+      `<p>Rechnungsdatum: ${v("invoiceDate")}</p>`,
+      `<p>Guten Tag ${v("customerName")},</p>`,
+      "<p>für unsere Leistungen stellen wir Ihnen folgenden Betrag in Rechnung.</p>",
+      INVOICE_DOCUMENT_ROWS,
+      `<p><strong>Gesamtbetrag: ${v("total")}</strong></p>`,
+      "<p>Bitte überweisen Sie den Betrag innerhalb von 14 Tagen auf unser Konto.</p>",
+    ].join(""),
+    meta: { layoutSlug: "default", pageFormat: "A4", fileName: "Rechnung.pdf" },
+    variableSchema: DOCUMENT_LINES_SCHEMA,
+  },
+  {
+    slug: "billing:invoice",
+    kind: "document-pdf",
+    locale: "en",
+    title: "Invoice",
+    content: [
+      `<h1>Invoice ${v("invoiceNumber")}</h1>`,
+      `<p>Invoice date: ${v("invoiceDate")}</p>`,
+      `<p>Dear ${v("customerName")},</p>`,
+      "<p>we charge you the following amount for our services.</p>",
+      INVOICE_DOCUMENT_ROWS.replace("Leistung", "Service").replace("Betrag", "Amount"),
+      `<p><strong>Total: ${v("total")}</strong></p>`,
+      "<p>Please transfer the amount to our account within 14 days.</p>",
+    ].join(""),
+    meta: { layoutSlug: "default", pageFormat: "A4", fileName: "Invoice.pdf" },
+    variableSchema: DOCUMENT_LINES_SCHEMA,
+  },
+];
+
+export const TENANT_UTILITY_STATEMENT: SeedTemplate = {
+  slug: "rental:utility-statement",
+  kind: "document-pdf",
+  locale: "de",
+  title: "Nebenkostenabrechnung",
+  content: [
+    `<h1>Nebenkostenabrechnung ${v("invoiceNumber")}</h1>`,
+    `<p>Abrechnungsdatum: ${v("invoiceDate")}</p>`,
+    `<p>Guten Tag ${v("customerName")},</p>`,
+    "<p>nachfolgend erhalten Sie die Abrechnung der Betriebskosten für den Abrechnungszeitraum.</p>",
+    INVOICE_DOCUMENT_ROWS,
+    `<p><strong>Ergebnis: ${v("total")}</strong></p>`,
+    "<p>Ein Guthaben überweisen wir Ihnen innerhalb von 30 Tagen, eine Nachzahlung ist zum Monatsende fällig.</p>",
+  ].join(""),
+  meta: { layoutSlug: "default", pageFormat: "A4", fileName: "Nebenkostenabrechnung.pdf" },
+  variableSchema: DOCUMENT_LINES_SCHEMA,
+};
+
+export const SYSTEM_TENANCY_CERTIFICATE: SeedTemplate = {
+  slug: "rental:tenancy-certificate",
+  kind: "document-pdf",
+  locale: "de",
+  title: "Mietbescheinigung",
+  content: [
+    "<h1>Mietbescheinigung</h1>",
+    `<p>Hiermit bestätigen wir, dass ${v("customerName")} bei uns Mieter ist und die Miete ordnungsgemäß zahlt.</p>`,
+    `<p>Ausgestellt am ${v("invoiceDate")}.</p>`,
+  ].join(""),
+  meta: { layoutSlug: "default", pageFormat: "A4", fileName: "Mietbescheinigung.pdf" },
+  variableSchema: {
+    customerName: { type: "text", required: true },
+    invoiceDate: { type: "date", required: true },
+  },
+};

package/samples/apps/ui-walkthrough/src/features/billing/feature.ts

@@ -0,0 +1,68 @@
+import { defineFeature, templateVariable } from "@cosmicdrift/kumiko-framework/engine";
+import { toKeyFirst } from "../translations";
+import { billingTranslations } from "./i18n";
+
+// Both mails are sent by the host app's billing run, not by an event trigger in
+// this sample; they exist so the template overview has real senders to show.
+const INVOICE_ISSUED_VARIABLES = {
+  recipientName: templateVariable.text({
+    label: "Empfängername",
+    required: true,
+    example: "Familie Yilmaz",
+  }),
+  invoiceNumber: templateVariable.text({
+    label: "Rechnungsnummer",
+    required: true,
+    example: "RE-2026-0142",
+  }),
+  invoiceTotal: templateVariable.money({
+    label: "Rechnungsbetrag",
+    required: true,
+    example: { amount: 128450, currency: "EUR" },
+  }),
+  dueDate: templateVariable.date({
+    label: "Fälligkeitsdatum",
+    required: true,
+    example: "2026-10-30",
+  }),
+  invoiceUrl: templateVariable.link({
+    label: "Link zur Rechnung",
+    required: true,
+    example: "https://nordlicht-immobilien.de/rechnungen/RE-2026-0142",
+  }),
+  lines: templateVariable.list(
+    {
+      description: templateVariable.text({ label: "Bezeichnung" }),
+      amount: templateVariable.money({ label: "Betrag" }),
+    },
+    {
+      label: "Rechnungspositionen",
+      required: true,
+      example: [
+        { description: "Kaltmiete Oktober 2026, Lindenstraße 14 WE 3", amount: 98000 },
+        { description: "Betriebskostenvorauszahlung Oktober 2026", amount: 24500 },
+        { description: "Stellplatz 7, Oktober 2026", amount: 5950 },
+      ],
+    },
+  ),
+  paymentReference: templateVariable.text({
+    label: "Zahlungsreferenz",
+    example: "RE-2026-0142 / Yilmaz",
+  }),
+} as const;
+
+const PAYMENT_REMINDER_VARIABLES = {
+  customerName: templateVariable.text({ required: true }),
+  invoiceNumber: templateVariable.text({ required: true }),
+  amount: templateVariable.money({ required: true }),
+  dueDate: templateVariable.date({ required: true }),
+  invoiceUrl: templateVariable.link({ required: true }),
+} as const;
+
+export const billingFeature = defineFeature("billing", (r) => {
+  r.translations({ keys: toKeyFirst(billingTranslations) });
+
+  r.notification("invoice-issued", { variables: INVOICE_ISSUED_VARIABLES });
+  r.notification("invoice-corrected", { variables: INVOICE_ISSUED_VARIABLES });
+  r.notification("payment-reminder", { variables: PAYMENT_REMINDER_VARIABLES });
+});

package/samples/apps/ui-walkthrough/src/features/billing/i18n.ts

@@ -0,0 +1,18 @@
+import type { TranslationsByLocale } from "@cosmicdrift/kumiko-renderer";
+
+// The keys follow the document-designer's "used by" lookup:
+// `<feature>:feature.label` and `<feature>:notify.<notification>.label`.
+export const billingTranslations: TranslationsByLocale = {
+  de: {
+    "billing:feature.label": "Rechnungen",
+    "billing:notify.invoice-issued.label": "Rechnung gestellt",
+    "billing:notify.invoice-corrected.label": "Rechnung korrigiert",
+    "billing:notify.payment-reminder.label": "Mahnlauf",
+  },
+  en: {
+    "billing:feature.label": "Invoices",
+    "billing:notify.invoice-issued.label": "Invoice issued",
+    "billing:notify.invoice-corrected.label": "Invoice corrected",
+    "billing:notify.payment-reminder.label": "Dunning run",
+  },
+};

package/samples/apps/ui-walkthrough/src/features/billing/index.ts

@@ -0,0 +1,2 @@
+export { billingFeature } from "./feature";
+export { billingClient } from "./web";

package/samples/apps/ui-walkthrough/src/features/billing/web/index.ts

@@ -0,0 +1,7 @@
+import type { ClientFeatureDefinition } from "@cosmicdrift/kumiko-renderer-web";
+import { billingTranslations } from "../i18n";
+
+export const billingClient: ClientFeatureDefinition = {
+  name: "billing",
+  translations: billingTranslations,
+};

package/samples/apps/ui-walkthrough/src/features/rental/screens.ts

@@ -467,7 +467,7 @@ export const leaseDetailGapsScreen: ProjectionDetailScreenDefinition = {
     {
       kind: "writeHandler",
       id: "terminate",
-      icon: "x",
+      icon: "circle-stop",
       label: "rental.action.terminate",
       handler: RENTAL_WRITES.leaseTerminate,
       payload: { pick: ["id"] },

package/samples/apps/ui-walkthrough/src/run-config.ts

@@ -3,12 +3,48 @@
 // src/app/server.ts (dev boot) and kumiko/schema.ts (schema CLI) import
 // from here — migration and runtime cannot drift.
 
+import { createAuditFeature } from "@cosmicdrift/kumiko-bundled-features/audit";
+import {
+  createChannelEmailFeature,
+  createInMemoryTransport,
+} from "@cosmicdrift/kumiko-bundled-features/channel-email";
+import { createDeliveryFeature } from "@cosmicdrift/kumiko-bundled-features/delivery";
+import { createManagedPagesFeature } from "@cosmicdrift/kumiko-bundled-features/managed-pages";
+import { createRendererFoundationFeature } from "@cosmicdrift/kumiko-bundled-features/renderer-foundation";
+import { createTemplateResolverFeature } from "@cosmicdrift/kumiko-bundled-features/template-resolver";
+import { createDocumentDesignerFeature } from "@cosmicdrift/kumiko-document-designer";
 import { localeDe } from "@cosmicdrift/kumiko-locale-de";
+import { createRendererMailHtmlFeature } from "@cosmicdrift/kumiko-renderer-mail-html";
+import { TENANT_ADMIN_EMAIL } from "./app/auth-constants";
+import { billingFeature } from "./features/billing";
 import { rentalFeature } from "./features/rental";
 import { taskFeature } from "./features/tasks";
 import { vehiclesFeature } from "./features/vehicles";
 
-export const APP_FEATURES = [localeDe(), taskFeature, rentalFeature, vehiclesFeature] as const;
+export const APP_FEATURES = [
+  localeDe(),
+  taskFeature,
+  rentalFeature,
+  vehiclesFeature,
+  billingFeature,
+  createTemplateResolverFeature(),
+  // Only the branding rail of the layout editor needs managed-pages; the sample
+  // serves no public pages, so no host resolves to a tenant.
+  createManagedPagesFeature({ resolveApexTenant: () => null }),
+  createDocumentDesignerFeature(),
+  // Mounted individually: composeRendererStack() would add a second template-resolver.
+  createRendererFoundationFeature(),
+  createRendererMailHtmlFeature(),
+  createDeliveryFeature(),
+  // In-memory transport: the test mail of the mail editor is rendered and
+  // "sent" for real, nothing leaves the process. Every user resolves to the
+  // tenant admin's address because the sample has no per-user mail lookup.
+  createChannelEmailFeature({
+    transport: createInMemoryTransport(),
+    resolveEmail: async () => TENANT_ADMIN_EMAIL,
+  }),
+  createAuditFeature(),
+] as const;
 
 // runDevApp auto-mounts config/user/tenant/auth-email-password when
 // `auth: { … }` is set in server.ts (composeFeatures includeBundled).

package/samples/apps/use-all-bundled/e2e-billing-gallery/gallery-features.ts

@@ -16,7 +16,6 @@ import {
   createChannelEmailFeature,
   createInMemoryTransport,
 } from "@cosmicdrift/kumiko-bundled-features/channel-email";
-import { simpleRenderer } from "@cosmicdrift/kumiko-bundled-features/renderer-simple";
 import type { TenantDb } from "@cosmicdrift/kumiko-framework/db";
 import { defineFeature, type FeatureDefinition } from "@cosmicdrift/kumiko-framework/engine";
 import {
@@ -93,7 +92,6 @@ export function createGalleryBillingFeature(baseUrl: string): FeatureDefinition
 export function createGalleryEmailFeature(): FeatureDefinition {
   return createChannelEmailFeature({
     transport: galleryMailTransport,
-    renderer: simpleRenderer,
     resolveEmail: async () => "unused@gallery.example",
   });
 }