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

package/link.5eb13d6e.js

@@ -1,84 +0,0 @@
-"use client";
-import { j as d } from "./chunks/jsx-runtime.5c071667.js";
-import { c as u } from "./chunks/index.8021d3e0.js";
-import { u as i } from "./chunks/useBreakpoint.6c1b06c2.js";
-import { DSIcon as S } from "./icon.b4211784.js";
-import { s as o } from "./chunks/Link.module.15dedc23.js";
-const F = ({
-  children: n,
-  aria: c,
-  className: h,
-  dataTrackingid: f,
-  download: p,
-  hideLabel: r = !1,
-  href: a,
-  iconName: g,
-  iconPosition: D = "left",
-  iconSource: k,
-  isFlush: s = !1,
-  referrerPolicy: x,
-  rel: j,
-  size: e = "medium",
-  target: G = "_self",
-  theme: t = "light",
-  variant: l = "filled",
-  ...I
-}) => {
-  const O = u(o.root, h, {
-    // variant
-    [o.rootFilled]: l === "filled",
-    [o.rootHighlight]: l === "highlight",
-    [o.rootOutline]: l === "outline",
-    [o.rootGhost]: l === "ghost" && s !== !0,
-    // isFlush
-    [o.rootGhostFlush]: l === "ghost" && s === !0,
-    // dark theme
-    [o.rootDarkFilled]: t === "dark" && l === "filled",
-    [o.rootDarkHighlight]: t === "dark" && l === "highlight",
-    [o.rootDarkOutline]: t === "dark" && l === "outline",
-    [o.rootDarkGhost]: t === "dark" && l === "ghost" && s !== !0,
-    // dark isFlush
-    [o.rootDarkGhostFlush]: t === "dark" && l === "ghost" && s === !0,
-    // size
-    [o.rootSmall]: e === "small",
-    // icon position
-    [o.rootIconLeft]: D === "left",
-    // icon only
-    [o.rootIconOnly]: i(r) && e === "medium",
-    [o.rootIconOnlySmall]: i(r) && e === "small"
-  }), y = u({
-    // hide label only visually to keep them available for assistive technologies
-    [o.labelHidden]: i(r)
-  }), H = t === "light" && l === "filled" || t === "dark" && l === "outline" || t === "dark" && l === "ghost" ? "dark" : "light", m = a === void 0 ? "span" : "a";
-  return /* @__PURE__ */ d.jsxs(
-    m,
-    {
-      className: O,
-      "data-trackingid": f,
-      ...m === "a" && {
-        href: a,
-        target: G,
-        rel: j,
-        referrerPolicy: x,
-        download: p
-      },
-      ...c,
-      ...I,
-      children: [
-        /* @__PURE__ */ d.jsx("span", { className: y, children: n }),
-        (g || k) && /* @__PURE__ */ d.jsx(
-          S,
-          {
-            name: g,
-            theme: H,
-            source: k,
-            "aria-hidden": "true"
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  F as DSLink
-};

package/linkstandalone.edfd6288.js

@@ -1,80 +0,0 @@
-import "./assets/LinkStandalone.19bdab0d.css";
-import { j as r } from "./chunks/jsx-runtime.5c071667.js";
-import { c as x } from "./chunks/index.8021d3e0.js";
-import { DSIcon as H } from "./icon.b4211784.js";
-import "react";
-import "./chunks/Link.module.15dedc23.js";
-const j = "_root_1iiai_25", v = "_root--highlight_1iiai_96", L = "_root--neutral-dark_1iiai_167", N = "_root--highlight-dark_1iiai_238", I = "_root--active_1iiai_309", A = "_root--icon-left_1iiai_315", o = {
-  root: j,
-  "root--highlight": "_root--highlight_1iiai_96",
-  rootHighlight: v,
-  "root--neutral-dark": "_root--neutral-dark_1iiai_167",
-  rootNeutralDark: L,
-  "root--highlight-dark": "_root--highlight-dark_1iiai_238",
-  rootHighlightDark: N,
-  "root--active": "_root--active_1iiai_309",
-  rootActive: I,
-  "root--icon-left": "_root--icon-left_1iiai_315",
-  rootIconLeft: A
-}, R = ({
-  children: e,
-  aria: _,
-  active: g,
-  className: n,
-  dataTrackingid: c,
-  download: k,
-  href: a,
-  iconName: l,
-  iconPosition: d = "left",
-  iconSource: h,
-  referrerPolicy: m,
-  rel: u,
-  target: f = "_self",
-  theme: t = "light",
-  variant: i = "neutral",
-  ...p
-}) => {
-  const D = x(o.root, n, {
-    // variant
-    [o.rootHighlight]: i === "highlight",
-    // theme
-    [o.rootNeutralDark]: t === "dark" && i === "neutral",
-    [o.rootHighlightDark]: t === "dark" && i === "highlight",
-    // active
-    [o.rootActive]: g,
-    // icon position
-    [o.rootIconLeft]: d === "left"
-  }), s = a === void 0 ? "span" : "a";
-  return /* @__PURE__ */ r.jsxs(
-    s,
-    {
-      className: D,
-      "data-trackingid": c,
-      ...s === "a" && {
-        href: a,
-        target: f,
-        rel: u,
-        referrerPolicy: m,
-        download: k
-      },
-      ..._,
-      ...p,
-      children: [
-        /* @__PURE__ */ r.jsx("span", { className: o.label, children: e }),
-        (l || h) && /* @__PURE__ */ r.jsx(
-          H,
-          {
-            name: l,
-            theme: t,
-            source: h,
-            size: "medium",
-            "aria-hidden": "true"
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  R as DSLinkStandalone
-};

package/optioncheckbox.2369560b.js

@@ -1,43 +0,0 @@
-import "./assets/OptionCheckbox.c56568a3.css";
-import { j as e } from "./chunks/jsx-runtime.5c071667.js";
-import { c as s } from "./chunks/index.8021d3e0.js";
-import { DSIcon as _ } from "./icon.b4211784.js";
-const i = "_root_zs58d_49", l = "_root--disabled_zs58d_68", k = "_checkbox_zs58d_72", n = "_icon-check_zs58d_86", r = "_checkbox--checked_zs58d_105", x = "_checkbox--disabled_zs58d_108", m = "_label_zs58d_125", c = {
-  root: i,
-  "root--disabled": "_root--disabled_zs58d_68",
-  rootDisabled: l,
-  checkbox: k,
-  "icon-check": "_icon-check_zs58d_86",
-  iconCheck: n,
-  "checkbox--checked": "_checkbox--checked_zs58d_105",
-  checkboxChecked: r,
-  "checkbox--disabled": "_checkbox--disabled_zs58d_108",
-  checkboxDisabled: x,
-  label: m
-}, D = ({
-  label: d,
-  checked: h,
-  className: a,
-  disabled: o
-}) => {
-  const t = s(c.root, {
-    [c.rootDisabled]: o
-  }), b = s(c.checkbox, {
-    [c.checkboxDisabled]: o,
-    [c.checkboxChecked]: h
-  });
-  return /* @__PURE__ */ e.jsx("div", { className: a, children: /* @__PURE__ */ e.jsxs("div", { className: t, children: [
-    /* @__PURE__ */ e.jsx("span", { className: b, children: /* @__PURE__ */ e.jsx(
-      _,
-      {
-        name: "check",
-        className: c.iconCheck,
-        "aria-hidden": "true"
-      }
-    ) }),
-    /* @__PURE__ */ e.jsx("span", { className: c.label, children: d })
-  ] }) });
-};
-export {
-  D as OptionCheckbox
-};

package/radio.fd841ab0.js

@@ -1,79 +0,0 @@
-import "./assets/Radio.79d98dde.css";
-import { j as s } from "./chunks/jsx-runtime.5c071667.js";
-import { c as d } from "./chunks/index.8021d3e0.js";
-import { forwardRef as H, useRef as I, useState as R, useCallback as S } from "react";
-import { u as g } from "./chunks/useBreakpoint.6c1b06c2.js";
-const B = "_root_l6los_25", V = "_root--disabled_l6los_44", w = "_radio_l6los_48", E = "_dot_l6los_63", L = "_radio--invalid_l6los_85", O = "_label_l6los_90", P = "_label--hidden_l6los_100", U = "_input_l6los_113", o = {
-  root: B,
-  "root--disabled": "_root--disabled_l6los_44",
-  rootDisabled: V,
-  radio: w,
-  dot: E,
-  "radio--invalid": "_radio--invalid_l6los_85",
-  radioInvalid: L,
-  label: O,
-  "label--hidden": "_label--hidden_l6los_100",
-  labelHidden: P,
-  input: U
-}, q = H(
-  ({
-    label: t,
-    name: c,
-    value: _,
-    defaultChecked: u = !1,
-    disabled: a = !1,
-    hideLabel: f = !1,
-    checked: r,
-    invalid: m = !1,
-    className: p,
-    onChange: i,
-    ...b
-  }, e) => {
-    const h = I(null), [v, x] = R(u), n = r !== void 0, C = n ? r : v, j = g(f), k = d(
-      o.root,
-      {
-        [o.rootDisabled]: a
-      },
-      p
-    ), N = d(o.label, {
-      // hide label only visually to keep them available for assistive technologies
-      [o.labelHidden]: j
-    }), D = d(o.radio, {
-      [o.radioInvalid]: m
-    }), y = S(
-      (l) => {
-        if (a) {
-          l.preventDefault();
-          return;
-        }
-        n || x(l.target.checked), i && i(l);
-      },
-      [a, n, i]
-    );
-    return /* @__PURE__ */ s.jsxs("label", { className: k, children: [
-      /* @__PURE__ */ s.jsx(
-        "input",
-        {
-          type: "radio",
-          value: _,
-          name: c,
-          className: o.input,
-          ref: (l) => {
-            typeof e == "function" ? e(l) : e !== null && (e.current = l), h.current = l;
-          },
-          onChange: y,
-          ...b,
-          disabled: a,
-          checked: C,
-          "aria-label": typeof t == "string" ? t : void 0
-        }
-      ),
-      /* @__PURE__ */ s.jsx("span", { className: D, children: /* @__PURE__ */ s.jsx("div", { className: o.dot }) }),
-      /* @__PURE__ */ s.jsx("span", { className: N, children: t })
-    ] });
-  }
-);
-q.displayName = "DSRadio";
-export {
-  q as DSRadio
-};

package/radiogroup.e1c8ea3d.js

@@ -1,100 +0,0 @@
-"use client";
-import { j as d } from "./chunks/jsx-runtime.5c071667.js";
-import { c as q } from "./chunks/index.8021d3e0.js";
-import { forwardRef as N, useState as P } from "react";
-import { DSFieldset as C } from "./fieldset.fdd84bda.js";
-import { DSRadio as y } from "./radio.fd841ab0.js";
-import { s as c } from "./chunks/RadioGroup.module.59ca486a.js";
-import { g as s } from "./chunks/helpers.ea3ca41a.js";
-const f = (o) => `The "${o}" prop is required. Please add the "${o}" prop to the DSRadioGroup component.`, z = ({
-  description: o,
-  id: e,
-  legend: t,
-  name: i,
-  options: n,
-  systemFeedback: a
-}) => {
-  if (!e && (o || a))
-    throw new Error(
-      s(
-        "DSRadioGroup",
-        'A unique "id" prop is required when providing the description or systemFeedback property. Please add an unique "id" prop to the DSRadioGroup component.'
-      )
-    );
-  if (!t)
-    throw new Error(
-      s("DSRadioGroup", f("legend"))
-    );
-  if (!i)
-    throw new Error(
-      s("DSRadioGroup", f("name"))
-    );
-  if (!n)
-    throw new Error(
-      s("DSRadioGroup", f("options"))
-    );
-}, M = N(
-  ({
-    legend: o,
-    name: e,
-    options: t,
-    alignment: i = "vertical",
-    defaultValue: n,
-    description: a,
-    disabled: l = !1,
-    id: m,
-    invalid: p = !1,
-    required: h = !1,
-    systemFeedback: u,
-    value: S,
-    onChange: D,
-    ...g
-  }, G) => {
-    process.env.NODE_ENV !== "production" && z({ description: a, id: m, legend: o, name: e, options: t, systemFeedback: u });
-    const [v, E] = P(n), R = S !== void 0, w = R ? S : v, x = q(c.root, {
-      // In case of longer copy, use vertical alignment
-      [c.rootHorizontal]: i === "horizontal",
-      [c.rootInvalid]: p && !!u
-    }), j = (r) => {
-      if (l) {
-        r.preventDefault();
-        return;
-      }
-      R || E(
-        r.target.value
-      ), D && D(r);
-    };
-    return /* @__PURE__ */ d.jsx(
-      C,
-      {
-        id: m,
-        legend: o,
-        description: a,
-        disabled: l,
-        required: h,
-        invalid: p,
-        systemFeedback: u,
-        ...g,
-        role: "radiogroup",
-        onChange: j,
-        children: /* @__PURE__ */ d.jsx("div", { className: x, children: t.map((r) => /* @__PURE__ */ d.jsx(
-          y,
-          {
-            name: e,
-            checked: r.value === w,
-            disabled: l,
-            invalid: p,
-            required: h,
-            ref: r.value === w ? G : null,
-            ...r
-          },
-          r.label + r.value
-        )) })
-      }
-    );
-  }
-);
-M.displayName = "DSRadioGroup";
-export {
-  M as DSRadioGroup
-};

package/select.88d40c51.js

@@ -1,188 +0,0 @@
-import "./assets/Select.b9c135c2.css";
-import { j as s } from "./chunks/jsx-runtime.5c071667.js";
-import { c as _ } from "./chunks/index.8021d3e0.js";
-import { useRef as R, useState as q, useEffect as W } from "react";
-import { u as F } from "./chunks/useBreakpoint.6c1b06c2.js";
-import { Asterisk as M } from "./asterisk.cb74ea72.js";
-import { DSIcon as O } from "./icon.b4211784.js";
-import { DSSystemFeedback as V } from "./systemfeedback.8515a4e0.js";
-import { g as f } from "./chunks/helpers.ea3ca41a.js";
-const J = "_root_1txp8_73", K = "_hint_1txp8_81", Q = "_label_1txp8_81", T = "_wrapper_1txp8_85", U = "_affix_1txp8_91", X = "_affix--small_1txp8_109", Y = "_affix--disabled_1txp8_121", Z = "_prefix_1txp8_125", z = "_suffix_1txp8_131", G = "_action-button_1txp8_136", ee = "_label--hidden_1txp8_153", te = "_feedback_1txp8_180", se = "_select-wrapper_1txp8_185", ne = "_select_1txp8_185", ae = "_select--invalid_1txp8_304", le = "_select--small_1txp8_311", ce = "_input--has-leading-icon_1txp8_357", oe = "_input--has-action-button_1txp8_360", ie = "_input--has-second-action-button_1txp8_363", re = "_select--has-leading-icon_1txp8_366", _e = "_select--has-action-button_1txp8_369", de = "_select--has-second-action-button_1txp8_372", pe = "_select--has-affix_1txp8_375", xe = "_select--is-ready_1txp8_387", fe = "_select--placeholder_1txp8_399", ue = "_chevron_1txp8_408", he = "_chevron--small_1txp8_412", be = "_chevron--disabled_1txp8_415", e = {
-  root: J,
-  hint: K,
-  label: Q,
-  wrapper: T,
-  affix: U,
-  "affix--small": "_affix--small_1txp8_109",
-  affixSmall: X,
-  "affix--disabled": "_affix--disabled_1txp8_121",
-  affixDisabled: Y,
-  prefix: Z,
-  suffix: z,
-  "action-button": "_action-button_1txp8_136",
-  actionButton: G,
-  "label--hidden": "_label--hidden_1txp8_153",
-  labelHidden: ee,
-  feedback: te,
-  "select-wrapper": "_select-wrapper_1txp8_185",
-  selectWrapper: se,
-  select: ne,
-  "select--invalid": "_select--invalid_1txp8_304",
-  selectInvalid: ae,
-  "select--small": "_select--small_1txp8_311",
-  selectSmall: le,
-  "input--has-leading-icon": "_input--has-leading-icon_1txp8_357",
-  inputHasLeadingIcon: ce,
-  "input--has-action-button": "_input--has-action-button_1txp8_360",
-  inputHasActionButton: oe,
-  "input--has-second-action-button": "_input--has-second-action-button_1txp8_363",
-  inputHasSecondActionButton: ie,
-  "select--has-leading-icon": "_select--has-leading-icon_1txp8_366",
-  selectHasLeadingIcon: re,
-  "select--has-action-button": "_select--has-action-button_1txp8_369",
-  selectHasActionButton: _e,
-  "select--has-second-action-button": "_select--has-second-action-button_1txp8_372",
-  selectHasSecondActionButton: de,
-  "select--has-affix": "_select--has-affix_1txp8_375",
-  selectHasAffix: pe,
-  "select--is-ready": "_select--is-ready_1txp8_387",
-  selectIsReady: xe,
-  "select--placeholder": "_select--placeholder_1txp8_399",
-  selectPlaceholder: fe,
-  chevron: ue,
-  "chevron--small": "_chevron--small_1txp8_412",
-  chevronSmall: he,
-  "chevron--disabled": "_chevron--disabled_1txp8_415",
-  chevronDisabled: be
-}, me = ({
-  id: t,
-  label: l,
-  options: a
-}) => {
-  if (!t)
-    throw new Error(
-      f(
-        "DSSelect",
-        'A unique "id" prop is required. Please add an unique "id" prop to the DSSelect component.'
-      )
-    );
-  if (!l)
-    throw new Error(
-      f(
-        "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 (!a || a.length === 0)
-    throw new Error(
-      f(
-        "DSSelect",
-        'Options are always required. Please add an "options" prop to the DSSelect component.'
-      )
-    );
-}, ve = (t, l, a) => t === "" || l !== void 0 && l !== "" ? !1 : !(a !== void 0 && a !== ""), Be = ({
-  id: t,
-  label: l,
-  options: a,
-  className: D,
-  defaultValue: u,
-  disabled: h = !1,
-  hideLabel: I = !1,
-  hint: d,
-  invalid: r = !1,
-  placeholder: p = "Select",
-  required: b = !1,
-  size: m = "medium",
-  systemFeedback: x,
-  value: v,
-  ...y
-}) => {
-  process.env.NODE_ENV !== "production" && me({
-    id: t,
-    label: l,
-    options: a
-  });
-  const i = R(null), [j, A] = q(
-    ve(p, u, v)
-  );
-  W(() => {
-    if (!i.current)
-      return;
-    const c = () => {
-      if (!i.current)
-        return;
-      const o = i.current.value;
-      A(o === "");
-    }, n = i.current;
-    return n.addEventListener("change", c), () => {
-      n.removeEventListener("change", c);
-    };
-  }, []);
-  const B = F(I), S = `${t}-label`, g = `${t}-feedback`, H = `${t}-hint`, N = d ? ` ${H}` : "", P = (c) => [
-    p && /* @__PURE__ */ s.jsx("option", { value: "", children: p }, `${t}-hidden-option-disabled-placeholder`),
-    ...c.map((n) => {
-      if ("options" in n) {
-        const { label: o, options: C } = n;
-        return /* @__PURE__ */ s.jsx("optgroup", { label: o, children: C.map(w) }, o);
-      } else
-        return w(n);
-    })
-  ], w = ({ label: c, value: n, isDisabled: o }) => /* @__PURE__ */ s.jsx("option", { value: n, disabled: o, children: c }, n), E = _(e.root, D), L = _(e.select, {
-    [e.selectSmall]: m === "small",
-    [e.selectInvalid]: r,
-    [e.selectPlaceholder]: j
-  }), k = _(e.label, {
-    // hide label only visually to keep them available for assistive technologies
-    [e.labelHidden]: B
-  }), $ = _(e.chevron, {
-    [e.chevronSmall]: m === "small",
-    [e.chevronDisabled]: h
-  });
-  return /* @__PURE__ */ s.jsxs("div", { className: E, children: [
-    /* @__PURE__ */ s.jsxs("label", { className: k, id: S, htmlFor: t, children: [
-      l,
-      b && /* @__PURE__ */ s.jsx(M, {})
-    ] }),
-    d && /* @__PURE__ */ s.jsx("div", { className: e.hint, id: H, children: d }),
-    r && x && /* @__PURE__ */ s.jsx(
-      V,
-      {
-        className: e.feedback,
-        message: x,
-        type: "invalid",
-        id: g,
-        "aria-live": "assertive"
-      }
-    ),
-    /* @__PURE__ */ s.jsxs("div", { className: e.selectWrapper, children: [
-      /* @__PURE__ */ s.jsx(
-        "select",
-        {
-          ...y,
-          id: t,
-          ref: i,
-          className: L,
-          "aria-labelledby": `${S}${N}`,
-          "aria-describedby": r && x ? g : void 0,
-          "aria-invalid": r,
-          defaultValue: u,
-          value: v,
-          disabled: h,
-          required: b,
-          children: P(a)
-        }
-      ),
-      /* @__PURE__ */ s.jsx(
-        O,
-        {
-          name: "chevron-down",
-          className: $,
-          "aria-hidden": "true"
-        }
-      )
-    ] })
-  ] });
-};
-export {
-  Be as DSSelect
-};

package/spinner.ee015469.js

@@ -1,58 +0,0 @@
-import "./assets/Spinner.af45d460.css";
-import { j as t } from "./chunks/jsx-runtime.5c071667.js";
-import { c as n } from "./chunks/index.8021d3e0.js";
-import { DSIcon as _ } from "./icon.b4211784.js";
-const m = "_root_1spts_25", z = "_root-size-small_1spts_31", c = "_root-size-medium_1spts_35", p = "_root-size-large_1spts_39", S = "_root-size-x-large_1spts_43", d = "_root-size-inherit_1spts_47", g = "_rotate_1spts_1", u = "_screenReaderOnly_1spts_67", e = {
-  root: m,
-  "root-size-small": "_root-size-small_1spts_31",
-  rootSizeSmall: z,
-  "root-size-medium": "_root-size-medium_1spts_35",
-  rootSizeMedium: c,
-  "root-size-large": "_root-size-large_1spts_39",
-  rootSizeLarge: p,
-  "root-size-x-large": "_root-size-x-large_1spts_43",
-  rootSizeXLarge: S,
-  "root-size-inherit": "_root-size-inherit_1spts_47",
-  rootSizeInherit: d,
-  rotate: g,
-  screenReaderOnly: u
-}, j = ({
-  aria: r,
-  className: s,
-  size: o = "small",
-  theme: i = "light",
-  ...a
-}) => {
-  const l = n(e.root, s, {
-    [e.rootSizeSmall]: o === "small",
-    [e.rootSizeMedium]: o === "medium",
-    [e.rootSizeLarge]: o === "large",
-    [e.rootSizeXLarge]: o === "x-large",
-    [e.rootSizeInherit]: o === "inherit"
-  });
-  return /* @__PURE__ */ t.jsxs(
-    "span",
-    {
-      className: l,
-      role: "alert",
-      "aria-live": "assertive",
-      "aria-label": (r == null ? void 0 : r["aria-label"]) || void 0,
-      ...a,
-      children: [
-        /* @__PURE__ */ t.jsx("span", { className: e.screenReaderOnly, children: " " }),
-        /* @__PURE__ */ t.jsx(
-          _,
-          {
-            name: "loading-spinner",
-            theme: i,
-            focusable: "false",
-            "aria-hidden": "true"
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  j as DSSpinner
-};