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

package/chunks/Select.D2ehd4yN.js

@@ -0,0 +1,162 @@
+"use client";
+import { jsx as v, jsxs as ge } from "react/jsx-runtime";
+import { d as xe } from "./index.CgTHIF3K.js";
+import { c as he } from "./index.CEyLAtio.js";
+import { forwardRef as Be, useRef as Fe, useState as Ee, useEffect as He } from "react";
+import { u as Re } from "./useBreakpoint.CMOR9ZOB.js";
+import { Asterisk as je } from "../asterisk.CR60hx8S.js";
+import { D as We } from "./Icon.NSsVrYeq.js";
+import { D as ze } from "./SystemFeedback.CyGbUCzT.js";
+import { g as me, r as Me } from "./helpers.BbWkXTr3.js";
+import '../assets/Select.C1gWF32A.css';const Te = "ds-select_root_17q4p_1", Oe = "ds-select_hint_17q4p_10", Ze = "ds-select_label_17q4p_10", Je = "ds-select_label--hidden_17q4p_131", Ke = "ds-select_label--disabled_17q4p_144", Qe = "ds-select_feedback_17q4p_164", Ue = "ds-select_select-wrapper_17q4p_169", Xe = "ds-select_select_17q4p_169", Ye = "ds-select_select--small_17q4p_183", Ge = "ds-select_select--invalid_17q4p_295", el = "ds-select_select--placeholder_17q4p_410", ll = "ds-select_chevron_17q4p_449", tl = "ds-select_chevron--small_17q4p_453", sl = "ds-select_chevron--disabled_17q4p_456", t = {
+  root: Te,
+  hint: Oe,
+  label: Ze,
+  labelHidden: Je,
+  labelDisabled: Ke,
+  feedback: Qe,
+  selectWrapper: Ue,
+  select: Xe,
+  selectSmall: Ye,
+  selectInvalid: Ge,
+  selectPlaceholder: el,
+  chevron: ll,
+  chevronSmall: tl,
+  chevronDisabled: sl
+}, _l = ["medium", "small"], al = ({
+  id: n,
+  label: s,
+  options: e
+}) => {
+  if (!n)
+    throw new Error(me("DSSelect", 'A unique "id" prop is required. Please add a unique "id" prop to the DSSelect component.'));
+  if (!s)
+    throw new Error(me("DSSelect", `A label is always required for a11y reasons. Please add a descriptive "label" prop to the DSSelect component. If you don't want to display a label, set hideLabel={true}.`));
+  if (Array.isArray(e)) {
+    if (e.length === 0)
+      throw new Error(me("DSSelect", "The options array must not be empty."));
+  } else throw new Error(me("DSSelect", Me("options", "DSSelect")));
+}, ol = (n, s, e) => n === "" || s !== void 0 && s !== "" ? !1 : !(e !== void 0 && e !== ""), cl = Be((n, s) => {
+  const e = xe.c(127);
+  let i, d, r, l, p, f, S, q, a, Z, J, K, Q, U, X, c;
+  e[0] !== n ? ({
+    id: l,
+    label: p,
+    options: S,
+    className: i,
+    defaultValue: d,
+    disabled: Z,
+    hideLabel: J,
+    hint: r,
+    invalid: K,
+    placeholder: Q,
+    required: U,
+    size: X,
+    systemFeedback: a,
+    value: c,
+    onChange: f,
+    ...q
+  } = n, e[0] = n, e[1] = i, e[2] = d, e[3] = r, e[4] = l, e[5] = p, e[6] = f, e[7] = S, e[8] = q, e[9] = a, e[10] = Z, e[11] = J, e[12] = K, e[13] = Q, e[14] = U, e[15] = X, e[16] = c) : (i = e[1], d = e[2], r = e[3], l = e[4], p = e[5], f = e[6], S = e[7], q = e[8], a = e[9], Z = e[10], J = e[11], K = e[12], Q = e[13], U = e[14], X = e[15], c = e[16]);
+  const b = Z === void 0 ? !1 : Z, Ie = J === void 0 ? !1 : J, o = K === void 0 ? !1 : K, D = Q === void 0 ? "Select" : Q, y = U === void 0 ? !1 : U, le = X === void 0 ? "medium" : X;
+  process.env.NODE_ENV !== "production" && al({
+    id: l,
+    label: p,
+    options: S
+  });
+  const Pe = Fe(null), [ue, we] = Ee(c);
+  let te;
+  e[17] !== d || e[18] !== D || e[19] !== c ? (te = ol(D, d, c), e[17] = d, e[18] = D, e[19] = c, e[20] = te) : te = e[20];
+  const [Y, Ce] = Ee(te);
+  let se, ae;
+  e[21] !== c ? (se = () => {
+    we(c);
+  }, ae = [c], e[21] = c, e[22] = se, e[23] = ae) : (se = e[22], ae = e[23]), He(se, ae);
+  let oe;
+  e[24] !== s ? (oe = (ee) => {
+    Pe.current = ee, typeof s == "function" ? s(ee) : s && (s.current = ee);
+  }, e[24] = s, e[25] = oe) : oe = e[25];
+  const _e = oe, G = Re(Ie), g = `${l}-label`, h = `${l}-feedback`, w = `${l}-hint`, ve = r ? ` ${w}` : "";
+  let ce;
+  e[26] !== o || e[27] !== a || e[28] !== h ? (ce = [o && a && h].filter(Boolean).join(" ") || void 0, e[26] = o, e[27] = a, e[28] = h, e[29] = ce) : ce = e[29];
+  const Se = ce;
+  let N, k, E, I, P, C, $, L, V, A, x, B, F, H, R, j, m, u, _;
+  if (e[30] !== Se || e[31] !== ve || e[32] !== i || e[33] !== d || e[34] !== b || e[35] !== _e || e[36] !== G || e[37] !== r || e[38] !== w || e[39] !== l || e[40] !== o || e[41] !== Y || e[42] !== p || e[43] !== f || e[44] !== S || e[45] !== D || e[46] !== y || e[47] !== q || e[48] !== g || e[49] !== ue || e[50] !== le || e[51] !== a || e[52] !== h) {
+    const ee = (be) => [D && /* @__PURE__ */ v("option", { value: "", children: D }, `${l}-hidden-option-disabled-placeholder`), ...be.map((O) => {
+      if ("options" in O) {
+        const {
+          label: ke,
+          options: Ae
+        } = O;
+        return /* @__PURE__ */ v("optgroup", { label: ke, children: Ae.map(Ne) }, ke);
+      } else
+        return Ne(O);
+    })], Ne = il;
+    let re;
+    e[72] !== i ? (re = he(t.root, i), e[72] = i, e[73] = re) : re = e[73];
+    const $e = re, De = le === "small";
+    let ne;
+    e[74] !== o || e[75] !== Y || e[76] !== De ? (ne = he(t.select, {
+      [t.selectSmall]: De,
+      [t.selectInvalid]: o,
+      [t.selectPlaceholder]: Y
+    }), e[74] = o, e[75] = Y, e[76] = De, e[77] = ne) : ne = e[77];
+    const Le = ne;
+    let de;
+    e[78] !== b || e[79] !== G ? (de = he(t.label, {
+      [t.labelHidden]: G,
+      [t.labelDisabled]: b
+    }), e[78] = b, e[79] = G, e[80] = de) : de = e[80];
+    const qe = de, ye = le === "small";
+    let pe;
+    e[81] !== b || e[82] !== ye ? (pe = he(t.chevron, {
+      [t.chevronSmall]: ye,
+      [t.chevronDisabled]: b
+    }), e[81] = b, e[82] = ye, e[83] = pe) : pe = e[83], N = pe;
+    let fe;
+    e[84] !== f ? (fe = (be) => {
+      const {
+        value: O
+      } = be.target;
+      Ce(O === ""), we(O), f && f(be);
+    }, e[84] = f, e[85] = fe) : fe = e[85];
+    const Ve = fe;
+    j = $e;
+    let T;
+    e[86] !== y ? (T = y && /* @__PURE__ */ v(je, {}), e[86] = y, e[87] = T) : T = e[87], e[88] !== l || e[89] !== p || e[90] !== qe || e[91] !== g || e[92] !== T ? (m = /* @__PURE__ */ ge("label", { className: qe, id: g, htmlFor: l, children: [
+      p,
+      T
+    ] }), e[88] = l, e[89] = p, e[90] = qe, e[91] = g, e[92] = T, e[93] = m) : m = e[93], e[94] !== r || e[95] !== w ? (u = r && /* @__PURE__ */ v("div", { className: t.hint, id: w, children: r }), e[94] = r, e[95] = w, e[96] = u) : u = e[96], e[97] !== o || e[98] !== a || e[99] !== h ? (_ = o && a && /* @__PURE__ */ v(ze, { className: t.feedback, message: a, variant: "error", id: h }), e[97] = o, e[98] = a, e[99] = h, e[100] = _) : _ = e[100], R = t.selectWrapper, k = q, E = l, I = _e, P = Le, C = `${g}${ve}`, $ = Se, L = o, V = d, A = ue, x = b, B = y, F = Ve, H = ee(S), e[30] = Se, e[31] = ve, e[32] = i, e[33] = d, e[34] = b, e[35] = _e, e[36] = G, e[37] = r, e[38] = w, e[39] = l, e[40] = o, e[41] = Y, e[42] = p, e[43] = f, e[44] = S, e[45] = D, e[46] = y, e[47] = q, e[48] = g, e[49] = ue, e[50] = le, e[51] = a, e[52] = h, e[53] = N, e[54] = k, e[55] = E, e[56] = I, e[57] = P, e[58] = C, e[59] = $, e[60] = L, e[61] = V, e[62] = A, e[63] = x, e[64] = B, e[65] = F, e[66] = H, e[67] = R, e[68] = j, e[69] = m, e[70] = u, e[71] = _;
+  } else
+    N = e[53], k = e[54], E = e[55], I = e[56], P = e[57], C = e[58], $ = e[59], L = e[60], V = e[61], A = e[62], x = e[63], B = e[64], F = e[65], H = e[66], R = e[67], j = e[68], m = e[69], u = e[70], _ = e[71];
+  let W;
+  e[101] !== k || e[102] !== E || e[103] !== I || e[104] !== P || e[105] !== C || e[106] !== $ || e[107] !== L || e[108] !== V || e[109] !== A || e[110] !== x || e[111] !== B || e[112] !== F || e[113] !== H ? (W = /* @__PURE__ */ v("select", { ...k, id: E, ref: I, className: P, "aria-labelledby": C, "aria-describedby": $, "aria-invalid": L, defaultValue: V, value: A, disabled: x, required: B, onChange: F, children: H }), e[101] = k, e[102] = E, e[103] = I, e[104] = P, e[105] = C, e[106] = $, e[107] = L, e[108] = V, e[109] = A, e[110] = x, e[111] = B, e[112] = F, e[113] = H, e[114] = W) : W = e[114];
+  let z;
+  e[115] !== N ? (z = /* @__PURE__ */ v(We, { name: "chevron-down", className: N, "aria-hidden": "true" }), e[115] = N, e[116] = z) : z = e[116];
+  let M;
+  e[117] !== R || e[118] !== W || e[119] !== z ? (M = /* @__PURE__ */ ge("div", { className: R, children: [
+    W,
+    z
+  ] }), e[117] = R, e[118] = W, e[119] = z, e[120] = M) : M = e[120];
+  let ie;
+  return e[121] !== j || e[122] !== m || e[123] !== u || e[124] !== _ || e[125] !== M ? (ie = /* @__PURE__ */ ge("div", { className: j, children: [
+    m,
+    u,
+    _,
+    M
+  ] }), e[121] = j, e[122] = m, e[123] = u, e[124] = _, e[125] = M, e[126] = ie) : ie = e[126], ie;
+});
+cl.displayName = "DSSelect";
+function il(n) {
+  const {
+    label: s,
+    value: e,
+    isDisabled: i
+  } = n;
+  return /* @__PURE__ */ v("option", { value: e, disabled: i, children: s }, e);
+}
+export {
+  cl as D,
+  _l as S,
+  ol as g,
+  al as v
+};

package/chunks/{Slider.kyVr7BLk.js → Slider.84lkgq3W.js}

@@ -1,22 +1,22 @@
 "use client";
 import { jsx as b, jsxs as Se } from "react/jsx-runtime";
-import { d as rt } from "./index.CgTHIF3K.js";
-import { c as T } from "./index.CEyLAtio.js";
+import { d as nt } from "./index.CgTHIF3K.js";
+import { c as v } from "./index.CEyLAtio.js";
 import { forwardRef as ot, useState as Xe, useRef as ct } from "react";
 import { u as dt } from "./useBreakpoint.CMOR9ZOB.js";
-import { DSInput as pt } from "../input.BKHOY118.js";
+import { DSInput as ut } from "../input.DG20x6gh.js";
 import { g as Je } from "./helpers.BbWkXTr3.js";
-import '../assets/Slider.DzwSjDPV.css';const ut = "ds-slider_root_1p0nf_1", mt = "ds-slider_hint_1p0nf_13", bt = "ds-slider_label_1p0nf_13", ft = "ds-slider_number-input_1p0nf_16", _t = "ds-slider_label-hint-input-wrapper_1p0nf_20", ht = "ds-slider_label--hidden_1p0nf_40", Tt = "ds-slider_label--disabled_1p0nf_53", xt = "ds-slider_number-input--small_1p0nf_82", vt = "ds-slider_min-max-label-wrapper_1p0nf_87", gt = "ds-slider_min-max-label-wrapper--disabled_1p0nf_101", kt = "ds-slider_min-label_1p0nf_106", Nt = "ds-slider_max-label_1p0nf_110", St = "ds-slider_slider-wrapper_1p0nf_114", yt = "ds-slider_slider_1p0nf_114", Dt = "ds-slider_value-tooltip_1p0nf_138", It = "ds-slider_proxy-thumb_1p0nf_142", Mt = "ds-slider_proxy-thumb--disabled_1p0nf_209", Lt = "ds-slider_custom-track_1p0nf_238", Vt = "ds-slider_custom-track--progress_1p0nf_243", wt = "ds-slider_custom-track--runnable_1p0nf_255", Ct = "ds-slider_custom-track--disabled_1p0nf_269", Wt = "ds-slider_tick-wrapper_1p0nf_289", $t = "ds-slider_tick_1p0nf_289", Pt = "ds-slider_value-tooltip--visible_1p0nf_361", At = "ds-slider_value-tooltip--disabled_1p0nf_364", a = {
-  root: ut,
+import '../assets/Slider.Bidyhb-B.css';const pt = "ds-slider_root_13uvg_1", mt = "ds-slider_hint_13uvg_13", bt = "ds-slider_label_13uvg_13", ft = "ds-slider_number-input_13uvg_16", _t = "ds-slider_label-hint-input-wrapper_13uvg_20", ht = "ds-slider_label--hidden_13uvg_40", vt = "ds-slider_label--disabled_13uvg_53", gt = "ds-slider_number-input--small_13uvg_82", Tt = "ds-slider_min-max-label-wrapper_13uvg_87", xt = "ds-slider_min-max-label-wrapper--disabled_13uvg_101", kt = "ds-slider_min-label_13uvg_106", Nt = "ds-slider_max-label_13uvg_110", St = "ds-slider_slider-wrapper_13uvg_114", yt = "ds-slider_slider_13uvg_114", Dt = "ds-slider_value-tooltip_13uvg_138", It = "ds-slider_proxy-thumb_13uvg_142", Mt = "ds-slider_proxy-thumb--disabled_13uvg_209", Lt = "ds-slider_custom-track_13uvg_238", Vt = "ds-slider_custom-track--progress_13uvg_243", wt = "ds-slider_custom-track--runnable_13uvg_255", Ct = "ds-slider_custom-track--disabled_13uvg_269", Wt = "ds-slider_tick-wrapper_13uvg_289", $t = "ds-slider_tick_13uvg_289", Pt = "ds-slider_value-tooltip--visible_13uvg_348", At = "ds-slider_value-tooltip--disabled_13uvg_351", a = {
+  root: pt,
   hint: mt,
   label: bt,
   numberInput: ft,
   labelHintInputWrapper: _t,
   labelHidden: ht,
-  labelDisabled: Tt,
-  numberInputSmall: xt,
-  minMaxLabelWrapper: vt,
-  minMaxLabelWrapperDisabled: gt,
+  labelDisabled: vt,
+  numberInputSmall: gt,
+  minMaxLabelWrapper: Tt,
+  minMaxLabelWrapperDisabled: xt,
   minLabel: kt,
   maxLabel: Nt,
   sliderWrapper: St,
@@ -32,37 +32,37 @@ import '../assets/Slider.DzwSjDPV.css';const ut = "ds-slider_root_1p0nf_1", mt =
   tick: $t,
   valueTooltipVisible: Pt,
   valueTooltipDisabled: At
-}, Et = 11, Qe = 4, Ye = (u) => u.toString().length, Rt = (u, n, e) => {
-  if (n === 0)
+}, Et = 11, Qe = 4, Ye = (p) => p.toString().length, Rt = (p, r, e) => {
+  if (r === 0)
     return !0;
-  const m = 1e-10, r = (u - e) / n;
-  return Math.abs(Math.round(r) - r) < m;
-}, Ft = (u, n, e, m) => {
+  const m = 1e-10, n = (p - e) / r;
+  return Math.abs(Math.round(n) - n) < m;
+}, Ft = (p, r, e, m) => {
   var o;
-  const r = parseFloat(n), f = e, c = Math.round((u - f) / r);
-  let d = f + c * r;
+  const n = parseFloat(r), f = e, c = Math.round((p - f) / n);
+  let d = f + c * n;
   d = Math.min(Math.max(d, e), m);
-  const v = ((o = r.toString().split(".")[1]) == null ? void 0 : o.length) || 0;
-  return parseFloat(d.toFixed(v));
-}, Ht = (u, n, e) => {
-  const m = (u - n) / (e - n) * 100, r = `calc(-0.24 * ${m}px + 10px)`;
-  return `calc(${m}% + ${r})`;
+  const T = ((o = n.toString().split(".")[1]) == null ? void 0 : o.length) || 0;
+  return parseFloat(d.toFixed(T));
+}, Ht = (p, r, e) => {
+  const m = (p - r) / (e - r) * 100, n = `calc(-0.24 * ${m}px + 10px)`;
+  return `calc(${m}% + ${n})`;
 }, Bt = ({
-  id: u,
-  label: n
+  id: p,
+  label: r
 }) => {
-  if (!u)
+  if (!p)
     throw new Error(Je("DSSlider", 'A unique "id" prop is required. Please add a unique "id" prop to the DSSlider component.'));
-  if (!n)
+  if (!r)
     throw new Error(Je("DSSlider", `A label is always required for a11y reasons. Please add a descriptive "label" prop to the DSSlider component. If you don't want to display a label, set hideLabel={true}.`));
-}, qt = ot((u, n) => {
-  const e = rt.c(154);
-  let m, r, f, c, d, v, o, S, U, G, X, J, Q, Y, Z, g;
-  e[0] !== u ? ({
+}, qt = ot((p, r) => {
+  const e = nt.c(154);
+  let m, n, f, c, d, T, o, S, U, G, X, J, Q, Y, Z, x;
+  e[0] !== p ? ({
     id: c,
     label: d,
     className: m,
-    defaultValue: r,
+    defaultValue: n,
     disabled: U,
     hideLabel: G,
     hideNumberInput: X,
@@ -70,32 +70,32 @@ import '../assets/Slider.DzwSjDPV.css';const ut = "ds-slider_root_1p0nf_1", mt =
     isTooltipAlwaysVisible: J,
     max: Q,
     min: Y,
-    numberInputProps: v,
+    numberInputProps: T,
     step: Z,
-    value: g,
+    value: x,
     onChange: o,
     ...S
-  } = u, e[0] = u, e[1] = m, e[2] = r, e[3] = f, e[4] = c, e[5] = d, e[6] = v, e[7] = o, e[8] = S, e[9] = U, e[10] = G, e[11] = X, e[12] = J, e[13] = Q, e[14] = Y, e[15] = Z, e[16] = g) : (m = e[1], r = e[2], f = e[3], c = e[4], d = e[5], v = e[6], o = e[7], S = e[8], U = e[9], G = e[10], X = e[11], J = e[12], Q = e[13], Y = e[14], Z = e[15], g = e[16]);
+  } = p, e[0] = p, e[1] = m, e[2] = n, e[3] = f, e[4] = c, e[5] = d, e[6] = T, e[7] = o, e[8] = S, e[9] = U, e[10] = G, e[11] = X, e[12] = J, e[13] = Q, e[14] = Y, e[15] = Z, e[16] = x) : (m = e[1], n = e[2], f = e[3], c = e[4], d = e[5], T = e[6], o = e[7], S = e[8], U = e[9], G = e[10], X = e[11], J = e[12], Q = e[13], Y = e[14], Z = e[15], x = e[16]);
   const l = U === void 0 ? !1 : U, Ze = G === void 0 ? !1 : G, y = X === void 0 ? !1 : X, ye = J === void 0 ? !1 : J, et = Q === void 0 ? 100 : Q, tt = Y === void 0 ? 0 : Y, ee = Z === void 0 ? 1 : Z;
   process.env.NODE_ENV !== "production" && Bt({
     id: c,
     label: d
   });
-  const i = Number(et), t = Number(tt), p = Number(ee), De = dt(Ze), D = `${c}-label`, Ie = `${c}-hint`, Me = `${c}-number-input`;
+  const i = Number(et), t = Number(tt), u = Number(ee), De = dt(Ze), D = `${c}-label`, Ie = `${c}-hint`, Me = `${c}-number-input`;
   let se;
-  e[17] !== r || e[18] !== t || e[19] !== g ? (se = g || r || t.toString() || "0", e[17] = r, e[18] = t, e[19] = g, e[20] = se) : se = e[20];
-  const [I, le] = Xe(se), [x, ae] = Xe(g || r || t || 0), st = ct(null);
+  e[17] !== n || e[18] !== t || e[19] !== x ? (se = x || n || t.toString() || "0", e[17] = n, e[18] = t, e[19] = x, e[20] = se) : se = e[20];
+  const [I, le] = Xe(se), [g, ae] = Xe(x || n || t || 0), st = ct(null);
   let ie;
-  e[21] !== n ? (ie = (s) => {
-    st.current = s, typeof n == "function" ? n(s) : n && (n.current = s);
-  }, e[21] = n, e[22] = ie) : ie = e[22];
+  e[21] !== r ? (ie = (s) => {
+    st.current = s, typeof r == "function" ? r(s) : r && (r.current = s);
+  }, e[21] = r, e[22] = ie) : ie = e[22];
   const Le = ie;
-  let ne;
-  e[23] !== v ? (ne = v || {}, e[23] = v, e[24] = ne) : ne = e[24];
+  let re;
+  e[23] !== T ? (re = T || {}, e[23] = T, e[24] = re) : re = e[24];
   const {
     size: Ge,
     suffix: Ve
-  } = ne, re = Ge === void 0 ? "medium" : Ge;
+  } = re, ne = Ge === void 0 ? "medium" : Ge;
   let oe;
   e[25] !== o ? (oe = (s) => {
     const _ = parseFloat(s.target.value);
@@ -128,35 +128,35 @@ import '../assets/Slider.DzwSjDPV.css';const ut = "ds-slider_root_1p0nf_1", mt =
     e[28] = I, e[29] = o, e[30] = i, e[31] = t, e[32] = ee, e[33] = k;
   } else
     k = e[33];
-  const M = (p === 0 ? !1 : (i - t) / p <= Et) && (i - t) / p || 0;
+  const M = (u === 0 ? !1 : (i - t) / u <= Et) && (i - t) / u || 0;
   let de;
-  if (e[34] !== i || e[35] !== t || e[36] !== p || e[37] !== M) {
+  if (e[34] !== i || e[35] !== t || e[36] !== u || e[37] !== M) {
     let s;
-    e[39] !== i || e[40] !== t || e[41] !== p ? (s = (_, te) => {
-      const h = t + te * p, nt = Ht(h, t, i);
+    e[39] !== i || e[40] !== t || e[41] !== u ? (s = (_, te) => {
+      const h = t + te * u, rt = Ht(h, t, i);
       return /* @__PURE__ */ b("span", { className: a.tick, style: {
-        left: nt
+        left: rt
       } }, h);
-    }, e[39] = i, e[40] = t, e[41] = p, e[42] = s) : s = e[42], de = Array.from({
+    }, e[39] = i, e[40] = t, e[41] = u, e[42] = s) : s = e[42], de = Array.from({
       length: M + 1
-    }, s), e[34] = i, e[35] = t, e[36] = p, e[37] = M, e[38] = de;
+    }, s), e[34] = i, e[35] = t, e[36] = u, e[37] = M, e[38] = de;
   } else
     de = e[38];
   const Ce = de;
-  let pe;
-  e[43] !== i || e[44] !== t || e[45] !== x ? (pe = () => {
+  let ue;
+  e[43] !== i || e[44] !== t || e[45] !== g ? (ue = () => {
     if (t === i)
       throw new Error("Min and max values cannot be the same.");
-    const s = (x - t) / (i - t) * 100;
+    const s = (g - t) / (i - t) * 100;
     return Math.max(0, Math.min(s, 100));
-  }, e[43] = i, e[44] = t, e[45] = x, e[46] = pe) : pe = e[46];
-  const N = pe;
-  let ue;
-  e[47] !== N ? (ue = () => {
+  }, e[43] = i, e[44] = t, e[45] = g, e[46] = ue) : ue = e[46];
+  const N = ue;
+  let pe;
+  e[47] !== N ? (pe = () => {
     const s = N();
     return s < 50 ? `calc(${s}% + 4px)` : `calc(${s}% - 4px)`;
-  }, e[47] = N, e[48] = ue) : ue = e[48];
-  const at = ue;
+  }, e[47] = N, e[48] = pe) : pe = e[48];
+  const at = pe;
   let me;
   e[49] !== N ? (me = () => {
     const s = 100 - N();
@@ -164,53 +164,53 @@ import '../assets/Slider.DzwSjDPV.css';const ut = "ds-slider_root_1p0nf_1", mt =
   }, e[49] = N, e[50] = me) : me = e[50];
   const it = me;
   let be;
-  e[51] !== m ? (be = T(a.slider, m), e[51] = m, e[52] = be) : be = e[52];
+  e[51] !== m ? (be = v(a.slider, m), e[51] = m, e[52] = be) : be = e[52];
   const We = be;
   let fe;
-  e[53] !== l || e[54] !== De ? (fe = T(a.label, {
+  e[53] !== l || e[54] !== De ? (fe = v(a.label, {
     [a.labelHidden]: De,
     [a.labelDisabled]: l
   }), e[53] = l, e[54] = De, e[55] = fe) : fe = e[55];
-  const $e = fe, Pe = re === "small";
+  const $e = fe, Pe = ne === "small";
   let _e;
-  e[56] !== Pe ? (_e = T(a.numberInput, {
+  e[56] !== Pe ? (_e = v(a.numberInput, {
     [a.numberInputSmall]: Pe
   }), e[56] = Pe, e[57] = _e) : _e = e[57];
   const Ae = _e;
   let he;
-  e[58] !== l ? (he = T(a.minMaxLabelWrapper, {
+  e[58] !== l ? (he = v(a.minMaxLabelWrapper, {
     [a.minMaxLabelWrapperDisabled]: l
   }), e[58] = l, e[59] = he) : he = e[59];
   const Ee = he;
-  let Te;
-  e[60] !== l ? (Te = T(a.customTrack, a.customTrackProgress, {
+  let ve;
+  e[60] !== l ? (ve = v(a.customTrack, a.customTrackProgress, {
     [a.customTrackDisabled]: l
-  }), e[60] = l, e[61] = Te) : Te = e[61];
-  const Re = Te;
-  let xe;
-  e[62] !== l ? (xe = T(a.customTrack, a.customTrackRunnable, {
+  }), e[60] = l, e[61] = ve) : ve = e[61];
+  const Re = ve;
+  let ge;
+  e[62] !== l ? (ge = v(a.customTrack, a.customTrackRunnable, {
     [a.customTrackDisabled]: l
-  }), e[62] = l, e[63] = xe) : xe = e[63];
-  const Fe = xe;
-  let ve;
-  e[64] !== l ? (ve = T(a.proxyThumb, {
+  }), e[62] = l, e[63] = ge) : ge = e[63];
+  const Fe = ge;
+  let Te;
+  e[64] !== l ? (Te = v(a.proxyThumb, {
     [a.proxyThumbDisabled]: l
-  }), e[64] = l, e[65] = ve) : ve = e[65];
-  const He = ve;
-  let ge;
-  e[66] !== l || e[67] !== ye ? (ge = T(a.valueTooltip, {
+  }), e[64] = l, e[65] = Te) : Te = e[65];
+  const He = Te;
+  let xe;
+  e[66] !== l || e[67] !== ye ? (xe = v(a.valueTooltip, {
     [a.valueTooltipVisible]: ye,
     [a.valueTooltipDisabled]: l
-  }), e[66] = l, e[67] = ye, e[68] = ge) : ge = e[68];
-  const Be = ge;
+  }), e[66] = l, e[67] = ye, e[68] = xe) : xe = e[68];
+  const Be = xe;
   let L;
   e[69] !== c || e[70] !== d || e[71] !== $e || e[72] !== D ? (L = /* @__PURE__ */ b("label", { className: $e, htmlFor: c, id: D, children: d }), e[69] = c, e[70] = d, e[71] = $e, e[72] = D, e[73] = L) : L = e[73];
   let V;
   e[74] !== f || e[75] !== Ie ? (V = f && /* @__PURE__ */ b("div", { className: a.hint, id: Ie, children: f }), e[74] = f, e[75] = Ie, e[76] = V) : V = e[76];
   let w;
-  e[77] !== l || e[78] !== k || e[79] !== y || e[80] !== Me || e[81] !== I || e[82] !== d || e[83] !== Ae || e[84] !== re || e[85] !== Ve || e[86] !== i || e[87] !== t || e[88] !== p ? (w = !y && /* @__PURE__ */ b(pt, { id: Me, className: Ae, type: "number", min: t, max: i, step: p, inputMode: "decimal", autoComplete: "off", disabled: l, hideLabel: !0, value: I, onChange: lt, onBlur: k, onKeyDown: (s) => {
+  e[77] !== l || e[78] !== k || e[79] !== y || e[80] !== Me || e[81] !== I || e[82] !== d || e[83] !== Ae || e[84] !== ne || e[85] !== Ve || e[86] !== i || e[87] !== t || e[88] !== u ? (w = !y && /* @__PURE__ */ b(ut, { id: Me, className: Ae, type: "number", min: t, max: i, step: u, inputMode: "decimal", autoComplete: "off", disabled: l, hideLabel: !0, value: I, onChange: lt, onBlur: k, onKeyDown: (s) => {
     s.key === "Enter" && (s.preventDefault(), k(s));
-  }, label: d, size: re, suffix: Ve }), e[77] = l, e[78] = k, e[79] = y, e[80] = Me, e[81] = I, e[82] = d, e[83] = Ae, e[84] = re, e[85] = Ve, e[86] = i, e[87] = t, e[88] = p, e[89] = w) : w = e[89];
+  }, label: d, size: ne, suffix: Ve }), e[77] = l, e[78] = k, e[79] = y, e[80] = Me, e[81] = I, e[82] = d, e[83] = Ae, e[84] = ne, e[85] = Ve, e[86] = i, e[87] = t, e[88] = u, e[89] = w) : w = e[89];
   let C;
   e[90] !== L || e[91] !== V || e[92] !== w ? (C = /* @__PURE__ */ Se("div", { className: a.labelHintInputWrapper, children: [
     L,
@@ -219,14 +219,14 @@ import '../assets/Slider.DzwSjDPV.css';const ut = "ds-slider_root_1p0nf_1", mt =
   ] }), e[90] = L, e[91] = V, e[92] = w, e[93] = C) : C = e[93];
   const qe = Ye(t) < Qe;
   let W;
-  e[94] !== qe ? (W = T({
+  e[94] !== qe ? (W = v({
     [a.minLabel]: qe
   }), e[94] = qe, e[95] = W) : W = e[95];
   let $;
   e[96] !== t || e[97] !== W ? ($ = /* @__PURE__ */ b("div", { className: W, children: t }), e[96] = t, e[97] = W, e[98] = $) : $ = e[98];
   const Oe = Ye(i) < Qe;
   let P;
-  e[99] !== Oe ? (P = T({
+  e[99] !== Oe ? (P = v({
     [a.maxLabel]: Oe
   }), e[99] = Oe, e[100] = P) : P = e[100];
   let A;
@@ -256,13 +256,13 @@ import '../assets/Slider.DzwSjDPV.css';const ut = "ds-slider_root_1p0nf_1", mt =
   let B;
   e[117] !== Fe || e[118] !== H ? (B = /* @__PURE__ */ b("div", { className: Fe, style: H }), e[117] = Fe, e[118] = H, e[119] = B) : B = e[119];
   let q;
-  e[120] !== l || e[121] !== Le || e[122] !== we || e[123] !== c || e[124] !== i || e[125] !== t || e[126] !== p || e[127] !== S || e[128] !== We || e[129] !== D || e[130] !== x ? (q = /* @__PURE__ */ b("input", { ...S, id: c, type: "range", ref: Le, className: We, min: t, max: i, step: p, value: x, disabled: l, "aria-labelledby": D, onChange: we }), e[120] = l, e[121] = Le, e[122] = we, e[123] = c, e[124] = i, e[125] = t, e[126] = p, e[127] = S, e[128] = We, e[129] = D, e[130] = x, e[131] = q) : q = e[131];
+  e[120] !== l || e[121] !== Le || e[122] !== we || e[123] !== c || e[124] !== i || e[125] !== t || e[126] !== u || e[127] !== S || e[128] !== We || e[129] !== D || e[130] !== g ? (q = /* @__PURE__ */ b("input", { ...S, id: c, type: "range", ref: Le, className: We, min: t, max: i, step: u, value: g, disabled: l, "aria-labelledby": D, onChange: we }), e[120] = l, e[121] = Le, e[122] = we, e[123] = c, e[124] = i, e[125] = t, e[126] = u, e[127] = S, e[128] = We, e[129] = D, e[130] = g, e[131] = q) : q = e[131];
   let O;
   e[132] !== M || e[133] !== Ce ? (O = M > 0 && /* @__PURE__ */ b("div", { className: a.tickWrapper, children: Ce }), e[132] = M, e[133] = Ce, e[134] = O) : O = e[134];
   let z;
   e[135] !== He ? (z = /* @__PURE__ */ b("div", { className: He }), e[135] = He, e[136] = z) : z = e[136];
   let K;
-  e[137] !== l || e[138] !== y || e[139] !== x || e[140] !== Be ? (K = y && /* @__PURE__ */ b("div", { className: Be, "aria-disabled": l, children: x }), e[137] = l, e[138] = y, e[139] = x, e[140] = Be, e[141] = K) : K = e[141];
+  e[137] !== l || e[138] !== y || e[139] !== g || e[140] !== Be ? (K = y && /* @__PURE__ */ b("div", { className: Be, "aria-disabled": l, children: g }), e[137] = l, e[138] = y, e[139] = g, e[140] = Be, e[141] = K) : K = e[141];
   let j;
   e[142] !== Ke || e[143] !== F || e[144] !== B || e[145] !== q || e[146] !== O || e[147] !== z || e[148] !== K ? (j = /* @__PURE__ */ Se("div", { className: a.sliderWrapper, style: Ke, children: [
     F,

package/chunks/{SystemFeedback.B9f67mjJ.js → SystemFeedback.CyGbUCzT.js}

@@ -3,7 +3,7 @@ import { jsxs as f, jsx as S } from "react/jsx-runtime";
 import { d as _ } from "./index.CgTHIF3K.js";
 import { c as p } from "./index.CEyLAtio.js";
 import "react";
-import { D as E } from "./Icon.DGTYCv63.js";
+import { D as E } from "./Icon.NSsVrYeq.js";
 import '../assets/SystemFeedback.RcrPepSZ.css';const x = "ds-system-feedback_root_1lr41_1", D = {
   root: x
 }, h = ["success", "error", "warning"], k = {

package/chunks/{Tabs.CkVL8Jw8.js → Tabs.C8ADTzJ0.js}

@@ -2,7 +2,7 @@
 import { jsx as N, jsxs as L } from "react/jsx-runtime";
 import { d as M } from "./index.CgTHIF3K.js";
 import { useState as $ } from "react";
-import { TabList as j } from "../tablist.g_Nwu6GA.js";
+import { TabList as j } from "../tablist.V7DBklhE.js";
 import { TabPane as B } from "../tabpane.CB-eudyw.js";
 import { g as C } from "./TabPane.utils.DG16Y2uD.js";
 import { g, r as O } from "./helpers.BbWkXTr3.js";

package/chunks/Textarea.Cw85sxHL.js

@@ -0,0 +1,163 @@
+"use client";
+import { jsxs as d, jsx as h, Fragment as le } from "react/jsx-runtime";
+import { c as A } from "./index.CEyLAtio.js";
+import { forwardRef as ie, useState as i, useRef as ce, useEffect as m } from "react";
+import { g as q, p as z } from "./helpers.BbWkXTr3.js";
+import { u as de } from "./useBreakpoint.CMOR9ZOB.js";
+import "./index.CgTHIF3K.js";
+import { Asterisk as ue } from "../asterisk.CR60hx8S.js";
+import { D as fe } from "./SystemFeedback.CyGbUCzT.js";
+import '../assets/Textarea.Dq4rH9Tg.css';const pe = "ds-textarea_textarea_1s8pw_1", be = "ds-textarea_textarea--small_1s8pw_9", _e = "ds-textarea_textarea--invalid_1s8pw_121", he = "ds-textarea_textarea--resize-auto_1s8pw_145", me = "ds-textarea_root_1s8pw_155", xe = "ds-textarea_hint_1s8pw_164", we = "ds-textarea_label_1s8pw_164", ve = "ds-textarea_label--hidden_1s8pw_303", Ce = "ds-textarea_label--disabled_1s8pw_316", Se = "ds-textarea_feedback_1s8pw_336", Ae = "ds-textarea_char-count_1s8pw_341", De = "ds-textarea_char-count-announcer_1s8pw_357", a = {
+  textarea: pe,
+  textareaSmall: be,
+  textareaInvalid: _e,
+  textareaResizeAuto: he,
+  root: me,
+  hint: xe,
+  label: we,
+  labelHidden: ve,
+  labelDisabled: Ce,
+  feedback: Se,
+  charCount: Ae,
+  charCountAnnouncer: De
+}, Ve = ["medium", "small"], Ie = ({
+  id: r,
+  label: u
+}) => {
+  if (!r)
+    throw new Error(q("DSTextarea", 'A unique "id" prop is required. Please add a unique "id" prop to the DSTextarea component.'));
+  if (!u)
+    throw new Error(q("DSTextarea", `A label is always required for a11y reasons. Please add a descriptive "label" prop to the DSTextarea component. If you don't want to display a label, set hideLabel={true}.`));
+}, Te = ie(({
+  id: r,
+  label: u,
+  charsLimitText: M = "Character limit reached",
+  charsRemainingText: O = "Characters remaining:",
+  className: F,
+  defaultValue: X,
+  disabled: D = !1,
+  hint: x,
+  hideLabel: Z = !1,
+  invalid: s = !1,
+  maxLength: e,
+  readonly: I = !1,
+  required: T = !1,
+  resize: f = "vertical",
+  size: G = "medium",
+  systemFeedback: n,
+  value: w,
+  wrapperClassName: J,
+  onChange: y,
+  onInput: R,
+  ...K
+}, p) => {
+  process.env.NODE_ENV !== "production" && Ie({
+    id: r,
+    label: u
+  });
+  const [Q, N] = i(X || ""), [l, E] = i(0), [U, g] = i(0), [W, $] = i("off"), [k, v] = i(n), [C, S] = i(s), H = w !== void 0, b = H ? w : Q, o = ce(null), Y = (t) => {
+    o.current = t, typeof p == "function" ? p(t) : p && (p.current = t);
+  }, L = de(Z);
+  m(() => {
+    if (!e || e <= 0)
+      return;
+    l >= e * 0.8 ? $("polite") : $("off");
+    const t = setTimeout(() => {
+      g(e - l || 0);
+    }, 1e3);
+    return () => clearTimeout(t);
+  }, [l]), m(() => {
+    N(b || ""), c(), e && e > 0 && (E(b.toString().length || 0), g(e - b.toString().length || 0));
+  }, [w]), m(() => {
+    s && n ? (v(n), S(s)) : !s && e && e >= 0 && l >= e ? (S(!0), v(M)) : (v(n), S(s));
+  }, [s, C, n, l]), m(() => {
+    if (f === "auto")
+      return c(), window.addEventListener("resize", c), () => window.removeEventListener("resize", c);
+  }, [f, o.current]);
+  const ee = A(a.root, J), te = A(a.textarea, F, {
+    // small textarea
+    [a.textareaSmall]: G === "small",
+    // invalid state
+    [a.textareaInvalid]: C,
+    // resize handling
+    [a.textareaResizeAuto]: f === "auto"
+  }), ae = A(a.label, {
+    // hide label only visually to keep them available for assistive technologies
+    [a.labelHidden]: L,
+    [a.labelDisabled]: D
+  }), V = `${r}-label`, P = `${r}-feedback`, j = `${r}-hint`, B = `${r}-char-count-announcer`, re = x ? ` ${j}` : "", c = () => {
+    if (o.current && f === "auto") {
+      o.current.style.height = "auto";
+      const t = z(o.current.scrollHeight), _ = z(2);
+      o.current.style.height = `${// We need to add 2px (border-top & border-bottom) to the scrollHeight to prevent the textarea
+      // from jumping as soon as the user starts typing.
+      t + _}rem`;
+    }
+  }, se = () => {
+    const t = [];
+    return e && e > 0 && t.push(B), s && n && t.push(P), t.length > 0 ? t.join(" ") : void 0;
+  }, oe = (t) => {
+    var _;
+    R && R(t), e && e > 0 && E(((_ = o.current) == null ? void 0 : _.value.length) || 0), c();
+  }, ne = (t) => {
+    y && y(t), H || N(t.target.value);
+  };
+  return /* @__PURE__ */ d("div", { className: ee, children: [
+    /* @__PURE__ */ d("label", { className: ae, id: V, htmlFor: r, children: [
+      u,
+      T && /* @__PURE__ */ h(ue, {})
+    ] }),
+    x && /* @__PURE__ */ h("div", { className: a.hint, id: j, children: x }),
+    C && k && /* @__PURE__ */ h(fe, { className: a.feedback, message: k, variant: "error", id: P }),
+    /* @__PURE__ */ h(
+      "textarea",
+      {
+        className: te,
+        id: r,
+        ...K,
+        ref: Y,
+        "aria-labelledby": `${V}${re}`,
+        "aria-describedby": se(),
+        "aria-invalid": s,
+        "aria-disabled": I,
+        maxLength: e,
+        readOnly: I,
+        required: T,
+        disabled: D,
+        value: b,
+        defaultValue: void 0,
+        rows: void 0,
+        cols: void 0,
+        onChange: ne,
+        onInput: oe
+      }
+    ),
+    e !== void 0 && e > 0 && /* @__PURE__ */ d(le, { children: [
+      /* @__PURE__ */ d("div", { className: a.charCount, "aria-hidden": "true", children: [
+        l,
+        "/",
+        e
+      ] }),
+      /* @__PURE__ */ d(
+        "div",
+        {
+          className: a.charCountAnnouncer,
+          id: B,
+          "aria-live": W,
+          "aria-atomic": "true",
+          children: [
+            O,
+            " ",
+            U
+          ]
+        }
+      )
+    ] })
+  ] });
+});
+Te.displayName = "DSTextarea";
+export {
+  Te as D,
+  Ve as T,
+  Ie as v
+};