@bytebrand/fe-ui-core-autobahn 1.0.135 → 1.0.137

package/package.json

@@ -1,30 +1,30 @@
-{
-  "name": "@bytebrand/fe-ui-core-autobahn",
-  "version": "1.0.135",
-  "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.137",
+  "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/FormField.tsx

@@ -21,7 +21,12 @@ export interface FormFieldProps {
   /** override the field's own type (e.g. force 'password'). */
   type?: string;
   id?: string;
-  autoComplete?: 'on' | 'off';
+  /** Any WHATWG autofill-detail token ('given-name', 'family-name', 'email', 'tel', …), not
+   *  just 'on'/'off' — narrower typing here previously blocked callers from disambiguating
+   *  structurally-similar fields (e.g. firstName/lastName) for the browser's own autofill,
+   *  which can otherwise fill the same value into both (confirmed live: Chrome's
+   *  profile-autofill on RegistrationForm.tsx's firstName/lastName, corrupting Odoo leads). */
+  autoComplete?: string;
   disabled?: boolean;
   onKeyPress?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
   /** suppress the built-in label (for layouts that supply their own external label next to the field). */

package/vdp/VdpModules.tsx

@@ -2239,6 +2239,21 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
     return () => window.clearTimeout(timer);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [open, initialShowBreakdown]);
+  // in-sheet "Finanzierungs-/Leasingdetails" toggle (mobile): expanding the breakdown alone left
+  // it below the fold — scroll the sheet body all the way down (same end state as opening via
+  // the page's details link). Waits out .fin-modal--expanded's 0.35s min-height transition: a
+  // smooth scroll started while the sheet is still growing gets cut short after a few px.
+  // Collapsing doesn't scroll.
+  const revealBreakdownRef = React.useRef(false);
+  React.useEffect(() => {
+    if (!showBreakdown || !revealBreakdownRef.current) return;
+    revealBreakdownRef.current = false;
+    const timer = window.setTimeout(() => {
+      const body = mobileBreakdownRef.current?.closest('.fin-modal-body') as HTMLElement | null | undefined;
+      if (body) body.scrollTo({ top: body.scrollHeight, behavior: 'smooth' });
+    }, 400);
+    return () => window.clearTimeout(timer);
+  }, [showBreakdown]);
 
   // mobile-only: swipe-down-to-dismiss on the grabber/header (the mockup's drag handle).
   // The sheet follows the finger (imperative transform — no re-renders while dragging);
@@ -3411,7 +3426,13 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
                 </div>
 
                 {/* centered ⓘ details toggle (mockup shows no chevron) */}
-                <button type="button" onClick={() => setShowBreakdown((v) => !v)} style={{ ...expanderBtnStyle, justifyContent: 'center', padding: '2px 0 20px' }}>
+                <button
+                  type="button"
+                  onClick={() => {
+                    revealBreakdownRef.current = !showBreakdown;
+                    setShowBreakdown((v) => !v);
+                  }}
+                  style={{ ...expanderBtnStyle, justifyContent: 'center', padding: '2px 0 20px' }}>
                   <span
                     style={{
                       display: 'inline-flex',