@bytebrand/fe-ui-core-autobahn 1.0.81 → 1.0.82

package/compat/CookieModal/modals/ManageCookieModal/ManageCookieModal.tsx

@@ -30,11 +30,11 @@ const ManageCookieModal = ({ toggleModal, handleSentryInit } : IManageCookieModa
     () => {
       const newAnalyticsSwitches = Object.values(COOKIE_SCHEMA.analytics)
         .reduce((acc, val) => acc.concat(val), [])
-        .reduce((acc, item) => ({ ...acc, [item]: false }), {});
+        .reduce((acc, item) => ({ ...acc, [item]: true }), {});
 
       const newMarketingSwitches = Object.values(COOKIE_SCHEMA.marketing)
         .reduce((acc, val) => acc.concat(val), [])
-        .reduce((acc, item) => ({ ...acc, [item]: false }), {});
+        .reduce((acc, item) => ({ ...acc, [item]: true }), {});
       setAnalyticsSwitches(newAnalyticsSwitches);
       setMarketingSwitches(newMarketingSwitches);
     },

package/compat/MdAccordionGroup/MdAccordionGroup.tsx

@@ -45,7 +45,7 @@ const MdAccordionGroup: React.FC<IMdAccordionGroupProps> = ({ title, tooltipText
         ) : null}
         <Icon name='chevron-down' cls='macc-chev' />
       </div>
-      {open ? <div style={{ padding: '4px 0 12px' }}>{children}</div> : null}
+      {open ? <div style={{ padding: '4px 15px 12px' }}>{children}</div> : null}
     </section>
   );
 };

package/locales/de/autobahn.json

@@ -107,9 +107,12 @@
     "addServicesPerMonth": "+{{value}} € / Monat",
     "addServicesOnce": "+{{value}} €",
     "addServicesIncluded": "inklusive",
-    "addServicesTooltipIntro": "Das Rundum-Sorglos-Paket ist Bestandteil des Angebots und im Kaufpreis enthalten.",
+    "addServicesTooltipIntroCash": "Das Rundum-Sorglos-Paket ist Bestandteil des Angebots und im Kaufpreis enthalten.",
+    "addServicesTooltipIntroFinanced": "Das Rundum-Sorglos-Paket ist verpflichtender Bestandteil des Angebots. Die Kosten fallen unabhängig von der gewählten Zahlungsweise an.",
     "addServicesTooltipHeading": "Im Rundum-Sorglos-Paket enthalten:",
-    "addServicesTooltipItems": "kompletter Zulassungsservice inklusive Wunschkennzeichen, soweit verfügbar\nsorgfältige Prüfung und Vorbereitung aller Zulassungsunterlagen\nbundesweite Fahrzeugauslieferung bis vor Ihre Haustür\npersönliche Fahrzeugübergabe\nhochwertige Fahrzeugaufbereitung innen und außen\nausführlicher technischer Übergabecheck\nHU und Inspektion, falls erforderlich\nTank- beziehungsweise Ladegrundfüllung bei Übergabe\npersönlicher Ansprechpartner von Beginn an"
+    "addServicesTooltipItems": "kompletter Zulassungsservice inklusive Wunschkennzeichen, soweit verfügbar\nsorgfältige Prüfung und Vorbereitung aller Zulassungsunterlagen\nbundesweite Fahrzeugauslieferung bis vor Ihre Haustür\npersönliche Fahrzeugübergabe\nhochwertige Fahrzeugaufbereitung innen und außen\nausführlicher technischer Übergabecheck\nHU und Inspektion, falls erforderlich\nTank- beziehungsweise Ladegrundfüllung bei Übergabe\npersönlicher Ansprechpartner von Beginn an",
+    "addServicesTooltipOutroFinancing": "Sie können die Paketkosten entweder einmalig in Höhe von 1.499,00 € bezahlen oder in die Fahrzeugfinanzierung einbeziehen lassen. Bei der Mitfinanzierung wird keine zusätzliche Einmalzahlung für das Paket erhoben. Die gewählte Zahlungsweise sowie die daraus resultierende monatliche Finanzierungsrate und der Gesamtbetrag werden in den Finanzierungsdetails ausgewiesen. Die Paketkosten sind in jedem Fall im ausgewiesenen Gesamtbetrag berücksichtigt.",
+    "addServicesTooltipOutroLeasing": "Sie können die Paketkosten entweder einmalig in Höhe von 1.499,00 € bezahlen oder in die monatliche Leasingrate einrechnen lassen. Bei der Rateneinrechnung wird keine zusätzliche Einmalzahlung für das Paket erhoben. Die gewählte Zahlungsweise sowie die daraus resultierende Monatsrate und der Gesamtbetrag werden in den Leasingdetails ausgewiesen. Die Paketkosten sind in jedem Fall im ausgewiesenen Gesamtbetrag berücksichtigt."
   },
   "specTable": {
     "title": "Fahrzeugdaten",

package/locales/en/autobahn.json

@@ -107,9 +107,12 @@
     "addServicesPerMonth": "+€{{value}} / month",
     "addServicesOnce": "+€{{value}}",
     "addServicesIncluded": "included",
-    "addServicesTooltipIntro": "The all-round care package is part of the offer and included in the purchase price.",
+    "addServicesTooltipIntroCash": "The all-round care package is part of the offer and included in the purchase price.",
+    "addServicesTooltipIntroFinanced": "The all-round care package is a mandatory part of the offer. Its cost applies regardless of the payment method chosen.",
     "addServicesTooltipHeading": "Included in the all-round care package:",
-    "addServicesTooltipItems": "complete registration service including a custom license plate, where available\ncareful review and preparation of all registration documents\nnationwide vehicle delivery to your doorstep\npersonal vehicle handover\nhigh-quality interior and exterior vehicle detailing\ndetailed technical handover check\nroadworthiness test (HU) and inspection, if required\nfuel or charge top-up at handover\npersonal point of contact from day one"
+    "addServicesTooltipItems": "complete registration service including a custom license plate, where available\ncareful review and preparation of all registration documents\nnationwide vehicle delivery to your doorstep\npersonal vehicle handover\nhigh-quality interior and exterior vehicle detailing\ndetailed technical handover check\nroadworthiness test (HU) and inspection, if required\nfuel or charge top-up at handover\npersonal point of contact from day one",
+    "addServicesTooltipOutroFinancing": "You can either pay the package cost as a one-off amount of €1,499.00, or have it included in the vehicle financing. If included in financing, no separate one-off payment for the package is charged. The payment method you choose, along with the resulting monthly financing rate and total amount, is shown in the financing details. The package cost is included in the total amount shown in either case.",
+    "addServicesTooltipOutroLeasing": "You can either pay the package cost as a one-off amount of €1,499.00, or have it included in the monthly leasing rate. If included in the rate, no separate one-off payment for the package is charged. The payment method you choose, along with the resulting monthly rate and total amount, is shown in the leasing details. The package cost is included in the total amount shown in either case."
   },
   "specTable": {
     "title": "Vehicle data",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core-autobahn",
-  "version": "1.0.81",
+  "version": "1.0.82",
   "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",

package/theme/md3.css

@@ -7184,13 +7184,21 @@ color: #005CFF;
   width: auto;
   z-index: 20;
   margin-bottom: 10px;
-  max-height: 260px;
   cursor: default;
 }
 .md3 .fin-modal .fin-toggle-addservices--cash .fin-toggle-tooltip {
   top: auto;
   bottom: auto;
 }
+.md3 .fin-modal .show-mobile .fin-toggle-tooltip {
+  border-radius: 11px;
+}
+/* desktop (.hide-mobile) row sits close to the top of a short, non-scrolling card — opening
+   upward has nowhere near enough room for the now-long financing/leasing copy (intro + 9
+   bullets + outro). */
+.md3 .fin-modal .hide-mobile .fin-toggle-tooltip {
+  bottom: auto;
+}
 .md3 .fin-calc-card .fin-toggle-tooltip-close,
 .md3 .fin-modal .fin-toggle-tooltip-close {
   position: absolute;

package/vdp/FinanceCalculator.tsx

@@ -261,11 +261,19 @@ export const ToggleRow: React.FunctionComponent<{
 };
 
 /** body content for the "Rundum-Sorglos-Paket" ToggleRow tooltip — intro sentence, bold heading,
- *  then the package's contents as a bullet list. Shared by every addServicesToggle ToggleRow
- *  (FinanceCalculator's own card + VdpModules' modal/mobile-sheet instances). */
-export const AddServicesTooltipBody: React.FunctionComponent<{ t: TranslationFunction }> = ({ t }) => (
+ *  the package's contents as a bullet list, then (financing/leasing only) a closing paragraph
+ *  explaining the one-off-vs-financed payment choice. Shared by every addServicesToggle
+ *  ToggleRow (FinanceCalculator's own card + VdpModules' modal/mobile-sheet instances); intro/
+ *  outro vary by mode since cash mode has no "financed into the rate" option. */
+export const AddServicesTooltipBody: React.FunctionComponent<{ t: TranslationFunction; isCash?: boolean; isLease?: boolean }> = ({
+  t,
+  isCash,
+  isLease,
+}) => (
   <>
-    <p style={{ margin: '0 0 8px' }}>{t('autobahn:finance.addServicesTooltipIntro')}</p>
+    <p style={{ margin: '0 0 8px' }}>
+      {t(isCash ? 'autobahn:finance.addServicesTooltipIntroCash' : 'autobahn:finance.addServicesTooltipIntroFinanced')}
+    </p>
     <p style={{ fontFamily: 'Arial', fontWeight: 700, fontSize: 10, lineHeight: '13px', color: '#0E2238', margin: '0 0 4px' }}>
       {t('autobahn:finance.addServicesTooltipHeading')}
     </p>
@@ -276,6 +284,11 @@ export const AddServicesTooltipBody: React.FunctionComponent<{ t: TranslationFun
           <li key={item}>{item}</li>
         ))}
     </ul>
+    {!isCash && (
+      <p style={{ margin: '8px 0 0' }}>
+        {t(isLease ? 'autobahn:finance.addServicesTooltipOutroLeasing' : 'autobahn:finance.addServicesTooltipOutroFinancing')}
+      </p>
+    )}
   </>
 );
 
@@ -826,7 +839,7 @@ const FinanceCalculator: React.FunctionComponent<FinanceCalculatorProps> = ({
                     disabled={addServicesDisabled}
                     onChange={onToggleAddServices}
                     staticNote={t('autobahn:finance.addServicesIncluded')}
-                    tooltip={<AddServicesTooltipBody t={t} />}
+                    tooltip={<AddServicesTooltipBody t={t} isCash />}
                     tooltipCloseLabel={t('autobahn:modal.close')}
                   />
                 )}
@@ -891,7 +904,7 @@ const FinanceCalculator: React.FunctionComponent<FinanceCalculatorProps> = ({
                     checked={!!withAddServices}
                     disabled={addServicesDisabled}
                     onChange={onToggleAddServices}
-                    tooltip={<AddServicesTooltipBody t={t} />}
+                    tooltip={<AddServicesTooltipBody t={t} isLease={isLease} />}
                     tooltipCloseLabel={t('autobahn:modal.close')}
                   />
                 )}

package/vdp/VdpModules.tsx

@@ -2429,7 +2429,7 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
                 checked={!!withAddServices}
                 disabled={addServicesDisabled}
                 onChange={onToggleAddServices}
-                tooltip={<AddServicesTooltipBody t={t} />}
+                tooltip={<AddServicesTooltipBody t={t} isLease={isLease} />}
                 tooltipCloseLabel={t('autobahn:modal.close')}
               />
             )}
@@ -2917,7 +2917,7 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
                     disabled={addServicesDisabled}
                     onChange={(checked) => onToggleAddServices && onToggleAddServices(checked)}
                     staticNote={t('autobahn:finance.addServicesIncluded')}
-                    tooltip={<AddServicesTooltipBody t={t} />}
+                    tooltip={<AddServicesTooltipBody t={t} isCash />}
                     tooltipCloseLabel={t('autobahn:modal.close')}
                   />
                 )}
@@ -3053,7 +3053,7 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
                     checked={!!withAddServices}
                     disabled={addServicesDisabled}
                     onChange={onToggleAddServices}
-                    tooltip={<AddServicesTooltipBody t={t} />}
+                    tooltip={<AddServicesTooltipBody t={t} isLease={isLease} />}
                     tooltipCloseLabel={t('autobahn:modal.close')}
                   />
                 )}