@cosmicdrift/kumiko-document-designer 0.363.0 → 0.364.0

package/dist/web/relative-time.d.ts

@@ -0,0 +1 @@
+export declare function formatRelativeWhen(value: string, now?: number): string;

package/dist/web/relative-time.js

@@ -0,0 +1,18 @@
+const UNITS = [
+    ["day", 86_400_000],
+    ["hour", 3_600_000],
+    ["minute", 60_000],
+];
+// Falls back to the raw value for an unparseable timestamp, like formatWhen.
+export function formatRelativeWhen(value, now = Date.now()) {
+    const then = Date.parse(value);
+    if (Number.isNaN(then))
+        return value;
+    const formatter = new Intl.RelativeTimeFormat(undefined, { numeric: "auto" });
+    const elapsed = then - now;
+    for (const [unit, size] of UNITS) {
+        if (Math.abs(elapsed) >= size)
+            return formatter.format(Math.round(elapsed / size), unit);
+    }
+    return formatter.format(0, "minute");
+}

package/dist/web/settings-panel.d.ts

@@ -1,17 +1,23 @@
 import type { ReactNode } from "react";
+import type { EditorVocabulary } from "./mail-edit-center.js";
+import type { OverviewRowView } from "./overview-row.js";
 import { type PdfMetaDraft } from "./pdf-meta.js";
-import type { TemplateStatus } from "./types.js";
+import { type TemplateStatus } from "./types.js";
+import type { InsertTargets } from "./use-insert-targets.js";
 export type VersionInfo = {
+    readonly id: string;
     readonly version: number;
     readonly status: TemplateStatus;
-    readonly modifiedAt: string | null;
 };
 export type SettingsPanelProps = {
     readonly meta: PdfMetaDraft;
     readonly onMetaChange: (next: PdfMetaDraft) => void;
-    /** Layout slugs available for this locale; the default layout is always offered. */
-    readonly layoutSlugs: readonly string[];
+    readonly layouts: readonly OverviewRowView[];
     readonly locale: string;
     readonly version: VersionInfo;
+    readonly vocabulary: EditorVocabulary;
+    readonly insert: InsertTargets;
+    /** Changes when the draft is replaced from outside, so the single-line editors re-read it. */
+    readonly draftKey: string;
 };
-export declare function SettingsPanel({ meta, onMetaChange, layoutSlugs, locale, version, }: SettingsPanelProps): ReactNode;
+export declare function SettingsPanel({ meta, onMetaChange, layouts, locale, version, vocabulary, insert, draftKey, }: SettingsPanelProps): ReactNode;

package/dist/web/settings-panel.js

@@ -1,25 +1,36 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // @runtime client
+import { PDF_ORIENTATIONS, PDF_PAGE_FORMATS, PlaceholderLineEditor, } from "@cosmicdrift/kumiko-bundled-features/template-resolver/web";
 import { usePrimitives, useTranslation } from "@cosmicdrift/kumiko-renderer";
-import { ModeSwitch, SectionCard, StatusBadge } from "@cosmicdrift/kumiko-renderer-web";
-import { MARGIN_SIDES, ORIENTATIONS, PAGE_FORMATS, } from "./pdf-meta.js";
+import { languageName } from "./mail-origin-bar.js";
+import { layoutOptionLabel } from "./mail-right-rail.js";
+import { VersionsSection } from "./mail-versions.js";
+import { MARGIN_SIDES } from "./pdf-meta.js";
+import { RailField, RailHint, RailSection } from "./rail.js";
+import { DEFAULT_LAYOUT_SLUG } from "./types.js";
 const SIDE_LABEL_KEYS = {
     top: "documentDesigner.settings.marginTop",
     right: "documentDesigner.settings.marginRight",
     bottom: "documentDesigner.settings.marginBottom",
     left: "documentDesigner.settings.marginLeft",
 };
-export function SettingsPanel({ meta, onMetaChange, layoutSlugs, locale, version, }) {
+export function SettingsPanel({ meta, onMetaChange, layouts, locale, version, vocabulary, insert, draftKey, }) {
     const t = useTranslation();
-    const { Field, Input } = usePrimitives();
+    const { Field, Input, Text } = usePrimitives();
     const patch = (changes) => onMetaChange({ ...meta, ...changes });
-    return (_jsxs("div", { className: "flex flex-col gap-4", "data-testid": "document-designer-settings", children: [_jsxs(SectionCard, { title: t("documentDesigner.settings.page"), children: [_jsx(Field, { id: "dd-layout", label: t("documentDesigner.settings.layout"), children: _jsx(Input, { kind: "select", id: "dd-layout", name: "layoutSlug", value: meta.layoutSlug, onChange: (layoutSlug) => patch({ layoutSlug }), display: "dropdown", options: [
-                                { value: "", label: t("documentDesigner.settings.layoutDefault") },
-                                ...layoutSlugs.map((slug) => ({ value: slug, label: slug })),
-                            ] }) }), _jsx(Field, { id: "dd-file-name", label: t("documentDesigner.settings.fileName"), children: _jsx(Input, { kind: "text", id: "dd-file-name", name: "fileName", value: meta.fileName, onChange: (fileName) => patch({ fileName }), placeholder: "rechnung-{{number}}.pdf" }) }), _jsx(ModeSwitch, { ariaLabel: t("documentDesigner.settings.pageFormat"), value: meta.pageFormat, onChange: (pageFormat) => patch({ pageFormat }), options: PAGE_FORMATS.map((value) => ({ value, label: value })) }), _jsx(ModeSwitch, { ariaLabel: t("documentDesigner.settings.orientation"), value: meta.orientation, onChange: (orientation) => patch({ orientation }), options: ORIENTATIONS.map((value) => ({
-                            value,
-                            label: t(`documentDesigner.settings.${value}`),
-                        })) }), _jsx("div", { className: "grid grid-cols-2 gap-2", children: MARGIN_SIDES.map((side) => (_jsx(Field, { id: `dd-margin-${side}`, label: t(SIDE_LABEL_KEYS[side]), children: _jsx(Input, { kind: "number", id: `dd-margin-${side}`, name: `margin-${side}`, value: meta.margins[side], onChange: (value) => patch({ margins: { ...meta.margins, [side]: value ?? "" } }), placeholder: "15" }) }, side))) }), _jsx(Field, { id: "dd-print-background", label: t("documentDesigner.settings.printBackground"), layout: "inline", children: _jsx(Input, { kind: "boolean", id: "dd-print-background", name: "printBackground", value: meta.printBackground, onChange: (printBackground) => patch({ printBackground }) }) }), _jsx(Field, { id: "dd-layout-header-footer", label: t("documentDesigner.settings.layoutHeaderFooter"), layout: "inline", children: _jsx(Input, { kind: "boolean", id: "dd-layout-header-footer", name: "layoutHeaderFooter", value: meta.layoutHeaderFooter, onChange: (layoutHeaderFooter) => patch({ layoutHeaderFooter }) }) })] }), _jsxs(SectionCard, { title: t("documentDesigner.settings.metadata"), children: [_jsx(Field, { id: "dd-meta-title", label: t("documentDesigner.settings.metaTitle"), children: _jsx(Input, { kind: "text", id: "dd-meta-title", name: "metaTitle", value: meta.title, onChange: (title) => patch({ title }) }) }), _jsx(Field, { id: "dd-meta-author", label: t("documentDesigner.settings.metaAuthor"), children: _jsx(Input, { kind: "text", id: "dd-meta-author", name: "metaAuthor", value: meta.author, onChange: (author) => patch({ author }) }) }), _jsx(Field, { id: "dd-meta-language", label: t("documentDesigner.settings.metaLanguage"), children: _jsx(Input, { kind: "text", id: "dd-meta-language", name: "metaLanguage", value: locale, onChange: () => undefined, disabled: true }) })] }), _jsx(SectionCard, { title: t("documentDesigner.settings.storage"), children: _jsx("p", { className: "text-xs text-muted-foreground", children: t("documentDesigner.settings.storageHint") }) }), _jsx(SectionCard, { title: t("documentDesigner.settings.versions"), children: _jsxs("div", { className: "flex items-center justify-between gap-2 text-sm", children: [_jsx("span", { children: `v${version.version}` }), _jsx("span", { className: "text-xs text-muted-foreground", children: version.modifiedAt?.slice(0, 10) ?? "" }), _jsx(StatusBadge, { tone: version.status === "active" ? "ok" : "warn", children: t(version.status === "active"
-                                ? "documentDesigner.status.active"
-                                : "documentDesigner.status.draft") })] }) })] }));
+    return (_jsxs("div", { "data-testid": "document-designer-settings", children: [_jsx(RailSection, { title: t("documentDesigner.settings.page"), testId: "pdf-editor-document", children: _jsxs(RailField, { children: [_jsx(Field, { id: "dd-layout", label: t("documentDesigner.settings.layout"), children: _jsx(Input, { kind: "select", id: "dd-layout", name: "layoutSlug", value: meta.layoutSlug === "" ? DEFAULT_LAYOUT_SLUG : meta.layoutSlug, onChange: (layoutSlug) => patch({ layoutSlug }), display: "dropdown", options: layouts.map((layout) => ({
+                                    value: layout.slug,
+                                    label: layoutOptionLabel(t, layout),
+                                })) }) }), _jsx(Field, { id: "dd-file-name", label: t("documentDesigner.settings.fileName"), children: _jsx(Input, { kind: "text", id: "dd-file-name", name: "fileName", value: meta.fileName, onChange: (fileName) => patch({ fileName }), placeholder: "rechnung-{{number}}.pdf" }) }), _jsxs("div", { className: "grid grid-cols-[minmax(0,1fr)_minmax(0,1.5fr)] gap-2", children: [_jsx(Field, { id: "dd-page-format", label: t("documentDesigner.settings.pageFormat"), children: _jsx(Input, { kind: "select", id: "dd-page-format", name: "pageFormat", value: meta.pageFormat, onChange: (pageFormat) => {
+                                            const next = PDF_PAGE_FORMATS.find((format) => format === pageFormat);
+                                            if (next !== undefined)
+                                                patch({ pageFormat: next });
+                                        }, display: "dropdown", options: PDF_PAGE_FORMATS.map((value) => ({ value, label: value })) }) }), _jsx(Field, { id: "dd-orientation", label: t("documentDesigner.settings.orientation"), children: _jsx(Input, { kind: "select", id: "dd-orientation", name: "orientation", value: meta.orientation, onChange: (orientation) => {
+                                            const next = PDF_ORIENTATIONS.find((candidate) => candidate === orientation);
+                                            if (next !== undefined)
+                                                patch({ orientation: next });
+                                        }, display: "dropdown", options: PDF_ORIENTATIONS.map((value) => ({
+                                            value,
+                                            label: t(`documentDesigner.settings.${value}`),
+                                        })) }) })] }), _jsxs("fieldset", { className: "m-0 flex min-w-0 flex-col gap-1 border-0 p-0", children: [_jsx("legend", { className: "p-0 text-sm font-medium", children: t("documentDesigner.settings.margins") }), _jsx("div", { className: "grid grid-cols-4 gap-1", children: MARGIN_SIDES.map((side) => (_jsx(Field, { id: `dd-margin-${side}`, label: t(SIDE_LABEL_KEYS[side]), hideLabel: true, children: _jsx(Input, { kind: "number", id: `dd-margin-${side}`, name: `margin-${side}`, value: meta.margins[side], onChange: (value) => patch({ margins: { ...meta.margins, [side]: value ?? "" } }), placeholder: "15" }) }, side))) })] }), _jsx(Field, { id: "dd-print-background", label: t("documentDesigner.settings.printBackground"), layout: "inline", children: _jsx(Input, { kind: "boolean", id: "dd-print-background", name: "printBackground", value: meta.printBackground, onChange: (printBackground) => patch({ printBackground }) }) }), _jsx(Field, { id: "dd-layout-header-footer", label: t("documentDesigner.settings.layoutHeaderFooter"), layout: "inline", children: _jsx(Input, { kind: "boolean", id: "dd-layout-header-footer", name: "layoutHeaderFooter", value: meta.layoutHeaderFooter, onChange: (layoutHeaderFooter) => patch({ layoutHeaderFooter }) }) })] }) }), _jsxs(RailSection, { title: t("documentDesigner.settings.metadata"), testId: "pdf-editor-metadata", children: [_jsxs(RailField, { children: [_jsx("div", { onFocusCapture: insert.markFocused("title"), "data-testid": "pdf-meta-title", children: _jsx(Field, { id: "dd-meta-title", label: t("documentDesigner.settings.metaTitle"), children: _jsx(PlaceholderLineEditor, { id: "dd-meta-title", value: meta.title, onChange: (title) => patch({ title }), variableLabels: vocabulary.labels, systemVariables: vocabulary.system, onEditorReady: insert.register("title"), "aria-label": t("documentDesigner.settings.metaTitle") }, `title:${draftKey}`) }) }), _jsx("div", { onFocusCapture: insert.markFocused("author"), "data-testid": "pdf-meta-author", children: _jsx(Field, { id: "dd-meta-author", label: t("documentDesigner.settings.metaAuthor"), children: _jsx(PlaceholderLineEditor, { id: "dd-meta-author", value: meta.author, onChange: (author) => patch({ author }), variableLabels: vocabulary.labels, systemVariables: vocabulary.system, onEditorReady: insert.register("author"), "aria-label": t("documentDesigner.settings.metaAuthor") }, `author:${draftKey}`) }) }), _jsxs("div", { className: "flex flex-col gap-1", "data-testid": "pdf-meta-language", children: [_jsx("span", { className: "text-sm font-medium", children: t("documentDesigner.settings.metaLanguage") }), _jsx(Text, { children: `${languageName(t, locale)} (${locale})` })] })] }), _jsx(RailHint, { children: t("documentDesigner.settings.metaLanguageHint") })] }), _jsx(RailSection, { title: t("documentDesigner.settings.storage"), testId: "pdf-editor-storage", children: _jsx(RailHint, { children: t("documentDesigner.settings.storageHint") }) }), _jsx(VersionsSection, { rowId: version.id, currentVersion: version.version, currentStatus: version.status })] }));
 }

package/dist/web/status-label.d.ts

@@ -3,5 +3,12 @@ import type { OverviewRowView } from "./overview-row.js";
 type Translate = (key: string, params?: Readonly<Record<string, unknown>>) => string;
 export declare function statusTone(status: OverviewRowView["status"]): StatusBadgeTone;
 export declare function statusLabel(t: Translate, status: OverviewRowView["status"], version: number): string;
+export declare function draftBesideActiveSentence(t: Translate, row: {
+    readonly status: string;
+    readonly version: number;
+    readonly active?: {
+        readonly version: number;
+    } | null;
+}): string | null;
 export declare function asRowStatus(status: string): OverviewRowView["status"];
 export {};

package/dist/web/status-label.js

@@ -13,6 +13,14 @@ export function statusLabel(t, status, version) {
         ? "documentDesigner.status.activeVersion"
         : "documentDesigner.status.draftVersion", { version });
 }
+export function draftBesideActiveSentence(t, row) {
+    if (asRowStatus(row.status) !== "draft" || row.active == null)
+        return null;
+    return t("documentDesigner.origin.draftBesideActive", {
+        active: row.active.version,
+        draft: row.version,
+    });
+}
 export function asRowStatus(status) {
     return status === "active" || status === "archived" ? status : "draft";
 }

package/dist/web/types.d.ts

@@ -1,4 +1,5 @@
 import type { FieldIssue } from "@cosmicdrift/kumiko-headless";
+import type { TemplateDiff } from "./layout-types.js";
 export type TemplateScope = "system" | "tenant";
 export type TemplateStatus = "draft" | "active" | "archived";
 export declare const DOCUMENT_PDF_KIND: "document-pdf";
@@ -31,12 +32,22 @@ export type TemplateDetail = {
     readonly parentTemplateId: string | null;
     readonly status: TemplateStatus;
     readonly modifiedAt: string | null;
+    readonly active?: ServedVersionView | null;
+};
+/** The version the resolver serves while a draft is open beside it. */
+export type ServedVersionView = {
+    readonly version: number;
+    readonly since: string;
 };
 export type VariableType = "text" | "link" | "money" | "date" | "list";
 export type VariableInfo = {
     readonly type: VariableType;
     readonly label?: string;
     readonly required?: boolean;
+    readonly item?: Readonly<Record<string, {
+        readonly type: VariableType;
+        readonly label?: string;
+    }>>;
 };
 export type ValidationWarning = {
     readonly code: string;
@@ -82,10 +93,22 @@ export type PdfPreviewResult = {
     readonly sizeBytes: number;
     readonly durationMs: number;
 };
+export type TenantOverrideRow = {
+    readonly tenantId: string;
+    readonly tenantName: string;
+    readonly templateId: string;
+    readonly locale: string;
+    readonly status: "active" | "draft";
+    readonly version: number;
+    readonly changedAt: string;
+    readonly changedBy: string | null;
+};
 export type TenantOverrides = {
     readonly activeOverrides: number;
     readonly draftOverrides: number;
     readonly totalTenants: number | null;
+    readonly rows: readonly TenantOverrideRow[];
+    readonly diff: TemplateDiff | null;
 };
 export type SaveResult = {
     readonly id: string;

package/dist/web/use-insert-targets.d.ts

@@ -1,5 +1,5 @@
 import type { DocumentEditorHandle } from "@cosmicdrift/kumiko-bundled-features/template-resolver/web";
-export type InsertField = "subject" | "previewText" | "body";
+export type InsertField = "subject" | "previewText" | "body" | "title" | "author";
 export type InsertTargets = {
     readonly register: (field: InsertField) => (handle: DocumentEditorHandle) => void;
     readonly markFocused: (field: InsertField) => () => void;

package/dist/web/use-mail-persistence.d.ts

@@ -11,5 +11,4 @@ export declare function useMailPersistence(args: {
     readonly title: string;
     readonly isSystemAdmin: boolean;
     readonly row: TemplateRowView | null;
-    readonly sender: unknown;
 }): MailPersistence;

package/dist/web/use-mail-persistence.js

@@ -21,7 +21,7 @@ export function useMailPersistence(args) {
             title: args.title,
             content: draft.body,
             contentFormat: "html",
-            meta: buildMeta(draft, args.sender),
+            meta: buildMeta(draft),
             variableSchema: parseJsonRecord(args.row?.variableSchema),
         };
         const saved = args.isSystemAdmin

package/dist/web/use-own-address.d.ts

@@ -0,0 +1,5 @@
+export type OwnAddress = {
+    readonly email: string | null;
+    readonly profileScreenId: string | null;
+};
+export declare function useOwnAddress(): OwnAddress;

package/dist/web/use-own-address.js

@@ -0,0 +1,14 @@
+// @runtime client
+import { useAppFeatures, useQuery } from "@cosmicdrift/kumiko-renderer";
+import { PROFILE_FEATURE_NAME, PROFILE_SCREEN_ID, USER_ME_QUERY_QN } from "../constants.js";
+export function useOwnAddress() {
+    const features = useAppFeatures();
+    const me = useQuery(USER_ME_QUERY_QN, {});
+    const email = me.data?.email;
+    const hasProfileScreen = features.some((feature) => feature.featureName === PROFILE_FEATURE_NAME &&
+        feature.screens.some((screen) => screen.id === PROFILE_SCREEN_ID));
+    return {
+        email: typeof email === "string" && email !== "" ? email : null,
+        profileScreenId: hasProfileScreen ? PROFILE_SCREEN_ID : null,
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-document-designer",
-  "version": "0.363.0",
+  "version": "0.364.0",
   "description": "Document designer for Kumiko: template overview, layout editor (mail layout, PDF letterhead) and the PDF template editor.",
   "license": "BUSL-1.1",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
@@ -19,13 +19,13 @@
     }
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-bundled-features": "0.363.0",
-    "@cosmicdrift/kumiko-framework": "0.363.0",
-    "@cosmicdrift/kumiko-headless": "0.363.0",
-    "@cosmicdrift/kumiko-renderer": "0.363.0",
-    "@cosmicdrift/kumiko-renderer-puppeteer-client": "0.363.0",
-    "@cosmicdrift/kumiko-renderer-web": "0.363.0",
-    "@cosmicdrift/kumiko-types": "0.363.0",
+    "@cosmicdrift/kumiko-bundled-features": "0.364.0",
+    "@cosmicdrift/kumiko-framework": "0.364.0",
+    "@cosmicdrift/kumiko-headless": "0.364.0",
+    "@cosmicdrift/kumiko-renderer": "0.364.0",
+    "@cosmicdrift/kumiko-renderer-puppeteer-client": "0.364.0",
+    "@cosmicdrift/kumiko-renderer-web": "0.364.0",
+    "@cosmicdrift/kumiko-types": "0.364.0",
     "pdfjs-dist": "6.3.289",
     "react": "^19.2.6"
   },

package/src/changes.json

@@ -1,4 +1,28 @@
 [
+  {
+    "version": "0.364.0",
+    "type": "improvement",
+    "title": "Editors and overview show an open draft beside the active version",
+    "detail": "The editor header shows the served version (Active vN) next to the open draft (Draft vM), fed by the active field of find-by-id and layout-source; the template overview shows the draftVersion badge under the status of an active row."
+  },
+  {
+    "version": "0.364.0",
+    "type": "improvement",
+    "title": "Document designer editors follow the approved board",
+    "detail": "Mail-layout templates accept appearance meta (width, font, outer background, accent line, button style) that the mail renderer applies, and the layout-source query returns it. The layout editor uses the shared editor shell with one paper and one shared toolbar (`DocumentContentEditor` gains `toolbarHost`). Mail and PDF editors share frame, info bar, rails and footer.\nThe unused `sender` key of mail template meta is gone from the editor; stored rows that still carry it are read without it, so they stay editable.\nInvalid template meta now reports per-field messages (`templateResolver.errors.template.meta.<field>.required|invalid`) instead of the parser text; the editors show them at the field. The `tenant-overrides` query additionally returns one row per customising tenant (name, status, version, changed at/by) and, with `diffTenantId`, the diff to the system version. A language without a version shows an empty state in the mail editor instead of a disabled editor.\nThe `compileDocumentBody` option `resourceImageMaxWidthPx` caps resource images in mails (180 px). The `send-test` command takes `prefixSubject` (default true) to skip the `[TEST]` subject prefix, the template preview returns `mailLayout` (slug, scope, version of the layout used), and `RenderedMail` carries the layout ref."
+  },
+  {
+    "version": "0.364.0",
+    "type": "fix",
+    "title": "PDF editor keeps unset margins unset, frees old PDF previews, and shows reset and diff errors",
+    "detail": "Setting one margin no longer stores the other three as 15 mm, so the layout's header and footer margins still apply to them. The PDF preview no longer re-renders pages or stacks text layers on re-render and destroys the previous document. A failed reset to the system version shows an error banner in the PDF and mail editors, and a failing diff query shows an error state with retry instead of loading forever. The canvas reserves the footer margin like the renderer. Page formats, orientations and default margins now come from template-resolver (new exports PDF_ORIENTATIONS, PDF_DEFAULT_MARGIN_MM, PDF_HEADER_MARGIN_MM, PDF_FOOTER_MARGIN_MM, PdfOrientation)."
+  },
+  {
+    "version": "0.364.0",
+    "type": "fix",
+    "title": "Layout editor shows the real number of mails or PDFs using a layout",
+    "detail": "The editor asks the overview for the users of one layout (kind and layoutSlug filter) and takes the count from total, so a tenant with more than 200 templates no longer sees a too low usage number."
+  },
   {
     "version": "0.363.0",
     "type": "improvement",

package/dist/web/mail-header.d.ts

@@ -1,23 +0,0 @@
-import type { ReactNode } from "react";
-import type { TemplateRowView } from "./mail-types.js";
-export type EditorMode = "edit" | "preview";
-export type HeaderActions = {
-    readonly busy: boolean;
-    readonly canSave: boolean;
-    readonly canPublish: boolean;
-    readonly onSave: () => void;
-    readonly onPublish: () => void;
-};
-export declare function MailHeader({ title, row, locales, locale, mode, testPending, actions, onBack, onLocale, onMode, onTestMail, }: {
-    readonly title: string;
-    readonly row: TemplateRowView | null;
-    readonly locales: readonly string[];
-    readonly locale: string;
-    readonly mode: EditorMode;
-    readonly testPending: boolean;
-    readonly actions: HeaderActions;
-    readonly onBack: () => void;
-    readonly onLocale: (locale: string) => void;
-    readonly onMode: (mode: EditorMode) => void;
-    readonly onTestMail: () => void;
-}): ReactNode;

package/dist/web/mail-header.js

@@ -1,16 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// @runtime client
-import { usePrimitives, useTranslation } from "@cosmicdrift/kumiko-renderer";
-import { ModeSwitch, StatusBadge } from "@cosmicdrift/kumiko-renderer-web";
-import { asRowStatus, statusLabel, statusTone } from "./status-label.js";
-export function MailHeader({ title, row, locales, locale, mode, testPending, actions, onBack, onLocale, onMode, onTestMail, }) {
-    const t = useTranslation();
-    const { Button, Heading, Link, Text } = usePrimitives();
-    const status = row === null ? null : asRowStatus(row.status);
-    return (_jsxs("div", { className: "flex flex-col gap-3", "data-testid": "mail-editor-header", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [_jsx(Link, { href: "#", onPress: onBack, testId: "document-designer-back", children: t("documentDesigner.editor.crumb") }), _jsx(Text, { variant: "muted", children: "\u203A" }), _jsx(Heading, { variant: "page", testId: "document-designer-editor-title", children: title }), row !== null && status !== null && (_jsxs(_Fragment, { children: [_jsx(StatusBadge, { tone: statusTone(status), testId: "document-designer-editor-status", children: statusLabel(t, status, row.version) }), _jsx(StatusBadge, { tone: row.scope === "tenant" ? "accent" : "muted", testId: "document-designer-editor-origin", children: t(row.scope === "tenant"
-                                    ? "documentDesigner.origin.tenant"
-                                    : "documentDesigner.origin.system") })] })), _jsx("div", { className: "grow" }), _jsx(ModeSwitch, { value: locale, onChange: onLocale, ariaLabel: t("documentDesigner.mail.header.localeSwitch"), testId: "mail-locale-switch", options: locales.map((code) => ({ value: code, label: code })) }), _jsx(ModeSwitch, { value: mode, onChange: onMode, ariaLabel: t("documentDesigner.mail.header.modeSwitch"), testId: "mail-mode-switch", options: [
-                            { value: "edit", label: t("documentDesigner.mail.header.edit") },
-                            { value: "preview", label: t("documentDesigner.mail.header.preview") },
-                        ] })] }), _jsxs("div", { className: "flex items-center gap-3", "data-testid": "mail-editor-header-actions", children: [_jsx(Button, { variant: "secondary", disabled: testPending, loading: testPending, onClick: onTestMail, testId: "mail-test-mail-header", children: t("documentDesigner.mail.header.testMail") }), _jsx(Button, { variant: "secondary", disabled: !actions.canSave, loading: actions.busy, onClick: actions.onSave, testId: "mail-header-save", children: t("documentDesigner.editor.save") }), _jsx(Button, { disabled: !actions.canPublish, onClick: actions.onPublish, testId: "mail-header-publish", children: t("documentDesigner.editor.publish") })] })] }));
-}

package/dist/web/placeholder-panel.d.ts

@@ -1,21 +0,0 @@
-import type { ReactNode } from "react";
-import type { VariableInfo } from "./types.js";
-export type SystemPlaceholderRow = {
-    readonly name: string;
-    readonly label: string;
-    readonly status: "used" | "layout" | "unused";
-};
-export type PlaceholderPanelProps = {
-    readonly variables: Readonly<Record<string, VariableInfo>>;
-    readonly used: readonly string[];
-    readonly missingRequired: readonly string[];
-    readonly systemRows: readonly SystemPlaceholderRow[];
-    readonly resourceKeys: readonly string[];
-    readonly canUpload: boolean;
-    readonly layoutName: string;
-    readonly onInsert: (name: string) => void;
-    readonly onInsertResource: (key: string) => void;
-    readonly onUpload: (file: File) => Promise<void>;
-};
-export declare function visibleSystemPlaceholders(names: readonly string[]): readonly string[];
-export declare function PlaceholderPanel(props: PlaceholderPanelProps): ReactNode;

package/dist/web/placeholder-panel.js

@@ -1,35 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// @runtime client
-import { usePrimitives, useTranslation } from "@cosmicdrift/kumiko-renderer";
-import { cn, SectionCard, UploadZone } from "@cosmicdrift/kumiko-renderer-web";
-const TYPE_GLYPHS = {
-    text: "T",
-    money: "€",
-    date: "D",
-    link: "↗",
-    list: "≡",
-};
-// unsubscribeUrl belongs to mail; the PDF designer never offers it.
-const HIDDEN_SYSTEM_PLACEHOLDERS = new Set(["unsubscribeUrl"]);
-export function visibleSystemPlaceholders(names) {
-    return names.filter((name) => !HIDDEN_SYSTEM_PLACEHOLDERS.has(name));
-}
-export function PlaceholderPanel(props) {
-    const t = useTranslation();
-    const { Button } = usePrimitives();
-    const names = Object.keys(props.variables);
-    return (_jsxs("div", { className: "flex flex-col gap-4", "data-testid": "document-designer-placeholders", children: [_jsx(SectionCard, { title: t("documentDesigner.placeholders.title"), children: _jsx("ul", { className: "m-0 flex list-none flex-col gap-1 p-0", children: names.map((name) => {
-                        const info = props.variables[name];
-                        if (info === undefined)
-                            return null;
-                        const missing = props.missingRequired.includes(name);
-                        const isUsed = props.used.includes(name);
-                        return (_jsx("li", { children: _jsxs("button", { type: "button", "data-testid": `placeholder-${name}`, onClick: () => props.onInsert(name), className: cn("flex w-full items-center gap-2 rounded-md border px-2 py-1 text-left text-sm", missing
-                                    ? "border-status-bad bg-status-bad-surface"
-                                    : "border-border bg-background hover:bg-muted"), children: [_jsx("span", { className: "w-4 text-center text-xs text-muted-foreground", children: TYPE_GLYPHS[info.type] }), _jsxs("span", { className: "min-w-0 flex-1 truncate", children: [info.label ?? name, info.required === true ? " *" : ""] }), _jsx("span", { className: cn("text-xs", missing ? "font-medium text-status-bad" : "text-muted-foreground"), children: missing ? t("documentDesigner.placeholders.missing") : isUsed ? "✓" : "–" })] }) }, name));
-                    }) }) }), _jsx(SectionCard, { title: t("documentDesigner.placeholders.system"), children: _jsx("ul", { className: "m-0 flex list-none flex-col gap-1 p-0", children: props.systemRows.map((row) => (_jsx("li", { children: _jsxs("button", { type: "button", "data-testid": `system-placeholder-${row.name}`, onClick: () => props.onInsert(row.name), className: "flex w-full items-center gap-2 rounded-md border border-primary/30 bg-primary/10 px-2 py-1 text-left text-sm text-primary", children: [_jsx("span", { className: "min-w-0 flex-1 truncate", children: row.label }), _jsx("span", { className: "text-xs", children: row.status === "used"
-                                        ? "✓"
-                                        : row.status === "layout"
-                                            ? t("documentDesigner.placeholders.fromLayout")
-                                            : "–" })] }) }, row.name))) }) }), _jsxs(SectionCard, { title: t("documentDesigner.resources.title"), children: [props.resourceKeys.length === 0 ? (_jsx("p", { className: "text-xs text-muted-foreground", children: t("documentDesigner.resources.empty") })) : (_jsx("ul", { className: "m-0 flex list-none flex-col gap-1 p-0 font-mono text-xs", children: props.resourceKeys.map((key) => (_jsxs("li", { className: "flex items-center justify-between gap-2", children: [_jsx("span", { className: "truncate", children: key }), _jsx(Button, { variant: "link", size: "sm", onClick: () => props.onInsertResource(key), ariaLabel: t("documentDesigner.resources.insertNamed", { key }), children: t("documentDesigner.resources.insert") })] }, key))) })), props.canUpload ? (_jsx(UploadZone, { multiple: false, accept: ["image/png", "image/jpeg", "image/gif", "image/webp"], title: t("documentDesigner.resources.upload"), onUpload: props.onUpload, testId: "document-designer-upload" })) : (_jsx(Button, { variant: "secondary", size: "sm", disabled: true, children: t("documentDesigner.resources.upload") })), !props.canUpload && (_jsx("p", { className: "text-xs text-muted-foreground", children: t("documentDesigner.resources.saveFirst") }))] }), _jsx("p", { className: "text-xs text-muted-foreground", children: t("documentDesigner.placeholders.layoutHint", { layout: props.layoutName }) })] }));
-}