@cosmicdrift/kumiko-document-designer 0.388.0 → 0.390.0

package/dist/web/mail-editor-model.d.ts

@@ -0,0 +1,105 @@
+import type { LeaveTarget } from "./mail-dialogs.tsx";
+import { type MailEditorBodyProps } from "./mail-editor-logic.ts";
+import type { MailDraft, MailValidation, PickedValues } from "./mail-types.ts";
+import type { MailServices, MailUiState } from "./use-mail-editor-parts.ts";
+type Translate = (key: string, params?: Readonly<Record<string, unknown>>) => string;
+export type MailModelInput = {
+    readonly props: MailEditorBodyProps;
+    readonly t: Translate;
+    readonly ui: MailUiState;
+    readonly picked: PickedValues | null;
+    readonly setPicked: (next: PickedValues | null) => void;
+    readonly services: MailServices;
+    readonly validation: MailValidation | null;
+    readonly variableSchema: Readonly<Record<string, unknown>>;
+    readonly pickedVariables: PickedValues | null;
+    readonly locked: boolean;
+    readonly dirty: boolean;
+};
+export declare function buildMailModel(input: MailModelInput): {
+    update: (patch: Partial<MailDraft>) => void;
+    reset: () => void;
+    saveAndReload: (publish: boolean) => Promise<void>;
+    perform: (target: LeaveTarget) => void;
+    leave: (target: LeaveTarget) => void;
+    leaveSave: (target: LeaveTarget) => Promise<void>;
+    removeResource: (key: string) => Promise<void>;
+    sendTestMail: () => void;
+    ui: {
+        baseline: MailDraft;
+        draft: MailDraft;
+        setDraft: import("react").Dispatch<import("react").SetStateAction<MailDraft>>;
+        settled: MailDraft;
+        settle: (next: MailDraft) => void;
+        mode: import("./editor-header.tsx").EditorMode;
+        setMode: import("react").Dispatch<import("react").SetStateAction<import("./editor-header.tsx").EditorMode>>;
+        creating: boolean;
+        setCreating: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+        dialog: import("./mail-dialogs.tsx").ConfirmDialog;
+        setDialog: import("react").Dispatch<import("react").SetStateAction<import("./mail-dialogs.tsx").ConfirmDialog>>;
+        uploadOpen: boolean;
+        setUploadOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+        pdfOpen: boolean;
+        setPdfOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+        resourceError: string | null;
+        setResourceError: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+        resetError: string | null;
+        setResetError: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+        editorEpoch: number;
+        setEditorEpoch: import("react").Dispatch<import("react").SetStateAction<number>>;
+        includeAttachments: boolean;
+        setIncludeAttachments: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+        prefixSubject: boolean;
+        setPrefixSubject: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    };
+    services: {
+        insert: import("./use-insert-targets.ts").InsertTargets;
+        persistence: import("./use-mail-persistence.ts").MailPersistence;
+        testMail: import("./use-test-mail.ts").TestMail;
+        own: import("./use-own-address.ts").OwnAddress;
+        filesAvailable: boolean;
+        resourceRemove: import("@cosmicdrift/kumiko-renderer").UseMutationResult<unknown>;
+        layouts: import("./use-overview-rows.ts").OverviewRows;
+        pdfTemplates: import("./use-overview-rows.ts").OverviewRows;
+    };
+    validation: MailValidation | null;
+    picked: Readonly<Record<string, unknown>> | null;
+    setPicked: (next: PickedValues | null) => void;
+    pickedVariables: Readonly<Record<string, unknown>> | null;
+    variableSchema: Readonly<Record<string, unknown>>;
+    locked: boolean;
+    dirty: boolean;
+    busy: boolean;
+    canSave: boolean;
+    canPublish: boolean;
+    resources: readonly import("./mail-types.ts").LinkedResourceView[];
+    pdfTitles: Map<string, string>;
+    uploadTemplateId: string | null;
+    takenKeys: string[];
+    attachments: ({
+        readonly kind: "file";
+        readonly key: string;
+        readonly fileRefId: string;
+        readonly fileName: string;
+    } | {
+        readonly kind: "pdf";
+        readonly key: string;
+        readonly templateSlug: string;
+        readonly fileName: string;
+    })[];
+    resourcePreviews: {
+        [k: string]: {
+            src: string;
+            caption: string;
+        };
+    };
+    railValidation: MailValidation | null;
+    vocabulary: import("./mail-edit-center.tsx").EditorVocabulary;
+    footer: {
+        readonly tone: "bad" | "warn" | "ok";
+        readonly text: string;
+    } | null;
+    fieldErrors: Partial<Record<"previewText" | "subject", string>>;
+};
+export type MailEditorModel = ReturnType<typeof buildMailModel>;
+export {};

package/dist/web/mail-editor-model.js

@@ -0,0 +1,114 @@
+import { dispatcherErrorText } from "@cosmicdrift/kumiko-renderer";
+import { parseLinkedResources } from "./mail-draft.js";
+import { mailSaveFlags, railValidationOf, resourcePreviewsOfMail, testMailPayload, vocabularyOf, } from "./mail-editor-logic.js";
+import { footerMessage, metaFieldMessages } from "./mail-footer.js";
+import { templateTitleText } from "./used-by-label.js";
+function mailActions(input) {
+    const { props, ui, services } = input;
+    const { draft, baseline, settle } = ui;
+    const { persistence } = services;
+    const update = (patch) => {
+        const next = { ...draft, ...patch };
+        ui.setDraft(next);
+        settle(next);
+    };
+    const reset = () => {
+        ui.setDraft(baseline);
+        settle(baseline);
+        ui.setEditorEpoch((epoch) => epoch + 1);
+        persistence.clearError();
+    };
+    const saveAndReload = async (publish) => {
+        if ((await persistence.save(draft, publish)) !== "failed")
+            await props.onReload();
+    };
+    const perform = (target) => props.onLocaleChange(target.locale);
+    const leave = (target) => {
+        // skip: the target locale is already open
+        if (target.locale === props.locale)
+            return;
+        if (input.dirty)
+            ui.setDialog({ kind: "leave", target });
+        else
+            perform(target);
+    };
+    const leaveSave = async (target) => {
+        if ((await persistence.save(draft, false)) === "saved")
+            perform(target);
+    };
+    return { update, reset, saveAndReload, perform, leave, leaveSave };
+}
+function resourceActions(input, uploadTemplateId) {
+    const { props, t, ui, services } = input;
+    const removeResource = async (key) => {
+        // skip: only tenant rows own removable resources
+        if (uploadTemplateId === null)
+            return;
+        ui.setResourceError(null);
+        const result = await services.resourceRemove.mutate({ templateId: uploadTemplateId, key });
+        if (result.isSuccess)
+            await props.onRefreshRow();
+        else
+            ui.setResourceError(dispatcherErrorText(result.error, t));
+    };
+    const sendTestMail = () => {
+        void services.testMail.send(testMailPayload({
+            slug: props.slug,
+            locale: props.locale,
+            draft: ui.draft,
+            variableSchema: input.variableSchema,
+            includeAttachments: ui.includeAttachments,
+            prefixSubject: ui.prefixSubject,
+            pickedVariables: input.pickedVariables,
+        }));
+    };
+    return { removeResource, sendTestMail };
+}
+export function buildMailModel(input) {
+    const { props, t, ui, services, validation, locked } = input;
+    const { row } = props;
+    const busy = services.persistence.busy;
+    const { canSave, canPublish } = mailSaveFlags({
+        locked,
+        busy,
+        validation,
+        dirty: input.dirty,
+        creating: ui.creating,
+        row,
+    });
+    const resources = parseLinkedResources(row?.linkedResources);
+    const pdfTitles = new Map(services.pdfTemplates.rows.map((template) => [
+        template.slug,
+        templateTitleText(t, template.title),
+    ]));
+    const uploadTemplateId = row?.scope === "tenant" ? row.id : null;
+    const footer = locked || validation === undefined || validation === null
+        ? null
+        : footerMessage(t, validation, ui.mode === "preview" && services.testMail.availability.canSend);
+    return {
+        ui,
+        services,
+        validation,
+        picked: input.picked,
+        setPicked: input.setPicked,
+        pickedVariables: input.pickedVariables,
+        variableSchema: input.variableSchema,
+        locked,
+        dirty: input.dirty,
+        busy,
+        canSave,
+        canPublish,
+        ...mailActions(input),
+        ...resourceActions(input, uploadTemplateId),
+        resources,
+        pdfTitles,
+        uploadTemplateId,
+        takenKeys: resources.map((resource) => resource.key),
+        attachments: resources.filter((resource) => resource.kind !== "image"),
+        resourcePreviews: resourcePreviewsOfMail(resources, t),
+        railValidation: railValidationOf(locked, validation),
+        vocabulary: vocabularyOf(t, validation),
+        footer,
+        fieldErrors: locked ? {} : metaFieldMessages(t, validation),
+    };
+}

package/dist/web/mail-editor-render.d.ts

@@ -0,0 +1,11 @@
+import type { usePrimitives } from "@cosmicdrift/kumiko-renderer";
+import type { ReactNode } from "react";
+import type { MailEditorBodyProps } from "./mail-editor-logic.ts";
+import type { MailEditorModel } from "./mail-editor-model.ts";
+type Translate = (key: string, params?: Readonly<Record<string, unknown>>) => string;
+type Banner = ReturnType<typeof usePrimitives>["Banner"];
+export declare function renderMailControls(props: MailEditorBodyProps, m: MailEditorModel): ReactNode;
+export declare function renderMailBanners(Banner: Banner, t: Translate, m: MailEditorModel): ReactNode;
+export declare function renderMailEditBody(props: MailEditorBodyProps, m: MailEditorModel): ReactNode;
+export declare function renderMailModals(props: MailEditorBodyProps, m: MailEditorModel): ReactNode;
+export {};

package/dist/web/mail-editor-render.js

@@ -0,0 +1,51 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EditorLocaleSwitch } from "./editor-header.js";
+import { EditorBody } from "./editor-shell.js";
+import { MailEditCenter } from "./mail-edit-center.js";
+import { PlaceholderSection, ResourceSection, SystemPlaceholderSection, } from "./mail-left-rail.js";
+import { MissingLocaleCanvas } from "./mail-missing-locale.js";
+import { PdfLinkModal } from "./mail-pdf-link-modal.js";
+import { AttachmentSection, ChromeSection, PropertiesSection, UsageSection, } from "./mail-right-rail.js";
+import { UploadModal } from "./mail-upload-modal.js";
+import { VersionsSection } from "./mail-versions.js";
+export function renderMailControls(props, m) {
+    return (_jsx(EditorLocaleSwitch, { testIdPrefix: "mail", locales: props.locales, locale: props.locale, onLocale: (next) => m.leave({ kind: "locale", locale: next }) }));
+}
+export function renderMailBanners(Banner, t, m) {
+    const { testMail } = m.services;
+    const { resetError, resourceError } = m.ui;
+    return (_jsxs(_Fragment, { children: [testMail.state.kind === "sent" && (_jsx(Banner, { variant: "primary", testId: "mail-test-sent", children: t("documentDesigner.mail.testMail.sent", { subject: testMail.state.subject }) })), testMail.state.kind === "error" && (_jsx(Banner, { variant: "error", testId: "mail-test-error", children: testMail.state.text })), resetError !== null && (_jsx(Banner, { variant: "error", testId: "mail-reset-error", children: resetError })), resourceError !== null && (_jsx(Banner, { variant: "error", testId: "mail-resource-error", children: resourceError }))] }));
+}
+function renderLeftRail(m) {
+    const { insert, filesAvailable } = m.services;
+    const { setUploadOpen, setDialog } = m.ui;
+    return (_jsxs(_Fragment, { children: [_jsx(PlaceholderSection, { validation: m.railValidation, onInsert: insert.insertPlaceholder }), _jsx(SystemPlaceholderSection, { validation: m.railValidation, onInsert: insert.insertPlaceholder }), _jsx(ResourceSection, { resources: m.resources, pdfTitles: m.pdfTitles, canUpload: m.uploadTemplateId !== null, filesAvailable: filesAvailable, onUpload: () => setUploadOpen(true), onInsert: insert.insertResource, onRemove: (key) => setDialog({ kind: "remove", key }) })] }));
+}
+function renderCenterCanvas(props, m) {
+    if (m.locked) {
+        return (_jsx(MissingLocaleCanvas, { slug: props.slug, locale: props.locale, fallbackLocale: props.fallbackLocale, copyScope: props.isSystemAdmin ? "system" : "tenant", onCreateBlank: () => m.ui.setCreating(true), onCopied: () => void props.onReload() }));
+    }
+    return (_jsx(MailEditCenter, { draft: m.ui.draft, vocabulary: m.vocabulary, resourcePreviews: m.resourcePreviews, insert: m.services.insert, readOnly: false, fieldErrors: m.fieldErrors, onChange: m.update }, m.ui.editorEpoch));
+}
+function renderRightRail(props, m) {
+    const { row } = props;
+    return (_jsxs(_Fragment, { children: [_jsx(PropertiesSection, { slug: props.slug, draft: m.ui.draft, layouts: m.services.layouts.rows, onChange: m.update }), _jsx(ChromeSection, { draft: m.ui.draft, vocabulary: m.vocabulary, insert: m.services.insert, onChange: m.update }), _jsx(AttachmentSection, { attachments: m.attachments, pdfTitles: m.pdfTitles, canEdit: m.uploadTemplateId !== null, onAddPdf: () => m.ui.setPdfOpen(true), onRemove: (key) => m.ui.setDialog({ kind: "remove", key }) }), _jsx(UsageSection, { slug: props.slug }), _jsx(VersionsSection, { rowId: row?.id ?? null, currentVersion: row?.version ?? 0, currentStatus: row?.status ?? "draft" })] }));
+}
+export function renderMailEditBody(props, m) {
+    return (_jsx(EditorBody, { left: renderLeftRail(m), center: renderCenterCanvas(props, m), right: renderRightRail(props, m) }));
+}
+export function renderMailModals(props, m) {
+    const { uploadTemplateId, takenKeys } = m;
+    if (uploadTemplateId === null)
+        return false; // skip: only tenant rows accept uploads
+    const { insert, pdfTemplates } = m.services;
+    return (_jsxs(_Fragment, { children: [_jsx(UploadModal, { open: m.ui.uploadOpen, onOpenChange: m.ui.setUploadOpen, target: {
+                    templateId: uploadTemplateId,
+                    takenKeys,
+                    onUploaded: (uploaded) => {
+                        if (uploaded.purpose === "image")
+                            insert.insertResource(uploaded.key);
+                        void props.onRefreshRow();
+                    },
+                } }), _jsx(PdfLinkModal, { open: m.ui.pdfOpen, onOpenChange: m.ui.setPdfOpen, templates: pdfTemplates.rows, variableLabels: m.vocabulary.labels, templateId: uploadTemplateId, takenKeys: takenKeys, onLinked: () => void props.onRefreshRow() })] }));
+}

package/dist/web/mail-preview-render.d.ts

@@ -0,0 +1,5 @@
+import type { ReactNode } from "react";
+import type { MailEditorBodyProps } from "./mail-editor-logic.ts";
+import type { MailEditorModel } from "./mail-editor-model.ts";
+import { MailPreviewMode } from "./mail-preview.tsx";
+export declare function renderMailPreview(props: MailEditorBodyProps, m: MailEditorModel, controls: ReactNode, origin: React.ComponentProps<typeof MailPreviewMode>["origin"]): ReactNode;

package/dist/web/mail-preview-render.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { previewPayload } from "./mail-editor-logic.js";
+import { MailPreviewMode } from "./mail-preview.js";
+export function renderMailPreview(props, m, controls, origin) {
+    const { ui, services } = m;
+    const { testMail } = services;
+    return (_jsx(MailPreviewMode, { payload: previewPayload({
+            slug: props.slug,
+            locale: props.locale,
+            settled: ui.settled,
+            variableSchema: m.variableSchema,
+            pickedVariables: m.pickedVariables,
+        }), picked: m.picked, onPick: m.setPicked, validation: m.validation ?? null, slug: props.slug, locale: props.locale, fromName: ui.settled.senderName, own: services.own, origin: origin, controls: controls, testMail: {
+            availability: testMail.availability,
+            pending: testMail.pending,
+            onSend: m.sendTestMail,
+            includeAttachments: ui.includeAttachments,
+            onIncludeAttachments: ui.setIncludeAttachments,
+            prefixSubject: ui.prefixSubject,
+            onPrefixSubject: ui.setPrefixSubject,
+        } }));
+}

package/dist/web/pdf-editor-actions.d.ts

@@ -0,0 +1,27 @@
+import type { useDispatcher } from "@cosmicdrift/kumiko-renderer";
+import { type Draft, type EditorState } from "./pdf-editor-draft.ts";
+import { type TemplateDetail } from "./types.ts";
+import type { PdfEditorState } from "./use-pdf-editor-state.ts";
+type Translate = (key: string, params?: Readonly<Record<string, unknown>>) => string;
+export type PdfActionsInput = {
+    readonly s: PdfEditorState;
+    readonly t: Translate;
+    readonly dispatcher: ReturnType<typeof useDispatcher>;
+    readonly slug: string;
+    readonly current: EditorState;
+    readonly detail: TemplateDetail;
+    readonly dirty: boolean;
+    readonly onLocaleChange: ((locale: string) => void) | undefined;
+};
+export declare function buildPdfActions(input: PdfActionsInput): {
+    updateDraft: (next: Draft) => void;
+    resetDraft: (source: TemplateDetail) => void;
+    save: () => Promise<boolean>;
+    publish: () => Promise<void>;
+    generatePdf: () => Promise<void>;
+    printOnce: () => void;
+    uploadResource: (file: File) => Promise<void>;
+    requestLocale: (next: string) => void;
+};
+export type PdfActions = ReturnType<typeof buildPdfActions>;
+export {};

package/dist/web/pdf-editor-actions.js

@@ -0,0 +1,146 @@
+import { TemplateResolverHandlers } from "@cosmicdrift/kumiko-bundled-features/template-resolver/web";
+import { uploadFileRef } from "@cosmicdrift/kumiko-renderer/web";
+import { RendererPuppeteerClientQueries } from "@cosmicdrift/kumiko-renderer-puppeteer-client/qualified-names";
+import { describeError, isAlreadyActive } from "./errors.js";
+import { draftFromDetail, SETTLE_MS, snapshotOf, } from "./pdf-editor-draft.js";
+import { serializePdfMeta } from "./pdf-meta.js";
+import { DOCUMENT_PDF_KIND, } from "./types.js";
+function draftActions(input) {
+    const { s } = input;
+    const { setState } = s.doc;
+    const { settleTimer } = s;
+    function updateDraft(next) {
+        setState((previous) => (previous === null ? previous : { ...previous, draft: next }));
+        if (settleTimer.current !== null)
+            clearTimeout(settleTimer.current);
+        settleTimer.current = setTimeout(() => {
+            setState((previous) => previous === null ? previous : { ...previous, settled: previous.draft });
+        }, SETTLE_MS);
+    }
+    function resetDraft(source) {
+        const draft = draftFromDetail(source);
+        if (settleTimer.current !== null)
+            clearTimeout(settleTimer.current);
+        setState({ key: source.id, draft, settled: draft, snapshot: snapshotOf(draft) });
+        s.ui.setDraftEpoch((epoch) => epoch + 1);
+        s.ui.setActionError(null);
+    }
+    return { updateDraft, resetDraft };
+}
+function writeActions(input) {
+    const { s, t, dispatcher, slug, current, detail, dirty } = input;
+    const { locale, rowsQuery, detailQuery, setState } = s.doc;
+    const { variableSchema, validationQuery } = s.server;
+    const { scope } = s.host;
+    const { setBusy, setActionError } = s.ui;
+    async function reload() {
+        await Promise.all([rowsQuery.refetch(), detailQuery.refetch(), validationQuery.refetch()]);
+    }
+    async function persist() {
+        const { draft } = current;
+        const parentTemplateId = detail?.scope === "system" ? detail.id : detail?.parentTemplateId;
+        const result = await dispatcher.write(scope === "system"
+            ? TemplateResolverHandlers.upsertSystem
+            : TemplateResolverHandlers.upsertTenant, {
+            slug,
+            kind: DOCUMENT_PDF_KIND,
+            locale,
+            content: draft.content,
+            contentFormat: "html",
+            variableSchema,
+            meta: serializePdfMeta(draft.meta),
+            ...(scope === "tenant" && parentTemplateId != null && { parentTemplateId }),
+        });
+        if (!result.isSuccess) {
+            setActionError(describeError(t, result.error));
+            return null;
+        }
+        setState((previous) => previous === null ? previous : { ...previous, snapshot: snapshotOf(draft) });
+        return result.data;
+    }
+    async function save() {
+        setBusy("save");
+        setActionError(null);
+        const saved = await persist();
+        if (saved !== null)
+            await reload();
+        setBusy(null);
+        return saved !== null;
+    }
+    async function publish() {
+        setBusy("publish");
+        setActionError(null);
+        // A system save activates immediately; a tenant row needs a save first when it
+        // does not exist yet or carries unsaved edits, then an explicit publish.
+        const needsSave = dirty || detail?.scope === "system";
+        const saved = needsSave ? await persist() : null;
+        const saveFailed = needsSave && saved === null;
+        // upsertSystem already activates, so only a tenant row needs the explicit publish.
+        const alreadyActivatedBySave = scope === "system" && saved !== null;
+        const templateId = saved?.id ?? detail?.id ?? null;
+        if (templateId !== null && !saveFailed && !alreadyActivatedBySave) {
+            const result = await dispatcher.write(scope === "system"
+                ? TemplateResolverHandlers.publishSystem
+                : TemplateResolverHandlers.publish, { id: templateId });
+            if (!result.isSuccess && !isAlreadyActive(result.error))
+                setActionError(describeError(t, result.error));
+        }
+        await reload();
+        setBusy(null);
+    }
+    return { save, publish };
+}
+function pdfActions(input) {
+    const { s, t, dispatcher, slug, current, detail, dirty, onLocaleChange } = input;
+    const { locale, detailQuery } = s.doc;
+    const { variableSchema } = s.server;
+    const { setMode, setBusy, setActionError, setGenerated, autoPrintedFor, setPendingLocale } = s.ui;
+    async function generatePdf() {
+        setMode("preview");
+        setBusy("pdf");
+        setActionError(null);
+        const forSnapshot = snapshotOf(current.draft);
+        const result = await dispatcher.query(RendererPuppeteerClientQueries.previewPdf, {
+            slug,
+            locale,
+            content: current.draft.content,
+            meta: serializePdfMeta(current.draft.meta),
+            variableSchema,
+        });
+        if (result.isSuccess)
+            setGenerated({ forSnapshot, result: result.data });
+        else
+            setActionError(describeError(t, result.error));
+        setBusy(null);
+    }
+    function printOnce() {
+        // skip: this draft was already printed
+        if (autoPrintedFor.current === snapshotOf(current.draft))
+            return;
+        autoPrintedFor.current = snapshotOf(current.draft);
+        void generatePdf();
+    }
+    async function uploadResource(file) {
+        const sourceFileRefId = await uploadFileRef(file);
+        const result = await dispatcher.write(TemplateResolverHandlers.resourceUpload, {
+            templateId: detail?.id,
+            sourceFileRefId,
+        });
+        if (!result.isSuccess)
+            throw new Error(describeError(t, result.error));
+        await detailQuery.refetch();
+    }
+    function requestLocale(next) {
+        // skip: the requested locale is already open
+        if (next === locale)
+            return;
+        if (dirty)
+            setPendingLocale(next);
+        else
+            onLocaleChange?.(next);
+    }
+    return { generatePdf, printOnce, uploadResource, requestLocale };
+}
+export function buildPdfActions(input) {
+    return { ...draftActions(input), ...writeActions(input), ...pdfActions(input) };
+}

package/dist/web/pdf-editor-chrome.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from "react";
+import type { PdfRenderContext } from "./pdf-editor-context.ts";
+export declare function renderPdfHeader(c: PdfRenderContext): ReactNode;
+export declare function renderPdfInfoBar(c: PdfRenderContext): ReactNode;
+export declare function renderPdfFooter(c: PdfRenderContext): ReactNode;
+export declare function renderPdfLocaleDialog(c: PdfRenderContext): ReactNode;

package/dist/web/pdf-editor-chrome.js

@@ -0,0 +1,60 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EditorHeader, EditorLocaleSwitch, EditorModeSwitch, originOf } from "./editor-header.js";
+import { EditorFooter, EditorInfoBar } from "./editor-shell.js";
+import { OverridesDrawer } from "./overrides-drawer.js";
+export function renderPdfHeader(c) {
+    const { s, view, detail, actions } = c;
+    const { busy, mode, setMode } = s.ui;
+    return (_jsx(EditorHeader, { title: view.title, stored: { status: detail.status, version: detail.version }, actions: {
+            busy: busy === "save",
+            canSave: busy === null && s.server.validation?.canSave !== false,
+            canPublish: busy === null && view.canPublish,
+            onSave: () => void actions.save(),
+            onPublish: () => void actions.publish(),
+        }, children: _jsx(EditorModeSwitch, { testIdPrefix: "pdf", mode: mode, onMode: setMode }) }));
+}
+function renderInfoControls(c) {
+    const { t, Button, s, view, actions } = c;
+    const { busy, mode } = s.ui;
+    const { locale, locales } = s.doc;
+    return (_jsxs(_Fragment, { children: [_jsx(EditorLocaleSwitch, { testIdPrefix: "pdf", locales: locales.length > 0 ? locales : [locale], locale: locale, onLocale: actions.requestLocale }), mode === "preview" && (_jsx(Button, { variant: "secondary", disabled: !view.pdfAvailable || busy !== null, loading: busy === "pdf", onClick: () => void actions.generatePdf(), testId: "pdf-generate-header", children: t("documentDesigner.actions.generatePdf") }))] }));
+}
+function renderOverrideLinks(c) {
+    const { t, Button, s, view } = c;
+    return (view.showOverrideLinks && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "link", onClick: () => void c.exportBundle(), children: t("documentDesigner.originBar.export") }), _jsx(Button, { variant: "link", onClick: () => s.ui.setOverridesOpen(true), children: t("documentDesigner.originBar.showOverrides") })] })));
+}
+function renderUnavailableNote(c) {
+    const { t, view } = c;
+    return (view.pdfUnavailableNote && (_jsxs(_Fragment, { children: [" ", _jsx("span", { "data-testid": "pdf-unavailable", children: view.unavailableMessage === ""
+                    ? t("documentDesigner.pdfUnavailableNoReason")
+                    : t("documentDesigner.pdfUnavailable", { message: view.unavailableMessage }) })] })));
+}
+export function renderPdfInfoBar(c) {
+    const { s, view, detail, slug } = c;
+    const { overridesOpen, setOverridesOpen } = s.ui;
+    return (_jsxs(EditorInfoBar, { tone: view.pdfUnavailableNote ? "warn" : detail.scope === "tenant" ? "active" : "muted", testId: "pdf-origin-bar", origin: originOf(detail.scope === "system", view.systemVersion !== null), controls: renderInfoControls(c), overlays: _jsx(OverridesDrawer, { open: overridesOpen, onOpenChange: setOverridesOpen, slug: slug, locale: s.doc.locale, overrides: s.server.overridesQuery.data }), links: renderOverrideLinks(c), children: [view.originText, view.besideActiveSentence !== null && ` ${view.besideActiveSentence}`, renderUnavailableNote(c)] }));
+}
+export function renderPdfFooter(c) {
+    const { s, view, detail, actions } = c;
+    const { busy } = s.ui;
+    return (_jsx(EditorFooter, { testIdPrefix: "pdf-editor", message: view.footer, saveError: s.ui.actionError, modifiedAt: detail.modifiedAt ?? null, dirty: view.dirty, busy: busy === "save", canSave: busy === null && s.server.validation?.canSave !== false, canPublish: busy === null && view.canPublish, onDiscard: () => actions.resetDraft(detail), onSave: () => void actions.save(), onPublish: () => void actions.publish() }));
+}
+export function renderPdfLocaleDialog(c) {
+    const { t, Button, Dialog, s, actions, detail, onLocaleChange } = c;
+    const { pendingLocale, setPendingLocale } = s.ui;
+    return (_jsx(Dialog, { open: pendingLocale !== null, onOpenChange: (open) => {
+            if (!open)
+                setPendingLocale(null);
+        }, title: t("documentDesigner.localeDialog.title"), description: t("documentDesigner.localeDialog.description"), confirmLabel: t("documentDesigner.localeDialog.save"), cancelLabel: t("documentDesigner.localeDialog.cancel"), onConfirm: async () => {
+            const target = pendingLocale;
+            if (target !== null && (await actions.save()))
+                onLocaleChange?.(target);
+            setPendingLocale(null);
+        }, children: _jsx(Button, { variant: "danger-ghost", onClick: () => {
+                const target = pendingLocale;
+                setPendingLocale(null);
+                actions.resetDraft(detail);
+                if (target !== null)
+                    onLocaleChange?.(target);
+            }, children: t("documentDesigner.localeDialog.discard") }) }));
+}

package/dist/web/pdf-editor-context.d.ts

@@ -0,0 +1,22 @@
+import type { usePrimitives } from "@cosmicdrift/kumiko-renderer";
+import type { PdfActions } from "./pdf-editor-actions.ts";
+import type { EditorState } from "./pdf-editor-draft.ts";
+import type { PdfView } from "./pdf-editor-view.ts";
+import type { TemplateDetail } from "./types.ts";
+import type { PdfEditorState } from "./use-pdf-editor-state.ts";
+type Translate = (key: string, params?: Readonly<Record<string, unknown>>) => string;
+type Primitives = ReturnType<typeof usePrimitives>;
+export type PdfRenderContext = {
+    readonly t: Translate;
+    readonly Button: Primitives["Button"];
+    readonly Dialog: Primitives["Dialog"];
+    readonly slug: string;
+    readonly s: PdfEditorState;
+    readonly actions: PdfActions;
+    readonly view: PdfView;
+    readonly current: EditorState;
+    readonly detail: TemplateDetail;
+    readonly onLocaleChange: ((locale: string) => void) | undefined;
+    readonly exportBundle: () => Promise<void>;
+};
+export {};

package/dist/web/pdf-editor-context.js

@@ -0,0 +1 @@
+export {};

package/dist/web/pdf-editor-draft.d.ts

@@ -0,0 +1,23 @@
+import type { MailVariable } from "./mail-types.ts";
+import { type PdfMetaDraft } from "./pdf-meta.ts";
+import type { PdfPreviewResult, TemplateDetail, VariableInfo } from "./types.ts";
+export declare const SETTLE_MS = 500;
+export declare const NO_VARIABLES: Readonly<Record<string, VariableInfo>>;
+export type Draft = {
+    readonly content: string;
+    readonly meta: PdfMetaDraft;
+};
+export type EditorState = {
+    readonly key: string;
+    readonly draft: Draft;
+    readonly settled: Draft;
+    readonly snapshot: string;
+};
+export type GeneratedPdf = {
+    readonly forSnapshot: string;
+    readonly result: PdfPreviewResult;
+};
+export declare const draftFromDetail: (detail: TemplateDetail) => Draft;
+export declare const snapshotOf: (draft: Draft) => string;
+export declare function imageLabelSource(variables: Readonly<Record<string, VariableInfo>>): Readonly<Record<string, MailVariable>>;
+export declare function textVariablesOf(variables: Readonly<Record<string, VariableInfo>>): Readonly<Record<string, MailVariable>>;

package/dist/web/pdf-editor-draft.js

@@ -0,0 +1,33 @@
+import { parsePdfMeta, serializePdfMeta } from "./pdf-meta.js";
+export const SETTLE_MS = 500;
+export const NO_VARIABLES = {};
+export const draftFromDetail = (detail) => ({
+    content: detail.content,
+    meta: parsePdfMeta(detail.meta),
+});
+export const snapshotOf = (draft) => JSON.stringify({ content: draft.content, meta: serializePdfMeta(draft.meta) });
+// Only the label of an images variable is needed, for the Images block and its picker.
+export function imageLabelSource(variables) {
+    const result = {};
+    for (const [name, info] of Object.entries(variables)) {
+        if (info.type === "images" && info.label !== undefined) {
+            result[name] = { type: "text", label: info.label };
+        }
+    }
+    return result;
+}
+export function textVariablesOf(variables) {
+    const result = {};
+    for (const [name, info] of Object.entries(variables)) {
+        if (info.type === "images")
+            continue;
+        const { item, ...rest } = info;
+        const columns = Object.entries(item ?? {}).flatMap(([column, def]) => def.type === "images" ? [] : [[column, { ...def, type: def.type }]]);
+        result[name] = {
+            ...rest,
+            type: info.type,
+            ...(item !== undefined && { item: Object.fromEntries(columns) }),
+        };
+    }
+    return result;
+}

package/dist/web/pdf-editor-panes.d.ts

@@ -0,0 +1,6 @@
+import { type ReactNode } from "react";
+import type { PdfRenderContext } from "./pdf-editor-context.ts";
+export declare function renderPdfLeftRail(c: PdfRenderContext): ReactNode;
+export declare function renderPdfEditCanvas(c: PdfRenderContext): ReactNode;
+export declare function renderPdfPreviewPane(c: PdfRenderContext): ReactNode;
+export declare function renderPdfSettings(c: PdfRenderContext): ReactNode;