@bytebrand/fe-ui-core-autobahn 1.0.92 → 1.0.93

package/cards/CarRow.tsx

@@ -176,7 +176,7 @@ const CarRow: React.FunctionComponent<CarRowProps> = ({
             availability/Geprüft pill (not present in the Figma "mcard" export). */}
         <div
           className="hide-mobile"
-          style={{ position: 'absolute', bottom: 12, left: 12, zIndex: 3, display: 'flex', alignItems: 'center', gap: 6 }}
+          style={{ position: 'absolute', bottom: 20, left: 12, zIndex: 3, display: 'flex', alignItems: 'center', gap: 6 }}
         >
           {car.photos > 1 && (
             <span className="mcard-photo-chip">

package/compat/CookieModal/Modal.tsx

@@ -2,18 +2,8 @@
 // BaseModalWrapper is replaced by a plain fixed overlay + centered surface.
 // Deliberately NOT the kit ui/Modal — the cookie consent dialog has no title
 // bar / close button and must not be dismissible without a choice.
-//
-// Rendered via ReactDOM.createPortal into document.body (same technique as
-// ui/Modal.tsx) rather than inline in the page tree: a React hydration-mismatch
-// error ANYWHERE else on the page (a known, separate bug — see the
-// SearchNextPage isMobile SSR/CSR mismatch) can corrupt sibling reconciliation
-// enough that an inline `position: fixed` overlay ends up mounted in the wrong
-// place in the DOM (observed: appearing as plain content below the footer
-// instead of as an overlay). A body-level portal is immune to that — its DOM
-// node never lives inside the page's own React subtree.
 
 import * as React from 'react';
-import * as ReactDOM from 'react-dom';
 
 import ModalsConfig from './ModalsConfig';
 
@@ -40,19 +30,13 @@ const SURFACE: React.CSSProperties = {
 };
 
 const BasicModal = ({ isVisible, toggleModal, name, modalProps, handleSentryInit }: IBasicModal) => {
-  if (!isVisible || typeof document === 'undefined') return null;
-  return ReactDOM.createPortal(
-    // wrapped in .md3: autobahn.css scopes every token/utility class (incl.
-    // .mbtn used by the modal buttons) under `.md3` and intentionally does
-    // nothing outside it — a bare document.body portal loses the theme.
-    <div className='md3'>
-      <div style={OVERLAY} role='dialog' aria-modal='true' aria-label='Cookie-Einstellungen'>
-        <div style={SURFACE}>
-          {ModalsConfig[name] && ModalsConfig[name]({ ...modalProps, toggleModal, handleSentryInit })}
-        </div>
+  if (!isVisible) return null;
+  return (
+    <div style={OVERLAY} role='dialog' aria-modal='true' aria-label='Cookie-Einstellungen'>
+      <div style={SURFACE}>
+        {ModalsConfig[name] && ModalsConfig[name]({ ...modalProps, toggleModal, handleSentryInit })}
       </div>
-    </div>,
-    document.body
+    </div>
   );
 };
 

package/constants/RateSearchWidget.ts

@@ -6,8 +6,9 @@ export const FIRST_INSTALLMENT_FIX = [
 ];
 
 export const MONTHLY_INSTALLMENT_FIX = [
-  'any', 50, 60, 70, 80, 90, 100, 125, 150, 175, 200, 225, 250, 275, 300, 350, 400, 450, 500, // tslint:disable-line
-  550, 600, 650, 700, 750, 800, 850, 900, 950, 1000, 1100, 1200, 1300, 1400, 1500 // tslint:disable-line
+  'any', 50, 100, 150, 200, 250, 300, 350, 400, 450, 500, // tslint:disable-line
+  550, 600, 650, 700, 750, 800, 850, 900, 950, 1000, // tslint:disable-line
+  1050, 1100, 1150, 1200, 1250, 1300, 1350, 1400, 1450, 1500 // tslint:disable-line
 ];
 
 export const PAYBACK_PERIOD_FIX = [

package/constants/Search.ts

@@ -58,7 +58,9 @@ export const IMAGES_COUNT_FIX = [
 ];
 
 export const MILEAGE_FIX = [
-  0, 5000, 10000, 20000, 30000, 40000, 50000, 60000, 70000, 80000, 90000, 100000, 125000, 150000
+  0, 5000, 10000, 15000, 20000, 25000, 30000, 35000, 40000, 45000, 50000,
+  55000, 60000, 65000, 70000, 75000, 80000, 85000, 90000, 95000, 100000,
+  105000, 110000, 115000, 120000, 125000, 130000, 135000, 140000, 145000, 150000
 ];
 
 export const POWER_FIX = [

package/package.json

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

@@ -521,6 +521,12 @@ line-height: 31px;
     border-color var(--dur-2) var(--ease-standard),
     transform var(--dur-2) var(--ease-standard);
 }
+/* the hero search card has no clipped media (unlike other .mcard uses) and its
+   .mselect-menu dropdowns can grow past the card's own bounds — the base
+   .mcard overflow: hidden would otherwise cut off the option list. */
+.md3 .hero-search {
+  overflow: visible;
+}
 .md3 .mcard--elevated {
   border: 0;
   box-shadow: var(--md-e1);
@@ -4154,10 +4160,17 @@ line-height: 31px;
   margin: 6px 0 2px;
   touch-action: none;
 }
+/* inset 9px (half the 18px thumb, see ::-webkit-slider-thumb below) on each side — the native
+   thumb's CENTER can only travel from thumbRadius to (width - thumbRadius) of the <input>'s own
+   box, so it never physically reaches the container's true 0%/100% edge. Widening the input to
+   overhang the container (the previous attempt here) just moves the mismatch: the thumb's outer
+   half then pokes OUT past the container instead of stopping short of it. Insetting the visual
+   track/fill to match the thumb's real (un-overhung) travel range instead — see .exslider-fill's
+   calc() below — is the only way to get all three (track, fill, thumb) to line up flush. */
 .md3 .exslider-track {
   position: absolute;
-  left: 0;
-  right: 0;
+  left: 9px;
+  right: 9px;
   top: 50%;
   height: 4px;
   transform: translateY(-50%);