@bytebrand/fe-ui-core-autobahn 1.0.100 → 1.0.102

package/locales/de/autobahn.json

@@ -699,7 +699,7 @@
     "vehiclePrice": "Fahrzeugpreis ggf. inkl. MwSt.",
     "leasingAmount": "Leasingbetrag",
     "netLoanAmount": "Nettodarlehensbetrag",
-    "downPayment": "Sonderzahlung",
+    "downPayment": "Anzahlung",
     "annualMileage": "Laufleistung / Jahr",
     "term": "Vertragslaufzeit",
     "months": "{{months}} Monat",

package/locales/en/autobahn.json

@@ -699,7 +699,7 @@
     "vehiclePrice": "Vehicle price (incl. VAT, if applicable)",
     "leasingAmount": "Leasing amount",
     "netLoanAmount": "Net loan amount",
-    "downPayment": "Special payment",
+    "downPayment": "Down payment",
     "annualMileage": "Mileage / year",
     "term": "Contract term",
     "months": "{{months}} month",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core-autobahn",
-  "version": "1.0.100",
+  "version": "1.0.102",
   "description": "auto.de md3 (Autobahn) design system — UI primitives, cards, chrome, VDP modules, theme CSS and locales. Ships raw TypeScript source (like fe-ui-core before it); each consumer's bundler compiles it.",
   "main": "index.ts",
   "license": "UNLICENSED",
@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@bytebrand/car-schema-selectors": "^2.0.7",
-    "@bytebrand/fe-financing": "^5.14.12",
+    "@bytebrand/fe-financing": "^5.14.15",
     "classnames": "2.2.6",
     "clsx": "^2.1.1",
     "d3-format": "1.4.5",

package/vdp/VdpModules.tsx

@@ -1845,6 +1845,11 @@ export interface FinanceDetailsModalProps {
   /** car make+model — mobile sheet subtitle under the title (mockup). */
   vehicleName?: string;
   price: number;
+  /** "No package" reference price (common.basePrice = originalSalesPrice + margin) — the
+   *  Repräsentatives Beispiel's Fahrzeugpreis/Anschaffungspreis line uses THIS, not `price`
+   *  (which is the real, package-dependent Kaufen/rate-basis price shown everywhere else).
+   *  Falls back to `price` when not supplied. */
+  basePrice?: number;
   monthly: number;
   /** struck old rate (oldMonthlyInstallment, isStrikeShown-gated) — red line-through next to the rate. */
   oldMonthly?: number;
@@ -1859,8 +1864,14 @@ export interface FinanceDetailsModalProps {
   netLoanAmount?: number;
   /** Schlussrate (balloon final installment); shown only when > 0. */
   finalInstallment?: number;
-  /** Gesamt(rückzahlungs)betrag from the config; shown only when > 0 (never the wrong monthly·term). */
+  /** Gesamt(rückzahlungs)betrag from the config; shown only when > 0 (never the wrong monthly·term).
+   *  Drives the bold "Gesamtbelastung inkl. Anzahlung" grand total ONLY — the "Gesamtbetrag
+   *  Finanzierung" disclosure line itself uses totalFinancingAmount below instead. */
   grossAmount?: number;
+  /** getFinancing's totalFinancingAmount = (paybackPeriod-1)×monthlyCarPrice + finalInstallment —
+   *  the simpler Repräsentatives-Beispiel total (uniform Folgerate, no separate 1.Rate), financing
+   *  only. Falls back to grossAmount when not supplied. */
+  totalFinancingAmount?: number;
   /** Sollzinssatz p.a. (%); shown only when > 0. */
   nominalRate?: number;
   /** slider bounds — when the change handlers are supplied, the modal shows adjustment sliders. */
@@ -1921,6 +1932,7 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
   mode,
   vehicleName,
   price,
+  basePrice,
   monthly,
   oldMonthly,
   listPrice,
@@ -1931,6 +1943,7 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
   netLoanAmount,
   finalInstallment,
   grossAmount,
+  totalFinancingAmount,
   nominalRate,
   downMin,
   downMax,
@@ -2091,7 +2104,7 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
     const subtotalWithPackage = ratesSum != null ? ratesSum + down + (hasAddServicesRow ? addServicesRowValue : 0) : undefined;
     const grandTotal = subtotalWithPackage != null ? subtotalWithPackage + residual : undefined;
     rows = [
-      [t('autobahn:modal.leaseVehiclePrice'), `${eurCents(price)} €`],
+      [t('autobahn:modal.leaseVehiclePrice'), `${eurCents(basePrice ?? price)} €`],
       [t('autobahn:modal.term'), t('autobahn:modal.months', { months: term, count: term })],
       ...(annualMileage != null ? ([[t('autobahn:modal.annualMileage'), `${eur(annualMileage)} km`]] as Array<[string, string]>) : []),
       [t('autobahn:modal.leaseDownPayment'), `${eurCents(down)} €`],
@@ -2117,19 +2130,29 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
       ...(listPrice != null && listPrice > 0 ? ([[t('autobahn:modal.listPriceLease'), `${eurCents(listPrice)} €`]] as Array<[string, string]>) : []),
     ];
   } else {
+    // Ballonfinanzierung: `term` includes the Schlussrate as its final slot, so only
+    // (term-1) of them are regular Folgerate-value installments. Without a balloon, all
+    // `term` payments are regular — no adjustment.
+    const hasBalloon = finalInstallment != null && finalInstallment > 0;
+    const regularRateCount = hasBalloon ? term - 1 : term;
+    // Repräsentatives-Beispiel total for THIS line only — falls back to grossAmount when the
+    // page hasn't been updated to pass totalFinancingAmount yet.
+    const totalRepaymentValue = totalFinancingAmount ?? grossAmount;
     rows = [
-      [t('autobahn:modal.vehiclePrice'), `${eurCents(price)} €`],
+      [t('autobahn:modal.vehiclePrice'), `${eurCents(basePrice ?? price)} €`],
       [t('autobahn:modal.term'), t('autobahn:modal.months', { months: term, count: term })],
       [t('autobahn:modal.downPayment'), `${eurCents(down)} €`],
-      [t('autobahn:modal.monthlyRateCount', { count: term }), `${eurCents(monthly)} €`],
-      ...(finalInstallment != null && finalInstallment > 0 ? ([[t('autobahn:modal.finalInstallment'), `${eurCents(finalInstallment)} €`]] as Array<[string, string]>) : []),
+      [t('autobahn:modal.monthlyRateCount', { count: regularRateCount }), `${eurCents(monthly)} €`],
+      ...(hasBalloon ? ([[t('autobahn:modal.finalInstallment'), `${eurCents(finalInstallment)} €`]] as Array<[string, string]>) : []),
       ...(hasAddServicesRow
         ? ([[t('autobahn:modal.addServicesRow'), `${eurCents(addServicesRowValue)} €`]] as Array<[string, string]>)
         : []),
       ...(nominalRate != null && nominalRate > 0 ? ([[t('autobahn:modal.nominalRate'), pct(nominalRate)]] as Array<[string, string]>) : []),
       [t('autobahn:modal.effectiveRate'), pct(apr)],
       [t('autobahn:modal.netLoanAmount'), `${eurCents(netto)} €`],
-      ...(grossAmount != null && grossAmount > 0 ? ([[t('autobahn:modal.totalRepayment'), `${eurCents(grossAmount)} €`]] as Array<[string, string]>) : []),
+      ...(totalRepaymentValue != null && totalRepaymentValue > 0
+        ? ([[t('autobahn:modal.totalRepayment'), `${eurCents(totalRepaymentValue)} €`]] as Array<[string, string]>)
+        : []),
       ...(totalCost != null
         ? ([[hasAddServices || hasAddServicesRow ? t('autobahn:modal.totalCostWithPackage') : t('autobahn:modal.totalCost'), `${eurCents(totalCost)} €`, true]] as Array<
             [string, string, boolean]