@stihl-design-system/components 1.0.0-RC.11 → 1.0.0-RC.13

package/chunks/Select.E6gLFYLk.js

@@ -0,0 +1,194 @@
+"use client";
+import { j as t } from "./jsx-runtime.C115EyI4.js";
+import { c as r } 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.DpzETKdT.js";
+import { D as O } from "./Icon.BCmt_XBG.js";
+import { DSSystemFeedback as T } from "../systemfeedback.C3Pfxxpp.js";
+import { g as p } from "./helpers.B1JT5ShS.js";
+import '../assets/Select.D4EXgIbz.css';const V = "ds-select_root_1ui0h_1", Z = "ds-select_hint_1ui0h_9", J = "ds-select_label_1ui0h_9", K = "ds-select_wrapper_1ui0h_13", Q = "ds-select_affix_1ui0h_19", U = "ds-select_affix--small_1ui0h_40", X = "ds-select_affix--disabled_1ui0h_53", Y = "ds-select_prefix_1ui0h_61", z = "ds-select_affix--readonly_1ui0h_64", G = "ds-select_suffix_1ui0h_74", ee = "ds-select_action-button_1ui0h_81", se = "ds-select_label--hidden_1ui0h_99", te = "ds-select_label--disabled_1ui0h_112", le = "ds-select_feedback_1ui0h_132", ce = "ds-select_select-wrapper_1ui0h_137", ae = "ds-select_select_1ui0h_137", ne = "ds-select_select--invalid_1ui0h_262", ie = "ds-select_select--small_1ui0h_269", oe = "ds-select_input--has-leading-icon_1ui0h_322", de = "ds-select_input--has-action-button_1ui0h_325", re = "ds-select_input--has-second-action-button_1ui0h_328", _e = "ds-select_select--has-leading-icon_1ui0h_331", ue = "ds-select_select--has-action-button_1ui0h_334", he = "ds-select_select--has-second-action-button_1ui0h_337", fe = "ds-select_select--has-affix_1ui0h_340", pe = "ds-select_select--is-ready_1ui0h_354", be = "ds-select_select--placeholder_1ui0h_371", me = "ds-select_chevron_1ui0h_410", xe = "ds-select_chevron--small_1ui0h_414", ve = "ds-select_chevron--disabled_1ui0h_417", e = {
+  root: V,
+  hint: Z,
+  label: J,
+  wrapper: K,
+  affix: Q,
+  "affix--small": "ds-select_affix--small_1ui0h_40",
+  affixSmall: U,
+  "affix--disabled": "ds-select_affix--disabled_1ui0h_53",
+  affixDisabled: X,
+  prefix: Y,
+  "affix--readonly": "ds-select_affix--readonly_1ui0h_64",
+  affixReadonly: z,
+  suffix: G,
+  "action-button": "ds-select_action-button_1ui0h_81",
+  actionButton: ee,
+  "label--hidden": "ds-select_label--hidden_1ui0h_99",
+  labelHidden: se,
+  "label--disabled": "ds-select_label--disabled_1ui0h_112",
+  labelDisabled: te,
+  feedback: le,
+  "select-wrapper": "ds-select_select-wrapper_1ui0h_137",
+  selectWrapper: ce,
+  select: ae,
+  "select--invalid": "ds-select_select--invalid_1ui0h_262",
+  selectInvalid: ne,
+  "select--small": "ds-select_select--small_1ui0h_269",
+  selectSmall: ie,
+  "input--has-leading-icon": "ds-select_input--has-leading-icon_1ui0h_322",
+  inputHasLeadingIcon: oe,
+  "input--has-action-button": "ds-select_input--has-action-button_1ui0h_325",
+  inputHasActionButton: de,
+  "input--has-second-action-button": "ds-select_input--has-second-action-button_1ui0h_328",
+  inputHasSecondActionButton: re,
+  "select--has-leading-icon": "ds-select_select--has-leading-icon_1ui0h_331",
+  selectHasLeadingIcon: _e,
+  "select--has-action-button": "ds-select_select--has-action-button_1ui0h_334",
+  selectHasActionButton: ue,
+  "select--has-second-action-button": "ds-select_select--has-second-action-button_1ui0h_337",
+  selectHasSecondActionButton: he,
+  "select--has-affix": "ds-select_select--has-affix_1ui0h_340",
+  selectHasAffix: fe,
+  "select--is-ready": "ds-select_select--is-ready_1ui0h_354",
+  selectIsReady: pe,
+  "select--placeholder": "ds-select_select--placeholder_1ui0h_371",
+  selectPlaceholder: be,
+  chevron: me,
+  "chevron--small": "ds-select_chevron--small_1ui0h_414",
+  chevronSmall: xe,
+  "chevron--disabled": "ds-select_chevron--disabled_1ui0h_417",
+  chevronDisabled: ve
+}, Ee = ["medium", "small"], Se = ({
+  id: s,
+  label: a,
+  options: c
+}) => {
+  if (!s)
+    throw new Error(
+      p(
+        "DSSelect",
+        'A unique "id" prop is required. Please add an unique "id" prop to the DSSelect component.'
+      )
+    );
+  if (!a)
+    throw new Error(
+      p(
+        "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 (!c || c.length === 0)
+    throw new Error(
+      p(
+        "DSSelect",
+        'Options are always required. Please add an "options" prop to the DSSelect component.'
+      )
+    );
+}, ge = (s, a, c) => s === "" || a !== void 0 && a !== "" ? !1 : !(c !== void 0 && c !== ""), Le = ({
+  id: s,
+  label: a,
+  options: c,
+  className: H,
+  defaultValue: b,
+  disabled: _ = !1,
+  hideLabel: I = !1,
+  hint: u,
+  invalid: d = !1,
+  placeholder: h = "Select",
+  required: m = !1,
+  size: x = "medium",
+  systemFeedback: f,
+  value: v,
+  ...w
+}) => {
+  process.env.NODE_ENV !== "production" && Se({
+    id: s,
+    label: a,
+    options: c
+  });
+  const o = C(null), [j, A] = q(
+    ge(h, b, v)
+  );
+  W(() => {
+    if (!o.current) return;
+    const n = () => {
+      if (!o.current) return;
+      const i = o.current.value;
+      A(i === "");
+    }, l = o.current;
+    return l.addEventListener("change", n), () => {
+      l.removeEventListener("change", n);
+    };
+  }, []);
+  const B = F(I), S = `${s}-label`, g = `${s}-feedback`, D = `${s}-hint`, E = u ? ` ${D}` : "", L = (n) => [
+    h && /* @__PURE__ */ t.jsx("option", { value: "", children: h }, `${s}-hidden-option-disabled-placeholder`),
+    ...n.map((l) => {
+      if ("options" in l) {
+        const { label: i, options: $ } = l;
+        return /* @__PURE__ */ t.jsx("optgroup", { label: i, children: $.map(y) }, i);
+      } else
+        return y(l);
+    })
+  ], y = ({ label: n, value: l, isDisabled: i }) => /* @__PURE__ */ t.jsx("option", { value: l, disabled: i, children: n }, l), N = r(e.root, H), P = r(e.select, {
+    [e.selectSmall]: x === "small",
+    [e.selectInvalid]: d,
+    [e.selectPlaceholder]: j
+  }), k = r(e.label, {
+    // hide label only visually to keep them available for assistive technologies
+    [e.labelHidden]: B,
+    [e.labelDisabled]: _
+  }), R = r(e.chevron, {
+    [e.chevronSmall]: x === "small",
+    [e.chevronDisabled]: _
+  });
+  return /* @__PURE__ */ t.jsxs("div", { className: N, children: [
+    /* @__PURE__ */ t.jsxs("label", { className: k, id: S, htmlFor: s, children: [
+      a,
+      m && /* @__PURE__ */ t.jsx(M, {})
+    ] }),
+    u && /* @__PURE__ */ t.jsx("div", { className: e.hint, id: D, children: u }),
+    d && f && /* @__PURE__ */ t.jsx(
+      T,
+      {
+        className: e.feedback,
+        message: f,
+        type: "invalid",
+        id: g,
+        "aria-live": "assertive"
+      }
+    ),
+    /* @__PURE__ */ t.jsxs("div", { className: e.selectWrapper, children: [
+      /* @__PURE__ */ t.jsx(
+        "select",
+        {
+          ...w,
+          id: s,
+          ref: o,
+          className: P,
+          "aria-labelledby": `${S}${E}`,
+          "aria-describedby": d && f ? g : void 0,
+          "aria-invalid": d,
+          defaultValue: b,
+          value: v,
+          disabled: _,
+          required: m,
+          children: L(c)
+        }
+      ),
+      /* @__PURE__ */ t.jsx(
+        O,
+        {
+          name: "chevron-down",
+          className: R,
+          "aria-hidden": "true"
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  Le as D,
+  Ee as S,
+  ge as g,
+  Se as v
+};

package/chunks/Textarea.DUBSOpNL.js

@@ -0,0 +1,198 @@
+"use client";
+import { j as s } from "./jsx-runtime.C115EyI4.js";
+import { c as g } from "./index.CvOaL64Y.js";
+import { useState as d, useRef as re, useEffect as x } from "react";
+import { u as ne, h as oe } from "./useBreakpoint.5xBNDiCf.js";
+import { g as V, p as z } from "./helpers.B1JT5ShS.js";
+import { Asterisk as ie } from "../asterisk.DpzETKdT.js";
+import { DSSystemFeedback as le } from "../systemfeedback.C3Pfxxpp.js";
+import '../assets/Textarea.KJGPTYMz.css';const de = "ds-textarea_textarea_18bj7_1", ce = "ds-textarea_textarea--invalid_18bj7_113", _e = "ds-textarea_textarea--small_18bj7_120", ue = "ds-textarea_textarea--resize-auto_18bj7_139", be = "ds-textarea_root_18bj7_149", fe = "ds-textarea_hint_18bj7_157", xe = "ds-textarea_label_18bj7_157", je = "ds-textarea_affix_18bj7_161", me = "ds-textarea_affix--small_18bj7_182", he = "ds-textarea_affix--disabled_18bj7_195", pe = "ds-textarea_prefix_18bj7_203", ve = "ds-textarea_affix--readonly_18bj7_206", ge = "ds-textarea_suffix_18bj7_216", Se = "ds-textarea_leading-icon_18bj7_223", Ie = "ds-textarea_leading-icon--small_18bj7_235", Ce = "ds-textarea_leading-icon--disabled_18bj7_238", ye = "ds-textarea_action-button_18bj7_247", De = "ds-textarea_label--hidden_18bj7_265", Ae = "ds-textarea_label--disabled_18bj7_278", we = "ds-textarea_feedback_18bj7_298", Re = "ds-textarea_char-count_18bj7_303", Te = "ds-textarea_char-count-announcer_18bj7_319", t = {
+  textarea: de,
+  "textarea--invalid": "ds-textarea_textarea--invalid_18bj7_113",
+  textareaInvalid: ce,
+  "textarea--small": "ds-textarea_textarea--small_18bj7_120",
+  textareaSmall: _e,
+  "textarea--resize-auto": "ds-textarea_textarea--resize-auto_18bj7_139",
+  textareaResizeAuto: ue,
+  root: be,
+  hint: fe,
+  label: xe,
+  affix: je,
+  "affix--small": "ds-textarea_affix--small_18bj7_182",
+  affixSmall: me,
+  "affix--disabled": "ds-textarea_affix--disabled_18bj7_195",
+  affixDisabled: he,
+  prefix: pe,
+  "affix--readonly": "ds-textarea_affix--readonly_18bj7_206",
+  affixReadonly: ve,
+  suffix: ge,
+  "leading-icon": "ds-textarea_leading-icon_18bj7_223",
+  leadingIcon: Se,
+  "leading-icon--small": "ds-textarea_leading-icon--small_18bj7_235",
+  leadingIconSmall: Ie,
+  "leading-icon--disabled": "ds-textarea_leading-icon--disabled_18bj7_238",
+  leadingIconDisabled: Ce,
+  "action-button": "ds-textarea_action-button_18bj7_247",
+  actionButton: ye,
+  "label--hidden": "ds-textarea_label--hidden_18bj7_265",
+  labelHidden: De,
+  "label--disabled": "ds-textarea_label--disabled_18bj7_278",
+  labelDisabled: Ae,
+  feedback: we,
+  "char-count": "ds-textarea_char-count_18bj7_303",
+  charCount: Re,
+  "char-count-announcer": "ds-textarea_char-count-announcer_18bj7_319",
+  charCountAnnouncer: Te
+}, Pe = ["medium", "small"], Ee = ({ id: r, label: _ }) => {
+  if (!r)
+    throw new Error(
+      V(
+        "DSTextarea",
+        'A unique "id" prop is required. Please add an unique "id" prop to the DSTextarea component.'
+      )
+    );
+  if (!_)
+    throw new Error(
+      V(
+        "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}.`
+      )
+    );
+}, qe = ({
+  id: r,
+  label: _,
+  charsLimitText: P = "Character limit reached",
+  charsRemainingText: q = "Characters remaining:",
+  className: M,
+  defaultValue: O,
+  disabled: S = !1,
+  hint: j,
+  hideLabel: F = !1,
+  invalid: n = !1,
+  maxLength: e,
+  readonly: I = !1,
+  required: C = !1,
+  resize: u = "vertical",
+  size: W = "medium",
+  systemFeedback: i,
+  value: m,
+  wrapperClassName: X,
+  onChange: y,
+  onInput: D,
+  ...Z
+}) => {
+  process.env.NODE_ENV !== "production" && Ee({
+    id: r,
+    label: _
+  });
+  const [G, A] = d(O || ""), [l, w] = d(0), [J, R] = d(0), [K, T] = d("off"), [E, h] = d(i), [p, v] = d(n), N = m !== void 0, b = N ? m : G, o = re(null), Q = ne(F);
+  x(() => {
+    if (!e || e <= 0)
+      return;
+    l >= e * 0.8 ? T("polite") : T("off");
+    const a = setTimeout(() => {
+      R(e - l || 0);
+    }, 1e3);
+    return () => clearTimeout(a);
+  }, [l]), x(() => {
+    A(b || ""), c(), e && e > 0 && (w(b.toString().length || 0), R(e - b.toString().length || 0));
+  }, [m]), x(() => {
+    n && i ? (h(i), v(n)) : !n && e && e >= 0 && l >= e ? (v(!0), h(P)) : (h(i), v(n));
+  }, [n, p, i, l]), x(() => {
+    if (oe && u === "auto")
+      return c(), window.addEventListener("resize", c), () => window.removeEventListener("resize", c);
+  }, [u, o.current]);
+  const U = g(t.root, X), Y = g(t.textarea, M, {
+    // 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,
+    [t.labelDisabled]: S
+  }), B = `${r}-label`, $ = `${r}-feedback`, k = `${r}-hint`, H = `${r}-char-count-announcer`, ee = j ? ` ${k}` : "", c = () => {
+    if (o.current && u === "auto") {
+      o.current.style.height = "auto";
+      const a = z(o.current.scrollHeight), f = 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.
+      a + f}rem`;
+    }
+  }, ae = () => {
+    const a = [];
+    return e && e > 0 && a.push(H), n && i && a.push($), a.length > 0 ? a.join(" ") : void 0;
+  }, te = (a) => {
+    var f;
+    D && D(a), e && e > 0 && w(((f = o.current) == null ? void 0 : f.value.length) || 0), c();
+  }, se = (a) => {
+    y && y(a), N || A(a.target.value);
+  };
+  return /* @__PURE__ */ s.jsxs("div", { className: U, children: [
+    /* @__PURE__ */ s.jsxs("label", { className: L, id: B, htmlFor: r, children: [
+      _,
+      C && /* @__PURE__ */ s.jsx(ie, {})
+    ] }),
+    j && /* @__PURE__ */ s.jsx("div", { className: t.hint, id: k, children: j }),
+    p && E && /* @__PURE__ */ s.jsx(
+      le,
+      {
+        className: t.feedback,
+        message: E,
+        type: "invalid",
+        id: $
+      }
+    ),
+    /* @__PURE__ */ s.jsx(
+      "textarea",
+      {
+        className: Y,
+        id: r,
+        ref: o,
+        ...Z,
+        "aria-labelledby": `${B}${ee}`,
+        "aria-describedby": ae(),
+        "aria-invalid": n,
+        "aria-disabled": I,
+        maxLength: e,
+        readOnly: I,
+        required: C,
+        disabled: S,
+        value: b,
+        defaultValue: void 0,
+        rows: void 0,
+        cols: void 0,
+        onChange: se,
+        onInput: te
+      }
+    ),
+    e !== void 0 && e > 0 && /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+      /* @__PURE__ */ s.jsxs("div", { className: t.charCount, "aria-hidden": "true", children: [
+        l,
+        "/",
+        e
+      ] }),
+      /* @__PURE__ */ s.jsxs(
+        "div",
+        {
+          className: t.charCountAnnouncer,
+          id: H,
+          "aria-live": K,
+          "aria-atomic": "true",
+          children: [
+            q,
+            " ",
+            J
+          ]
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  qe as D,
+  Pe as T,
+  Ee as v
+};

package/chunks/Toast.DyEi2GEP.js

@@ -0,0 +1,89 @@
+"use client";
+import { j as t } from "./jsx-runtime.C115EyI4.js";
+import { c } from "./index.CvOaL64Y.js";
+import { forwardRef as u } from "react";
+import { DSButton as y } from "../button.M4nXjcUn.js";
+import { D as g } from "./Icon.BCmt_XBG.js";
+import '../assets/Toast.CuafTAf7.css';const h = "ds-toast_root_58y8a_5", p = "ds-toast_root--closing_58y8a_19", x = "ds-toast_fade-out_58y8a_1", I = "ds-toast_move-in_58y8a_1", S = "ds-toast_root--success_58y8a_54", N = "ds-toast_root--info_58y8a_58", j = "ds-toast_root--warning_58y8a_62", v = "ds-toast_content_58y8a_67", w = "ds-toast_content--hide-icon_58y8a_74", C = "ds-toast_icon_58y8a_78", D = "ds-toast_message_58y8a_82", o = {
+  root: h,
+  "root--closing": "ds-toast_root--closing_58y8a_19",
+  rootClosing: p,
+  "fade-out": "ds-toast_fade-out_58y8a_1",
+  fadeOut: x,
+  "move-in": "ds-toast_move-in_58y8a_1",
+  moveIn: I,
+  "root--success": "ds-toast_root--success_58y8a_54",
+  rootSuccess: S,
+  "root--info": "ds-toast_root--info_58y8a_58",
+  rootInfo: N,
+  "root--warning": "ds-toast_root--warning_58y8a_62",
+  rootWarning: j,
+  content: v,
+  "content--hide-icon": "ds-toast_content--hide-icon_58y8a_74",
+  contentHideIcon: w,
+  icon: C,
+  message: D
+}, O = {
+  success: "circle-check-colored",
+  warning: "triangle-exclamationmark-colored",
+  info: "circle-info-colored"
+}, T = u(
+  ({
+    message: n,
+    className: e,
+    hideIcon: a = !1,
+    variant: s = "info",
+    onClick: r,
+    onMouseEnter: i,
+    onMouseLeave: _,
+    ...d
+  }, l) => {
+    const m = c(o.root, e, {
+      [o.rootSuccess]: s === "success",
+      [o.rootWarning]: s === "warning",
+      [o.rootInfo]: s === "info"
+    }), f = c(o.content, {
+      [o.contentHideIcon]: a
+    });
+    return /* @__PURE__ */ t.jsx(
+      "aside",
+      {
+        className: m,
+        ref: l,
+        popover: "manual",
+        "data-ds-toast": !0,
+        onMouseEnter: i,
+        onMouseLeave: _,
+        "aria-label": n,
+        ...d,
+        children: /* @__PURE__ */ t.jsxs("div", { className: f, children: [
+          !a && /* @__PURE__ */ t.jsx(
+            g,
+            {
+              name: O[s],
+              className: o.icon,
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ t.jsx("div", { className: o.message, children: n }),
+          /* @__PURE__ */ t.jsx(
+            y,
+            {
+              hideLabel: !0,
+              iconName: "cross",
+              size: "small",
+              variant: "ghost",
+              onClick: r,
+              children: "Close toast"
+            }
+          )
+        ] })
+      }
+    );
+  }
+);
+T.displayName = "DSToast";
+export {
+  T as D,
+  o as s
+};

package/{combobox.BeTnbG1m.js → combobox.CzBpi97e.js}

@@ -1,6 +1,6 @@
 "use client";
 import { j as u } from "./chunks/jsx-runtime.C115EyI4.js";
-import { v as x, c as C } from "./chunks/CustomReactSelect.D3jv5-fa.js";
+import { v as x, c as C } from "./chunks/CustomReactSelect.CQ1uexBH.js";
 const v = ({
   id: s,
   label: o,

package/components/Combobox/Combobox.d.ts

@@ -1,4 +1,4 @@
-import { CustomReactSelectProps } from '../CustomReactSelect/CustomReactSelect';
+import { CustomReactSelectProps } from './CustomReactSelect/CustomReactSelect';
 type CommonComboboxProps = {
     /** Opens the dropdown on click or focus.
      * @default false

package/components/{CustomReactSelect → Combobox/CustomReactSelect}/CustomReactSelect.d.ts

@@ -1,6 +1,6 @@
 import { GroupBase } from 'react-select';
-import { BreakpointCustomizable, Optional } from '../../types';
-import { ComboboxAriaTranslations, ComboboxLanguage, ComboboxOption, ComboboxOptionsGroup, ComboboxOptionsOrOptGroups, ComboboxSize } from '../Combobox/Combobox.utils';
+import { BreakpointCustomizable, Optional } from '../../../types';
+import { ComboboxAriaTranslations, 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';

package/components/{CustomReactSelect → Combobox/CustomReactSelect}/CustomReactSelect.utils.d.ts

@@ -1,3 +1,3 @@
 import { AriaLiveMessages, GroupBase } from 'react-select';
-import { ComboboxAriaTranslations } from '../Combobox/Combobox.utils';
+import { ComboboxAriaTranslations } from '../Combobox.utils';
 export declare const defaultAriaLiveMessages: (translations: ComboboxAriaTranslations) => AriaLiveMessages<unknown, boolean, GroupBase<unknown>>;

package/components/Notification/Notification.d.ts

@@ -9,10 +9,6 @@ export interface NotificationProps extends HTMLAttributes<HTMLDivElement> {
     closeButtonLabel?: string;
     /** Content within the Notification's action bar. For example a CTA button. */
     customActionArea?: React.ReactNode;
-    /** Hides the close button.
-     * @default false
-     */
-    hideCloseButton?: boolean;
     /** Hides the icon.
      * @default false
      */
@@ -21,7 +17,7 @@ export interface NotificationProps extends HTMLAttributes<HTMLDivElement> {
      * @default 'info'
      */
     variant?: NotificationVariant;
-    /** Callback function called when the close button is clicked. */
+    /** Shows a close button if provided and is called when the close button is clicked. */
     onClose?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 }
 /**
@@ -32,4 +28,4 @@ export interface NotificationProps extends HTMLAttributes<HTMLDivElement> {
  *
  * <div className="ds-info">For more information on the different types of notifications and to determine which is best suited for your needs, please refer to our [Notification Guidelines](/docs/templates-notification-guidelines--documentation) and explore the decision trees provided.</div>
  */
-export declare const DSNotification: ({ children, variant, className, closeButtonLabel, customActionArea, hideCloseButton, hideIcon, onClose, ...rest }: NotificationProps) => JSX.Element;
+export declare const DSNotification: ({ children, variant, className, closeButtonLabel, customActionArea, hideIcon, onClose, ...rest }: NotificationProps) => JSX.Element;

package/components/Radio/Radio.d.ts

@@ -20,7 +20,7 @@ export interface RadioProps extends InputHTMLAttributes<HTMLInputElement> {
      * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
-    /** Makes the label use `ds-utility-medium-bold` if any option has a `hint` and `hideUncheckedHint` is set to false.
+    /** Makes the label use `ds.utility-medium-bold` if any option has a `hint` and `hideUncheckedHint` is set to false.
      * @default false
      */
     isBold?: boolean;

package/customreactselect.d.ts

@@ -1,2 +1,2 @@
-export * from './components/CustomReactSelect/CustomReactSelect'
+export * from './components/Combobox/CustomReactSelect/CustomReactSelect'
 export {}

package/customreactselect.qf7CIeFs.js

@@ -0,0 +1,13 @@
+"use client";
+import "./chunks/jsx-runtime.C115EyI4.js";
+import "./chunks/index.CvOaL64Y.js";
+import "react";
+import { c as l } from "./chunks/CustomReactSelect.CQ1uexBH.js";
+import "./chunks/useBreakpoint.5xBNDiCf.js";
+import "./asterisk.DpzETKdT.js";
+import "./chunks/Icon.BCmt_XBG.js";
+import "./systemfeedback.C3Pfxxpp.js";
+import "./optioncheckbox.BRUTnQnJ.js";
+export {
+  l as CustomReactSelect
+};

package/{dialog.lGwNQU91.js → dialog.DYlBUsOD.js}

@@ -2,8 +2,8 @@
 import "./chunks/jsx-runtime.C115EyI4.js";
 import "./chunks/index.CvOaL64Y.js";
 import "react";
-import "./button.C5opEJ6x.js";
-import { D as e } from "./chunks/Dialog.Fwr6vLiK.js";
+import "./button.M4nXjcUn.js";
+import { D as e } from "./chunks/Dialog.CudsqNag.js";
 export {
   e as DSDialog
 };

package/{drawer.DNi5m8wP.js → drawer.CvhbP1ra.js}

@@ -2,8 +2,8 @@
 import "./chunks/jsx-runtime.C115EyI4.js";
 import "./chunks/index.CvOaL64Y.js";
 import "react";
-import "./button.C5opEJ6x.js";
-import { D as e } from "./chunks/Drawer.CKoYzQHd.js";
+import "./button.M4nXjcUn.js";
+import { D as e } from "./chunks/Drawer.ueG2Bzr9.js";
 export {
   e as DSDrawer
 };

package/fieldset.CtUGEdLv.js

@@ -0,0 +1,11 @@
+"use client";
+import "./chunks/jsx-runtime.C115EyI4.js";
+import "./chunks/index.CvOaL64Y.js";
+import "react";
+import "./asterisk.DpzETKdT.js";
+import "./heading.IPIYc5vW.js";
+import "./systemfeedback.C3Pfxxpp.js";
+import { D as l } from "./chunks/Fieldset.Cjmkgxxk.js";
+export {
+  l as DSFieldset
+};

package/flag.BKpsdB_-.js

@@ -0,0 +1,43 @@
+"use client";
+import { j as s } from "./chunks/jsx-runtime.C115EyI4.js";
+import { c } from "./chunks/index.CvOaL64Y.js";
+import { D as i } from "./chunks/Icon.BCmt_XBG.js";
+import './assets/flag.B-RLcMcf.css';const n = "ds-flag_root_14d3h_1", f = "ds-flag_root--color-grey-light_14d3h_28", C = "ds-flag_root--color-yellow-light_14d3h_31", y = "ds-flag_root--color-red-light_14d3h_34", m = "ds-flag_root--color-green-light_14d3h_37", L = "ds-flag_root--color-orange-base_14d3h_40", r = {
+  root: n,
+  "root--color-grey-light": "ds-flag_root--color-grey-light_14d3h_28",
+  rootColorGreyLight: f,
+  "root--color-yellow-light": "ds-flag_root--color-yellow-light_14d3h_31",
+  rootColorYellowLight: C,
+  "root--color-red-light": "ds-flag_root--color-red-light_14d3h_34",
+  rootColorRedLight: y,
+  "root--color-green-light": "ds-flag_root--color-green-light_14d3h_37",
+  rootColorGreenLight: m,
+  "root--color-orange-base": "ds-flag_root--color-orange-base_14d3h_40",
+  rootColorOrangeBase: L
+}, x = ({
+  children: g,
+  className: h,
+  color: o,
+  iconName: t,
+  iconSource: l,
+  ...a
+}) => {
+  const e = typeof o == "string" && r[`root--color-${o}`], d = e ? {} : { backgroundColor: o }, _ = c(r.root, h, {
+    [r[`root--color-${o}`]]: e
+  });
+  return /* @__PURE__ */ s.jsxs("span", { className: _, style: d, ...a, children: [
+    (t || l) && /* @__PURE__ */ s.jsx(
+      i,
+      {
+        name: t,
+        theme: "light",
+        source: l,
+        "aria-hidden": "true"
+      }
+    ),
+    g
+  ] });
+};
+export {
+  x as DSFlag
+};