@sbb-esta/lyne-elements-experimental 4.6.0 → 4.8.0

package/autocomplete-grid.js

@@ -1,15 +1,10 @@
-import { SbbAutocompleteGridElement as t } from "./autocomplete-grid/autocomplete-grid/autocomplete-grid.component.js";
-import { SbbAutocompleteGridButtonElement as m } from "./autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.component.js";
-import { SbbAutocompleteGridCellElement as l } from "./autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.component.js";
-import { SbbAutocompleteGridOptgroupElement as i } from "./autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.component.js";
-import { SbbAutocompleteGridOptionElement as u, autocompleteGridOptionId as d } from "./autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.component.js";
-import { SbbAutocompleteGridRowElement as G } from "./autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.component.js";
-export {
-  m as SbbAutocompleteGridButtonElement,
-  l as SbbAutocompleteGridCellElement,
-  t as SbbAutocompleteGridElement,
-  i as SbbAutocompleteGridOptgroupElement,
-  u as SbbAutocompleteGridOptionElement,
-  G as SbbAutocompleteGridRowElement,
-  d as autocompleteGridOptionId
-};
+import { SbbAutocompleteGridButtonElement as e } from "./autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.component.js";
+import { t } from "./autocomplete-grid-cell.component-Dak9wlBr.js";
+import { SbbAutocompleteGridOptgroupElement as n } from "./autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.component.js";
+import { n as r, t as i } from "./autocomplete-grid-option.component-DNRFHOwc.js";
+import { t as a } from "./autocomplete-grid-row.component-DBHZQ0GQ.js";
+import { SbbAutocompleteGridElement as o } from "./autocomplete-grid/autocomplete-grid/autocomplete-grid.component.js";
+import "./autocomplete-grid.pure.js";
+o.define(), e.define(), t.define(), n.define(), i.define(), a.define();
+//#endregion
+export { e as SbbAutocompleteGridButtonElement, t as SbbAutocompleteGridCellElement, o as SbbAutocompleteGridElement, n as SbbAutocompleteGridOptgroupElement, i as SbbAutocompleteGridOptionElement, a as SbbAutocompleteGridRowElement, r as autocompleteGridOptionId };

package/autocomplete-grid.pure.js

@@ -0,0 +1,7 @@
+import { SbbAutocompleteGridButtonElement as e } from "./autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.component.js";
+import { t } from "./autocomplete-grid-cell.component-Dak9wlBr.js";
+import { SbbAutocompleteGridOptgroupElement as n } from "./autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.component.js";
+import { n as r, t as i } from "./autocomplete-grid-option.component-DNRFHOwc.js";
+import { t as a } from "./autocomplete-grid-row.component-DBHZQ0GQ.js";
+import { SbbAutocompleteGridElement as o } from "./autocomplete-grid/autocomplete-grid/autocomplete-grid.component.js";
+export { e as SbbAutocompleteGridButtonElement, t as SbbAutocompleteGridCellElement, o as SbbAutocompleteGridElement, n as SbbAutocompleteGridOptgroupElement, i as SbbAutocompleteGridOptionElement, a as SbbAutocompleteGridRowElement, r as autocompleteGridOptionId };

package/core/datetime/date-helper.js

@@ -1,191 +1,2 @@
-import { i18nDurationDay as N, i18nDurationHour as h, i18nDurationMinute as T } from "@sbb-esta/lyne-elements/core/i18n.js";
-import { n as w, d as y, i as U } from "../../isValid-m3_OsPaB.js";
-import { t as d, c as g, b as m, m as I } from "../../toDate-Bw2KTWeq.js";
-import { g as C, a as Y, d as F } from "../../differenceInMinutes-COvvdYsJ.js";
-function x(e, t, n) {
-  const i = d(e, n?.in);
-  return isNaN(t) ? g(e, NaN) : (t && i.setDate(i.getDate() + t), i);
-}
-function z(e, t, n) {
-  return g(e, +d(e) + t);
-}
-function H(e, t, n) {
-  return z(e, t * m);
-}
-function S(e, t, n) {
-  const [i, s] = w(
-    n?.in,
-    e,
-    t
-  ), r = M(i, s), a = Math.abs(
-    y(i, s)
-  );
-  i.setDate(i.getDate() - r * a);
-  const o = +(M(i, s) === -r), u = r * (a - o);
-  return u === 0 ? 0 : u;
-}
-function M(e, t) {
-  const n = e.getFullYear() - t.getFullYear() || e.getMonth() - t.getMonth() || e.getDate() - t.getDate() || e.getHours() - t.getHours() || e.getMinutes() - t.getMinutes() || e.getSeconds() - t.getSeconds() || e.getMilliseconds() - t.getMilliseconds();
-  return n < 0 ? -1 : n > 0 ? 1 : n;
-}
-function Z(e, t, n) {
-  const [i, s] = w(
-    n?.in,
-    e,
-    t
-  ), r = (+i - +s) / m;
-  return C(n?.roundingMethod)(r);
-}
-function v(e, t, n) {
-  return x(e, -t, n);
-}
-function O(e, t) {
-  const n = () => g(t?.in, NaN), s = k(e);
-  let r;
-  if (s.date) {
-    const c = W(s.date, 2);
-    r = j(c.restDateString, c.year);
-  }
-  if (!r || isNaN(+r)) return n();
-  const a = +r;
-  let o = 0, u;
-  if (s.time && (o = A(s.time), isNaN(o)))
-    return n();
-  if (s.timezone) {
-    if (u = E(s.timezone), isNaN(u)) return n();
-  } else {
-    const c = new Date(a + o), p = d(0, t?.in);
-    return p.setFullYear(
-      c.getUTCFullYear(),
-      c.getUTCMonth(),
-      c.getUTCDate()
-    ), p.setHours(
-      c.getUTCHours(),
-      c.getUTCMinutes(),
-      c.getUTCSeconds(),
-      c.getUTCMilliseconds()
-    ), p;
-  }
-  return d(a + o + u, t?.in);
-}
-const l = {
-  dateTimeDelimiter: /[T ]/,
-  timeZoneDelimiter: /[Z ]/i,
-  timezone: /([Z+-].*)$/
-}, _ = /^-?(?:(\d{3})|(\d{2})(?:-?(\d{2}))?|W(\d{2})(?:-?(\d{1}))?|)$/, b = /^(\d{2}(?:[.,]\d*)?)(?::?(\d{2}(?:[.,]\d*)?))?(?::?(\d{2}(?:[.,]\d*)?))?$/, R = /^([+-])(\d{2})(?::?(\d{2}))?$/;
-function k(e) {
-  const t = {}, n = e.split(l.dateTimeDelimiter);
-  let i;
-  if (n.length > 2)
-    return t;
-  if (/:/.test(n[0]) ? i = n[0] : (t.date = n[0], i = n[1], l.timeZoneDelimiter.test(t.date) && (t.date = e.split(l.timeZoneDelimiter)[0], i = e.substr(
-    t.date.length,
-    e.length
-  ))), i) {
-    const s = l.timezone.exec(i);
-    s ? (t.time = i.replace(s[1], ""), t.timezone = s[1]) : t.time = i;
-  }
-  return t;
-}
-function W(e, t) {
-  const n = new RegExp(
-    "^(?:(\\d{4}|[+-]\\d{" + (4 + t) + "})|(\\d{2}|[+-]\\d{" + (2 + t) + "})$)"
-  ), i = e.match(n);
-  if (!i) return { year: NaN, restDateString: "" };
-  const s = i[1] ? parseInt(i[1]) : null, r = i[2] ? parseInt(i[2]) : null;
-  return {
-    year: r === null ? s : r * 100,
-    restDateString: e.slice((i[1] || i[2]).length)
-  };
-}
-function j(e, t) {
-  if (t === null) return /* @__PURE__ */ new Date(NaN);
-  const n = e.match(_);
-  if (!n) return /* @__PURE__ */ new Date(NaN);
-  const i = !!n[4], s = f(n[1]), r = f(n[2]) - 1, a = f(n[3]), o = f(n[4]), u = f(n[5]) - 1;
-  if (i)
-    return G(t, o, u) ? J(t, o, u) : /* @__PURE__ */ new Date(NaN);
-  {
-    const c = /* @__PURE__ */ new Date(0);
-    return !q(t, r, a) || !B(t, s) ? /* @__PURE__ */ new Date(NaN) : (c.setUTCFullYear(t, r, Math.max(s, a)), c);
-  }
-}
-function f(e) {
-  return e ? parseInt(e) : 1;
-}
-function A(e) {
-  const t = e.match(b);
-  if (!t) return NaN;
-  const n = D(t[1]), i = D(t[2]), s = D(t[3]);
-  return K(n, i, s) ? n * m + i * I + s * 1e3 : NaN;
-}
-function D(e) {
-  return e && parseFloat(e.replace(",", ".")) || 0;
-}
-function E(e) {
-  if (e === "Z") return 0;
-  const t = e.match(R);
-  if (!t) return 0;
-  const n = t[1] === "+" ? -1 : 1, i = parseInt(t[2]), s = t[3] && parseInt(t[3]) || 0;
-  return P(i, s) ? n * (i * m + s * I) : NaN;
-}
-function J(e, t, n) {
-  const i = /* @__PURE__ */ new Date(0);
-  i.setUTCFullYear(e, 0, 4);
-  const s = i.getUTCDay() || 7, r = (t - 1) * 7 + n + 1 - s;
-  return i.setUTCDate(i.getUTCDate() + r), i;
-}
-const V = [31, null, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
-function $(e) {
-  return e % 400 === 0 || e % 4 === 0 && e % 100 !== 0;
-}
-function q(e, t, n) {
-  return t >= 0 && t <= 11 && n >= 1 && n <= (V[t] || ($(e) ? 29 : 28));
-}
-function B(e, t) {
-  return t >= 1 && t <= ($(e) ? 366 : 365);
-}
-function G(e, t, n) {
-  return t >= 1 && t <= 53 && n >= 0 && n <= 6;
-}
-function K(e, t, n) {
-  return e === 24 ? t === 0 && n === 0 : n >= 0 && n < 60 && t >= 0 && t < 60 && e >= 0 && e < 25;
-}
-function P(e, t) {
-  return t >= 0 && t <= 59;
-}
-function Q(e, t, n) {
-  return H(e, -t);
-}
-function nt(e) {
-  if (!e)
-    return;
-  const t = O(e);
-  if (U(t)) {
-    if (e.includes("Z"))
-      return new Date(e.replace("Z", ""));
-    if (e.includes("T")) {
-      const n = e.split("T");
-      if (n[1] && (n[1].includes("+") || n[1].includes("-")))
-        return /* @__PURE__ */ new Date(`${n[0]}T${n[1].split(/[+-]/)[0]}`);
-    }
-    return new Date(e);
-  }
-}
-const it = (e, t) => {
-  const n = [], i = [];
-  let r = Y(0, e);
-  const a = S(r, 0);
-  a > 0 && (n.push(`${a} d`), t && i.push(`${a} ${a > 1 ? N.multiple.long[t] : N.single.long[t]}`), r = v(r, a));
-  const o = Z(r, 0);
-  o > 0 && (n.push(`${o} h`), t && i.push(`${o} ${o > 1 ? h.multiple.long[t] : h.single.long[t]}`), r = Q(r, o));
-  const u = F(r, 0);
-  return u > 0 && (n.push(`${u} min`), t && i.push(`${u} ${u > 1 ? T.multiple.long[t] : T.single.long[t]}`)), {
-    short: n.join(" "),
-    long: i.join(" ")
-  };
-};
-export {
-  it as durationToTime,
-  nt as removeTimezoneFromISOTimeString
-};
+import { n as e, t } from "../../date-helper-CGproP5d.js";
+export { t as durationToTime, e as removeTimezoneFromISOTimeString };

package/core/datetime.js

@@ -1,5 +1,2 @@
-import { durationToTime as m, removeTimezoneFromISOTimeString as r } from "./datetime/date-helper.js";
-export {
-  m as durationToTime,
-  r as removeTimezoneFromISOTimeString
-};
+import { n as e, t } from "../date-helper-CGproP5d.js";
+export { t as durationToTime, e as removeTimezoneFromISOTimeString };

package/core/styles/core.scss

@@ -0,0 +1,13 @@
+$theme: 'standard' !default;
+
+@use 'sass:string';
+
+@use '../../autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.global' as
+  autocomplete-grid-row with (
+  $theme: $theme
+);
+
+// Core variables
+:root {
+  @include autocomplete-grid-row.base;
+}

package/core/styles/lean-theme.scss

@@ -0,0 +1,3 @@
+@use './theme' with (
+  $theme: 'lean'
+);

package/core/styles/off-brand-theme.scss

@@ -0,0 +1,3 @@
+@use './theme' with (
+  $theme: 'off-brand'
+);

package/core/styles/safety-theme.scss

@@ -0,0 +1,3 @@
+@use './theme' with (
+  $theme: 'safety'
+);

package/core/styles/standard-theme.scss

@@ -0,0 +1,3 @@
+@use './theme' with (
+  $theme: 'standard'
+);

package/core/styles/theme.scss

@@ -0,0 +1,5 @@
+$theme: 'standard' !default;
+
+@use './core' with (
+  $theme: $theme
+);

package/core/timetable/access-leg-helper.js

@@ -1,91 +1,96 @@
-import { i18nWalkingDistanceDeparture as T, i18nWalkingDistanceArrival as h } from "@sbb-esta/lyne-elements/core/i18n.js";
-import { nothing as u, html as f } from "lit";
-import { isRideLeg as $, isConnectionLeg as L, extractTimeAndStringFromNoticeText as k } from "./timetable-helper.js";
+import { extractTimeAndStringFromNoticeText as e, isConnectionLeg as t, isRideLeg as n } from "./timetable-helper.js";
 import "@sbb-esta/lyne-elements/icon.js";
-function g(t, r) {
-  const i = L(t) ? t : null, n = i ? i?.notices?.filter((e) => r.includes(e.name))[0] : null;
-  return n ? {
-    duration: i?.duration || 0,
-    text: n?.text?.template || "",
-    icon: "walk-small"
-  } : null;
+import { html as r, nothing as i } from "lit";
+import { i18nWalkingDistanceArrival as a, i18nWalkingDistanceDeparture as o } from "@sbb-esta/lyne-elements/core/i18n.js";
+//#region src/elements-experimental/core/timetable/access-leg-helper.ts
+function s(e, n) {
+	let r = t(e) ? e : null, i = r ? r?.notices?.filter((e) => n.includes(e.name))[0] : null;
+	return i ? {
+		duration: r?.duration || 0,
+		text: i?.text?.template || "",
+		icon: "walk-small"
+	} : null;
 }
-function M(t, r, i, n) {
-  const e = $(t) ? t?.serviceJourney?.notices?.filter((m) => ["CI"].includes(m.name))[0] : null, c = e && k(e);
-  return e ? {
-    duration: (c?.duration || 0) + (r || 0),
-    text: i ? T[n] : c?.text || "",
-    icon: i ? "wheelchair-small" : `sa-${e?.name?.toLowerCase()}`
-  } : null;
+function c(t, r, i, a) {
+	let s = n(t) ? t?.serviceJourney?.notices?.filter((e) => ["CI"].includes(e.name))[0] : null, c = s && e(s);
+	return s ? {
+		duration: (c?.duration || 0) + (r || 0),
+		text: i ? o[a] : c?.text || "",
+		icon: i ? "wheelchair-small" : `sa-${s?.name?.toLowerCase()}`
+	} : null;
 }
-function N(t, r, i, n) {
-  const e = $(t) ? t?.serviceJourney?.notices?.filter((m) => ["CO"].includes(m.name))[0] : null, c = e && k(e);
-  return e ? {
-    duration: (c?.duration || 0) + (r || 0),
-    text: i ? h[n] : c?.text || "",
-    icon: i ? "wheelchair-small" : `sa-${e?.name?.toLowerCase()}`
-  } : null;
+function l(t, r, i, o) {
+	let s = n(t) ? t?.serviceJourney?.notices?.filter((e) => ["CO"].includes(e.name))[0] : null, c = s && e(s);
+	return s ? {
+		duration: (c?.duration || 0) + (r || 0),
+		text: i ? a[o] : c?.text || "",
+		icon: i ? "wheelchair-small" : `sa-${s?.name?.toLowerCase()}`
+	} : null;
 }
-function _(t, r, i, n, e) {
-  return f`
-    <span class="sbb-pearl-chain__time-transfer sbb-pearl-chain__time-transfer--${r}-${e}">
-      <sbb-icon name=${r}></sbb-icon>
-      <time datetime=${t + "M"}>
+function u(e, t, n, s, c) {
+	return r`
+    <span class="sbb-pearl-chain__time-transfer sbb-pearl-chain__time-transfer--${t}-${c}">
+      <sbb-icon name=${t}></sbb-icon>
+      <time datetime=${e + "M"}>
         <span class="sbb-screen-reader-only">
-          ${!n && e ? e === "departure" ? T[i] : h[i] : u}
-          ${n ? f`<span>${n}</span>` : u}&nbsp;
+          ${!s && c ? c === "departure" ? o[n] : a[n] : i}
+          ${s ? r`<span>${s}</span>` : i}&nbsp;
         </span>
-        ${t}
+        ${e}
         <span class="sbb-pearl-chain__time-walktime-prime-symbol" aria-hidden="true">'</span>
         <span class="sbb-screen-reader-only">min</span>
       </time>
     </span>
   `;
 }
-function p(t, r, i, n) {
-  return f`
-    <span class="sbb-pearl-chain__time-walktime sbb-pearl-chain__time-walktime--${n}-${i}">
-      <sbb-icon name=${n}></sbb-icon>
-      <time datetime=${t + "M"}>
-        <span class="sbb-screen-reader-only">${r}</span>
-        ${t}
+function d(e, t, n, i) {
+	return r`
+    <span class="sbb-pearl-chain__time-walktime sbb-pearl-chain__time-walktime--${i}-${n}">
+      <sbb-icon name=${i}></sbb-icon>
+      <time datetime=${e + "M"}>
+        <span class="sbb-screen-reader-only">${t}</span>
+        ${e}
         <span class="sbb-pearl-chain__time-walktime-prime-symbol" aria-hidden="true">'</span>
       </time>
     </span>
   `;
 }
-function B(t, r, i, n, e) {
-  const c = t && t.filter((w) => $(w) || L(w))[0], m = ["YM", "YB", "Y", "YT"], o = g(c, m), s = M(c, r, e, n), d = r ? {
-    text: T[n],
-    duration: r,
-    icon: e ? "wheelchair-small" : "walk-small"
-  } : null, v = () => o || (d && !s && !o ? d : s || null);
-  function C() {
-    return f`
-      ${o ? p(o.duration, o.text, "left", o.icon) : u}
-      ${d && !s && !o ? p(d.duration, d.text, "left", d.icon) : u}
-      ${s ? e ? p(s.duration, s.text, "left", s.icon) : _(s.duration, s.icon, n, s.text, "departure") : u}
+function f(e, f, p, m, h) {
+	let g = e && e.filter((e) => n(e) || t(e))[0], _ = [
+		"YM",
+		"YB",
+		"Y",
+		"YT"
+	], v = s(g, _), y = c(g, f, h, m), b = f ? {
+		text: o[m],
+		duration: f,
+		icon: h ? "wheelchair-small" : "walk-small"
+	} : null, x = () => v || (b && !y && !v ? b : y || null);
+	function S() {
+		return r`
+      ${v ? d(v.duration, v.text, "left", v.icon) : i}
+      ${b && !y && !v ? d(b.duration, b.text, "left", b.icon) : i}
+      ${y ? h ? d(y.duration, y.text, "left", y.icon) : u(y.duration, y.icon, m, y.text, "departure") : i}
     `;
-  }
-  const A = t && t[t.length - 1], x = (L(A) || $(A)) && A, l = x && g(x, m), a = x && N(x, i, e, n), b = i ? {
-    text: h[n],
-    duration: i,
-    icon: e ? "wheelchair-small" : "walk-small"
-  } : null, D = () => l || (b && !a && !l ? b : a || null);
-  function Y() {
-    return f`
-      ${l ? p(l.duration, l.text, "right", l.icon) : u}
-      ${b && !a && !l ? p(b.duration, b.text, "right", b.icon) : u}
-      ${a ? e ? p(a.duration, a.text, "right", a.icon) : _(a.duration, a.icon, n, a.text, "arrival") : u}
+	}
+	let C = e && e[e.length - 1], w = (t(C) || n(C)) && C, T = w && s(w, _), E = w && l(w, p, h, m), D = p ? {
+		text: a[m],
+		duration: p,
+		icon: h ? "wheelchair-small" : "walk-small"
+	} : null, O = () => T || (D && !E && !T ? D : E || null);
+	function k() {
+		return r`
+      ${T ? d(T.duration, T.text, "right", T.icon) : i}
+      ${D && !E && !T ? d(D.duration, D.text, "right", D.icon) : i}
+      ${E ? h ? d(E.duration, E.text, "right", E.icon) : u(E.duration, E.icon, m, E.text, "arrival") : i}
     `;
-  }
-  return {
-    renderDepartureTimeAttribute: C,
-    renderArrivalTimeAttribute: Y,
-    departureTimeAttribute: v(),
-    arrivalTimeAttribute: D()
-  };
+	}
+	return {
+		renderDepartureTimeAttribute: S,
+		renderArrivalTimeAttribute: k,
+		departureTimeAttribute: x(),
+		arrivalTimeAttribute: O()
+	};
 }
-export {
-  B as getDepartureArrivalTimeAttribute
-};
+//#endregion
+export { f as getDepartureArrivalTimeAttribute };

package/core/timetable/timetable-helper.js

@@ -1,12 +1,10 @@
-const r = (t) => t?.__typename === "PTRideLeg", i = (t) => t?.__typename === "PTConnectionLeg", s = (t) => {
-  const n = t?.text?.template && t.text.template.indexOf("(") + 1, e = t?.text?.template?.substring(n || 0, t?.text?.template.indexOf(")"));
-  return {
-    duration: e && +e.substring(0, e.length - 1) || 0,
-    text: t?.text?.template?.split("(")[0] || ""
-  };
-};
-export {
-  s as extractTimeAndStringFromNoticeText,
-  i as isConnectionLeg,
-  r as isRideLeg
+//#region src/elements-experimental/core/timetable/timetable-helper.ts
+var e = (e) => e?.__typename === "PTRideLeg", t = (e) => e?.__typename === "PTConnectionLeg", n = (e) => {
+	let t = e?.text?.template && e.text.template.indexOf("(") + 1, n = e?.text?.template?.substring(t || 0, e?.text?.template.indexOf(")"));
+	return {
+		duration: n && +n.substring(0, n.length - 1) || 0,
+		text: e?.text?.template?.split("(")[0] || ""
+	};
 };
+//#endregion
+export { n as extractTimeAndStringFromNoticeText, t as isConnectionLeg, e as isRideLeg };

package/core/timetable/timetable-properties.js

@@ -1 +0,0 @@
-

package/core/timetable.js

@@ -1,8 +1,4 @@
+import { extractTimeAndStringFromNoticeText as e, isConnectionLeg as t, isRideLeg as n } from "./timetable/timetable-helper.js";
 import { getDepartureArrivalTimeAttribute as r } from "./timetable/access-leg-helper.js";
-import { extractTimeAndStringFromNoticeText as o, isConnectionLeg as m, isRideLeg as n } from "./timetable/timetable-helper.js";
-export {
-  o as extractTimeAndStringFromNoticeText,
-  r as getDepartureArrivalTimeAttribute,
-  m as isConnectionLeg,
-  n as isRideLeg
-};
+import "./timetable/timetable-properties.js";
+export { e as extractTimeAndStringFromNoticeText, r as getDepartureArrivalTimeAttribute, t as isConnectionLeg, n as isRideLeg };

package/core.css

@@ -0,0 +1,13 @@
+:root {
+  --sbb-autocomplete-grid-row-color: var(--sbb-color-3);
+  --sbb-autocomplete-grid-row-background-color-hover: var(--sbb-background-color-3);
+  --sbb-autocomplete-grid-row-disabled-border-color: var(--sbb-color-graphite);
+  --sbb-autocomplete-grid-row-disabled-border-color: light-dark(
+    var(--sbb-color-graphite),
+    var(--sbb-color-smoke)
+  );
+  --sbb-autocomplete-grid-row-disabled-background-color: var(--sbb-background-color-3);
+  --sbb-autocomplete-grid-row-padding-inline-end: var(--sbb-spacing-responsive-xxxs);
+  --sbb-autocomplete-grid-row-justify-content: space-between;
+  --sbb-autocomplete-grid-row-cursor: var(--sbb-cursor-pointer);
+}