@stihl-design-system/components 1.0.0-RC.31 → 1.0.0-RC.34

package/chunks/helpers.CexwVao7.js

@@ -0,0 +1,38 @@
+"use client";
+import l from "react";
+const f = (e) => typeof e != "number" || isNaN(e) ? 0 : e / 16, m = (e, t) => `[STIHL Design System] - [${e}]: ${t}`, d = (e, t) => `The "${e}" prop is required. Please add the "${e}" prop to the ${t} component.`, y = (e, t) => e?.closest(t), u = (e, t, a) => {
+  let r = !1;
+  const n = {
+    fn: t,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- any is needed here to allow any React component type to be checked
+    displayName: t.displayName || t.name
+  };
+  return l.Children.forEach(e, (s) => {
+    if (r || !l.isValidElement(s))
+      return;
+    if (s.type === n.fn) {
+      r = !0;
+      return;
+    }
+    const i = s.type, o = (
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- any is needed here to allow any React component type to be checked
+      i.displayName || i.name
+    );
+    if (typeof o == "string" && o === n.displayName) {
+      r = !0;
+      return;
+    }
+    const p = s.props;
+    if (a && p.children && u(p.children, n.fn, a)) {
+      r = !0;
+      return;
+    }
+  }), r;
+};
+export {
+  y as a,
+  u as c,
+  m as g,
+  f as p,
+  d as r
+};

package/chunks/{index.CgTHIF3K.js → index.D-sRdssb.js}

@@ -147,7 +147,7 @@ function ee() {
   }
   function Y(e, r) {
     const i = p.get(e);
-    i != null && i.delete(r);
+    i?.delete(r);
   }
   function Z(e) {
     const r = w(null);

package/chunks/{index.CEyLAtio.js → index.DL9mof6u.js}

@@ -10,7 +10,7 @@ var o = { exports: {} };
 */
 var i;
 function p() {
-  return i || (i = 1, function(e) {
+  return i || (i = 1, (function(e) {
     (function() {
       var u = {}.hasOwnProperty;
       function s() {
@@ -39,7 +39,7 @@ function p() {
       }
       e.exports ? (s.default = s, e.exports = s) : window.classNames = s;
     })();
-  }(o)), o.exports;
+  })(o)), o.exports;
 }
 var l = p();
 const m = /* @__PURE__ */ c(l);

package/chunks/{is-animation-disabled.CUl4N3LI.js → is-animation-disabled.B-V_68K-.js}

@@ -1,6 +1,6 @@
 "use client";
 import { h as i } from "./has-window.ut_-aShB.js";
-const n = (t) => i && (t == null ? void 0 : t.getBoundingClientRect()) || DOMRect.fromRect({
+const o = (e) => i && e?.getBoundingClientRect() || DOMRect.fromRect({
   x: 0,
   y: 0,
   width: 0,
@@ -8,13 +8,13 @@ const n = (t) => i && (t == null ? void 0 : t.getBoundingClientRect()) || DOMRec
 }), r = () => {
   if (i) {
     const {
-      matches: t
-    } = window.matchMedia("(prefers-reduced-motion: reduce)"), e = getComputedStyle(document.documentElement).getPropertyValue("--ds-animation-duration").trim();
-    return e === "0s" || e === "0ms" || t;
+      matches: e
+    } = window.matchMedia("(prefers-reduced-motion: reduce)"), t = getComputedStyle(document.documentElement).getPropertyValue("--ds-animation-duration").trim();
+    return t === "0s" || t === "0ms" || e;
   } else
     return !0;
 };
 export {
-  n as g,
+  o as g,
   r as i
 };

package/chunks/{map.CXgG1iGz.js → map.DNl7PF61.js}

@@ -4,7 +4,7 @@ const i = ({
   title: l,
   titleId: t,
   ...a
-}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 17 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": t, ...a }, l ? /* @__PURE__ */ e.createElement("title", { id: t }, l) : null, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "m5.6.9 4.7 2L16.1.5v12.2l-5.7 2.4-4.7-2L0 15.5V3.3zM2 12.5l2.7-1.2V3.5L2 4.7zm7.3 0-2.7-1.1V3.5l2.7 1.2zm2-.1 2.7-1.1V3.5l-2.7 1.2z", clipRule: "evenodd" }));
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": t, ...a }, l ? /* @__PURE__ */ e.createElement("title", { id: t }, l) : null, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "m5.565.9 4.671 2L16 .5v12.2l-5.665 2.4-4.67-2L0 15.5V3.3zM1.988 12.5l2.683-1.2V3.5L1.988 4.7zm7.254 0L6.56 11.4V3.5l2.683 1.2zm1.988-.1 2.683-1.1V3.5L11.23 4.7z", clipRule: "evenodd" }));
 export {
   i as default
 };

package/chunks/moon.5yILPYXs.js

@@ -0,0 +1,10 @@
+"use client";
+import * as e from "react";
+const c = ({
+  title: l,
+  titleId: a,
+  ...t
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": a, ...t }, l ? /* @__PURE__ */ e.createElement("title", { id: a }, l) : null, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "M3.992 8c0 2.761 2.229 5 4.978 5a4.7 4.7 0 0 0 1.15-.158c-2.403-2.707-2.39-7.042.103-9.683Q9.62 3.002 8.97 3C6.22 3 3.992 5.239 3.992 8m8.125-6.248A6.9 6.9 0 0 0 8.97 1C5.12 1 2 4.134 2 8s3.12 7 6.97 7c.989 0 2.04-.267 2.99-.694A7.9 7.9 0 0 0 14 13a5.2 5.2 0 0 1-1.921-1.031c-2.349-2.015-2.338-5.87.044-7.84A5.2 5.2 0 0 1 14 3.155a7 7 0 0 0-1.883-1.402", clipRule: "evenodd" }));
+export {
+  c as default
+};

package/chunks/muscle.DbNjWasV.js

@@ -0,0 +1,10 @@
+"use client";
+import * as e from "react";
+const c = ({
+  title: l,
+  titleId: t,
+  ...a
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": t, ...a }, l ? /* @__PURE__ */ e.createElement("title", { id: t }, l) : null, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "M0 5.895c3.5-.723 6.5-.723 10 2.68l1-3.216-2-1.097V1.69L10.4 0H14l2 4.262-2 11.628s-3.911.247-6.4 0c-3.018-.3-5.6-1.153-7.6-1.689zm2 6.244v-4.1s2.726-.911 5.6 1.42c.976.792 2.9 2.68 2.9 2.68l2.5-6.78V4.287l-2-1.071V2.144h2l1 2.143V5.36l-1.6 8.842s-4.214-.267-4.4-.267c-3.018 0-6-1.795-6-1.795", clipRule: "evenodd" }));
+export {
+  c as default
+};

package/chunks/petrol.BGWwCsTw.js

@@ -0,0 +1,10 @@
+"use client";
+import * as e from "react";
+const n = ({
+  title: l,
+  titleId: t,
+  ...a
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": t, ...a }, l ? /* @__PURE__ */ e.createElement("title", { id: t }, l) : null, /* @__PURE__ */ e.createElement("path", { d: "M4.414 0 1 3.46l1.394 1.413 3.414-3.46zm6.053 6.511 1.38 1.399-1.38 1.398 1.38 1.398-1.38 1.399-1.38-1.399-1.379 1.399-1.38-1.399 1.38-1.398-1.38-1.398 1.38-1.399 1.38 1.399z" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "M3.175 5.712 8.792.02H15V16H3.175zm1.971 8.29h7.883V2.017H9.58L5.146 6.51z", clipRule: "evenodd" }));
+export {
+  n as default
+};

package/chunks/sun.CY6ttzTL.js

@@ -0,0 +1,10 @@
+"use client";
+import * as e from "react";
+const m = ({
+  title: l,
+  titleId: t,
+  ...a
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": t, ...a }, l ? /* @__PURE__ */ e.createElement("title", { id: t }, l) : null, /* @__PURE__ */ e.createElement("g", { clipPath: "url(#a)" }, /* @__PURE__ */ e.createElement("path", { d: "M9 16H7v-2.75h2zm-4.005-3.58L3.05 14.364 1.636 12.95l1.944-1.945zm9.369.53-1.414 1.414-1.945-1.945 1.414-1.414z" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "M8 3.5a4.5 4.5 0 1 1 0 9 4.5 4.5 0 0 1 0-9m0 2a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5", clipRule: "evenodd" }), /* @__PURE__ */ e.createElement("path", { d: "M2.75 9H0V7h2.75zM16 9h-2.75V7H16zM4.995 3.581 3.581 4.995 1.636 3.051 3.05 1.636zm9.369-.531L12.42 4.995 11.005 3.58l1.945-1.944zM9 2.75H7V0h2z" })));
+export {
+  m as default
+};

package/chunks/{triangle-exclamationmark-colored.CbVC3Gzi.js → triangle-exclamationmark-colored.e93zvQ6Q.js}

@@ -4,7 +4,7 @@ const c = ({
   title: l,
   titleId: a,
   ...t
-}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": a, ...t }, l ? /* @__PURE__ */ e.createElement("title", { id: a }, l) : null, /* @__PURE__ */ e.createElement("path", { fill: "#FDC543", d: "M8 0 0 16h16z" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "m8.7 11.3.5-4.9H6.8l.5 4.9zm-1.8 2.1c0 .6.5 1.1 1.1 1.1s1.1-.4 1.1-1.1c0-.6-.5-1.1-1.1-1.1s-1.1.5-1.1 1.1", clipRule: "evenodd" }));
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": a, ...t }, l ? /* @__PURE__ */ e.createElement("title", { id: a }, l) : null, /* @__PURE__ */ e.createElement("path", { fill: "#fdc543", d: "M8 0 0 16h16z" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "m8.7 11.3.5-4.9H6.8l.5 4.9zm-1.8 2.1c0 .6.5 1.1 1.1 1.1s1.1-.4 1.1-1.1c0-.6-.5-1.1-1.1-1.1s-1.1.5-1.1 1.1", clipRule: "evenodd" }));
 export {
   c as default
 };

package/chunks/upload.BogDfonx.js

@@ -0,0 +1,10 @@
+"use client";
+import * as e from "react";
+const h = ({
+  title: l,
+  titleId: t,
+  ...a
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": t, ...a }, l ? /* @__PURE__ */ e.createElement("title", { id: t }, l) : null, /* @__PURE__ */ e.createElement("path", { d: "M13 5 8 0 3 5l1.5 1.4L7 3.8V10h2V3.8l2.5 2.6z" }), /* @__PURE__ */ e.createElement("path", { d: "M4 8H0v8h16V8h-4v2h2v4H2v-4h2z" }));
+export {
+  h as default
+};

package/chunks/useBreakpoint.BzR_yaIv.js

@@ -0,0 +1,42 @@
+"use client";
+import { useState as u, useEffect as c } from "react";
+const o = {
+  base: 0,
+  s: 320,
+  m: 768,
+  l: 1024,
+  xl: 1536
+}, a = ["base", "s", "m", "l", "xl"], k = (e) => {
+  let n = "base";
+  for (const t of a)
+    if (e >= o[t])
+      n = t;
+    else
+      break;
+  return n;
+}, b = (e) => e && typeof e == "object" && "base" in e, f = () => {
+  const [e, n] = u("base");
+  c(() => (t(), window.addEventListener("resize", t), () => window.removeEventListener("resize", t)), []);
+  const t = () => {
+    const r = window.innerWidth;
+    n(k(r));
+  };
+  return e;
+}, B = (e) => {
+  const n = f();
+  if (e && typeof e != "object" || !b(e))
+    return e;
+  const t = [...a].reverse();
+  let r = e.base;
+  for (const s of t) {
+    const i = e[s];
+    if (i !== void 0 && o[n] >= o[s]) {
+      r = i;
+      break;
+    }
+  }
+  return r;
+};
+export {
+  B as u
+};

package/chunks/variants.-R3_RCW8.js

@@ -0,0 +1,10 @@
+"use client";
+import * as e from "react";
+const h = ({
+  title: t,
+  titleId: l,
+  ...a
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": l, ...a }, t ? /* @__PURE__ */ e.createElement("title", { id: l }, t) : null, /* @__PURE__ */ e.createElement("g", { clipPath: "url(#a)" }, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", d: "M10 16H0V6h10zm-8-2h6V8H2z", clipRule: "evenodd" }), /* @__PURE__ */ e.createElement("path", { d: "M13 13h-2V5H3V3h10z" }), /* @__PURE__ */ e.createElement("path", { d: "M16 10h-2V2H6V0h10z" })));
+export {
+  h as default
+};

package/chunks/weight.DUPu2UT0.js

@@ -0,0 +1,10 @@
+"use client";
+import * as e from "react";
+const c = ({
+  title: l,
+  titleId: t,
+  ...a
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#252525", viewBox: "0 0 16 16", focusable: "false", width: "100%", height: "100%", "aria-labelledby": t, ...a }, l ? /* @__PURE__ */ e.createElement("title", { id: t }, l) : null, /* @__PURE__ */ e.createElement("g", { clipPath: "url(#a)" }, /* @__PURE__ */ e.createElement("path", { d: "m15.614 14.039-1.516-7.767-.256-1.322h-3.678c.481-.525.776-1.23.776-2.001C10.94 1.322 9.64 0 8.04 0S5.143 1.322 5.143 2.949c0 .771.294 1.472.775 2H2.153l-.255 1.323L.38 14.04 0 16h16l-.381-1.961zm-7.573-12.4c.71 0 1.283.587 1.283 1.305 0 .719-.577 1.305-1.283 1.305A1.296 1.296 0 0 1 6.76 2.944c0-.718.576-1.304 1.282-1.304M2.775 14 4 7h8l1.39 7z" })));
+export {
+  c as default
+};

package/combobox.jG5GRA7C.js

@@ -0,0 +1,65 @@
+"use client";
+import { jsx as y } from "react/jsx-runtime";
+import { d as P } from "./chunks/index.D-sRdssb.js";
+import { v as _, c as $ } from "./chunks/CustomReactSelect.Dg3wC_VH.js";
+import { forwardRef as z } from "react";
+const A = z((O, x) => {
+  const e = P.c(32);
+  let s, a, t, n, d, l, r, o, c, p, i, m, u;
+  if (e[0] !== O) {
+    const {
+      id: h,
+      label: q,
+      className: L,
+      disabled: S,
+      dropdownOnFocus: g,
+      filterOption: R,
+      hideLabel: w,
+      invalid: D,
+      lang: E,
+      required: F,
+      tabSelectsValue: M,
+      variant: V,
+      ...j
+    } = O;
+    if (l = h, o = q, s = L, n = R, i = j, a = S === void 0 ? !1 : S, t = g === void 0 ? !1 : g, d = w === void 0 ? !1 : w, r = D === void 0 ? !1 : D, c = E === void 0 ? "en" : E, p = F === void 0 ? !1 : F, m = M === void 0 ? !0 : M, u = V === void 0 ? "single" : V, process.env.NODE_ENV !== "production") {
+      const {
+        options: k
+      } = i;
+      _({
+        id: l,
+        label: o,
+        options: k
+      });
+    }
+    e[0] = O, e[1] = s, e[2] = a, e[3] = t, e[4] = n, e[5] = d, e[6] = l, e[7] = r, e[8] = o, e[9] = c, e[10] = p, e[11] = i, e[12] = m, e[13] = u;
+  } else
+    s = e[1], a = e[2], t = e[3], n = e[4], d = e[5], l = e[6], r = e[7], o = e[8], c = e[9], p = e[10], i = e[11], m = e[12], u = e[13];
+  const b = u === "multi", C = !t || b;
+  let f;
+  e[14] !== s || e[15] !== a || e[16] !== t || e[17] !== n || e[18] !== d || e[19] !== l || e[20] !== r || e[21] !== b || e[22] !== o || e[23] !== c || e[24] !== x || e[25] !== p || e[26] !== i || e[27] !== C || e[28] !== m ? (f = {
+    id: l,
+    label: o,
+    className: s,
+    disabled: a,
+    filterOption: n,
+    hideLabel: d,
+    isMulti: b,
+    invalid: r,
+    lang: c,
+    openMenuOnClick: t,
+    openMenuOnFocus: t,
+    isClearable: C,
+    required: p,
+    ref: x,
+    tabSelectsValue: m,
+    ...i
+  }, e[14] = s, e[15] = a, e[16] = t, e[17] = n, e[18] = d, e[19] = l, e[20] = r, e[21] = b, e[22] = o, e[23] = c, e[24] = x, e[25] = p, e[26] = i, e[27] = C, e[28] = m, e[29] = f) : f = e[29];
+  const N = f;
+  let v;
+  return e[30] !== N ? (v = /* @__PURE__ */ y($, { ...N }), e[30] = N, e[31] = v) : v = e[31], v;
+});
+A.displayName = "DSCombobox";
+export {
+  A as DSCombobox
+};

package/components/ActionButton/ActionButton.d.ts

@@ -50,6 +50,8 @@ export interface ActionButtonProps extends ButtonHTMLAttributes<HTMLButtonElemen
      * @default 'normal'
      */
     weight?: ActionButtonWeight;
+    /** Tooltip content. */
+    tooltip?: string;
     /** Callback function called when the button is clicked. */
     onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 }

package/components/Button/Button.d.ts

@@ -47,6 +47,10 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
      * @default 'light'
      */
     theme?: Theme;
+    /**
+     * Tooltip content.
+     */
+    tooltip?: string;
     /** Visual style variant of the button.
      * @default 'filled'
      */

package/components/ChipGroup/Chip.d.ts

@@ -1,6 +1,7 @@
 import { HTMLAttributes } from 'react';
 import { Chip, ChipGroupAriaTranslations, ChipGroupLanguage, ChipGroupSelectionMode, ChipGroupSize } from './ChipGroup.utils';
 interface ChipProps extends Omit<Chip, 'onClick'>, Omit<HTMLAttributes<HTMLDivElement>, 'id'> {
+    disableTooltips?: boolean;
     groupId: string;
     isRemovable: boolean;
     lang?: ChipGroupLanguage;

package/components/ChipGroup/ChipGroup.d.ts

@@ -9,6 +9,10 @@ export interface ChipGroupProps extends HTMLAttributes<HTMLDivElement> {
     id: string;
     /** Label text displayed above the DSChipGroup. */
     label: string;
+    /** Disables tooltips for all chips in the group.
+     * @default false
+     */
+    disableTooltips?: boolean;
     /** Hides the DSChipGroup label, can be responsive.
      *  `boolean | { base: boolean; s?: boolean; m?: boolean; l?: boolean; xl?: boolean; }`
      * @default false

package/components/ChipGroup/ChipGroup.utils.d.ts

@@ -33,10 +33,10 @@ export declare const DS_CHIP_GROUP_TRANSLATIONS_EN: {
     addToSelection: string;
     removeFromSelection: string;
     removeChip: string;
-    titleDisabled: string;
-    titleRemovable: string;
-    titleDeactivate: string;
-    titleActivate: string;
+    tooltipDisabled: string;
+    tooltipRemovable: string;
+    tooltipDeactivate: string;
+    tooltipActivate: string;
 };
 export declare const DS_CHIP_GROUP_TRANSLATIONS_DE: {
     disabled: string;
@@ -47,14 +47,12 @@ export declare const DS_CHIP_GROUP_TRANSLATIONS_DE: {
     addToSelection: string;
     removeFromSelection: string;
     removeChip: string;
-    titleDisabled: string;
-    titleRemovable: string;
-    titleDeactivate: string;
-    titleActivate: string;
-};
-export declare const DS_CHIP_GROUP_TRANSLATIONS: {
-    [key in ChipGroupLanguage]: ChipGroupAriaTranslations;
+    tooltipDisabled: string;
+    tooltipRemovable: string;
+    tooltipDeactivate: string;
+    tooltipActivate: string;
 };
+export declare const DS_CHIP_GROUP_TRANSLATIONS: Record<ChipGroupLanguage, ChipGroupAriaTranslations>;
 export declare const getChipAriaLabel: (t: (key: keyof ChipGroupAriaTranslations, replacements?: string[]) => string, label: string, disabled: boolean | undefined, isSelected: boolean | undefined, selectionMode: ChipGroupSelectionMode, isRemovable: boolean | undefined) => string;
-export declare const getChipTitle: (t: (key: keyof ChipGroupAriaTranslations, replacements?: string[]) => string, disabled: boolean | undefined, isSelected: boolean | undefined, isRemovable: boolean | undefined) => string;
+export declare const getChipTooltip: (t: (key: keyof ChipGroupAriaTranslations, replacements?: string[]) => string, disabled: boolean | undefined, isSelected: boolean | undefined, isRemovable: boolean | undefined) => string;
 export {};

package/components/Combobox/Combobox.utils.d.ts

@@ -1,8 +1,9 @@
 import { IconName } from '../../types';
 import { ComboboxProps } from './Combobox';
-import { GroupBase, OptionsOrGroups } from 'react-select';
+import { FilterOptionOption, GroupBase, OptionsOrGroups } from 'react-select';
 export type ComboboxVariant = 'single' | 'multi';
 type ValidationProps = Pick<ComboboxProps, 'id' | 'label' | 'options'>;
+export type ComboboxFilterOption<Option> = FilterOptionOption<Option>;
 /**
  * Validates the given properties of the DSCombobox component for common configuration errors.
  * This function is intended to be used in development mode to provide developers with
@@ -57,7 +58,5 @@ export declare const DS_COMBOBOX_TRANSLATIONS_EN: {
     resultsAvailable: string;
 };
 export declare const DS_COMBOBOX_TRANSLATIONS_DE: ComboboxAriaTranslations;
-export declare const DS_COMBOBOX_TRANSLATIONS: {
-    [key in ComboboxLanguage]: ComboboxAriaTranslations;
-};
+export declare const DS_COMBOBOX_TRANSLATIONS: Record<ComboboxLanguage, ComboboxAriaTranslations>;
 export {};

package/components/Combobox/CustomReactSelect/CustomReactSelect.d.ts

@@ -1,9 +1,9 @@
 import { GroupBase } from 'react-select';
 import { BreakpointCustomizable, Optional } from '../../../types';
-import { ComboboxAriaTranslations, ComboboxLanguage, ComboboxOption, ComboboxOptionsGroup, ComboboxOptionsOrOptGroups, ComboboxSize } from '../Combobox.utils';
+import { ComboboxAriaTranslations, ComboboxFilterOption, ComboboxLanguage, ComboboxOption, ComboboxOptionsGroup, ComboboxOptionsOrOptGroups, ComboboxSize } from '../Combobox.utils';
 import { PublicBaseSelectProps } from 'react-select/dist/declarations/src/Select';
 import { StateManagerProps } from 'react-select/dist/declarations/src/useStateManager';
-type IncludedReactSelectKeys = 'className' | 'form' | 'inputValue' | 'menuIsOpen' | 'name' | 'onBlur' | 'onFocus' | 'openMenuOnClick' | 'openMenuOnFocus' | 'tabIndex';
+type IncludedReactSelectKeys = 'className' | 'filterOption' | 'form' | 'inputValue' | 'menuIsOpen' | 'name' | 'onBlur' | 'onFocus' | 'openMenuOnClick' | 'openMenuOnFocus' | 'tabIndex';
 type PickedReactSelectProps<OptionType, IsMulti extends boolean, GroupType extends GroupBase<OptionType>> = Optional<Pick<PublicBaseSelectProps<OptionType, IsMulti, GroupType>, IncludedReactSelectKeys>, IncludedReactSelectKeys>;
 type PickedReactSelectStateManagerProps<OptionType, IsMulti extends boolean, GroupType extends GroupBase<OptionType>> = Optional<Pick<StateManagerProps<OptionType, IsMulti, GroupType>, 'defaultInputValue'>, 'defaultInputValue'>;
 export interface CustomReactSelectProps<IsMulti extends boolean> extends PickedReactSelectProps<ComboboxOption, IsMulti, ComboboxOptionsGroup>, PickedReactSelectStateManagerProps<ComboboxOption, IsMulti, ComboboxOptionsGroup> {
@@ -26,6 +26,8 @@ export interface CustomReactSelectProps<IsMulti extends boolean> extends PickedR
      * @default false
      */
     disabled?: boolean;
+    /** Custom method to filter whether an option should be displayed in the menu */
+    filterOption?: ((option: ComboboxFilterOption<ComboboxOption>, inputValue: string) => boolean) | null;
     /** Hides the DSCombobox label, can be responsive.
      *  `boolean | { base: boolean; s?: boolean; m?: boolean; l?: boolean; xl?: boolean; }`
      * @default false

package/components/Header/Header.d.ts

@@ -2,14 +2,13 @@ import { JSX } from 'react';
 import { BrandAddOnProps, BrandAreaLogoProps } from '../TopBar/TopBar';
 import { HeaderVariant, SlotProps } from './Header.utils';
 export interface HeaderProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** Brand addOn props:
+    /** Brand add-on props:
      *
-     * `children`: Content of the brand addOn.
+     * `children`: Content of the brand add-on.
      *
-     * `subTitle`: Sub title below the title. **Only available with `variant="double"`**.
+     * `subTitle`: Sub title displayed below the `children` to create a two line brand add-on.
      *
-     * `variant`: Variant of the brand addOn.
-     *            Defaults to `'single'`
+     * `variant`: Predefined variant of the brand add-on.
      */
     brandAddOnProps?: BrandAddOnProps;
     /** Content of the Header. */

package/components/{InputStepper/InputStepper.d.ts → InputNumber/InputNumber.d.ts}

@@ -1,7 +1,7 @@
 import { InputHTMLAttributes } from 'react';
 import { BreakpointCustomizable } from '../../types';
 import { InputSize } from '../Input/Input.utils';
-export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'size' | 'value'> {
+export interface InputNumberProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'size' | 'value'> {
     /** Unique id for the input. */
     id: string;
     /** Label text displayed above the input. */
@@ -20,10 +20,13 @@ export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputEle
      *
      * `label`: Accessibility label for the decrease button.
      * (default) 'Decrease'
+     *
+     * `tooltip`: Tooltip text for the decrease button.
      */
     decreaseAmountButtonProps?: {
         [key: `data-${string}`]: string | undefined;
         label?: string;
+        tooltip?: string;
     };
     /** Hides the input label, can be responsive.
      *  `boolean | { base: boolean; s?: boolean; m?: boolean; l?: boolean; xl?: boolean; }`
@@ -38,10 +41,13 @@ export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputEle
      *
      * `label`: Accessibility label for the increase button.
      * (default) 'Increase'
+     *
+     * `tooltip`: Tooltip text for the increase button.
      */
     increaseAmountButtonProps?: {
         [key: `data-${string}`]: string | undefined;
         label?: string;
+        tooltip?: string;
     };
     /** Marks the input as invalid, typically used for form validation.
      * @default false
@@ -81,11 +87,11 @@ export interface InputStepperProps extends Omit<InputHTMLAttributes<HTMLInputEle
     value?: InputHTMLAttributes<HTMLInputElement>['value'];
 }
 /**
- * The `<DSInputStepper />` component is a versatile input field that allows users to easily enter a value and decrease or increase it as needed.
+ * The `<DSInputNumber />` component is a versatile input field that allows users to easily enter a value and decrease or increase it as needed.
  * It comes in two sizes (medium & small) and supports various customizations including a prefix and suffix.
  *
  * Next to the input field, there are two buttons to increase or decrease the input value.
  *
- * Design in Figma: [Input Stepper](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=2141-6769&t=UBsmFURFENnuYSW1-11)
+ * Design in Figma: [Input Number](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=2141-6769&t=UBsmFURFENnuYSW1-11)
  */
-export declare const DSInputStepper: import('react').ForwardRefExoticComponent<InputStepperProps & import('react').RefAttributes<HTMLInputElement>>;
+export declare const DSInputNumber: import('react').ForwardRefExoticComponent<InputNumberProps & import('react').RefAttributes<HTMLInputElement>>;

package/components/InputNumber/InputNumber.utils.d.ts

@@ -0,0 +1,13 @@
+import { InputNumberProps } from './InputNumber';
+type ValidationProps = Pick<InputNumberProps, 'id' | 'label' | 'prefix' | 'suffix'>;
+export declare const isValidValue: (value: string | number | readonly string[] | undefined | null) => boolean;
+/**
+ * Validates the given properties of the DSInputNumber component for common configuration errors.
+ * This function is intended to be used in development mode to provide developers with
+ * warnings about potential misuse of the component.
+ *
+ * @param validationProps - The subset of DSInputNumber properties to validate. This includes
+ *                          properties related to the prefix, suffix, icons and action button of the input.
+ */
+export declare const validateInputNumberProps: ({ id, label, prefix, suffix, }: ValidationProps) => void;
+export {};

package/components/LinkButton/LinkButton.d.ts

@@ -34,6 +34,8 @@ export interface CommonLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorEl
      * @default 'light'
      */
     theme?: Theme;
+    /** Tooltip content. */
+    tooltip?: string;
 }
 export interface LinkButtonProps extends CommonLinkProps {
     /** Content within the link. */

package/components/Logo100Years/Logo100Years.d.ts

@@ -0,0 +1 @@
+export declare const Logo100Years: () => import("react/jsx-runtime").JSX.Element;

package/components/Popover/Popover.d.ts

@@ -3,38 +3,60 @@ import { OpenChangeReason, Placement } from '@floating-ui/react';
 export interface PopoverProps {
     /** Content within the Popover. */
     children?: React.ReactNode;
+    /** Default anchor button props:
+     *
+     * `data-*`: Custom data attributes.
+     *
+     * `label`: Accessibility label for the default anchor button.
+     * (default) 'Toggle popover'
+     */
+    defaultAnchorButtonProps?: {
+        [key: `data-${string}`]: string | undefined;
+        label?: string;
+    };
     /** Opens the Popover on initial render.
      * @default false
      */
     initialOpen?: boolean;
+    /** Controls the open state of the Popover. If provided, it will be a controlled component.
+     * @default false
+     */
+    isOpen?: boolean;
     /** The placement of the Popover relative to the anchor element.
-     * @default 'bottom-start'
+     * @default 'bottom'
      */
     placement?: Placement;
     /** The offset distance in "px" between the Popover and its anchor element.
      * @default 6
      */
     popoverOffset?: number;
-    /** Controls the open state of the Popover. If provided, it will be a controlled component.
-     * @default false
+    /** Whether to render a pointing arrow attached to the popover.
+     * @default true
      */
-    isOpen?: boolean;
+    showArrow?: boolean;
+    /** The variant style of the Popover. The "grey" variant requires `showArrow` to be `true`.
+     * @default 'default'
+     */
+    variant?: 'default' | 'grey';
     /** A function that is called when the open state should change. */
     onOpenChange?: (isOpen: boolean, event?: Event, reason?: OpenChangeReason) => void;
 }
 /**
  * The Popover component is used to display additional information or actions related to an anchor element. It can be positioned relative to the anchor and supports various placements and offsets.
  *
- * Design in Figma: [Popover](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=35223-10505&p=f&t=QXC7W0qCpEbPrh2M-11)
+ * Design in Figma: [Popover](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=35223-10505)
  * */
 export declare const DSPopover: {
     ({ children, ...rest }: PopoverProps): JSX.Element;
     /** attach static members */
     Anchor: import('react').ForwardRefExoticComponent<Omit<HTMLProps<HTMLElement> & PopoverAnchorProps, "ref"> & import('react').RefAttributes<HTMLElement>>;
-    Content: import('react').ForwardRefExoticComponent<Omit<HTMLProps<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Content: import('react').ForwardRefExoticComponent<Omit<HTMLProps<HTMLDivElement> & PopoverContentProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
     displayName: string;
 };
 interface PopoverAnchorProps {
-    children: React.ReactNode;
+    children?: React.ReactNode;
+}
+interface PopoverContentProps {
+    classNameArrow?: string;
 }
 export {};