@stihl-design-system/components 1.0.0-RC.6 → 1.0.0-RC.7

package/{arialiveregions.BvZhV6hb.js → arialiveregions.BK4T7Vhk.js}

@@ -1,6 +1,6 @@
 "use client";
 import { j as s } from "./chunks/jsx-runtime.C115EyI4.js";
-import { v as r, A as n, a } from "./chunks/AriaLiveRegions.utils.DzWI5KCU.js";
+import { v as r, A as n, a } from "./chunks/AriaLiveRegions.utils.D2ni4Yrf.js";
 import './assets/arialiveregions.GsGx2USO.css';const l = "_sr-only_echuy_76", e = {
   "sr-only": "_sr-only_echuy_76",
   srOnly: l

package/chunks/AriaLiveRegions.utils.D2ni4Yrf.js

@@ -0,0 +1,34 @@
+"use client";
+import { g as i } from "./helpers.B1JT5ShS.js";
+import "react";
+import { h as s } from "./has-document.r9i9TxKV.js";
+const e = "ds-alert-live-region", t = "ds-status-live-region", g = () => document.getElementById(e), c = () => document.getElementById(t), m = () => {
+  if (!s)
+    return;
+  const n = document.querySelectorAll(
+    `#${e}`
+  ), o = document.querySelectorAll(
+    `#${t}`
+  );
+  if (n.length > 1)
+    throw new Error(
+      i(
+        "DSAriaLiveRegions",
+        `The DSAriaLiveRegions component with id="${e}" should only be present once on the page. Found ${n.length} instances.`
+      )
+    );
+  if (o.length > 1)
+    throw new Error(
+      i(
+        "DSAriaLiveRegions",
+        `The DSAriaLiveRegions component with id="${t}" should only be present once on the page. Found ${o.length} instances.`
+      )
+    );
+};
+export {
+  e as A,
+  t as a,
+  c as b,
+  g,
+  m as v
+};

package/chunks/{Input.utils.AKWCNkpA.js → Input.utils.BGUhXCNP.js}

@@ -1,7 +1,8 @@
 "use client";
 import { g as t } from "./helpers.B1JT5ShS.js";
 import "react";
-const p = typeof document < "u", a = 8, i = 5, I = ["medium", "small"], u = [
+import { h as p } from "./has-document.r9i9TxKV.js";
+const a = 8, i = 5, T = ["medium", "small"], u = [
   "color",
   "date",
   "datetime-local",
@@ -26,15 +27,15 @@ const p = typeof document < "u", a = 8, i = 5, I = ["medium", "small"], u = [
   "submit",
   "image",
   "datetime"
-], T = ({
+], b = ({
   id: e,
   label: n,
   prefix: o,
   suffix: s,
   leadingIconName: r,
   leadingIconSource: d,
-  actionButtonIconName: c,
-  actionButtonIconSource: m
+  actionButtonIconName: m,
+  actionButtonIconSource: c
 }) => {
   if (!e)
     throw new Error(
@@ -65,13 +66,13 @@ const p = typeof document < "u", a = 8, i = 5, I = ["medium", "small"], u = [
       "DSInput",
       "Prefix and a leading Icon cannot be used at the same time."
     )
-  ), s && (c || m) && console.warn(
+  ), s && (m || c) && console.warn(
     t(
       "DSInput",
       "Suffix and an action button cannot be used at the same time."
     )
   );
-}, b = (e) => {
+}, D = (e) => {
   if (!u.includes(e) && !l.includes(e))
     throw new Error(
       t(
@@ -94,17 +95,17 @@ const p = typeof document < "u", a = 8, i = 5, I = ["medium", "small"], u = [
     hidden: 'Type hidden is not supported by DSInput component. Use a default <input type="hidden" /> element instead.'
   };
   n[e] && console.warn(t("DSInput", n[e]));
-}, h = () => p && "showPicker" in HTMLInputElement.prototype && !!window.navigator.userAgent.match(/chrome|chromium|crios|edg/i), D = (e, n) => h() && (e || n), y = (e) => e === "date" || e === "datetime-local" || e === "month", U = (e) => e === "time";
+}, h = () => p && "showPicker" in HTMLInputElement.prototype && !!window.navigator.userAgent.match(/chrome|chromium|crios|edg/i), y = (e, n) => h() && (e || n), U = (e) => e === "date" || e === "datetime-local" || e === "month", P = (e) => e === "time";
 export {
-  I,
+  T as I,
   a as M,
   u as S,
   l as U,
   i as a,
-  b,
-  U as c,
+  D as b,
+  P as c,
   h,
-  y as i,
-  D as s,
-  T as v
+  U as i,
+  y as s,
+  b as v
 };

package/chunks/{InputStepper.BkncCNwJ.js → InputStepper.Bf8NZ9pb.js}

@@ -5,7 +5,7 @@ import { useState as _, useRef as N, useEffect as w, useLayoutEffect as M } from
 import { u as _t } from "./useBreakpoint.5xBNDiCf.js";
 import { Asterisk as ft } from "../asterisk.Cjbk-xZi.js";
 import { DSButton as X } from "../button.L1lgCuM9.js";
-import { M as E, a as H } from "./Input.utils.AKWCNkpA.js";
+import { M as E, a as H } from "./Input.utils.BGUhXCNP.js";
 import { DSSystemFeedback as ht } from "../systemfeedback.CUWch42u.js";
 import { g as y } from "./helpers.B1JT5ShS.js";
 import '../assets/InputStepper.BKjqNi-i.css';const mt = "_input_xdphx_226", bt = "_input--invalid_xdphx_336", St = "_input--small_xdphx_343", yt = "_input--has-leading-icon_xdphx_395", vt = "_input--has-action-button_xdphx_398", It = "_input--has-second-action-button_xdphx_401", gt = "_input--has-affix_xdphx_413", At = "_input--is-ready_xdphx_427", Bt = "_root_xdphx_437", Dt = "_hint_xdphx_445", Nt = "_label_xdphx_445", wt = "_wrapper_xdphx_449", Et = "_affix_xdphx_455", Ht = "_affix--small_xdphx_475", Lt = "_affix--disabled_xdphx_487", jt = "_prefix_xdphx_490", Rt = "_affix--readonly_xdphx_493", kt = "_suffix_xdphx_503", Ct = "_action-button_xdphx_510", $t = "_label--hidden_xdphx_527", Ft = "_feedback_xdphx_554", Vt = "_second-action-button_xdphx_568", Pt = "_value-announcer_xdphx_572", n = {

package/chunks/has-document.r9i9TxKV.js

@@ -0,0 +1,5 @@
+"use client";
+const e = typeof document < "u";
+export {
+  e as h
+};

package/components/Toast/ToastManager.d.ts

@@ -1,6 +1,10 @@
 import { ToastOptions } from './Toast.utils';
 
-export declare const useToast: () => {
-    toast: import("react/jsx-runtime").JSX.Element | undefined;
-    queueToastMessage: (message: string, options?: ToastOptions) => void;
+type ToastContextType = {
+    queueDSToastMessage: (message: string, options?: ToastOptions) => void;
 };
+export declare const useDSToast: () => ToastContextType;
+export declare const DSToastProvider: ({ children, }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export {};

package/index.d.ts

@@ -46,3 +46,4 @@ export * from './components/Textarea/Textarea';
 export * from './components/Textarea/Textarea.utils';
 export * from './components/Title/Title';
 export * from './components/Title/Title.utils';
+export * from './components/Toast/ToastManager';

package/index.es.js

@@ -1,7 +1,7 @@
 "use client";
-import { DSAriaLiveRegions as x } from "./arialiveregions.BvZhV6hb.js";
-import { DSButton as N } from "./button.L1lgCuM9.js";
-import { DSButtonRound as u } from "./buttonround.ddSqXjYf.js";
+import { DSAriaLiveRegions as x } from "./arialiveregions.BK4T7Vhk.js";
+import { DSButton as u } from "./button.L1lgCuM9.js";
+import { DSButtonRound as c } from "./buttonround.ddSqXjYf.js";
 import { DSCheckbox as f } from "./checkbox.DNHdo6_n.js";
 import { D as E, v as A } from "./chunks/CheckboxGroup.DsQ6lI5a.js";
 import { DSCombobox as g } from "./combobox.CRlhqmuO.js";
@@ -10,13 +10,13 @@ import { D as X, v as b } from "./chunks/Fieldset.B1vsrHNv.js";
 import { DSFloatingActionButton as Z } from "./floatingactionbutton.D_e4vz2G.js";
 import { DSHeading as H } from "./heading.BTNroD1E.js";
 import { D as M, I as w, u as V } from "./chunks/Icon.n4XZrQ4N.js";
-import { DSInput as y } from "./input.ChVISFEX.js";
-import { I as Y, M as q, a as j, S as z, U as J, h as Q, i as $, c as oo, s as ao, v as eo, b as to } from "./chunks/Input.utils.AKWCNkpA.js";
+import { DSInput as y } from "./input.DqSOhSMX.js";
+import { I as Y, M as q, a as j, S as z, U as J, h as Q, i as $, c as oo, s as eo, v as ao, b as to } from "./chunks/Input.utils.BGUhXCNP.js";
 import { D as so, v as po } from "./chunks/InputPassword.a7zHKrmM.js";
 import { D as So, i as lo, v as mo } from "./chunks/InputSearch.DITRiB92.js";
-import { D as Io, v as To } from "./chunks/InputStepper.BkncCNwJ.js";
+import { D as Io, v as To } from "./chunks/InputStepper.Bf8NZ9pb.js";
 import { DSLink as xo } from "./link.SAcKvzJ3.js";
-import { DSLinkStandalone as co } from "./linkstandalone.DNe0Nydm.js";
+import { DSLinkStandalone as No } from "./linkstandalone.DNe0Nydm.js";
 import { DSLogo as _o } from "./logo.BR_CUXFl.js";
 import { D as ho, a as Eo, N as Ao } from "./chunks/Notification.DVVuSOqG.js";
 import { D as go, a as vo, o as Po, v as Co } from "./chunks/RadioGroup.BO4pbAJw.js";
@@ -27,12 +27,13 @@ import { DSSwitch as ko } from "./switch.rd7PdLc9.js";
 import { DSText as wo } from "./text.CrYUewrP.js";
 import { D as Ko, T as yo, v as Wo } from "./chunks/Textarea.oqCrSopu.js";
 import { DSTitle as qo } from "./title.Dvp8LKJt.js";
-const o = ["medium", "small"], a = [
+import { DSToastProvider as zo, useDSToast as Jo } from "./toastmanager.BncH_rUP.js";
+const o = ["medium", "small"], e = [
   "filled",
   "highlight",
   "outline",
   "ghost"
-], e = ["filled", "highlight"], t = [
+], a = ["filled", "highlight"], t = [
   "x-large",
   "x-large-uppercase",
   "large",
@@ -70,13 +71,13 @@ const o = ["medium", "small"], a = [
   "xx-small"
 ], n = ["bold", "normal"], I = ["x-large", "large"];
 export {
-  e as BUTTON_ROUND_VARIANT,
+  a as BUTTON_ROUND_VARIANT,
   o as BUTTON_SIZE,
-  a as BUTTON_VARIANT,
+  e as BUTTON_VARIANT,
   P as COMBOBOX_SIZE,
   x as DSAriaLiveRegions,
-  N as DSButton,
-  u as DSButtonRound,
+  u as DSButton,
+  c as DSButtonRound,
   f as DSCheckbox,
   E as DSCheckboxGroup,
   g as DSCombobox,
@@ -89,7 +90,7 @@ export {
   So as DSInputSearch,
   Io as DSInputStepper,
   xo as DSLink,
-  co as DSLinkStandalone,
+  No as DSLinkStandalone,
   _o as DSLogo,
   ho as DSNotification,
   go as DSRadioGroup,
@@ -100,6 +101,7 @@ export {
   wo as DSText,
   Ko as DSTextarea,
   qo as DSTitle,
+  zo as DSToastProvider,
   C as DS_COMBOBOX_TRANSLATIONS,
   R as DS_COMBOBOX_TRANSLATIONS_DE,
   L as DS_COMBOBOX_TRANSLATIONS_EN,
@@ -130,13 +132,14 @@ export {
   lo as isWithinForm,
   vo as optionsHaveCustomArea,
   Po as optionsHaveHint,
-  ao as showCustomCalendarOrTimeIndicator,
+  eo as showCustomCalendarOrTimeIndicator,
+  Jo as useDSToast,
   V as useDynamicSvgImport,
   A as validateCheckboxGroupProps,
   B as validateComboboxProps,
   b as validateFieldsetProps,
   po as validateInputPasswordProps,
-  eo as validateInputProps,
+  ao as validateInputProps,
   mo as validateInputSearchProps,
   To as validateInputStepperProps,
   Co as validateRadioGroupProps,

package/{input.ChVISFEX.js → input.DqSOhSMX.js}

@@ -7,7 +7,7 @@ import { Asterisk as ea } from "./asterisk.Cjbk-xZi.js";
 import { DSButton as E } from "./button.L1lgCuM9.js";
 import { D as la } from "./chunks/Icon.n4XZrQ4N.js";
 import { DSSystemFeedback as oa } from "./systemfeedback.CUWch42u.js";
-import { v as da, b as ca, M as _a, a as ua, s as fa, c as ra, i as v } from "./chunks/Input.utils.AKWCNkpA.js";
+import { v as da, b as ca, M as _a, a as ua, s as fa, c as ra, i as v } from "./chunks/Input.utils.BGUhXCNP.js";
 import './assets/input.71tOIrpp.css';const pa = "_input_1jdyx_226", xa = "_input--invalid_1jdyx_336", ma = "_input--small_1jdyx_343", ya = "_input--has-leading-icon_1jdyx_395", ja = "_input--has-action-button_1jdyx_398", ha = "_input--has-second-action-button_1jdyx_401", ba = "_input--has-affix_1jdyx_413", ga = "_input--is-ready_1jdyx_427", Ia = "_root_1jdyx_434", Sa = "_hint_1jdyx_442", Ha = "_label_1jdyx_442", ka = "_wrapper_1jdyx_446", va = "_affix_1jdyx_452", Ca = "_affix--small_1jdyx_472", Ra = "_affix--disabled_1jdyx_484", Da = "_prefix_1jdyx_487", La = "_affix--readonly_1jdyx_490", Aa = "_suffix_1jdyx_500", Na = "_leading-icon_1jdyx_507", Ba = "_leading-icon--small_1jdyx_519", wa = "_leading-icon--disabled_1jdyx_522", Ea = "_action-button_1jdyx_531", Ta = "_label--hidden_1jdyx_548", Fa = "_feedback_1jdyx_575", a = {
   input: pa,
   "input--invalid": "_input--invalid_1jdyx_336",

package/{inputstepper.CTpTeXL9.js → inputstepper.DFQ4zC15.js}

@@ -5,9 +5,9 @@ import "react";
 import "./chunks/useBreakpoint.5xBNDiCf.js";
 import "./asterisk.Cjbk-xZi.js";
 import "./button.L1lgCuM9.js";
-import "./chunks/Input.utils.AKWCNkpA.js";
+import "./chunks/Input.utils.BGUhXCNP.js";
 import "./systemfeedback.CUWch42u.js";
-import { D } from "./chunks/InputStepper.BkncCNwJ.js";
+import { D } from "./chunks/InputStepper.Bf8NZ9pb.js";
 export {
   D as DSInputStepper
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@stihl-design-system/components",
   "private": false,
-  "version": "1.0.0-RC.6",
+  "version": "1.0.0-RC.7",
   "license": "SEE LICENSE IN LICENSE",
   "homepage": "https://main--63440bbb95889041542a5ba3.chromatic.com",
   "keywords": [

package/toastmanager.BncH_rUP.js

@@ -0,0 +1,117 @@
+"use client";
+import { j as h } from "./chunks/jsx-runtime.C115EyI4.js";
+import { createContext as C, useContext as P, useState as S, useRef as O, useEffect as A, useMemo as j } from "react";
+import { g as a } from "./chunks/helpers.B1JT5ShS.js";
+import { g as E, b as x } from "./chunks/AriaLiveRegions.utils.D2ni4Yrf.js";
+import { D as _, s as U } from "./chunks/Toast.RON4bFPY.js";
+import { h as q } from "./chunks/has-document.r9i9TxKV.js";
+const Q = () => {
+  if (!E() || !x())
+    throw new Error(
+      a(
+        "DSToast",
+        'The DSAriaLiveRegions component has to be placed at the root of your application, as close to the "body" as possible, e.g. in your "App.tsx" or "layout.tsx".'
+      )
+    );
+}, k = () => {
+  if (!q)
+    return;
+  if (document.querySelectorAll("[data-ds-toast]").length > 1)
+    throw new Error(
+      a(
+        "DSToast",
+        'The destructured "toast" element should only be used once in the DOM.'
+      )
+    );
+}, i = "data-ds-toast-timeout-id", D = "closing", B = 1e4, w = C(void 0), J = () => {
+  const n = P(w);
+  if (!n)
+    throw new Error(
+      a(
+        "DSToastProvider",
+        "useDSToast must be used within a <DSToastProvider />, which wraps around your root component."
+      )
+    );
+  return n;
+}, K = ({
+  children: n
+}) => {
+  const [u, c] = S([]), [s, l] = S(null), o = O(null);
+  A(() => {
+    !s && u.length > 0 && setTimeout(() => {
+      l(u[0]);
+    });
+  }, [u]), A(() => {
+    s && (M(s.message, s.variant), I());
+  }, [s]);
+  const m = () => {
+    var e;
+    return ((e = o.current) == null ? void 0 : e.getAttribute(i)) || null;
+  }, T = (e) => {
+    var t;
+    (t = o.current) == null || t.setAttribute(i, e);
+  }, L = () => {
+    var e;
+    return (e = o.current) == null ? void 0 : e.removeAttribute(i);
+  }, M = (e, t) => {
+    if (t === "warning") {
+      const r = E();
+      r && (r.innerText = e);
+    } else if (t === "success" || t === "info") {
+      const r = x();
+      r && (r.innerText = e);
+    }
+  }, d = (e, t) => {
+    Q();
+    const r = {
+      message: e,
+      hideIcon: t == null ? void 0 : t.hideIcon,
+      variant: (t == null ? void 0 : t.variant) || "info",
+      onClick: () => {
+        g();
+      },
+      onMouseEnter: R,
+      onMouseLeave: p
+    };
+    c((y) => [...y, r]);
+  }, R = () => {
+    f();
+  }, f = () => {
+    var t;
+    const e = m();
+    e && (clearTimeout(e), (t = o.current) == null || t.removeAttribute(i));
+  }, v = () => {
+    const e = setTimeout(() => {
+      g();
+    }, B);
+    T(String(e));
+  }, p = () => {
+    m() !== D && o.current && v();
+  }, I = () => {
+    k(), o.current && s && (o.current.showPopover(), v());
+  }, g = () => {
+    f(), T(D), o.current && (o.current.addEventListener(
+      "animationend",
+      () => {
+        o.current && (o.current.hidePopover(), L(), o.current = null, c((e) => e.slice(1)), l(null));
+      },
+      {
+        once: !0
+        // removes event listener after being called once
+      }
+    ), o.current.classList.add(U.rootClosing));
+  }, b = j(
+    () => ({
+      queueDSToastMessage: d
+    }),
+    [d]
+  );
+  return /* @__PURE__ */ h.jsxs(w.Provider, { value: b, children: [
+    s ? /* @__PURE__ */ h.jsx(_, { ...s, ref: o }) : void 0,
+    n
+  ] });
+};
+export {
+  K as DSToastProvider,
+  J as useDSToast
+};

package/chunks/AriaLiveRegions.utils.DzWI5KCU.js

@@ -1,31 +0,0 @@
-"use client";
-import { g as i } from "./helpers.B1JT5ShS.js";
-import "react";
-const e = "ds-alert-live-region", n = "ds-status-live-region", r = () => document.getElementById(e), a = () => document.getElementById(n), g = () => {
-  const t = document.querySelectorAll(
-    `#${e}`
-  ), o = document.querySelectorAll(
-    `#${n}`
-  );
-  if (t.length > 1)
-    throw new Error(
-      i(
-        "DSAriaLiveRegions",
-        `The DSAriaLiveRegions component with id="${e}" should only be present once on the page. Found ${t.length} instances.`
-      )
-    );
-  if (o.length > 1)
-    throw new Error(
-      i(
-        "DSAriaLiveRegions",
-        `The DSAriaLiveRegions component with id="${n}" should only be present once on the page. Found ${o.length} instances.`
-      )
-    );
-};
-export {
-  e as A,
-  n as a,
-  a as b,
-  r as g,
-  g as v
-};

package/toastmanager.D-uIi-TS.js

@@ -1,96 +0,0 @@
-"use client";
-import { j as w } from "./chunks/jsx-runtime.C115EyI4.js";
-import { useState as f, useRef as x, useEffect as g } from "react";
-import { g as h, b as A } from "./chunks/AriaLiveRegions.utils.DzWI5KCU.js";
-import { D, s as y } from "./chunks/Toast.RON4bFPY.js";
-import { g as E } from "./chunks/helpers.B1JT5ShS.js";
-const O = () => {
-  if (!h() || !A())
-    throw new Error(
-      E(
-        "DSToast",
-        'The DSAriaLiveRegions component has to be placed at the root of your application, as close to the "body" as possible, e.g. in your "App.tsx" or "layout.tsx".'
-      )
-    );
-}, C = () => {
-  if (document.querySelectorAll("[data-ds-toast]").length > 1)
-    throw new Error(
-      E(
-        "DSToast",
-        'The destructured "toast" element should only be used once in the DOM.'
-      )
-    );
-}, i = "data-ds-toast-timeout-id", v = "closing", P = 1e4, k = () => {
-  const [r, u] = f([]), [s, a] = f(null), o = x(null);
-  g(() => {
-    !s && r.length > 0 && setTimeout(() => {
-      a(r[0]);
-    });
-  }, [r]), g(() => {
-    s && (R(s.message, s.variant), b());
-  }, [s]);
-  const c = () => {
-    var e;
-    return ((e = o.current) == null ? void 0 : e.getAttribute(i)) || null;
-  }, l = (e) => {
-    var t;
-    (t = o.current) == null || t.setAttribute(i, e);
-  }, L = () => {
-    var e;
-    return (e = o.current) == null ? void 0 : e.removeAttribute(i);
-  }, R = (e, t) => {
-    if (t === "warning") {
-      const n = h();
-      n && (n.innerText = e);
-    } else if (t === "success" || t === "info") {
-      const n = A();
-      n && (n.innerText = e);
-    }
-  }, S = (e, t) => {
-    O();
-    const n = {
-      message: e,
-      hideIcon: t == null ? void 0 : t.hideIcon,
-      variant: (t == null ? void 0 : t.variant) || "info",
-      onClick: () => {
-        d();
-      },
-      onMouseEnter: I,
-      onMouseLeave: M
-    };
-    u((p) => [...p, n]);
-  }, I = () => {
-    T();
-  }, T = () => {
-    var t;
-    const e = c();
-    e && (clearTimeout(e), (t = o.current) == null || t.removeAttribute(i));
-  }, m = () => {
-    const e = setTimeout(() => {
-      d();
-    }, P);
-    l(String(e));
-  }, M = () => {
-    c() !== v && o.current && m();
-  }, b = () => {
-    C(), o.current && s && (o.current.showPopover(), m());
-  }, d = () => {
-    T(), l(v), o.current && (o.current.addEventListener(
-      "animationend",
-      () => {
-        o.current && (o.current.hidePopover(), L(), o.current = null, u((e) => e.slice(1)), a(null));
-      },
-      {
-        once: !0
-        // removes event listener after being called once
-      }
-    ), o.current.classList.add(y.rootClosing));
-  };
-  return {
-    toast: s ? /* @__PURE__ */ w.jsx(D, { ...s, ref: o }) : void 0,
-    queueToastMessage: S
-  };
-};
-export {
-  k as useToast
-};