@stihl-design-system/components 1.0.0-RC.10 → 1.0.0-RC.12

package/buttonround.0mw4zzlU.js

@@ -1,118 +0,0 @@
-"use client";
-import { j as r } from "./chunks/jsx-runtime.C115EyI4.js";
-import { c as i } from "./chunks/index.CvOaL64Y.js";
-import { D } from "./chunks/Icon.C2o2seDb.js";
-import { DSSpinner as H } from "./spinner.D-xrotcu.js";
-import './assets/buttonround.DlH_ipDo.css';const p = "_root_y7qt0_151", F = "_root--highlight_y7qt0_220", O = "_root--dark-highlight_y7qt0_220", G = "_root--filled_y7qt0_298", I = "_root--outline_y7qt0_326", S = "_root--ghost_y7qt0_353", x = "_root--ghost-flush_y7qt0_378", j = "_root--small_y7qt0_384", L = "_root--dark-filled_y7qt0_461", C = "_root--dark-outline_y7qt0_520", N = "_root--dark-ghost_y7qt0_578", R = "_root--dark-ghost-flush_y7qt0_634", B = "_root--icon-left_y7qt0_693", E = "_root--icon-only_y7qt0_709", T = "_root--icon-only-small_y7qt0_718", w = "_loader_y7qt0_735", z = "_icon--hidden_y7qt0_747", A = "_label--hidden_y7qt0_751", J = "_label--loading_y7qt0_763", o = {
-  root: p,
-  "root--highlight": "_root--highlight_y7qt0_220",
-  rootHighlight: F,
-  "root--dark-highlight": "_root--dark-highlight_y7qt0_220",
-  rootDarkHighlight: O,
-  "root--filled": "_root--filled_y7qt0_298",
-  rootFilled: G,
-  "root--outline": "_root--outline_y7qt0_326",
-  rootOutline: I,
-  "root--ghost": "_root--ghost_y7qt0_353",
-  rootGhost: S,
-  "root--ghost-flush": "_root--ghost-flush_y7qt0_378",
-  rootGhostFlush: x,
-  "root--small": "_root--small_y7qt0_384",
-  rootSmall: j,
-  "root--dark-filled": "_root--dark-filled_y7qt0_461",
-  rootDarkFilled: L,
-  "root--dark-outline": "_root--dark-outline_y7qt0_520",
-  rootDarkOutline: C,
-  "root--dark-ghost": "_root--dark-ghost_y7qt0_578",
-  rootDarkGhost: N,
-  "root--dark-ghost-flush": "_root--dark-ghost-flush_y7qt0_634",
-  rootDarkGhostFlush: R,
-  "root--icon-left": "_root--icon-left_y7qt0_693",
-  rootIconLeft: B,
-  "root--icon-only": "_root--icon-only_y7qt0_709",
-  rootIconOnly: E,
-  "root--icon-only-small": "_root--icon-only-small_y7qt0_718",
-  rootIconOnlySmall: T,
-  loader: w,
-  "icon--hidden": "_icon--hidden_y7qt0_747",
-  iconHidden: z,
-  "label--hidden": "_label--hidden_y7qt0_751",
-  labelHidden: A,
-  "label--loading": "_label--loading_y7qt0_763",
-  labelLoading: J
-}, U = ({
-  children: d,
-  aria: c,
-  className: y,
-  dataTrackingid: g,
-  disabled: n = !1,
-  iconName: s = "placeholder",
-  iconSource: a,
-  loading: t = !1,
-  theme: _ = "light",
-  variant: l = "filled",
-  onClick: e,
-  ...q
-}) => {
-  const k = i(
-    o.root,
-    o.rootIconOnlySmall,
-    y,
-    {
-      // variant
-      [o.rootFilled]: l === "filled",
-      [o.rootHighlight]: l === "highlight",
-      // dark theme
-      [o.rootDarkFilled]: _ === "dark" && l === "filled",
-      [o.rootDarkHighlight]: _ === "dark" && l === "highlight"
-    }
-  ), u = i(o.label, o.labelHidden, {
-    // set label opacity to 0 when loading to prevent button size from changing
-    [o.labelLoading]: t
-  }), f = i(o.icon, {
-    // set icon opacity to 0 when loading to prevent button size from changing
-    [o.iconHidden]: t
-  }), m = _ === "light" && l === "filled" ? "dark" : "light", b = (h) => {
-    if (n || t) {
-      h.preventDefault();
-      return;
-    }
-    e && e(h);
-  };
-  return /* @__PURE__ */ r.jsxs(
-    "button",
-    {
-      className: k,
-      "data-trackingid": g,
-      type: "button",
-      onClick: b,
-      ...c,
-      ...q,
-      "aria-disabled": n || t,
-      "aria-busy": t,
-      children: [
-        t && /* @__PURE__ */ r.jsx(
-          H,
-          {
-            className: o.loader,
-            aria: { "aria-label": "Loading state" }
-          }
-        ),
-        /* @__PURE__ */ r.jsx("span", { className: u, children: d }),
-        (s || a) && /* @__PURE__ */ r.jsx(
-          D,
-          {
-            name: s,
-            theme: m,
-            source: a,
-            className: f,
-            "aria-hidden": "true"
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  U as DSButtonRound
-};

package/checkbox.DETR3e3X.js

@@ -1,112 +0,0 @@
-"use client";
-import { j as e } from "./chunks/jsx-runtime.C115EyI4.js";
-import { c as r } from "./chunks/index.CvOaL64Y.js";
-import { forwardRef as S, useRef as y, useState as I, useEffect as H, useCallback as M } from "react";
-import { u as g } from "./chunks/useBreakpoint.5xBNDiCf.js";
-import { D as _ } from "./chunks/Icon.C2o2seDb.js";
-import { DSSystemFeedback as B } from "./systemfeedback.ZzRUAVYX.js";
-import './assets/checkbox.K4CVYK9g.css';const E = "_checkbox-root_rwkfx_151", V = "_checkbox-root--disabled_rwkfx_172", L = "_checkbox_rwkfx_151", O = "_icon-check_rwkfx_192", P = "_icon-minus_rwkfx_193", U = "_checkbox--invalid_rwkfx_217", q = "_label--hidden_rwkfx_222", z = "_input_rwkfx_235", A = "_label_rwkfx_222", F = "_feedback_rwkfx_349", c = {
-  "checkbox-root": "_checkbox-root_rwkfx_151",
-  checkboxRoot: E,
-  "checkbox-root--disabled": "_checkbox-root--disabled_rwkfx_172",
-  checkboxRootDisabled: V,
-  checkbox: L,
-  "icon-check": "_icon-check_rwkfx_192",
-  iconCheck: O,
-  "icon-minus": "_icon-minus_rwkfx_193",
-  iconMinus: P,
-  "checkbox--invalid": "_checkbox--invalid_rwkfx_217",
-  checkboxInvalid: U,
-  "label--hidden": "_label--hidden_rwkfx_222",
-  labelHidden: q,
-  input: z,
-  label: A,
-  feedback: F
-}, G = S(
-  ({
-    label: k,
-    checked: x,
-    className: d,
-    defaultChecked: f = !1,
-    disabled: s = !1,
-    hideLabel: u = !1,
-    indeterminate: h = !1,
-    invalid: i = !1,
-    systemFeedback: b,
-    onChange: l,
-    ...m
-  }, n) => {
-    const a = y(null), [p, w] = I(f), C = g(u);
-    H(() => {
-      a && a.current && (a.current.indeterminate = h);
-    }, [h]);
-    const t = x !== void 0, j = t ? x : p, D = r(c.checkboxRoot, {
-      [c.checkboxRootDisabled]: s
-    }), N = r(c.label, {
-      // hide label only visually to keep them available for assistive technologies
-      [c.labelHidden]: C
-    }), v = r(c.checkbox, {
-      [c.checkboxInvalid]: i
-    }), R = M(
-      (o) => {
-        if (s) {
-          o.preventDefault();
-          return;
-        }
-        t || w(o.target.checked), l && l(o);
-      },
-      [s, t, l]
-    );
-    return /* @__PURE__ */ e.jsxs("div", { className: d, children: [
-      /* @__PURE__ */ e.jsxs("label", { className: D, children: [
-        /* @__PURE__ */ e.jsx(
-          "input",
-          {
-            type: "checkbox",
-            className: c.input,
-            ref: (o) => {
-              typeof n == "function" ? n(o) : n !== null && (n.current = o), a.current = o;
-            },
-            ...m,
-            checked: j,
-            disabled: s,
-            "aria-label": k,
-            "aria-invalid": i,
-            onChange: R
-          }
-        ),
-        /* @__PURE__ */ e.jsxs("div", { className: v, children: [
-          /* @__PURE__ */ e.jsx(
-            _,
-            {
-              name: "check",
-              className: c.iconCheck,
-              "aria-hidden": "true"
-            }
-          ),
-          /* @__PURE__ */ e.jsx(
-            _,
-            {
-              name: "minus",
-              className: c.iconMinus,
-              "aria-hidden": "true"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e.jsx("span", { className: N, children: k })
-      ] }),
-      i && b && /* @__PURE__ */ e.jsx(
-        B,
-        {
-          className: c.feedback,
-          message: b,
-          type: "invalid"
-        }
-      )
-    ] });
-  }
-);
-G.displayName = "DSCheckbox";
-export {
-  G as DSCheckbox
-};

package/checkboxgroup.CZqrlF-x.js

@@ -1,9 +0,0 @@
-"use client";
-import "./chunks/jsx-runtime.C115EyI4.js";
-import "./chunks/index.CvOaL64Y.js";
-import "./chunks/Fieldset.COGbZwry.js";
-import "./chunks/RadioGroup.module.BBZwHDjW.js";
-import { D as e } from "./chunks/CheckboxGroup.4J_gZ_XJ.js";
-export {
-  e as DSCheckboxGroup
-};

package/chunks/Accordion.pI3JyHJL.js

@@ -1,125 +0,0 @@
-"use client";
-import { j as t } from "./jsx-runtime.C115EyI4.js";
-import { c as s } from "./index.CvOaL64Y.js";
-import { forwardRef as A, useRef as F, useState as I, useImperativeHandle as R, useEffect as w } from "react";
-import { DSHeading as T } from "../heading.CAkraI2D.js";
-import { D as L } from "./Icon.C2o2seDb.js";
-import { g } from "./helpers.B1JT5ShS.js";
-import '../assets/Accordion.lFv7Q_RG.css';const M = "_details_15or5_76", b = "_summary_15or5_112", H = "_summary--utility--m_15or5_153", P = "_summary--flush_15or5_178", U = "_summary--small_15or5_238", q = "_summary-content-wrapper_15or5_243", V = "_summary-content-wrapper--flush_15or5_249", z = "_summary-content-wrapper--chevron-left_15or5_253", Z = "_heading-summary-wrapper_15or5_258", k = "_hint_15or5_262", B = "_icon_15or5_277", G = "_icon--open_15or5_288", J = "_content-wrapper_15or5_300", K = "_content-wrapper--flush_15or5_306", Q = "_content-wrapper--small_15or5_310", r = {
-  details: M,
-  summary: b,
-  "summary--utility--m": "_summary--utility--m_15or5_153",
-  summaryUtilityM: H,
-  "summary--flush": "_summary--flush_15or5_178",
-  summaryFlush: P,
-  "summary--small": "_summary--small_15or5_238",
-  summarySmall: U,
-  "summary-content-wrapper": "_summary-content-wrapper_15or5_243",
-  summaryContentWrapper: q,
-  "summary-content-wrapper--flush": "_summary-content-wrapper--flush_15or5_249",
-  summaryContentWrapperFlush: V,
-  "summary-content-wrapper--chevron-left": "_summary-content-wrapper--chevron-left_15or5_253",
-  summaryContentWrapperChevronLeft: z,
-  "heading-summary-wrapper": "_heading-summary-wrapper_15or5_258",
-  headingSummaryWrapper: Z,
-  hint: k,
-  icon: B,
-  "icon--open": "_icon--open_15or5_288",
-  iconOpen: G,
-  "content-wrapper": "_content-wrapper_15or5_300",
-  contentWrapper: J,
-  "content-wrapper--flush": "_content-wrapper--flush_15or5_306",
-  contentWrapperFlush: K,
-  "content-wrapper--small": "_content-wrapper--small_15or5_310",
-  contentWrapperSmall: Q
-}, ar = ["medium", "small"], or = ["left", "right"], X = ({
-  children: a,
-  summary: n
-}) => {
-  if (!a)
-    throw new Error(
-      g(
-        "DSAccordion",
-        "The component requires children to be set."
-      )
-    );
-  if (!n)
-    throw new Error(
-      g(
-        "DSAccordion",
-        "The summary prop is required. Please add the summary prop to the DSAccordion component."
-      )
-    );
-}, Y = A(
-  ({
-    children: a,
-    summary: n,
-    chevronPosition: C = "right",
-    className: S,
-    hint: p,
-    isFlush: o = !1,
-    isOpen: m = !1,
-    size: l = "medium",
-    ...W
-  }, v) => {
-    process.env.NODE_ENV !== "production" && X({ children: a, summary: n });
-    const e = F(null), [D, i] = I(m);
-    R(v, () => e.current), w(() => {
-      e.current && i(e.current.open);
-    }, [m]), w(() => {
-      var d;
-      const h = () => {
-        e.current && i(e.current.open);
-      };
-      return (d = e.current) == null || d.addEventListener("toggle", h), () => {
-        var f;
-        (f = e.current) == null || f.removeEventListener("toggle", h);
-      };
-    }, []);
-    let u, _, y;
-    const c = typeof n == "object" && n !== void 0;
-    c && ({ headingSize: u, headingTag: _, headingText: y } = n);
-    const N = s(r.details, S), j = s(r.summary, {
-      [r.summaryFlush]: o,
-      [r.summarySmall]: l === "small",
-      [r.summaryUtilityM]: !c
-    }), x = s(
-      r.summaryContentWrapper,
-      {
-        [r.summaryContentWrapperFlush]: o,
-        [r.summaryContentWrapperChevronLeft]: C === "left"
-      }
-    ), E = s(r.icon, {
-      [r.iconOpen]: D
-    }), O = s(r.contentWrapper, {
-      [r.contentWrapperFlush]: o,
-      [r.contentWrapperSmall]: l === "small"
-    });
-    return /* @__PURE__ */ t.jsxs(
-      "details",
-      {
-        ...W,
-        ref: e,
-        className: N,
-        open: m,
-        children: [
-          /* @__PURE__ */ t.jsx("summary", { className: j, children: /* @__PURE__ */ t.jsxs("div", { className: x, children: [
-            /* @__PURE__ */ t.jsxs("div", { className: r.headingSummaryWrapper, children: [
-              c ? /* @__PURE__ */ t.jsx(T, { tag: _, size: u, children: y }) : n,
-              p && /* @__PURE__ */ t.jsx("div", { className: r.hint, children: p })
-            ] }),
-            /* @__PURE__ */ t.jsx(L, { name: "chevron-down", className: E })
-          ] }) }),
-          /* @__PURE__ */ t.jsx("div", { className: O, children: a })
-        ]
-      }
-    );
-  }
-);
-Y.displayName = "DSAccordion";
-export {
-  ar as A,
-  or as C,
-  Y as D,
-  X as v
-};

package/chunks/CheckboxGroup.4J_gZ_XJ.js

@@ -1,87 +0,0 @@
-"use client";
-import { j as u } from "./jsx-runtime.C115EyI4.js";
-import { c as D } from "./index.CvOaL64Y.js";
-import { D as b } from "./Fieldset.COGbZwry.js";
-import { s as c } from "./RadioGroup.module.BBZwHDjW.js";
-import l from "react";
-import { g as s } from "./helpers.B1JT5ShS.js";
-import { DSCheckbox as f } from "../checkbox.DETR3e3X.js";
-const C = (e) => `The "${e}" prop is required. Please add the "${e}" prop to the DSCheckboxGroup component.`, k = ({
-  children: e,
-  description: o,
-  id: i,
-  legend: n,
-  systemFeedback: r
-}) => {
-  if (!i && (o || r))
-    throw new Error(
-      s(
-        "DSCheckboxGroup",
-        'A unique "id" prop is required when providing the description or systemFeedback property. Please add an unique "id" prop to the DSCheckboxGroup component.'
-      )
-    );
-  if (!n)
-    throw new Error(
-      s("DSCheckboxGroup", C("legend"))
-    );
-  if (!e)
-    throw new Error(
-      s(
-        "DSCheckboxGroup",
-        "The component requires DSCheckbox components to be explicitly set as its children. Ensure that you include individual DSCheckbox components within the DSCheckboxGroup to create a cohesive checkbox group."
-      )
-    );
-  l.Children.forEach(e, (t) => {
-    if (!(l.isValidElement(t) && t.type === f))
-      throw new Error(
-        s(
-          "DSCheckboxGroup",
-          "The component requires the children to be DSCheckbox elements. Ensure that you include individual DSCheckbox components within the DSCheckboxGroup to create a cohesive checkbox group."
-        )
-      );
-  });
-}, y = ({
-  children: e,
-  legend: o,
-  alignment: i = "vertical",
-  className: n,
-  description: r,
-  disabled: t = !1,
-  id: h,
-  invalid: a = !1,
-  required: m = !1,
-  systemFeedback: p,
-  ...x
-}) => {
-  process.env.NODE_ENV !== "production" && k({
-    children: e,
-    legend: o,
-    description: r,
-    id: h,
-    systemFeedback: p
-  });
-  const d = D(c.group, {
-    // In case of longer copy, use vertical alignment
-    [c.groupHorizontal]: i === "horizontal",
-    [c.groupInvalid]: a && !!p
-  });
-  return /* @__PURE__ */ u.jsx(
-    b,
-    {
-      id: h,
-      legend: o,
-      className: n,
-      description: r,
-      disabled: t,
-      required: m,
-      invalid: a,
-      systemFeedback: p,
-      ...x,
-      children: /* @__PURE__ */ u.jsx("div", { className: d, children: e })
-    }
-  );
-};
-export {
-  y as D,
-  k as v
-};

package/chunks/Dialog.Z5ESJQMi.js

@@ -1,148 +0,0 @@
-"use client";
-import { j as n } from "./jsx-runtime.C115EyI4.js";
-import { c as s } from "./index.CvOaL64Y.js";
-import { useRef as h, useState as w, useEffect as b } from "react";
-import { DSButton as x } from "../button.DH0h6uPs.js";
-import { g as j } from "./helpers.B1JT5ShS.js";
-import '../assets/Dialog.fiQvxJg_.css';const B = "_dialog_1yzgd_80", E = "_content-wrapper_1yzgd_151", C = "_content-wrapper--no-footer_1yzgd_157", F = "_close-button_1yzgd_165", W = "_header_1yzgd_178", k = "_content_1yzgd_151", R = "_footer_1yzgd_180", L = "_header--scrollable_1yzgd_201", M = "_header--close-button_1yzgd_210", H = "_content--no-footer_1yzgd_223", I = "_footer--scrollable_1yzgd_230", o = {
-  dialog: B,
-  "content-wrapper": "_content-wrapper_1yzgd_151",
-  contentWrapper: E,
-  "content-wrapper--no-footer": "_content-wrapper--no-footer_1yzgd_157",
-  contentWrapperNoFooter: C,
-  "close-button": "_close-button_1yzgd_165",
-  closeButton: F,
-  header: W,
-  content: k,
-  footer: R,
-  "header--scrollable": "_header--scrollable_1yzgd_201",
-  headerScrollable: L,
-  "header--close-button": "_header--close-button_1yzgd_210",
-  headerCloseButton: M,
-  "content--no-footer": "_content--no-footer_1yzgd_223",
-  contentNoFooter: H,
-  "footer--scrollable": "_footer--scrollable_1yzgd_230",
-  footerScrollable: I
-}, O = ({ tabIndex: r }) => {
-  if (r || r === 0)
-    throw new Error(
-      j(
-        "DSDialog",
-        "Do not pass the tabindex property to the DSDialog component as it is not interactive and does not receive focus. The DSDialogs contents, including the close button contained in the DSDialog, can receive focus and be interactive."
-      )
-    );
-}, G = ({
-  children: r,
-  className: m,
-  closeButtonLabel: y = "Close dialog",
-  disableBackdropClose: z = !1,
-  footer: c,
-  header: D,
-  hideCloseButton: a = !1,
-  isOpen: d = !1,
-  onClose: l,
-  ...i
-}) => {
-  if (process.env.NODE_ENV !== "production") {
-    const { tabIndex: e } = i;
-    O({
-      tabIndex: e
-    });
-  }
-  const t = h(null), _ = h(null), [u, S] = w(!1);
-  b(() => {
-    const e = _.current;
-    if (e) {
-      const g = () => {
-        S(
-          e.scrollHeight > e.clientHeight
-        );
-      };
-      g();
-      const p = new ResizeObserver(g);
-      return p.observe(e), () => {
-        p.disconnect();
-      };
-    }
-  }, []), b(() => {
-    const e = t.current;
-    if (e)
-      return e.addEventListener("close", f), d ? e.showModal() : e.close(), () => {
-        e.removeEventListener("close", f);
-      };
-  }, [d, l]);
-  const f = () => {
-    l && l();
-  }, v = (e) => {
-    z || t.current && e.target === t.current && t.current.close();
-  }, N = () => {
-    t.current && t.current.close();
-  };
-  return /* @__PURE__ */ n.jsx(
-    "dialog",
-    {
-      ...i,
-      ref: t,
-      className: o.dialog,
-      onMouseDown: (e) => v(e),
-      "aria-modal": "true",
-      children: /* @__PURE__ */ n.jsxs(
-        "div",
-        {
-          className: s(o.contentWrapper, m, {
-            [o.contentWrapperNoFooter]: !c
-          }),
-          children: [
-            !a && /* @__PURE__ */ n.jsx(
-              x,
-              {
-                className: o.closeButton,
-                hideLabel: !0,
-                iconName: "cross",
-                size: "small",
-                type: "button",
-                variant: "ghost",
-                onClick: () => N(),
-                children: y
-              }
-            ),
-            /* @__PURE__ */ n.jsx(
-              "header",
-              {
-                className: s(o.header, {
-                  [o.headerCloseButton]: !a,
-                  [o.headerScrollable]: u
-                }),
-                children: D
-              }
-            ),
-            /* @__PURE__ */ n.jsx(
-              "div",
-              {
-                ref: _,
-                className: s(o.content, {
-                  [o.contentNoFooter]: !c
-                }),
-                tabIndex: 0,
-                children: r
-              }
-            ),
-            c && /* @__PURE__ */ n.jsx(
-              "footer",
-              {
-                className: s(o.footer, {
-                  [o.footerScrollable]: u
-                }),
-                children: c
-              }
-            )
-          ]
-        }
-      )
-    }
-  );
-};
-export {
-  G as D,
-  O as v
-};