diff --git a/README.md b/README.md index 267879f..11c439a 100644 --- a/README.md +++ b/README.md @@ -31,6 +31,8 @@ One canonical implementation, consumed by both repos, makes this class of drift **2026-07-25, Vorkasse fixes (v0.2.3).** `isPaidImmediately()` matched `paymentMethodTitle` with an exact `!==` check against the literal string `"Überweisung"` — the consuming shop renamed its Vorkasse row to `"Überweisung (Vorkasse)"` the same day (to make room for a possible future *automated* bank-transfer method, e.g. "Sofortüberweisung", routed through a real payment gateway), which would have silently made every unpaid Vorkasse invoice show "✓ Bereits beglichen". Changed to `startsWith("Überweisung")` — same "only Überweisung is the named exception" design, tolerant of a suffix qualifier on that one title. Also added an explicit instruction in the unpaid case (previously the *absence* of the paid confirmation was the only signal, no actual text): "Bitte überweisen Sie den Rechnungsbetrag unter Angabe der Bestellnummer … auf die unten stehende Bankverbindung. Die Bestellung wird nach Zahlungseingang bearbeitet (in der Regel innerhalb von 1–2 Werktagen)." — same plain-text treatment as the paid confirmation (`unpaidNoticeText`, muted rather than green — an unpaid Vorkasse invoice isn't a problem, just an expected pending state). +**2026-07-25, unpaid-notice layout fix (v0.2.4).** The new unpaid-Vorkasse instruction (v0.2.3) reused `paidBadgeRow`, which lives inside `summary`'s `alignItems: "flex-end"` column (240pt-wide, designed for the short one-line paid confirmation) — so the longer two-sentence instruction shrank to content width and read as squeezed under the narrow summary card instead of a proper full-width note. Moved to its own sibling row (`unpaidNoticeRow`, `width: "100%"`, `marginTop: 20` vs. `paidBadgeRow`'s 10) outside `summary` entirely, left-aligned instead of right-aligned. + ## How this is consumed Not published to npm — installed as a git dependency: diff --git a/package.json b/package.json index d3b84eb..59ce3e3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@einfach-produktiv/invoicing", - "version": "0.2.3", + "version": "0.2.4", "private": true, "description": "Shared invoice / correction-invoice (Stornorechnung, Gutschrift) PDF generation and VAT-breakdown math, consumed as a git dependency by both the einfach-produktiv frontend and the payload backend — not published to npm.", "type": "module", diff --git a/src/invoicePdf.tsx b/src/invoicePdf.tsx index 69893c6..564c80d 100644 --- a/src/invoicePdf.tsx +++ b/src/invoicePdf.tsx @@ -53,9 +53,17 @@ const styles = StyleSheet.create({ // Same plain-text treatment as paidBadgeText (no pill/box, see that // style's own comment) — muted, not an error/warning color, since an // unpaid Vorkasse invoice isn't a problem, just a pending, expected - // state. Right-aligned + a max width so the two-sentence instruction - // wraps under the summary card instead of running the full page width. - unpaidNoticeText: { fontSize: 9, color: TEXT_MUTED, textAlign: "right", maxWidth: 220 }, + // state. `width: "100%"` + left-aligned + its own row (not + // `paidBadgeRow`) — an earlier version reused `paidBadgeRow`, which + // sits inside `summary`'s `alignItems: "flex-end"` column, so a + // right-aligned, unconstrained-width Text there just shrank to content + // and read as squeezed under the narrow summaryBox instead of a proper + // full-width instruction. `unpaidNoticeRow` below breaks out of that. + unpaidNoticeText: { fontSize: 9, lineHeight: 1.5, color: TEXT_MUTED, textAlign: "left" }, + // More top space than paidBadgeRow's 10 — this is a longer, more + // important instruction than a one-line confirmation, needs to read as + // its own section, not crowd the summary card above it. + unpaidNoticeRow: { width: "100%", alignSelf: "stretch", marginTop: 20 }, table: { borderRadius: 6, overflow: "hidden", borderWidth: 1, borderColor: BORDER, marginTop: 8, marginBottom: 16 }, tableHeader: { flexDirection: "row", backgroundColor: BG_MUTED, paddingVertical: 8, paddingHorizontal: 10 }, // Every item row shares this same tinted background now — no more @@ -463,18 +471,22 @@ export function InvoiceDocument({ order, seller }: { order: InvoiceOrder; seller )} - {paid ? ( + {paid && ( ✓ Bereits beglichen ({order.paymentMethodTitle}) - ) : ( - - - Bitte überweisen Sie den Rechnungsbetrag unter Angabe der Bestellnummer {order.orderNumber} auf die unten stehende Bankverbindung. Die Bestellung wird nach Zahlungseingang bearbeitet (in der Regel innerhalb von 1–2 Werktagen). - - )} + {/* Sibling of `summary`, not nested inside it — `summary`'s own + `alignItems: "flex-end"` is meant for the narrow paid-badge + case, not this full-width, multi-sentence instruction. */} + {!paid && ( + + + Bitte überweisen Sie den Rechnungsbetrag unter Angabe der Bestellnummer {order.orderNumber} auf die unten stehende Bankverbindung. Die Bestellung wird nach Zahlungseingang bearbeitet (in der Regel innerhalb von 1–2 Werktagen). + + + )}