@bytebrand/fe-ui-core-autobahn 1.0.164 → 1.0.165

package/locales/de/autobahn.json

@@ -797,7 +797,8 @@
     "serviceHistory": "Scheckheft",
     "warranty": "Garantie",
     "yes": "Ja",
-    "no": "Nein"
+    "no": "Nein",
+    "notSpecified": "keine Angabe"
   },
   "common": {
     "needsData": "Daten folgt"

package/locales/en/autobahn.json

@@ -797,7 +797,8 @@
     "serviceHistory": "Full service history",
     "warranty": "Warranty",
     "yes": "Yes",
-    "no": "No"
+    "no": "No",
+    "notSpecified": "not specified"
   },
   "common": {
     "needsData": "Data coming soon"

package/package.json

@@ -1,30 +1,30 @@
-{
-  "name": "@bytebrand/fe-ui-core-autobahn",
-  "version": "1.0.164",
-  "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",
-  "peerDependencies": {
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0"
-  },
-  "dependencies": {
-    "@bytebrand/car-schema-selectors": "^2.0.7",
-    "@bytebrand/fe-financing": "^5.14.20",
-    "classnames": "2.2.6",
-    "clsx": "^2.1.1",
-    "d3-format": "1.4.5",
-    "js-cookie": "^2.2.0",
-    "lodash": "^4.17.21",
-    "lucide-react": "^0.288.0",
-    "mobx-react": "^7.6.0",
-    "moment": "^2.29.1",
-    "qs": "^6.6.0",
-    "react-device-detect": "^2.1.2",
-    "react-grid-system": "^5.0.2",
-    "react-lazyload": "^3.2.0",
-    "react-scroll": "^1.9.3",
-    "react-slick": "^0.29.0",
-    "slick-carousel": "1.8.1"
-  }
-}
+{
+  "name": "@bytebrand/fe-ui-core-autobahn",
+  "version": "1.0.165",
+  "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",
+  "peerDependencies": {
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
+  },
+  "dependencies": {
+    "@bytebrand/car-schema-selectors": "^2.0.7",
+    "@bytebrand/fe-financing": "^5.14.20",
+    "classnames": "2.2.6",
+    "clsx": "^2.1.1",
+    "d3-format": "1.4.5",
+    "js-cookie": "^2.2.0",
+    "lodash": "^4.17.21",
+    "lucide-react": "^0.288.0",
+    "mobx-react": "^7.6.0",
+    "moment": "^2.29.1",
+    "qs": "^6.6.0",
+    "react-device-detect": "^2.1.2",
+    "react-grid-system": "^5.0.2",
+    "react-lazyload": "^3.2.0",
+    "react-scroll": "^1.9.3",
+    "react-slick": "^0.29.0",
+    "slick-carousel": "1.8.1"
+  }
+}

package/ui/scrollFieldIntoView.ts

@@ -1,41 +1,41 @@
-// Autobahn (auto.de redesign) — shared "scroll a just-opened/just-focused field to the top of the
-// page" behaviour, used by Dropdown.tsx and by fe-main's DualRange/RateSlider (FilterContent.tsx)
-// text fields on /search/detailed. On mobile, opening a dropdown's menu or focusing a text field
-// brings the on-screen keyboard up and/or needs room for a popover below the field — if the field
-// is sitting mid-page, there may not be enough space left below it once the keyboard/menu takes
-// its share. Scrolling the field to the very top of the page first maximizes what's available.
-//
-// Extracted out of Dropdown.tsx so it can be shared verbatim with fe-main's non-Dropdown form
-// fields (DualRange/RateSlider's text inputs) — same problem, same fix, one place to keep them
-// from drifting apart. See Dropdown.tsx's own call site for the original reasoning this was
-// pulled from.
-export function scrollFieldIntoView(field: HTMLElement): void {
-  if (typeof window === 'undefined') return;
-  // Mobile-only: the on-screen-keyboard/popover space problem this fixes doesn't exist on
-  // desktop, where there's no keyboard pushing the viewport around. Same breakpoint + matchMedia
-  // pattern as Modal.tsx/CardCarousel.tsx elsewhere in this lib.
-  if (window.matchMedia('(min-width: 601px)').matches) return;
-  // Anchor on whichever is higher up: the field itself, or a short field label/caption sitting
-  // directly above it (own previous sibling, or — the common "label above a row of controls"
-  // shape, e.g. "Marke & Modell" above the Make/Model row on /search/detailed — the wrapping
-  // row's previous sibling). Checked by height, not by class name, so this works for ANY
-  // caller's label without this needing to know that call site's specific markup.
-  const MAX_LABEL_HEIGHT = 30;
-  const asLabel = (el: Element | null): HTMLElement | null => {
-    if (!(el instanceof HTMLElement)) return null;
-    const h = el.getBoundingClientRect().height;
-    return h > 0 && h <= MAX_LABEL_HEIGHT ? el : null;
-  };
-  const anchor =
-    asLabel(field.previousElementSibling) ||
-    asLabel(field.parentElement && field.parentElement.previousElementSibling) ||
-    field;
-  // No sticky-header reservation here: every current caller (NewMainPage '/', FilterContent on
-  // '/search*') sits on a page where TopBar's own autoHideOnScroll is on (App.tsx: isHomePage ||
-  // isSearchPage) — the header slides itself out of the way the instant this scroll starts,
-  // independently of this call, so reserving space for it here would double-count.
-  const GAP = 8;
-  const rect = anchor.getBoundingClientRect();
-  const targetY = window.scrollY + rect.top - GAP;
-  window.scrollTo({ top: Math.max(0, targetY), behavior: 'smooth' });
-}
+// Autobahn (auto.de redesign) — shared "scroll a just-opened/just-focused field to the top of the
+// page" behaviour, used by Dropdown.tsx and by fe-main's DualRange/RateSlider (FilterContent.tsx)
+// text fields on /search/detailed. On mobile, opening a dropdown's menu or focusing a text field
+// brings the on-screen keyboard up and/or needs room for a popover below the field — if the field
+// is sitting mid-page, there may not be enough space left below it once the keyboard/menu takes
+// its share. Scrolling the field to the very top of the page first maximizes what's available.
+//
+// Extracted out of Dropdown.tsx so it can be shared verbatim with fe-main's non-Dropdown form
+// fields (DualRange/RateSlider's text inputs) — same problem, same fix, one place to keep them
+// from drifting apart. See Dropdown.tsx's own call site for the original reasoning this was
+// pulled from.
+export function scrollFieldIntoView(field: HTMLElement): void {
+  if (typeof window === 'undefined') return;
+  // Mobile-only: the on-screen-keyboard/popover space problem this fixes doesn't exist on
+  // desktop, where there's no keyboard pushing the viewport around. Same breakpoint + matchMedia
+  // pattern as Modal.tsx/CardCarousel.tsx elsewhere in this lib.
+  if (window.matchMedia('(min-width: 601px)').matches) return;
+  // Anchor on whichever is higher up: the field itself, or a short field label/caption sitting
+  // directly above it (own previous sibling, or — the common "label above a row of controls"
+  // shape, e.g. "Marke & Modell" above the Make/Model row on /search/detailed — the wrapping
+  // row's previous sibling). Checked by height, not by class name, so this works for ANY
+  // caller's label without this needing to know that call site's specific markup.
+  const MAX_LABEL_HEIGHT = 30;
+  const asLabel = (el: Element | null): HTMLElement | null => {
+    if (!(el instanceof HTMLElement)) return null;
+    const h = el.getBoundingClientRect().height;
+    return h > 0 && h <= MAX_LABEL_HEIGHT ? el : null;
+  };
+  const anchor =
+    asLabel(field.previousElementSibling) ||
+    asLabel(field.parentElement && field.parentElement.previousElementSibling) ||
+    field;
+  // No sticky-header reservation here: every current caller (NewMainPage '/', FilterContent on
+  // '/search*') sits on a page where TopBar's own autoHideOnScroll is on (App.tsx: isHomePage ||
+  // isSearchPage) — the header slides itself out of the way the instant this scroll starts,
+  // independently of this call, so reserving space for it here would double-count.
+  const GAP = 8;
+  const rect = anchor.getBoundingClientRect();
+  const targetY = window.scrollY + rect.top - GAP;
+  window.scrollTo({ top: Math.max(0, targetY), behavior: 'smooth' });
+}

package/utils/index.ts

@@ -83,3 +83,5 @@ export type { IValues, IFilters, IQuery } from './query';
 // Decorated car props (renders React UI; lives in vehiclesProps/ with its
 // IconContainer + Co2Widget dependencies under compat/).
 export { default as getDecoratedProps } from '../vehiclesProps/decoratedProps';
+export { setStrictConditionOwners, isStrictConditionOwner, strictAccidentStatus } from '../vehiclesProps/accidentDisclosure';
+export type { AccidentStatus } from '../vehiclesProps/accidentDisclosure';

package/vdp/VdpModules.tsx

@@ -92,7 +92,7 @@ export const VdpHeaderSummary: React.FunctionComponent<VdpHeaderCardProps> = ({
     ['zap', extractPS(vehicle.power)],
     ['fuel', stripParen(vehicle.fuel)],
     ['cog', vehicle.gear],
-    ['user', t('autobahn:header.owners', { owners: vehicle.owners, count: vehicle.owners })],
+    ...(vehicle.owners == null ? [] : ([['user', t('autobahn:header.owners', { owners: vehicle.owners, count: vehicle.owners })]] as const)),
   ];
   return (
     <>
@@ -142,7 +142,7 @@ export const VdpFactsGrid: React.FunctionComponent<VdpHeaderCardProps> = ({ vehi
     ['calendar', vehicle.reg],
     ['cog', vehicle.gear],
     ['fuel', stripParen(vehicle.fuel)],
-    ['user', t('autobahn:header.owners', { owners: vehicle.owners, count: vehicle.owners })],
+    ...(vehicle.owners == null ? [] : ([['user', t('autobahn:header.owners', { owners: vehicle.owners, count: vehicle.owners })]] as const)),
     ...(vehicle.body ? ([['car-front', vehicle.body]] as const) : []),
   ];
   return (
@@ -216,7 +216,7 @@ export const VdpHeaderCondition: React.FunctionComponent<VdpHeaderCardProps> = (
   // only the Garantie tile has one, linking out to auto.de's warranty policy page.
   const tiles: ReadonlyArray<readonly [string, string, string, string?]> = [
     ['wrench', t('autobahn:header.huLabel'), condition.hu === 'Neu' ? t('autobahn:header.huNew') : t('autobahn:header.huUntil', { date: condition.hu })],
-    ['shield-check', t('autobahn:header.accidentFree'), condition.unfallfrei ? t('autobahn:header.yes') : t('autobahn:header.no')],
+    ['shield-check', t('autobahn:header.accidentFree'), condition.unfallfrei == null ? t('autobahn:header.notSpecified') : condition.unfallfrei ? t('autobahn:header.yes') : t('autobahn:header.no')],
     ['clipboard-check', t('autobahn:header.serviceHistory'), condition.scheckheft ? t('autobahn:header.yes') : t('autobahn:header.no')],
     ['award', t('autobahn:header.warranty'), condition.garantie, 'https://www.auto.de/garantie/'],
   ];

package/vdp/types.ts

@@ -111,8 +111,8 @@ export interface Co2CostsSummary {
 export interface VehicleCondition {
   /** TÜV/HU validity, e.g. '03/2027' — or 'Neu' for a new HU. */
   hu: string;
-  /** accident-free flag (Unfallfrei). */
-  unfallfrei: boolean;
+  /** accident-free flag (Unfallfrei); null = not specified by the source ("keine Angabe"). */
+  unfallfrei: boolean | null;
   /** full service history (Scheckheftgepflegt). */
   scheckheft: boolean;
   /** warranty label, e.g. '12 Monate inkl.'. */
@@ -191,8 +191,8 @@ export interface VehicleDetail {
   fuel: string;
   /** gearbox label, e.g. 'Automatik' / 'Schaltgetriebe'. */
   gear: string;
-  /** number of previous owners (rendered as 'N. Hand'). */
-  owners: number;
+  /** number of previous owners (rendered as 'N. Hand'); null = not known, the fact is not shown. */
+  owners: number | null;
   /** number of seats. */
   seats: number;
   /** number of doors. */
@@ -302,7 +302,7 @@ export function defaultVdpSpecs(v: VehicleDetail): VdpSpec[] {
     [['cog', 'Getriebe', v.gear], true],
     [['users', 'Sitze', `${v.seats} Sitze`], false],
     [['door-open', 'Türen', `${v.doors} Türen`], false],
-    [['user', 'Halter', `${v.owners}. Hand`], true], // 0 Vorbesitzer is valid
+    ...(v.owners == null ? [] : [[['user', 'Halter', `${v.owners}. Hand`], true] as const]), // 0 Vorbesitzer is valid
     [['palette', 'Außenfarbe', v.color], true],
     [['car-front', 'Karosserie', v.body], true],
     [['droplet', 'Verbrauch komb.', v.cons], true], // Pkw-EnVKV — exempt from this rule

package/vehiclesProps/accidentDisclosure.ts

@@ -0,0 +1,25 @@
+// FINN handover v0.6 (Daniel, 15.10.2026): for the owners set here, accident and owner facts follow
+// only what the source states — mainData.accidentDamaged false → accident-free, true → accident,
+// empty → not specified; an empty owner count is not shown as "0. Hand". Every other dealer keeps
+// the old display (accident-free unless `damaged`). The app sets the owners once at start.
+let strictOwners: ReadonlyArray<string> = [];
+
+export function setStrictConditionOwners(ownerIds: ReadonlyArray<string>): void {
+  strictOwners = (ownerIds || []).filter(Boolean);
+}
+
+export function isStrictConditionOwner(car: any): boolean {
+  const ownerId = car?.metaData?.ownerId;
+  return !!ownerId && strictOwners.includes(ownerId);
+}
+
+export type AccidentStatus = 'accidentFree' | 'accident' | 'notSpecified';
+
+// The strict status, or undefined when the car's owner keeps the old display.
+export function strictAccidentStatus(car: any): AccidentStatus | undefined {
+  if (!isStrictConditionOwner(car)) return undefined;
+  const value = car?.mainData?.accidentDamaged;
+  if (value === true) return 'accident';
+  if (value === false) return 'accidentFree';
+  return 'notSpecified';
+}

package/vehiclesProps/decoratedLightProps.tsx

@@ -6,6 +6,7 @@ import { formatTimestamp } from '../utils/DateUtils';
 import { DELIVERY_PERIODS_EXTRA } from '../constants/core';
 import moment from 'moment';
 import { IDecoratedProp } from '../types/types';
+import { strictAccidentStatus } from './accidentDisclosure';
 
 interface IDecoratedProps {
   [key: string]: IDecoratedProp;
@@ -519,6 +520,9 @@ const getDecoratedLightProps = (
       title: t('cbd:mainData_accidentDamaged'),
       icon: 'wrench',
       get value() {
+        const strict = strictAccidentStatus(car);
+        if (strict === 'notSpecified') return t('vehicleProps:value.na');
+        if (strict) return strict === 'accident' ? t('vehicleProps:value.damaged') : t('vehicleProps:value.accidentFree');
         return damaged ? t('vehicleProps:value.damaged') : t('vehicleProps:value.accidentFree');
       }
     },

package/vehiclesProps/decoratedProps.tsx

@@ -9,6 +9,7 @@ import { EMISSION_STICKERS_ICONS, WP_EMISSION_STICKERS_ICONS } from '../constant
 import { DELIVERY_PERIODS_EXTRA } from '../constants';
 import { IDecoratedProp, ICar, IFinancingUtils } from '../types/types';
 import { getFormattedPrice } from '../utils/CommonUtils';
+import { strictAccidentStatus } from './accidentDisclosure';
 
 const formatDeliveryPeriod = (t: (key: string, options?: object) => string, deliveryPeriod: string) => {
   const count: number = +DELIVERY_PERIODS_EXTRA.find((period: any) => period.value === deliveryPeriod).label;
@@ -195,6 +196,9 @@ const getDecoratedProps = (
       title: t('cbd:mainData_accidentDamaged'),
       icon: 'wrench',
       get value() {
+        const strict = strictAccidentStatus(car);
+        if (strict === 'notSpecified') return t('vehicleProps:value.na');
+        if (strict) return strict === 'accident' ? t('vehicleProps:value.damaged') : t('vehicleProps:value.accidentFree');
         return damaged ? t('vehicleProps:value.damaged') : t('vehicleProps:value.accidentFree');
       }
     },