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

package/chunks/Accordion.CB6jB3s_.js

@@ -0,0 +1,125 @@
+"use client";
+import { j as e } from "./jsx-runtime.C115EyI4.js";
+import { c as a } 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.IPIYc5vW.js";
+import { D as L } from "./Icon.BCmt_XBG.js";
+import { g } from "./helpers.B1JT5ShS.js";
+import '../assets/Accordion.i4k5SMQM.css';const M = "ds-accordion_details_1385s_1", b = "ds-accordion_summary_1385s_120", H = "ds-accordion_summary--utility--m_1385s_159", P = "ds-accordion_summary--flush_1385s_188", U = "ds-accordion_summary--small_1385s_256", q = "ds-accordion_summary-content-wrapper_1385s_261", V = "ds-accordion_summary-content-wrapper--flush_1385s_267", z = "ds-accordion_summary-content-wrapper--chevron-left_1385s_271", Z = "ds-accordion_heading-summary-wrapper_1385s_276", k = "ds-accordion_hint_1385s_280", B = "ds-accordion_icon_1385s_294", G = "ds-accordion_icon--open_1385s_305", J = "ds-accordion_content-wrapper_1385s_317", K = "ds-accordion_content-wrapper--flush_1385s_323", Q = "ds-accordion_content-wrapper--small_1385s_327", r = {
+  details: M,
+  summary: b,
+  "summary--utility--m": "ds-accordion_summary--utility--m_1385s_159",
+  summaryUtilityM: H,
+  "summary--flush": "ds-accordion_summary--flush_1385s_188",
+  summaryFlush: P,
+  "summary--small": "ds-accordion_summary--small_1385s_256",
+  summarySmall: U,
+  "summary-content-wrapper": "ds-accordion_summary-content-wrapper_1385s_261",
+  summaryContentWrapper: q,
+  "summary-content-wrapper--flush": "ds-accordion_summary-content-wrapper--flush_1385s_267",
+  summaryContentWrapperFlush: V,
+  "summary-content-wrapper--chevron-left": "ds-accordion_summary-content-wrapper--chevron-left_1385s_271",
+  summaryContentWrapperChevronLeft: z,
+  "heading-summary-wrapper": "ds-accordion_heading-summary-wrapper_1385s_276",
+  headingSummaryWrapper: Z,
+  hint: k,
+  icon: B,
+  "icon--open": "ds-accordion_icon--open_1385s_305",
+  iconOpen: G,
+  "content-wrapper": "ds-accordion_content-wrapper_1385s_317",
+  contentWrapper: J,
+  "content-wrapper--flush": "ds-accordion_content-wrapper--flush_1385s_323",
+  contentWrapperFlush: K,
+  "content-wrapper--small": "ds-accordion_content-wrapper--small_1385s_327",
+  contentWrapperSmall: Q
+}, or = ["medium", "small"], tr = ["left", "right"], X = ({
+  children: o,
+  summary: n
+}) => {
+  if (!o)
+    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: o,
+    summary: n,
+    chevronPosition: C = "right",
+    className: S,
+    hint: p,
+    isFlush: t = !1,
+    isOpen: c = !1,
+    size: i = "medium",
+    ...W
+  }, v) => {
+    process.env.NODE_ENV !== "production" && X({ children: o, summary: n });
+    const s = F(null), [D, l] = I(c);
+    R(v, () => s.current), w(() => {
+      s.current && l(s.current.open);
+    }, [c]), w(() => {
+      var h;
+      const y = () => {
+        s.current && l(s.current.open);
+      };
+      return (h = s.current) == null || h.addEventListener("toggle", y), () => {
+        var f;
+        (f = s.current) == null || f.removeEventListener("toggle", y);
+      };
+    }, []);
+    let d, u, _;
+    const m = typeof n == "object" && n !== void 0;
+    m && ({ headingSize: d, headingTag: u, headingText: _ } = n);
+    const N = a(r.details, S), j = a(r.summary, {
+      [r.summaryFlush]: t,
+      [r.summarySmall]: i === "small",
+      [r.summaryUtilityM]: !m
+    }), x = a(
+      r.summaryContentWrapper,
+      {
+        [r.summaryContentWrapperFlush]: t,
+        [r.summaryContentWrapperChevronLeft]: C === "left"
+      }
+    ), E = a(r.icon, {
+      [r.iconOpen]: D
+    }), O = a(r.contentWrapper, {
+      [r.contentWrapperFlush]: t,
+      [r.contentWrapperSmall]: i === "small"
+    });
+    return /* @__PURE__ */ e.jsxs(
+      "details",
+      {
+        ...W,
+        ref: s,
+        className: N,
+        open: c,
+        children: [
+          /* @__PURE__ */ e.jsx("summary", { className: j, children: /* @__PURE__ */ e.jsxs("div", { className: x, children: [
+            /* @__PURE__ */ e.jsxs("div", { className: r.headingSummaryWrapper, children: [
+              m ? /* @__PURE__ */ e.jsx(T, { tag: u, size: d, children: _ }) : n,
+              p && /* @__PURE__ */ e.jsx("div", { className: r.hint, children: p })
+            ] }),
+            /* @__PURE__ */ e.jsx(L, { name: "chevron-down", className: E })
+          ] }) }),
+          /* @__PURE__ */ e.jsx("div", { className: O, children: o })
+        ]
+      }
+    );
+  }
+);
+Y.displayName = "DSAccordion";
+export {
+  or as A,
+  tr as C,
+  Y as D,
+  X as v
+};

package/chunks/{CheckboxGroup.M3jOjhNf.js → CheckboxGroup.S6i5EOc4.js}

@@ -1,33 +1,33 @@
 "use client";
-import { j as h } from "./jsx-runtime.C115EyI4.js";
+import { j as u } from "./jsx-runtime.C115EyI4.js";
 import { c as m } from "./index.CvOaL64Y.js";
-import { D as f } from "./Fieldset.C9K8BYmH.js";
+import { D as f } from "./Fieldset.Cjmkgxxk.js";
 import l from "react";
 import { g as i } from "./helpers.B1JT5ShS.js";
-import { DSCheckbox as k } from "../checkbox.DETR3e3X.js";
-import '../assets/CheckboxGroup.Bz3_xkZU.css';const D = "_group_2f5rk_76", b = "_group--horizontal_2f5rk_84", _ = "_group--invalid_2f5rk_87", u = {
-  group: D,
-  "group--horizontal": "_group--horizontal_2f5rk_84",
-  groupHorizontal: b,
-  "group--invalid": "_group--invalid_2f5rk_87",
-  groupInvalid: _
-}, C = (o) => `The "${o}" prop is required. Please add the "${o}" prop to the DSCheckboxGroup component.`, S = ({
+import { DSCheckbox as k } from "../checkbox.Cb2_ey6U.js";
+import '../assets/CheckboxGroup.BH1Br1dg.css';const D = "ds-checkbox-group_root_12fot_1", _ = "ds-checkbox-group_root--horizontal_12fot_9", C = "ds-checkbox-group_root--invalid_12fot_12", h = {
+  root: D,
+  "root--horizontal": "ds-checkbox-group_root--horizontal_12fot_9",
+  rootHorizontal: _,
+  "root--invalid": "ds-checkbox-group_root--invalid_12fot_12",
+  rootInvalid: C
+}, S = (o) => `The "${o}" prop is required. Please add the "${o}" prop to the DSCheckboxGroup component.`, v = ({
   children: o,
-  description: r,
+  description: e,
   id: n,
-  legend: e,
-  systemFeedback: p
+  legend: r,
+  systemFeedback: s
 }) => {
-  if (!n && (r || p))
+  if (!n && (e || s))
     throw new Error(
       i(
         "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 (!e)
+  if (!r)
     throw new Error(
-      i("DSCheckboxGroup", C("legend"))
+      i("DSCheckboxGroup", S("legend"))
     );
   if (!o)
     throw new Error(
@@ -47,46 +47,46 @@ import '../assets/CheckboxGroup.Bz3_xkZU.css';const D = "_group_2f5rk_76", b = "
   });
 }, y = ({
   children: o,
-  legend: r,
+  legend: e,
   className: n,
-  description: e,
-  direction: p = "vertical",
+  description: r,
+  direction: s = "vertical",
   disabled: t = !1,
-  id: c,
-  invalid: a = !1,
+  id: a,
+  invalid: p = !1,
   required: d = !1,
-  systemFeedback: s,
-  ...g
+  systemFeedback: c,
+  ...x
 }) => {
-  process.env.NODE_ENV !== "production" && S({
+  process.env.NODE_ENV !== "production" && v({
     children: o,
-    legend: r,
-    description: e,
-    id: c,
-    systemFeedback: s
+    legend: e,
+    description: r,
+    id: a,
+    systemFeedback: c
   });
-  const x = m(u.group, {
+  const b = m(h.root, {
     // In case of longer copy, use vertical direction
-    [u.groupHorizontal]: p === "horizontal",
-    [u.groupInvalid]: a && !!s
+    [h.rootHorizontal]: s === "horizontal",
+    [h.rootInvalid]: p && !!c
   });
-  return /* @__PURE__ */ h.jsx(
+  return /* @__PURE__ */ u.jsx(
     f,
     {
-      id: c,
-      legend: r,
+      id: a,
+      legend: e,
       className: n,
-      description: e,
+      description: r,
       disabled: t,
       required: d,
-      invalid: a,
-      systemFeedback: s,
-      ...g,
-      children: /* @__PURE__ */ h.jsx("div", { className: x, children: o })
+      invalid: p,
+      systemFeedback: c,
+      ...x,
+      children: /* @__PURE__ */ u.jsx("div", { className: b, children: o })
     }
   );
 };
 export {
   y as D,
-  S as v
+  v
 };

package/chunks/{Chip.fMG8wi5K.js → Chip.CMlPUyOJ.js}

@@ -1,14 +1,14 @@
 "use client";
 import { j as o } from "./jsx-runtime.C115EyI4.js";
-import { c as g } from "./index.CvOaL64Y.js";
-import { forwardRef as y } from "react";
-import { t as w } from "./translate.isa3FHb8.js";
-import { D as h } from "./Icon.C2o2seDb.js";
+import { c as _ } from "./index.CvOaL64Y.js";
+import { forwardRef as w } from "react";
+import { t as y } from "./translate.isa3FHb8.js";
+import { D as d } from "./Icon.BCmt_XBG.js";
 import { g as a } from "./helpers.B1JT5ShS.js";
 import { g as P } from "./AriaLiveRegions.utils.BGSZafnS.js";
-import '../assets/Chip.D10_7Q82.css';const T = "_chip_1hj8y_76", b = "_chip--small_1hj8y_106", d = {
+import '../assets/Chip.DSdLuzoi.css';const T = "ds-chip-group_chip_aidwn_1", b = "ds-chip-group_chip--small_aidwn_30", h = {
   chip: T,
-  "chip--small": "_chip--small_1hj8y_106",
+  "chip--small": "ds-chip-group_chip--small_aidwn_30",
   chipSmall: b
 }, u = (e) => `The "${e}" prop is required. Please add the "${e}" prop to the DSChipGroup component.`, F = ({
   chips: e,
@@ -74,7 +74,7 @@ import '../assets/Chip.D10_7Q82.css';const T = "_chip_1hj8y_76", b = "_chip--sma
   [
     e(n === "single" ? t ? "unselectAction" : "selectAction" : t ? "removeFromSelection" : "addToSelection")
   ]
-)}`, G = (e, i, r, t) => e(i ? "titleDisabled" : t ? "titleRemovable" : r ? "titleDeactivate" : "titleActivate"), x = y(
+)}`, G = (e, i, r, t) => e(i ? "titleDisabled" : t ? "titleRemovable" : r ? "titleDeactivate" : "titleActivate"), x = w(
   ({
     id: e,
     label: i,
@@ -90,11 +90,11 @@ import '../assets/Chip.D10_7Q82.css';const T = "_chip_1hj8y_76", b = "_chip--sma
     translations: S,
     onClick: D,
     ...A
-  }, C) => {
-    const p = w(
+  }, g) => {
+    const p = y(
       S || k[m]
-    ), _ = g(d.chip, {
-      [d.chipSmall]: v === "small"
+    ), C = _(h.chip, {
+      [h.chipSmall]: v === "small"
     });
     return /* @__PURE__ */ o.jsxs(
       "div",
@@ -111,18 +111,18 @@ import '../assets/Chip.D10_7Q82.css';const T = "_chip_1hj8y_76", b = "_chip--sma
         "aria-selected": l && !t,
         "aria-disabled": s && !t,
         id: `${r}-chip-${e}`,
-        className: _,
+        className: C,
         tabIndex: f,
         onClick: D,
-        ref: C,
+        ref: g,
         ...A,
         title: G(p, s, l, t),
         children: [
           /* @__PURE__ */ o.jsxs("div", { role: "gridcell", "aria-colindex": 1, style: { display: "contents" }, children: [
-            c && /* @__PURE__ */ o.jsx(h, { name: c, "aria-hidden": "true" }),
+            c && /* @__PURE__ */ o.jsx(d, { name: c, "aria-hidden": "true" }),
             i
           ] }),
-          t && /* @__PURE__ */ o.jsx(h, { name: "cross" })
+          t && /* @__PURE__ */ o.jsx(d, { name: "cross" })
         ]
       }
     );