@stihl-design-system/components 1.0.0-RC.47 → 1.0.0-RC.48

package/{popover.DYiEGSnj.js → popover.BBaqL7y9.js}

@@ -1,13 +1,13 @@
 "use client";
 import "react/jsx-runtime";
 import "./chunks/index.cKLI89Eg.js";
-import { D as c } from "./chunks/Popover.ByaoNwGK.js";
+import { D as c } from "./chunks/Popover.CxZZ_y1Z.js";
 import "react";
 import "./chunks/floating-ui.react.Chmq0RmI.js";
 import "./chunks/index.DQOqod3i.js";
-import "./chunks/helpers.CexwVao7.js";
+import "./chunks/Button.CCol--xy.js";
 import "./chunks/useIsomorphicLayoutEffect.CnJ9AMFS.js";
-import "./chunks/Button.COycNYUI.js";
+import "./chunks/helpers.CexwVao7.js";
 export {
   c as DSPopover
 };

package/progressindicator.D9CfVD95.js

@@ -0,0 +1,74 @@
+"use client";
+import { jsx as t, Fragment as o, jsxs as g } from "react/jsx-runtime";
+import { d as x } from "./chunks/index.cKLI89Eg.js";
+import { c as l } from "./chunks/index.DQOqod3i.js";
+import { DSSpinner as N } from "./spinner.DtLnsqVV.js";
+import './assets/progressindicator.tyY_RVQ9.css';const v = "ds-input-file_root_1dac7_1", B = "ds-input-file_bar-background_1dac7_7", I = "ds-input-file_bar-background--dark_1dac7_23", T = "ds-input-file_bar-fill_1dac7_27", L = "ds-input-file_bar-fill--dark_1dac7_32", $ = "ds-input-file_bar-fill--error_1dac7_35", w = "ds-input-file_bar-fill-indeterminate_1dac7_46", E = "ds-input-file_bar-fill-indeterminate--dark_1dac7_61", S = "ds-input-file_percent-label_1dac7_70", j = "ds-input-file_percent-label--dark_1dac7_83", y = "ds-input-file_progress-text_1dac7_87", A = "ds-input-file_progress-text--dark_1dac7_102", P = "ds-input-file_progress-bar_1dac7_106", a = {
+  root: v,
+  barBackground: B,
+  barBackgroundDark: I,
+  barFill: T,
+  barFillDark: L,
+  barFillError: $,
+  barFillIndeterminate: w,
+  barFillIndeterminateDark: E,
+  percentLabel: S,
+  percentLabelDark: j,
+  progressText: y,
+  progressTextDark: A,
+  progressBar: P
+}, H = (F) => {
+  const r = x.c(17), {
+    className: c,
+    fileName: f,
+    id: p,
+    percent: n,
+    progressStatus: h,
+    variant: b,
+    theme: D,
+    t: e
+  } = F, i = (D === void 0 ? "light" : D) === "dark", s = n === "indeterminate";
+  let u;
+  r[0] !== e ? (u = e("uploadStatus"), r[0] = e, r[1] = u) : u = r[1];
+  let _;
+  r[2] !== f || r[3] !== s || r[4] !== e ? (_ = s ? `, ${e("fileListIndeterminate", {
+    fileName: f
+  })}` : "", r[2] = f, r[3] = s, r[4] = e, r[5] = _) : _ = r[5];
+  const d = `${u}${_}`, m = s ? void 0 : n;
+  let k;
+  return r[6] !== m || r[7] !== c || r[8] !== p || r[9] !== i || r[10] !== s || r[11] !== n || r[12] !== h || r[13] !== d || r[14] !== e || r[15] !== b ? (k = b === "text" ? /* @__PURE__ */ t(o, { children: /* @__PURE__ */ t("span", { id: p, className: l(a.root, a.progressText, {
+    [a.progressTextDark]: i
+  }, c), role: "progressbar", "aria-label": d, "aria-valuenow": m, children: s ? /* @__PURE__ */ g(o, { children: [
+    /* @__PURE__ */ t(N, { aria: {
+      "aria-label": e("uploading")
+    } }),
+    /* @__PURE__ */ t("span", { children: e("uploading") })
+  ] }) : `${d} ${n}%` }) }) : b === "bar" ? /* @__PURE__ */ g(o, { children: [
+    /* @__PURE__ */ t("div", { id: p, className: l(a.root, a.progressBar, c), role: "progressbar", "aria-label": d, "aria-valuenow": m, children: s ? /* @__PURE__ */ t(o, { children: /* @__PURE__ */ t("div", { className: l(a.barBackground, {
+      [a.barBackgroundDark]: i
+    }), "aria-hidden": "true", children: /* @__PURE__ */ t("div", { className: l(a.barFillIndeterminate, {
+      [a.barFillIndeterminateDark]: i
+    }) }) }) }) : /* @__PURE__ */ g(o, { children: [
+      /* @__PURE__ */ t("div", { className: l(a.barBackground, {
+        [a.barBackgroundDark]: i
+      }), "aria-hidden": "true", children: /* @__PURE__ */ t("div", { className: l(a.barFill, {
+        [a.barFillDark]: i,
+        [a.barFillError]: h === "error"
+      }), style: {
+        width: `${n}%`
+      } }) }),
+      /* @__PURE__ */ g("span", { className: l(a.percentLabel, {
+        [a.percentLabelDark]: i
+      }), "aria-hidden": "true", children: [
+        n,
+        "%"
+      ] })
+    ] }) }),
+    s && /* @__PURE__ */ t("div", { className: l(a.progressText, {
+      [a.progressTextDark]: i
+    }), children: e("uploading") })
+  ] }) : null, r[6] = m, r[7] = c, r[8] = p, r[9] = i, r[10] = s, r[11] = n, r[12] = h, r[13] = d, r[14] = e, r[15] = b, r[16] = k) : k = r[16], k;
+};
+export {
+  H as ProgressIndicator
+};

package/radio.DjToa2aV.js

@@ -0,0 +1,148 @@
+"use client";
+import { jsx as B, jsxs as ge } from "react/jsx-runtime";
+import { d as Ne } from "./chunks/index.cKLI89Eg.js";
+import { c as f } from "./chunks/index.DQOqod3i.js";
+import { forwardRef as We, useRef as ve, useState as xe, useEffect as He } from "react";
+import './assets/radio.9hUUyg8R.css';const Ae = (U) => U.replace(/\s+/g, ""), Be = "ds-radio_root_1c2bg_1", Ue = "ds-radio_root--dark_1c2bg_24", Ie = "ds-radio_root--disabled_1c2bg_27", Se = "ds-radio_root--with-custom-area_1c2bg_30", $e = "ds-radio_root--with-custom-area--above_1c2bg_33", we = "ds-radio_radio_1c2bg_41", je = "ds-radio_dot_1c2bg_64", Ee = "ds-radio_radio--invalid_1c2bg_88", Ve = "ds-radio_radio--dark_1c2bg_92", Oe = "ds-radio_label_1c2bg_108", Re = "ds-radio_label--bold_1c2bg_125", Te = "ds-radio_label--with-custom-area_1c2bg_137", qe = "ds-radio_custom-area_1c2bg_141", ze = "ds-radio_custom-area--disabled_1c2bg_149", Fe = "ds-radio_custom-area--above_1c2bg_152", Ge = "ds-radio_hint_1c2bg_159", Je = "ds-radio_hint--visible_1c2bg_183", Ke = "ds-radio_hint--unchecked-hidden_1c2bg_187", Le = "ds-radio_input_1c2bg_193", Me = "ds-radio_input--dark_1c2bg_294", t = {
+  root: Be,
+  rootDark: Ue,
+  rootDisabled: Ie,
+  rootWithCustomArea: Se,
+  rootWithCustomAreaAbove: $e,
+  radio: we,
+  dot: je,
+  radioInvalid: Ee,
+  radioDark: Ve,
+  label: Oe,
+  labelBold: Re,
+  labelWithCustomArea: Te,
+  customArea: qe,
+  customAreaDisabled: ze,
+  customAreaAbove: Fe,
+  hint: Ge,
+  hintVisible: Je,
+  hintUncheckedHidden: Ke,
+  input: Le,
+  inputDark: Me
+}, Pe = We((U, g) => {
+  const e = Ne.c(98);
+  let I, v, i, h, l, u, r, b, A, S, $, w, j, E, V, O, c;
+  e[0] !== U ? ({
+    label: u,
+    name: r,
+    value: c,
+    checked: I,
+    className: v,
+    customArea: i,
+    isCustomAreaAbove: S,
+    defaultChecked: $,
+    disabled: w,
+    fieldsetId: h,
+    hint: l,
+    invalid: j,
+    isBold: E,
+    hideUncheckedHint: V,
+    theme: O,
+    onChange: b,
+    ...A
+  } = U, e[0] = U, e[1] = I, e[2] = v, e[3] = i, e[4] = h, e[5] = l, e[6] = u, e[7] = r, e[8] = b, e[9] = A, e[10] = S, e[11] = $, e[12] = w, e[13] = j, e[14] = E, e[15] = V, e[16] = O, e[17] = c) : (I = e[1], v = e[2], i = e[3], h = e[4], l = e[5], u = e[6], r = e[7], b = e[8], A = e[9], S = e[10], $ = e[11], w = e[12], j = e[13], E = e[14], V = e[15], O = e[16], c = e[17]);
+  const _ = S === void 0 ? !1 : S, pe = $ === void 0 ? !1 : $, s = w === void 0 ? !1 : w, p = j === void 0 ? !1 : j, se = E === void 0 ? !1 : E, d = V === void 0 ? !1 : V, ke = O === void 0 ? "light" : O, Ce = ve(null), o = ve(null), [ye, De] = xe(pe), R = I !== void 0, a = R ? I : ye;
+  let T, q;
+  e[18] !== a || e[19] !== d ? (T = () => {
+    o.current && (d ? (o.current.style.height === "0px" || o.current.style.height === "") && a ? (o.current.style.height = `${o.current.scrollHeight}px`, o.current.style.opacity = "1") : a || (o.current.style.opacity = "0", o.current.style.height = "0px", o.current.style.pointerEvents = "none") : (o.current.style.height === "0px" || o.current.style.height === "") && (o.current.style.height = "auto", o.current.style.opacity = "1"));
+  }, q = [o, a, d], e[18] = a, e[19] = d, e[20] = T, e[21] = q) : (T = e[20], q = e[21]), He(T, q);
+  const n = ke === "dark", oe = !!i, ie = !!i && _;
+  let z;
+  e[22] !== v || e[23] !== s || e[24] !== n || e[25] !== oe || e[26] !== ie ? (z = f(t.root, {
+    [t.rootDark]: n,
+    [t.rootDisabled]: s,
+    [t.rootWithCustomArea]: oe,
+    [t.rootWithCustomAreaAbove]: ie
+  }, v), e[22] = v, e[23] = s, e[24] = n, e[25] = oe, e[26] = ie, e[27] = z) : z = e[27];
+  const le = z, ae = !!i;
+  let F;
+  e[28] !== se || e[29] !== ae ? (F = f(t.label, {
+    [t.labelBold]: se,
+    [t.labelWithCustomArea]: ae
+  }), e[28] = se, e[29] = ae, e[30] = F) : F = e[30];
+  const re = F;
+  let G;
+  e[31] !== a || e[32] !== d || e[33] !== l ? (G = () => !d && l ? !0 : !!(d && l && a), e[31] = a, e[32] = d, e[33] = l, e[34] = G) : G = e[34];
+  const J = G, ce = d && !J();
+  let K;
+  e[35] !== J || e[36] !== ce ? (K = f(t.hint, {
+    [t.hintUncheckedHidden]: ce,
+    [t.hintVisible]: J()
+  }), e[35] = J, e[36] = ce, e[37] = K) : K = e[37];
+  const de = K;
+  let L;
+  e[38] !== n ? (L = f(t.input, {
+    [t.inputDark]: n
+  }), e[38] = n, e[39] = L) : L = e[39];
+  const ne = L;
+  let M;
+  e[40] !== p || e[41] !== n ? (M = f(t.radio, {
+    [t.radioDark]: n,
+    [t.radioInvalid]: p
+  }), e[40] = p, e[41] = n, e[42] = M) : M = e[42];
+  const ue = M;
+  let P;
+  e[43] !== s ? (P = f(t.customArea, {
+    [t.customAreaDisabled]: s
+  }), e[43] = s, e[44] = P) : P = e[44];
+  const he = P;
+  let Q;
+  e[45] !== s ? (Q = f(t.customArea, t.customAreaAbove, {
+    [t.customAreaDisabled]: s
+  }), e[45] = s, e[46] = Q) : Q = e[46];
+  const be = Q;
+  let X;
+  e[47] !== s || e[48] !== R || e[49] !== b ? (X = (m) => {
+    if (s) {
+      m.preventDefault();
+      return;
+    }
+    R || De(m.target.checked), b && b(m);
+  }, e[47] = s, e[48] = R, e[49] = b, e[50] = X) : X = e[50];
+  const _e = X;
+  let Y;
+  e[51] !== l || e[52] !== r || e[53] !== c ? (Y = l ? `${Ae(r)}-${Ae(c)}-description` : void 0, e[51] = l, e[52] = r, e[53] = c, e[54] = Y) : Y = e[54];
+  const k = Y;
+  let Z;
+  e[55] !== k || e[56] !== h || e[57] !== p ? (Z = [p && h && `${h}-feedback`, k].filter(Boolean).join(" ") || void 0, e[55] = k, e[56] = h, e[57] = p, e[58] = Z) : Z = e[58];
+  const me = Z;
+  let C;
+  e[59] !== g ? (C = (m) => {
+    typeof g == "function" ? g(m) : g !== null && (g.current = m), Ce.current = m;
+  }, e[59] = g, e[60] = C) : C = e[60];
+  const fe = typeof u == "string" ? u : void 0;
+  let y;
+  e[61] !== me || e[62] !== a || e[63] !== s || e[64] !== _e || e[65] !== ne || e[66] !== r || e[67] !== A || e[68] !== C || e[69] !== fe || e[70] !== c ? (y = /* @__PURE__ */ B("input", { type: "radio", value: c, name: r, className: ne, ref: C, onChange: _e, ...A, disabled: s, checked: a, "aria-label": fe, "aria-describedby": me }), e[61] = me, e[62] = a, e[63] = s, e[64] = _e, e[65] = ne, e[66] = r, e[67] = A, e[68] = C, e[69] = fe, e[70] = c, e[71] = y) : y = e[71];
+  let ee;
+  e[72] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (ee = /* @__PURE__ */ B("div", { className: t.dot }), e[72] = ee) : ee = e[72];
+  let D;
+  e[73] !== ue ? (D = /* @__PURE__ */ B("span", { className: ue, children: ee }), e[73] = ue, e[74] = D) : D = e[74];
+  let N;
+  e[75] !== i || e[76] !== be || e[77] !== _ ? (N = i && _ && /* @__PURE__ */ B("div", { className: be, children: i }), e[75] = i, e[76] = be, e[77] = _, e[78] = N) : N = e[78];
+  let W;
+  e[79] !== i || e[80] !== he || e[81] !== _ ? (W = i && !_ && /* @__PURE__ */ B("div", { className: he, children: i }), e[79] = i, e[80] = he, e[81] = _, e[82] = W) : W = e[82];
+  let x;
+  e[83] !== k || e[84] !== l || e[85] !== de ? (x = /* @__PURE__ */ B("span", { id: k, className: de, ref: o, children: l }), e[83] = k, e[84] = l, e[85] = de, e[86] = x) : x = e[86];
+  let H;
+  e[87] !== u || e[88] !== re || e[89] !== W || e[90] !== x ? (H = /* @__PURE__ */ ge("span", { className: re, children: [
+    u,
+    W,
+    x
+  ] }), e[87] = u, e[88] = re, e[89] = W, e[90] = x, e[91] = H) : H = e[91];
+  let te;
+  return e[92] !== le || e[93] !== y || e[94] !== D || e[95] !== N || e[96] !== H ? (te = /* @__PURE__ */ ge("label", { className: le, children: [
+    y,
+    D,
+    N,
+    H
+  ] }), e[92] = le, e[93] = y, e[94] = D, e[95] = N, e[96] = H, e[97] = te) : te = e[97], te;
+});
+Pe.displayName = "DSRadio";
+export {
+  Pe as DSRadio
+};

package/{radiogroup.wqgExwrG.js → radiogroup.mc-8lw65.js}

@@ -3,9 +3,9 @@ import "react/jsx-runtime";
 import "./chunks/index.cKLI89Eg.js";
 import "./chunks/index.DQOqod3i.js";
 import "react";
-import "./chunks/Fieldset.DOjI3DlI.js";
-import "./radio.KQ8CUM3_.js";
-import { D as s } from "./chunks/RadioGroup.Bh2X6pT9.js";
+import "./chunks/Fieldset.BBMuLKps.js";
+import "./radio.DjToa2aV.js";
+import { D as s } from "./chunks/RadioGroup.CO91_5hA.js";
 export {
   s as DSRadioGroup
 };

package/{scroller.Dqnsxq2M.js → scroller.CgWp2WXG.js}

@@ -2,11 +2,10 @@
 import { jsxs as H, jsx as i } from "react/jsx-runtime";
 import { c as a } from "./chunks/index.DQOqod3i.js";
 import { forwardRef as I, useState as _, useRef as d } from "react";
-import { i as v, g as S } from "./chunks/is-animation-disabled.B-V_68K-.js";
+import { D as v } from "./chunks/Button.CCol--xy.js";
+import { u as S } from "./chunks/useIsomorphicLayoutEffect.CnJ9AMFS.js";
 import { g as W } from "./chunks/helpers.CexwVao7.js";
-import { u as R } from "./chunks/useIsomorphicLayoutEffect.CnJ9AMFS.js";
-import "./chunks/index.cKLI89Eg.js";
-import { D as L } from "./chunks/Button.COycNYUI.js";
+import { i as R, g as L } from "./chunks/is-animation-disabled.B-V_68K-.js";
 import './assets/scroller.BGlPnnPD.css';function P(...u) {
   return (l) => {
     for (const s of u)
@@ -31,12 +30,12 @@ const T = "ds-scroller_root_3ktti_1", M = "ds-scroller_scroll-wrapper_3ktti_6",
   const [m, w] = _(!1), [p, N] = _(!1), c = d(null), t = d(null), y = d(!1), f = () => {
     g();
   };
-  R(() => {
+  S(() => {
     const r = new ResizeObserver(f);
     return t.current && r.observe(t.current), () => {
       r.disconnect();
     };
-  }, []), R(() => {
+  }, []), S(() => {
     const r = [
       // utility large bold -- assuming that it is used with DSButton or DSLinkButton variant="navigation"
       "18px 'STIHL Contraface Digital Text Bold'"
@@ -52,18 +51,18 @@ const T = "ds-scroller_root_3ktti_1", M = "ds-scroller_scroll-wrapper_3ktti_6",
   const D = () => {
     t.current && n?.scrollPosition && t.current.scrollTo({
       left: n.scrollPosition,
-      behavior: v() || !n.isSmooth ? "instant" : "smooth"
+      behavior: R() || !n.isSmooth ? "instant" : "smooth"
     });
   }, g = () => {
     if (t.current && c.current) {
-      const r = S(t.current), e = S(c.current);
+      const r = L(t.current), e = L(c.current);
       w(e.left < r.left), N(e.right > r.right + 4);
     }
   }, b = (r) => {
     const e = z(r);
     t.current?.scrollTo({
       left: e,
-      behavior: v() ? "instant" : "smooth"
+      behavior: R() ? "instant" : "smooth"
     });
   }, z = (r) => {
     if (!c.current || !t.current)
@@ -84,10 +83,10 @@ const T = "ds-scroller_root_3ktti_1", M = "ds-scroller_scroll-wrapper_3ktti_6",
         children: /* @__PURE__ */ i("div", { className: C, ref: c, children: u })
       }
     ),
-    /* @__PURE__ */ i(L, { variant: "filled", className: a(o.scrollButton, h, {
+    /* @__PURE__ */ i(v, { variant: "filled", className: a(o.scrollButton, h, {
       [o.scrollButtonHidden]: !m
     }), hideLabel: !0, iconName: "chevron-left", tabIndex: -1, size: "small", type: "button", onClick: () => b("prev"), children: "Left" }),
-    /* @__PURE__ */ i(L, { variant: "filled", className: a(o.scrollButton, o.scrollButtonRight, h, {
+    /* @__PURE__ */ i(v, { variant: "filled", className: a(o.scrollButton, o.scrollButtonRight, h, {
       [o.scrollButtonHidden]: !p
     }), hideLabel: !0, iconName: "chevron-right", tabIndex: -1, size: "small", type: "button", onClick: () => b("next"), children: "Right" })
   ] });

package/{select.DkKuGI6O.js → select.DTZ6a6Ag.js}

@@ -2,13 +2,12 @@
 import "react/jsx-runtime";
 import "./chunks/index.DQOqod3i.js";
 import "react";
-import "./chunks/useBreakpoint.1txsny17.js";
-import "./chunks/index.cKLI89Eg.js";
 import "./asterisk.Dwtdwpkq.js";
 import "./chunks/Icon.DYtaQgbw.js";
-import "./chunks/Popover.ByaoNwGK.js";
-import "./chunks/SystemFeedback.4osheYxC.js";
-import { D as S } from "./chunks/Select.KWb09VmF.js";
+import "./chunks/Popover.CxZZ_y1Z.js";
+import "./chunks/SystemFeedback.DhWcYjnu.js";
+import { D } from "./chunks/Select.EzoMdk1u.js";
+import "./chunks/useBreakpoint.1txsny17.js";
 export {
-  S as DSSelect
+  D as DSSelect
 };

package/{skeleton.DUkBgXxO.js → skeleton.CNJdNVav.js}

@@ -1,8 +1,8 @@
 "use client";
 import { jsx as _ } from "react/jsx-runtime";
 import { d as v } from "./chunks/index.cKLI89Eg.js";
-import { c as L } from "./chunks/index.DQOqod3i.js";
-import './assets/skeleton.BjozXDiQ.css';const M = "ds-skeleton_line_q6f73_26", N = "ds-skeleton_shimmer-slide_q6f73_1", C = "ds-skeleton_line--title-x-large_q6f73_57", z = "ds-skeleton_line--title-large_q6f73_60", W = "ds-skeleton_line--heading-x-large_q6f73_63", w = "ds-skeleton_line--heading-large_q6f73_66", $ = "ds-skeleton_line--heading-medium_q6f73_69", j = "ds-skeleton_line--heading-small_q6f73_72", A = "ds-skeleton_line--text-large_q6f73_75", E = "ds-skeleton_line--text-medium_q6f73_78", b = "ds-skeleton_line--text-small_q6f73_81", B = "ds-skeleton_line--text-x-small_q6f73_84", F = "ds-skeleton_line--text-xx-small_q6f73_87", G = "ds-skeleton_line--utility-large_q6f73_90", I = "ds-skeleton_line--utility-medium_q6f73_93", J = "ds-skeleton_line--utility-small_q6f73_96", K = "ds-skeleton_line--utility-x-small-demi_q6f73_99", O = "ds-skeleton_line--heading-x-large-uppercase_q6f73_106", P = "ds-skeleton_line--heading-large-uppercase_q6f73_109", Q = "ds-skeleton_line--theme-dark_q6f73_113", R = "ds-skeleton_multi-line-wrapper_q6f73_143", V = "ds-skeleton_multi-line_q6f73_143", Y = "ds-skeleton_multi-line--title-x-large_q6f73_182", Z = "ds-skeleton_multi-line--title-large_q6f73_185", ee = "ds-skeleton_multi-line--heading-x-large_q6f73_188", le = "ds-skeleton_multi-line--heading-large_q6f73_191", ie = "ds-skeleton_multi-line--heading-medium_q6f73_194", te = "ds-skeleton_multi-line--heading-small_q6f73_197", ne = "ds-skeleton_multi-line--text-large_q6f73_200", se = "ds-skeleton_multi-line--text-medium_q6f73_203", ae = "ds-skeleton_multi-line--text-small_q6f73_206", me = "ds-skeleton_multi-line--text-x-small_q6f73_209", _e = "ds-skeleton_multi-line--text-xx-small_q6f73_212", de = "ds-skeleton_multi-line--utility-large_q6f73_215", re = "ds-skeleton_multi-line--utility-medium_q6f73_218", ue = "ds-skeleton_multi-line--utility-small_q6f73_221", oe = "ds-skeleton_multi-line--utility-x-small-demi_q6f73_224", ge = "ds-skeleton_multi-line--heading-x-large-uppercase_q6f73_231", ce = "ds-skeleton_multi-line--heading-large-uppercase_q6f73_234", ke = "ds-skeleton_multi-line--theme-dark_q6f73_238", xe = "ds-skeleton_rectangle_q6f73_268", fe = "ds-skeleton_rectangle--theme-dark_q6f73_299", qe = "ds-skeleton_circle_q6f73_329", Le = "ds-skeleton_circle--theme-dark_q6f73_361", s = {
+import { c as h } from "./chunks/index.DQOqod3i.js";
+import './assets/skeleton.BjozXDiQ.css';const M = "ds-skeleton_line_q6f73_26", N = "ds-skeleton_shimmer-slide_q6f73_1", C = "ds-skeleton_line--title-x-large_q6f73_57", z = "ds-skeleton_line--title-large_q6f73_60", W = "ds-skeleton_line--heading-x-large_q6f73_63", w = "ds-skeleton_line--heading-large_q6f73_66", $ = "ds-skeleton_line--heading-medium_q6f73_69", j = "ds-skeleton_line--heading-small_q6f73_72", A = "ds-skeleton_line--text-large_q6f73_75", E = "ds-skeleton_line--text-medium_q6f73_78", b = "ds-skeleton_line--text-small_q6f73_81", B = "ds-skeleton_line--text-x-small_q6f73_84", F = "ds-skeleton_line--text-xx-small_q6f73_87", G = "ds-skeleton_line--utility-large_q6f73_90", I = "ds-skeleton_line--utility-medium_q6f73_93", J = "ds-skeleton_line--utility-small_q6f73_96", K = "ds-skeleton_line--utility-x-small-demi_q6f73_99", O = "ds-skeleton_line--heading-x-large-uppercase_q6f73_106", P = "ds-skeleton_line--heading-large-uppercase_q6f73_109", Q = "ds-skeleton_line--theme-dark_q6f73_113", R = "ds-skeleton_multi-line-wrapper_q6f73_143", V = "ds-skeleton_multi-line_q6f73_143", Y = "ds-skeleton_multi-line--title-x-large_q6f73_182", Z = "ds-skeleton_multi-line--title-large_q6f73_185", ee = "ds-skeleton_multi-line--heading-x-large_q6f73_188", le = "ds-skeleton_multi-line--heading-large_q6f73_191", ie = "ds-skeleton_multi-line--heading-medium_q6f73_194", te = "ds-skeleton_multi-line--heading-small_q6f73_197", ne = "ds-skeleton_multi-line--text-large_q6f73_200", se = "ds-skeleton_multi-line--text-medium_q6f73_203", ae = "ds-skeleton_multi-line--text-small_q6f73_206", me = "ds-skeleton_multi-line--text-x-small_q6f73_209", _e = "ds-skeleton_multi-line--text-xx-small_q6f73_212", de = "ds-skeleton_multi-line--utility-large_q6f73_215", re = "ds-skeleton_multi-line--utility-medium_q6f73_218", ue = "ds-skeleton_multi-line--utility-small_q6f73_221", oe = "ds-skeleton_multi-line--utility-x-small-demi_q6f73_224", ge = "ds-skeleton_multi-line--heading-x-large-uppercase_q6f73_231", ce = "ds-skeleton_multi-line--heading-large-uppercase_q6f73_234", ke = "ds-skeleton_multi-line--theme-dark_q6f73_238", xe = "ds-skeleton_rectangle_q6f73_268", fe = "ds-skeleton_rectangle--theme-dark_q6f73_299", qe = "ds-skeleton_circle_q6f73_329", he = "ds-skeleton_circle--theme-dark_q6f73_361", s = {
   line: M,
   "shimmer-slide": "ds-skeleton_shimmer-slide_q6f73_1",
   shimmerSlide: N,
@@ -87,22 +87,22 @@ import './assets/skeleton.BjozXDiQ.css';const M = "ds-skeleton_line_q6f73_26", N
   rectangleThemeDark: fe,
   circle: qe,
   "circle--theme-dark": "ds-skeleton_circle--theme-dark_q6f73_361",
-  circleThemeDark: Le
-}, Te = (h) => {
+  circleThemeDark: he
+}, Te = (L) => {
   const e = v.c(39);
   let i, t, d, r, u, o;
-  e[0] !== h ? ({
+  e[0] !== L ? ({
     className: i,
     textSize: d,
     textLineCount: r,
     theme: u,
     variant: o,
     ...t
-  } = h, e[0] = h, e[1] = i, e[2] = t, e[3] = d, e[4] = r, e[5] = u, e[6] = o) : (i = e[1], t = e[2], d = e[3], r = e[4], u = e[5], o = e[6]);
+  } = L, e[0] = L, e[1] = i, e[2] = t, e[3] = d, e[4] = r, e[5] = u, e[6] = o) : (i = e[1], t = e[2], d = e[3], r = e[4], u = e[5], o = e[6]);
   const g = d === void 0 ? "text-medium" : d, U = r === void 0 ? 3 : r, X = u === void 0 ? "light" : u, k = o === void 0 ? "single-line" : o, p = g.startsWith("title-"), n = X === "dark";
   if (k === "rectangle") {
     let l;
-    e[7] !== i || e[8] !== n ? (l = L(s.rectangle, i, {
+    e[7] !== i || e[8] !== n ? (l = h(s.rectangle, i, {
       [s.rectangleThemeDark]: n
     }), e[7] = i, e[8] = n, e[9] = l) : l = e[9];
     let a;
@@ -110,7 +110,7 @@ import './assets/skeleton.BjozXDiQ.css';const M = "ds-skeleton_line_q6f73_26", N
   }
   if (k === "circle") {
     let l;
-    e[13] !== i || e[14] !== n ? (l = L(s.circle, i, {
+    e[13] !== i || e[14] !== n ? (l = h(s.circle, i, {
       [s.circleThemeDark]: n
     }), e[13] = i, e[14] = n, e[15] = l) : l = e[15];
     let a;
@@ -118,7 +118,7 @@ import './assets/skeleton.BjozXDiQ.css';const M = "ds-skeleton_line_q6f73_26", N
   }
   const y = g ? s[`line--${g}`] : void 0;
   let x;
-  e[19] !== i || e[20] !== n || e[21] !== y ? (x = L(s.line, y, i, {
+  e[19] !== i || e[20] !== n || e[21] !== y ? (x = h(s.line, y, i, {
     [s.lineThemeDark]: n
   }), e[19] = i, e[20] = n, e[21] = y, e[22] = x) : x = e[22];
   const T = x;
@@ -130,7 +130,7 @@ import './assets/skeleton.BjozXDiQ.css';const M = "ds-skeleton_line_q6f73_26", N
   let f;
   if (e[26] !== n || e[27] !== S || e[28] !== c) {
     let l;
-    e[30] !== n || e[31] !== c ? (l = (a, D) => /* @__PURE__ */ _("div", { className: L(s.multiLine, c, {
+    e[30] !== n || e[31] !== c ? (l = (a, D) => /* @__PURE__ */ _("div", { className: h(s.multiLine, c, {
       [s.multiLineThemeDark]: n
     }) }, D), e[30] = n, e[31] = c, e[32] = l) : l = e[32], f = Array.from({
       length: S

package/{skiptocontent.CRQywi6J.js → skiptocontent.BsRpWvyu.js}

@@ -2,13 +2,13 @@
 import { jsx as u } from "react/jsx-runtime";
 import { d as g } from "./chunks/index.cKLI89Eg.js";
 import { c as w } from "./chunks/index.DQOqod3i.js";
+import { D as T } from "./chunks/LinkButton.BxG7fx1O.js";
+import { forwardRef as _ } from "react";
 import { g as S } from "./chunks/helpers.CexwVao7.js";
-import { forwardRef as T } from "react";
-import { D as _ } from "./chunks/LinkButton.BCHTLFMJ.js";
 import './assets/skiptocontent.CTSDC_kG.css';const v = "ds-skip-to-content_root_uqkjt_1", C = "ds-skip-to-content_root--dark_uqkjt_8", D = {
   root: v,
   rootDark: C
-}, E = T((m, d) => {
+}, E = _((m, d) => {
   const t = g.c(16);
   let o, e, s, r, n;
   t[0] !== m ? ({
@@ -27,7 +27,7 @@ import './assets/skiptocontent.CTSDC_kG.css';const v = "ds-skip-to-content_root_
   }), t[6] = o, t[7] = p, t[8] = l) : l = t[8];
   const k = l, f = `#${a}`;
   let c;
-  return t[9] !== h || t[10] !== d || t[11] !== e || t[12] !== k || t[13] !== f || t[14] !== i ? (c = /* @__PURE__ */ u(_, { ...e, className: k, href: f, theme: i, ref: d, children: h }), t[9] = h, t[10] = d, t[11] = e, t[12] = k, t[13] = f, t[14] = i, t[15] = c) : c = t[15], c;
+  return t[9] !== h || t[10] !== d || t[11] !== e || t[12] !== k || t[13] !== f || t[14] !== i ? (c = /* @__PURE__ */ u(T, { ...e, className: k, href: f, theme: i, ref: d, children: h }), t[9] = h, t[10] = d, t[11] = e, t[12] = k, t[13] = f, t[14] = i, t[15] = c) : c = t[15], c;
 });
 E.displayName = "DSSkipToContent";
 export {

package/{slider.BOjqQp9n.js → slider.BMGAihY0.js}

@@ -3,10 +3,10 @@ import "react/jsx-runtime";
 import "./chunks/index.cKLI89Eg.js";
 import "./chunks/index.DQOqod3i.js";
 import "react";
+import "./input.Dh0ws-9j.js";
+import "./chunks/Popover.CxZZ_y1Z.js";
+import { D } from "./chunks/Slider.CX38t4Sk.js";
 import "./chunks/useBreakpoint.1txsny17.js";
-import "./input.ChMzyHej.js";
-import "./chunks/Popover.ByaoNwGK.js";
-import { D } from "./chunks/Slider.CxnIy51F.js";
 export {
   D as DSSlider
 };

package/{step.C6zDRCBu.js → step.DCQ6CawJ.js}

@@ -3,7 +3,7 @@ import { jsx as o, jsxs as O } from "react/jsx-runtime";
 import { d as V } from "./chunks/index.cKLI89Eg.js";
 import { c as L } from "./chunks/index.DQOqod3i.js";
 import "react";
-import { D as P } from "./chunks/Button.COycNYUI.js";
+import { D as P } from "./chunks/Button.CCol--xy.js";
 import { D as A } from "./chunks/Icon.DYtaQgbw.js";
 import './assets/step.DOAmuuEQ.css';const E = "ds-stepper_step_1x7q2_1", I = "ds-stepper_step-content_1x7q2_5", R = "ds-stepper_step-button_1x7q2_12", w = "ds-stepper_step-button--horizontal_1x7q2_49", F = "ds-stepper_step-button--vertical_1x7q2_58", G = "ds-stepper_step-button--current_1x7q2_69", J = "ds-stepper_step-button--completed_1x7q2_107", K = "ds-stepper_step-button--disabled_1x7q2_135", M = "ds-stepper_step-number_1x7q2_166", Q = "ds-stepper_step-label_1x7q2_176", T = "ds-stepper_step-hint_1x7q2_184", U = "ds-stepper_step-number--current_1x7q2_213", W = "ds-stepper_step-label--current_1x7q2_239", X = "ds-stepper_sr-only_1x7q2_268", s = {
   step: E,

package/stepper.D7-7BdSv.js

@@ -0,0 +1,15 @@
+"use client";
+import "react/jsx-runtime";
+import "./chunks/index.DQOqod3i.js";
+import "react";
+import "./chunks/AriaLiveRegions.utils.xoETe2Ps.js";
+import "./scroller.CgWp2WXG.js";
+import { D as f } from "./chunks/Stepper.Ds_aIEF8.js";
+import "./step.DCQ6CawJ.js";
+import "./chunks/translate.DSb-TdWR.js";
+import "./chunks/useIsomorphicLayoutEffect.CnJ9AMFS.js";
+import "./chunks/helpers.CexwVao7.js";
+import "./chunks/is-animation-disabled.B-V_68K-.js";
+export {
+  f as DSStepper
+};

package/styles/scss/ds/index.scss

@@ -1,4 +1,5 @@
 @forward 'lib/animation';
+@forward 'lib/border-width';
 @forward 'lib/breakpoints';
 @forward 'lib/container-query';
 @forward 'lib/grid';
@@ -12,6 +13,7 @@
 @forward 'lib/link';
 @forward 'lib/link-button';
 @forward 'lib/media-query';
+@forward 'lib/radius';
 @forward 'lib/shadow';
 @forward 'lib/spacing-dynamic';
 @forward 'lib/spacing-rem';

package/styles/scss/ds/lib/border-width.scss

@@ -0,0 +1,3 @@
+$border-width-1: 1px;
+$border-width-2: 2px;
+$border-width-4: 4px;

package/styles/scss/ds/lib/ds-internal/_input.scss

@@ -1,18 +1,24 @@
+@use '../border-width' as *;
 @use '_focus' as *;
 @use '_helpers' as *;
 @use '_high-contrast' as *;
 @use '_hover' as *;
 @use '../spacing' as *;
 @use '../spacing-rem' as *;
+@use '../radius' as *;
 @use '../text' as *;
 @use '../theme' as *;
 @use '../transition' as *;
 
-@mixin input-label-base($hasHint: false) {
+@mixin input-label-base($hasHint: false, $theme: 'light') {
   @include utility-medium;
   display: block;
   min-height: $spacing-24-rem;
 
+  @if $theme == 'dark' {
+    color: $theme-dark-content-color-primary;
+  }
+
   
   &:has(input) {
     padding-block-start: $spacing-2;
@@ -68,14 +74,18 @@
   }
 }
 
-@mixin input-hint-base() {
+@mixin input-hint-base($theme: 'light') {
   @include utility-small;
   display: block;
   max-width: 25.5rem;
   margin-block-end: $spacing-8;
+
+  @if $theme == 'dark' {
+    color: $theme-dark-content-color-primary;
+  }
 }
 
-@mixin input-base($size) {
+@mixin input-base($size, $theme: 'light') {
   @if ($size == 'medium') {
     
     @include utility-medium;
@@ -95,12 +105,16 @@
   }
 
   
-  @include focus($offset: 0, $thickness: $spacing-1);
+  @include focus($theme: $theme, $offset: 0, $thickness: $spacing-1);
   @include transition((background-color, color));
 
   @include hover-media-query {
     &:hover {
-      background: $theme-light-background-color-transparent-hover;
+      @if $theme == 'light' {
+        background: $theme-light-background-color-transparent-hover;
+      } @else {
+        background: $theme-dark-background-color-transparent-hover;
+      }
       @include high-contrast-media-query {
         border-color: Highlight;
       }
@@ -109,31 +123,50 @@
 
   & {
     background: transparent;
-    border: $spacing-1 solid $theme-light-border-color-primary;
-    border-radius: 0;
-    color: $theme-light-content-color-primary;
+    border-radius: $radius-none;
     width: 100%;
+    @if $theme == 'light' {
+      border: $border-width-1 solid $theme-light-border-color-primary;
+      color: $theme-light-content-color-primary;
+    } @else {
+      border: $border-width-1 solid $theme-dark-border-color-primary;
+      color: $theme-dark-content-color-primary;
+    }
   }
 
   &[readonly] {
-    background-color: $theme-light-background-color-tertiary;
     border-color: transparent;
-    color: $theme-light-content-color-primary;
+    @if $theme == 'light' {
+      background-color: $theme-light-background-color-tertiary;
+      color: $theme-light-content-color-primary;
+    } @else {
+      background-color: $theme-dark-background-color-tertiary;
+      color: $theme-dark-content-color-primary;
+    }
 
-    @include focus($offset: 0, $thickness: $spacing-2);
+    @include focus($theme: $theme, $offset: 0, $thickness: $spacing-2);
   }
 
   &:disabled {
     background-color: transparent;
-    border-color: $theme-light-border-color-primary-disabled;
-    color: $theme-light-content-color-primary-disabled;
     cursor: not-allowed;
+    @if $theme == 'light' {
+      border-color: $theme-light-border-color-primary-disabled;
+      color: $theme-light-content-color-primary-disabled;
+    } @else {
+      border-color: $theme-dark-border-color-primary-disabled;
+      color: $theme-dark-content-color-primary-disabled;
+    }
   }
 
   &::-webkit-placeholder,
   &::placeholder {
-    color: $theme-light-content-color-secondary;
     opacity: 1;
+    @if $theme == 'light' {
+      color: $theme-light-content-color-secondary;
+    } @else {
+      color: $theme-dark-content-color-secondary;
+    }
   }
 
   
@@ -185,13 +218,24 @@
   }
 }
 
-@mixin input-invalid() {
-  border-color: $theme-light-border-color-feedback-error;
-  outline-color: $theme-light-border-color-feedback-error;
+@mixin input-invalid($theme: 'light') {
+  @if $theme == 'light' {
+    border-color: $theme-light-border-color-feedback-error;
+    outline-color: $theme-light-border-color-feedback-error;
 
-  &:active,
-  &:focus,
-  &:focus-visible {
-    border-color: $theme-light-border-color-primary;
+    &:active,
+    &:focus,
+    &:focus-visible {
+      border-color: $theme-light-border-color-primary;
+    }
+  } @else {
+    border-color: $theme-dark-border-color-feedback-error;
+    outline-color: $theme-dark-border-color-feedback-error;
+
+    &:active,
+    &:focus,
+    &:focus-visible {
+      border-color: $theme-dark-border-color-primary;
+    }
   }
 }