@stihl-design-system/components 1.0.0-RC.3 → 1.0.0-RC.5

package/chunks/RadioGroup.module.BBZwHDjW.js

@@ -0,0 +1,11 @@
+"use client";
+import '../assets/RadioGroup.Bz3_xkZU.css';const o = "_group_2f5rk_76", r = "_group--horizontal_2f5rk_84", n = "_group--invalid_2f5rk_87", _ = {
+  group: o,
+  "group--horizontal": "_group--horizontal_2f5rk_84",
+  groupHorizontal: r,
+  "group--invalid": "_group--invalid_2f5rk_87",
+  groupInvalid: n
+};
+export {
+  _ as s
+};

package/chunks/Select.COdS787F.js

@@ -0,0 +1,191 @@
+"use client";
+import { j as n } from "./jsx-runtime.C115EyI4.js";
+import { c as _ } from "./index.CvOaL64Y.js";
+import { useRef as C, useState as q, useEffect as W } from "react";
+import { u as F } from "./useBreakpoint.5xBNDiCf.js";
+import { Asterisk as M } from "../asterisk.Cjbk-xZi.js";
+import { D as O } from "./Icon.n4XZrQ4N.js";
+import { DSSystemFeedback as T } from "../systemfeedback.CUWch42u.js";
+import { g as u } from "./helpers.B1JT5ShS.js";
+import '../assets/Select.Bz1TImkI.css';const V = "_root_omrno_226", Z = "_hint_omrno_234", J = "_label_omrno_234", K = "_wrapper_omrno_238", Q = "_affix_omrno_244", U = "_affix--small_omrno_264", X = "_affix--disabled_omrno_276", Y = "_prefix_omrno_279", z = "_affix--readonly_omrno_282", G = "_suffix_omrno_292", ee = "_action-button_omrno_299", oe = "_label--hidden_omrno_316", ne = "_feedback_omrno_343", te = "_select-wrapper_omrno_348", se = "_select_omrno_348", ae = "_select--invalid_omrno_464", le = "_select--small_omrno_471", ce = "_input--has-leading-icon_omrno_523", re = "_input--has-action-button_omrno_526", ie = "_input--has-second-action-button_omrno_529", _e = "_select--has-leading-icon_omrno_532", de = "_select--has-action-button_omrno_535", me = "_select--has-second-action-button_omrno_538", fe = "_select--has-affix_omrno_541", ue = "_select--is-ready_omrno_555", he = "_select--placeholder_omrno_572", pe = "_chevron_omrno_581", be = "_chevron--small_omrno_585", xe = "_chevron--disabled_omrno_588", e = {
+  root: V,
+  hint: Z,
+  label: J,
+  wrapper: K,
+  affix: Q,
+  "affix--small": "_affix--small_omrno_264",
+  affixSmall: U,
+  "affix--disabled": "_affix--disabled_omrno_276",
+  affixDisabled: X,
+  prefix: Y,
+  "affix--readonly": "_affix--readonly_omrno_282",
+  affixReadonly: z,
+  suffix: G,
+  "action-button": "_action-button_omrno_299",
+  actionButton: ee,
+  "label--hidden": "_label--hidden_omrno_316",
+  labelHidden: oe,
+  feedback: ne,
+  "select-wrapper": "_select-wrapper_omrno_348",
+  selectWrapper: te,
+  select: se,
+  "select--invalid": "_select--invalid_omrno_464",
+  selectInvalid: ae,
+  "select--small": "_select--small_omrno_471",
+  selectSmall: le,
+  "input--has-leading-icon": "_input--has-leading-icon_omrno_523",
+  inputHasLeadingIcon: ce,
+  "input--has-action-button": "_input--has-action-button_omrno_526",
+  inputHasActionButton: re,
+  "input--has-second-action-button": "_input--has-second-action-button_omrno_529",
+  inputHasSecondActionButton: ie,
+  "select--has-leading-icon": "_select--has-leading-icon_omrno_532",
+  selectHasLeadingIcon: _e,
+  "select--has-action-button": "_select--has-action-button_omrno_535",
+  selectHasActionButton: de,
+  "select--has-second-action-button": "_select--has-second-action-button_omrno_538",
+  selectHasSecondActionButton: me,
+  "select--has-affix": "_select--has-affix_omrno_541",
+  selectHasAffix: fe,
+  "select--is-ready": "_select--is-ready_omrno_555",
+  selectIsReady: ue,
+  "select--placeholder": "_select--placeholder_omrno_572",
+  selectPlaceholder: he,
+  chevron: pe,
+  "chevron--small": "_chevron--small_omrno_585",
+  chevronSmall: be,
+  "chevron--disabled": "_chevron--disabled_omrno_588",
+  chevronDisabled: xe
+}, Be = ["medium", "small"], ve = ({
+  id: o,
+  label: a,
+  options: s
+}) => {
+  if (!o)
+    throw new Error(
+      u(
+        "DSSelect",
+        'A unique "id" prop is required. Please add an unique "id" prop to the DSSelect component.'
+      )
+    );
+  if (!a)
+    throw new Error(
+      u(
+        "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 (!s || s.length === 0)
+    throw new Error(
+      u(
+        "DSSelect",
+        'Options are always required. Please add an "options" prop to the DSSelect component.'
+      )
+    );
+}, Se = (o, a, s) => o === "" || a !== void 0 && a !== "" ? !1 : !(s !== void 0 && s !== ""), Ee = ({
+  id: o,
+  label: a,
+  options: s,
+  className: H,
+  defaultValue: h,
+  disabled: p = !1,
+  hideLabel: I = !1,
+  hint: d,
+  invalid: i = !1,
+  placeholder: m = "Select",
+  required: b = !1,
+  size: x = "medium",
+  systemFeedback: f,
+  value: v,
+  ...w
+}) => {
+  process.env.NODE_ENV !== "production" && ve({
+    id: o,
+    label: a,
+    options: s
+  });
+  const r = C(null), [j, A] = q(
+    Se(m, h, v)
+  );
+  W(() => {
+    if (!r.current) return;
+    const l = () => {
+      if (!r.current) return;
+      const c = r.current.value;
+      A(c === "");
+    }, t = r.current;
+    return t.addEventListener("change", l), () => {
+      t.removeEventListener("change", l);
+    };
+  }, []);
+  const B = F(I), S = `${o}-label`, g = `${o}-feedback`, y = `${o}-hint`, E = d ? ` ${y}` : "", L = (l) => [
+    m && /* @__PURE__ */ n.jsx("option", { value: "", children: m }, `${o}-hidden-option-disabled-placeholder`),
+    ...l.map((t) => {
+      if ("options" in t) {
+        const { label: c, options: $ } = t;
+        return /* @__PURE__ */ n.jsx("optgroup", { label: c, children: $.map(D) }, c);
+      } else
+        return D(t);
+    })
+  ], D = ({ label: l, value: t, isDisabled: c }) => /* @__PURE__ */ n.jsx("option", { value: t, disabled: c, children: l }, t), N = _(e.root, H), P = _(e.select, {
+    [e.selectSmall]: x === "small",
+    [e.selectInvalid]: i,
+    [e.selectPlaceholder]: j
+  }), k = _(e.label, {
+    // hide label only visually to keep them available for assistive technologies
+    [e.labelHidden]: B
+  }), R = _(e.chevron, {
+    [e.chevronSmall]: x === "small",
+    [e.chevronDisabled]: p
+  });
+  return /* @__PURE__ */ n.jsxs("div", { className: N, children: [
+    /* @__PURE__ */ n.jsxs("label", { className: k, id: S, htmlFor: o, children: [
+      a,
+      b && /* @__PURE__ */ n.jsx(M, {})
+    ] }),
+    d && /* @__PURE__ */ n.jsx("div", { className: e.hint, id: y, children: d }),
+    i && f && /* @__PURE__ */ n.jsx(
+      T,
+      {
+        className: e.feedback,
+        message: f,
+        type: "invalid",
+        id: g,
+        "aria-live": "assertive"
+      }
+    ),
+    /* @__PURE__ */ n.jsxs("div", { className: e.selectWrapper, children: [
+      /* @__PURE__ */ n.jsx(
+        "select",
+        {
+          ...w,
+          id: o,
+          ref: r,
+          className: P,
+          "aria-labelledby": `${S}${E}`,
+          "aria-describedby": i && f ? g : void 0,
+          "aria-invalid": i,
+          defaultValue: h,
+          value: v,
+          disabled: p,
+          required: b,
+          children: L(s)
+        }
+      ),
+      /* @__PURE__ */ n.jsx(
+        O,
+        {
+          name: "chevron-down",
+          className: R,
+          "aria-hidden": "true"
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  Ee as D,
+  Be as S,
+  Se as g,
+  ve as v
+};

package/chunks/Textarea.oqCrSopu.js

@@ -0,0 +1,195 @@
+"use client";
+import { j as n } from "./jsx-runtime.C115EyI4.js";
+import { c as g } from "./index.CvOaL64Y.js";
+import { useState as c, useRef as oe, useEffect as q } from "react";
+import { u as se, h as ie } from "./useBreakpoint.5xBNDiCf.js";
+import { g as k, p as H } from "./helpers.B1JT5ShS.js";
+import { Asterisk as re } from "../asterisk.Cjbk-xZi.js";
+import { DSSystemFeedback as le } from "../systemfeedback.CUWch42u.js";
+import '../assets/Textarea.D2h5cW_t.css';const ce = "_textarea_q1qm9_226", de = "_textarea--invalid_q1qm9_336", _e = "_textarea--small_q1qm9_343", ue = "_textarea--resize-auto_q1qm9_361", fe = "_root_q1qm9_371", me = "_hint_q1qm9_379", qe = "_label_q1qm9_379", xe = "_affix_q1qm9_383", be = "_affix--small_q1qm9_403", he = "_affix--disabled_q1qm9_415", pe = "_prefix_q1qm9_418", ve = "_affix--readonly_q1qm9_421", ge = "_suffix_q1qm9_431", Se = "_leading-icon_q1qm9_438", Ie = "_leading-icon--small_q1qm9_450", Ce = "_leading-icon--disabled_q1qm9_453", ye = "_action-button_q1qm9_462", Ae = "_label--hidden_q1qm9_479", De = "_feedback_q1qm9_506", je = "_char-count_q1qm9_511", we = "_char-count-announcer_q1qm9_526", t = {
+  textarea: ce,
+  "textarea--invalid": "_textarea--invalid_q1qm9_336",
+  textareaInvalid: de,
+  "textarea--small": "_textarea--small_q1qm9_343",
+  textareaSmall: _e,
+  "textarea--resize-auto": "_textarea--resize-auto_q1qm9_361",
+  textareaResizeAuto: ue,
+  root: fe,
+  hint: me,
+  label: qe,
+  affix: xe,
+  "affix--small": "_affix--small_q1qm9_403",
+  affixSmall: be,
+  "affix--disabled": "_affix--disabled_q1qm9_415",
+  affixDisabled: he,
+  prefix: pe,
+  "affix--readonly": "_affix--readonly_q1qm9_421",
+  affixReadonly: ve,
+  suffix: ge,
+  "leading-icon": "_leading-icon_q1qm9_438",
+  leadingIcon: Se,
+  "leading-icon--small": "_leading-icon--small_q1qm9_450",
+  leadingIconSmall: Ie,
+  "leading-icon--disabled": "_leading-icon--disabled_q1qm9_453",
+  leadingIconDisabled: Ce,
+  "action-button": "_action-button_q1qm9_462",
+  actionButton: ye,
+  "label--hidden": "_label--hidden_q1qm9_479",
+  labelHidden: Ae,
+  feedback: De,
+  "char-count": "_char-count_q1qm9_511",
+  charCount: je,
+  "char-count-announcer": "_char-count-announcer_q1qm9_526",
+  charCountAnnouncer: we
+}, Ve = ["medium", "small"], Re = ({ id: o, label: _ }) => {
+  if (!o)
+    throw new Error(
+      k(
+        "DSTextarea",
+        'A unique "id" prop is required. Please add an unique "id" prop to the DSTextarea component.'
+      )
+    );
+  if (!_)
+    throw new Error(
+      k(
+        "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}.`
+      )
+    );
+}, ze = ({
+  id: o,
+  label: _,
+  charsLimitText: V = "Character limit reached",
+  charsRemainingText: z = "Characters remaining:",
+  className: P,
+  defaultValue: M,
+  disabled: O = !1,
+  hint: x,
+  hideLabel: F = !1,
+  invalid: s = !1,
+  maxLength: e,
+  readonly: S = !1,
+  required: I = !1,
+  resize: u = "vertical",
+  size: W = "medium",
+  systemFeedback: r,
+  value: b,
+  wrapperClassName: X,
+  onChange: C,
+  onInput: y,
+  ...Z
+}) => {
+  process.env.NODE_ENV !== "production" && Re({
+    id: o,
+    label: _
+  });
+  const [G, A] = c(M || ""), [l, D] = c(0), [J, j] = c(0), [K, w] = c("off"), [R, h] = c(r), [p, v] = c(s), T = b !== void 0, f = T ? b : G, i = oe(null), Q = se(F);
+  q(() => {
+    if (!e || e <= 0)
+      return;
+    l >= e * 0.8 ? w("polite") : w("off");
+    const a = setTimeout(() => {
+      j(e - l || 0);
+    }, 1e3);
+    return () => clearTimeout(a);
+  }, [l]), q(() => {
+    A(f || ""), d(), e && e > 0 && (D(f.toString().length || 0), j(e - f.toString().length || 0));
+  }, [b]), q(() => {
+    s && r ? (h(r), v(s)) : !s && e && e >= 0 && l >= e ? (v(!0), h(V)) : (h(r), v(s));
+  }, [s, p, r, l]), q(() => {
+    if (ie && u === "auto")
+      return d(), window.addEventListener("resize", d), () => window.removeEventListener("resize", d);
+  }, [u, i.current]);
+  const U = g(t.root, X), Y = g(t.textarea, P, {
+    // small textarea
+    [t.textareaSmall]: W === "small",
+    // invalid state
+    [t.textareaInvalid]: p,
+    // resize handling
+    [t.textareaResizeAuto]: u === "auto"
+  }), L = g(t.label, {
+    // hide label only visually to keep them available for assistive technologies
+    [t.labelHidden]: Q
+  }), E = `${o}-label`, N = `${o}-feedback`, B = `${o}-hint`, $ = `${o}-char-count-announcer`, ee = x ? ` ${B}` : "", d = () => {
+    if (i.current && u === "auto") {
+      i.current.style.height = "auto";
+      const a = H(i.current.scrollHeight), m = H(2);
+      i.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.
+      a + m}rem`;
+    }
+  }, ae = () => {
+    const a = [];
+    return e && e > 0 && a.push($), s && r && a.push(N), a.length > 0 ? a.join(" ") : void 0;
+  }, te = (a) => {
+    var m;
+    y && y(a), e && e > 0 && D(((m = i.current) == null ? void 0 : m.value.length) || 0), d();
+  }, ne = (a) => {
+    C && C(a), T || A(a.target.value);
+  };
+  return /* @__PURE__ */ n.jsxs("div", { className: U, children: [
+    /* @__PURE__ */ n.jsxs("label", { className: L, id: E, htmlFor: o, children: [
+      _,
+      I && /* @__PURE__ */ n.jsx(re, {})
+    ] }),
+    x && /* @__PURE__ */ n.jsx("div", { className: t.hint, id: B, children: x }),
+    p && R && /* @__PURE__ */ n.jsx(
+      le,
+      {
+        className: t.feedback,
+        message: R,
+        type: "invalid",
+        id: N
+      }
+    ),
+    /* @__PURE__ */ n.jsx(
+      "textarea",
+      {
+        className: Y,
+        id: o,
+        ref: i,
+        ...Z,
+        "aria-labelledby": `${E}${ee}`,
+        "aria-describedby": ae(),
+        "aria-invalid": s,
+        "aria-disabled": S,
+        maxLength: e,
+        readOnly: S,
+        required: I,
+        disabled: O,
+        value: f,
+        defaultValue: void 0,
+        rows: void 0,
+        cols: void 0,
+        onChange: ne,
+        onInput: te
+      }
+    ),
+    e !== void 0 && e > 0 && /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+      /* @__PURE__ */ n.jsxs("div", { className: t.charCount, "aria-hidden": "true", children: [
+        l,
+        "/",
+        e
+      ] }),
+      /* @__PURE__ */ n.jsxs(
+        "div",
+        {
+          className: t.charCountAnnouncer,
+          id: $,
+          "aria-live": K,
+          "aria-atomic": "true",
+          children: [
+            z,
+            " ",
+            J
+          ]
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  ze as D,
+  Ve as T,
+  Re as v
+};

package/chunks/Toast.BLGKvAvZ.js

@@ -0,0 +1,89 @@
+"use client";
+import { j as n } from "./jsx-runtime.C115EyI4.js";
+import { c } from "./index.CvOaL64Y.js";
+import { forwardRef as u } from "react";
+import { DSButton as g } from "../button.DlFWwHuA.js";
+import { D as h } from "./Icon.n4XZrQ4N.js";
+import '../assets/Toast.BzVaebc0.css';const p = "_root_127fr_80", x = "_root--closing_127fr_89", I = "_fade-out_127fr_1", S = "_move-in_127fr_1", N = "_root--success_127fr_124", j = "_root--info_127fr_128", v = "_root--warning_127fr_132", w = "_content_127fr_137", C = "_content--hide-icon_127fr_144", D = "_icon_127fr_148", O = "_message_127fr_152", o = {
+  root: p,
+  "root--closing": "_root--closing_127fr_89",
+  rootClosing: x,
+  "fade-out": "_fade-out_127fr_1",
+  fadeOut: I,
+  "move-in": "_move-in_127fr_1",
+  moveIn: S,
+  "root--success": "_root--success_127fr_124",
+  rootSuccess: N,
+  "root--info": "_root--info_127fr_128",
+  rootInfo: j,
+  "root--warning": "_root--warning_127fr_132",
+  rootWarning: v,
+  content: w,
+  "content--hide-icon": "_content--hide-icon_127fr_144",
+  contentHideIcon: C,
+  icon: D,
+  message: O
+}, T = {
+  success: "circle-check-colored",
+  warning: "triangle-exclamationmark-colored",
+  info: "circle-info-colored"
+}, H = u(
+  ({
+    message: s,
+    className: e,
+    hideIcon: r = !1,
+    variant: t = "info",
+    onClick: i,
+    onMouseEnter: a,
+    onMouseLeave: _,
+    ...f
+  }, l) => {
+    const m = c(o.root, e, {
+      [o.rootSuccess]: t === "success",
+      [o.rootWarning]: t === "warning",
+      [o.rootInfo]: t === "info"
+    }), d = c(o.content, {
+      [o.contentHideIcon]: r
+    });
+    return /* @__PURE__ */ n.jsx(
+      "aside",
+      {
+        className: m,
+        ref: l,
+        popover: "manual",
+        "data-ds-toast": !0,
+        onMouseEnter: a,
+        onMouseLeave: _,
+        "aria-label": s,
+        ...f,
+        children: /* @__PURE__ */ n.jsxs("div", { className: d, children: [
+          !r && /* @__PURE__ */ n.jsx(
+            h,
+            {
+              name: T[t],
+              className: o.icon,
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ n.jsx("div", { className: o.message, children: s }),
+          /* @__PURE__ */ n.jsx(
+            g,
+            {
+              hideLabel: !0,
+              iconName: "cross",
+              size: "small",
+              variant: "ghost",
+              onClick: i,
+              children: "Close toast"
+            }
+          )
+        ] })
+      }
+    );
+  }
+);
+H.displayName = "DSToast";
+export {
+  H as D,
+  o as s
+};

package/chunks/{circle-info-colored.DLY6BTL4.js → circle-info-colored.D2pp54gf.js}

@@ -1,10 +1,10 @@
 "use client";
 import * as e from "react";
-const o = ({
+const n = ({
   title: l,
   titleId: t,
   ...a
-}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", 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", { fill: "#666", fillRule: "evenodd", d: "M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16M6.575 3.35C6.575 2.6 7.175 2 8 2s1.425.6 1.425 1.35c0 .825-.6 1.425-1.425 1.425A1.424 1.424 0 0 1 6.575 3.35M9.05 6.775H6.875v6.75H9.05z", clipRule: "evenodd" }));
+}) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", 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", { fill: "#666", fillRule: "evenodd", d: "M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16", clipRule: "evenodd" }), /* @__PURE__ */ e.createElement("path", { fill: "#fff", d: "M6.575 3.35C6.575 2.6 7.175 2 8 2s1.425.6 1.425 1.35c0 .825-.6 1.425-1.425 1.425A1.424 1.424 0 0 1 6.575 3.35M9.05 6.775H6.875v6.75H9.05z" }));
 export {
-  o as default
+  n as default
 };

package/chunks/{jsx-runtime.C-kxDJ4g.js → jsx-runtime.C115EyI4.js}

@@ -12,18 +12,14 @@ var Z = { exports: {} }, D = {};
  */
 var Oe;
 function lr() {
-  if (Oe)
-    return D;
+  if (Oe) return D;
   Oe = 1;
   var M = we, C = Symbol.for("react.element"), U = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, A = M.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, I = { key: !0, ref: !0, __self: !0, __source: !0 };
   function P(h, c, T) {
     var p, b = {}, _ = null, W = null;
     T !== void 0 && (_ = "" + T), c.key !== void 0 && (_ = "" + c.key), c.ref !== void 0 && (W = c.ref);
-    for (p in c)
-      m.call(c, p) && !I.hasOwnProperty(p) && (b[p] = c[p]);
-    if (h && h.defaultProps)
-      for (p in c = h.defaultProps, c)
-        b[p] === void 0 && (b[p] = c[p]);
+    for (p in c) m.call(c, p) && !I.hasOwnProperty(p) && (b[p] = c[p]);
+    if (h && h.defaultProps) for (p in c = h.defaultProps, c) b[p] === void 0 && (b[p] = c[p]);
     return { $$typeof: C, type: h, key: _, ref: W, props: b, _owner: A.current };
   }
   return D.Fragment = U, D.jsx = P, D.jsxs = P, D;

package/{combobox.BXHAo4Wx.js → combobox.CRlhqmuO.js}

@@ -1,6 +1,6 @@
 "use client";
-import { j as u } from "./chunks/jsx-runtime.C-kxDJ4g.js";
-import { v as x, C } from "./chunks/CustomReactSelect.uzWNynay.js";
+import { j as u } from "./chunks/jsx-runtime.C115EyI4.js";
+import { v as x, c as C } from "./chunks/CustomReactSelect.5dHi6PEO.js";
 const v = ({
   id: s,
   label: o,
@@ -8,9 +8,9 @@ const v = ({
   disabled: a = !1,
   dropdownOnFocus: e = !1,
   hideLabel: l = !1,
-  invalid: m = !1,
-  lang: r = "en",
-  required: c = !1,
+  invalid: c = !1,
+  lang: m = "en",
+  required: r = !1,
   variant: f = "single",
   ...t
 }) => {
@@ -32,12 +32,12 @@ const v = ({
       disabled: a,
       hideLabel: l,
       isMulti: i,
-      invalid: m,
-      lang: r,
+      invalid: c,
+      lang: m,
       openMenuOnClick: e,
       openMenuOnFocus: e,
       isClearable: !e || i,
-      required: c,
+      required: r,
       ...t
     }
   );

package/components/AriaLiveRegions/AriaLiveRegions.d.ts

@@ -0,0 +1,4 @@
+/**
+ * A component that provides hidden ARIA live regions for accessibility, allowing screen readers to announce changes dynamically.
+ */
+export declare const DSAriaLiveRegions: () => JSX.Element;

package/components/AriaLiveRegions/AriaLiveRegions.utils.d.ts

@@ -0,0 +1,5 @@
+export declare const ARIA_LIVE_REGION_ALERT_ID = "ds-alert-live-region";
+export declare const ARIA_LIVE_REGION_STATUS_ID = "ds-status-live-region";
+export declare const getAriaAlertLiveRegionElement: () => HTMLElement | null;
+export declare const getAriaStatusLiveRegionElement: () => HTMLElement | null;
+export declare const validateMultipleDSAriaLiveRegionsOnPage: () => void;

package/components/AriaLiveRegions/AriaLiveRegions.utils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/Checkbox/Checkbox.d.ts

@@ -8,7 +8,7 @@ export interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
     checked?: boolean;
     /** Disables the checkbox, preventing user interaction */
     disabled?: boolean;
-    /** Hide the checkbox label, can be responsive
+    /** Hides the checkbox label, can be responsive
      * `boolean | { base: boolean; s?: boolean; m?: boolean; l?: boolean; xl?: boolean; }`
      * */
     hideLabel?: BreakpointCustomizable<boolean>;

package/components/CheckboxGroup/CheckboxGroup.utils.d.ts

@@ -1,5 +1,5 @@
 import { CheckboxGroupProps } from './CheckboxGroup';
 
 type ValidationProps = Pick<CheckboxGroupProps, 'children' | 'description' | 'id' | 'legend' | 'systemFeedback'>;
-export declare const validateProps: ({ children, description, id, legend, systemFeedback, }: ValidationProps) => void;
+export declare const validateCheckboxGroupProps: ({ children, description, id, legend, systemFeedback, }: ValidationProps) => void;
 export {};

package/components/Dialog/Dialog.d.ts

@@ -0,0 +1,11 @@
+import { HTMLAttributes } from 'react';
+
+type DialogProps = {
+    children: React.ReactNode;
+    footer?: React.ReactNode;
+    header?: React.ReactNode;
+    isOpen?: boolean;
+    onClose?: () => void;
+} & HTMLAttributes<HTMLDialogElement>;
+export declare const DSDialog: ({ children, className, footer, header, isOpen, onClose, }: DialogProps) => JSX.Element;
+export {};

package/components/Fieldset/Fieldset.utils.d.ts

@@ -7,5 +7,5 @@ export type Legend = string | {
     headingTag?: HeadingTag;
 };
 type ValidationProps = Pick<FieldsetProps, 'description' | 'id' | 'legend' | 'systemFeedback'>;
-export declare const validateProps: ({ description, id, legend, systemFeedback, }: ValidationProps) => void;
+export declare const validateFieldsetProps: ({ description, id, legend, systemFeedback, }: ValidationProps) => void;
 export {};

package/components/Notification/Notification.d.ts

@@ -0,0 +1,26 @@
+import { HTMLAttributes } from 'react';
+import { NotificationVariant } from './Notification.utils';
+
+export interface NotificationProps extends HTMLAttributes<HTMLDivElement> {
+    /** Content within the Notification */
+    children: React.ReactNode;
+    /** Content within the Notification's action bar. For example a CTA button. */
+    customActionArea?: React.ReactNode;
+    /** Label for the close button */
+    closeButtonLabel?: string;
+    /** Hides the close button */
+    hideCloseButton?: boolean;
+    /** Hides the icon */
+    hideIcon?: boolean;
+    /** Defines the variant */
+    variant?: NotificationVariant;
+    /** Callback function triggered when the close button is clicked */
+    onClose?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+/**
+ * An inline notification component that can be used to provide system feedback messages
+ * or highlight important content.
+ *
+ * The background color and icon vary based on the value of the `variant` prop.
+ */
+export declare const DSNotification: ({ children, variant, customActionArea, className, closeButtonLabel, hideCloseButton, hideIcon, onClose, ...rest }: NotificationProps) => JSX.Element;

package/components/Notification/Notification.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/Notification/Notification.utils.d.ts

@@ -0,0 +1,5 @@
+import { IconName } from '../../types';
+
+export declare const NOTIFICATION_VARIANT: readonly ["success", "error", "warning", "info"];
+export type NotificationVariant = (typeof NOTIFICATION_VARIANT)[number];
+export declare const NOTIFICATION_ICONS: Record<NotificationVariant, IconName>;