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

package/input.o8OT6rxJ.js

@@ -1,236 +0,0 @@
-"use client";
-import { j as i } from "./chunks/jsx-runtime.C-kxDJ4g.js";
-import { c as l } from "./chunks/index.CvOaL64Y.js";
-import { useState as m, useRef as k, useLayoutEffect as B, useEffect as as } from "react";
-import { u as ts } from "./chunks/useBreakpoint.5xBNDiCf.js";
-import { Asterisk as es } from "./asterisk.DU8THnoC.js";
-import { DSButton as E } from "./button.BUUGRxIp.js";
-import { DSIcon as ls } from "./icon.PX9_1kNB.js";
-import { DSSystemFeedback as os } from "./systemfeedback.C7iXO5A1.js";
-import { v as cs, a as ds, M as _s, b as us, s as fs, i as v, c as rs } from "./chunks/Input.utils.Bly6ZzLI.js";
-import './assets/input.BcP5kkZ2.css';const ps = "_input_1swsi_187", ms = "_input--invalid_1swsi_297", hs = "_input--small_1swsi_304", bs = "_input--has-leading-icon_1swsi_350", ws = "_input--has-action-button_1swsi_353", xs = "_input--has-second-action-button_1swsi_356", gs = "_input--has-affix_1swsi_368", Is = "_input--is-ready_1swsi_380", Ss = "_root_1swsi_387", ys = "_hint_1swsi_395", Hs = "_label_1swsi_395", ks = "_wrapper_1swsi_399", vs = "_affix_1swsi_405", Cs = "_affix--small_1swsi_425", Rs = "_affix--disabled_1swsi_437", js = "_prefix_1swsi_440", Ls = "_affix--readonly_1swsi_443", As = "_suffix_1swsi_453", Ds = "_leading-icon_1swsi_460", Ns = "_leading-icon--small_1swsi_472", Bs = "_leading-icon--disabled_1swsi_475", Es = "_action-button_1swsi_484", Ts = "_label--hidden_1swsi_501", Fs = "_feedback_1swsi_528", s = {
-  input: ps,
-  "input--invalid": "_input--invalid_1swsi_297",
-  inputInvalid: ms,
-  "input--small": "_input--small_1swsi_304",
-  inputSmall: hs,
-  "input--has-leading-icon": "_input--has-leading-icon_1swsi_350",
-  inputHasLeadingIcon: bs,
-  "input--has-action-button": "_input--has-action-button_1swsi_353",
-  inputHasActionButton: ws,
-  "input--has-second-action-button": "_input--has-second-action-button_1swsi_356",
-  inputHasSecondActionButton: xs,
-  "input--has-affix": "_input--has-affix_1swsi_368",
-  inputHasAffix: gs,
-  "input--is-ready": "_input--is-ready_1swsi_380",
-  inputIsReady: Is,
-  root: Ss,
-  hint: ys,
-  label: Hs,
-  wrapper: ks,
-  affix: vs,
-  "affix--small": "_affix--small_1swsi_425",
-  affixSmall: Cs,
-  "affix--disabled": "_affix--disabled_1swsi_437",
-  affixDisabled: Rs,
-  prefix: js,
-  "affix--readonly": "_affix--readonly_1swsi_443",
-  affixReadonly: Ls,
-  suffix: As,
-  "leading-icon": "_leading-icon_1swsi_460",
-  leadingIcon: Ds,
-  "leading-icon--small": "_leading-icon--small_1swsi_472",
-  leadingIconSmall: Ns,
-  "leading-icon--disabled": "_leading-icon--disabled_1swsi_475",
-  leadingIconDisabled: Bs,
-  "action-button": "_action-button_1swsi_484",
-  actionButton: Es,
-  "label--hidden": "_label--hidden_1swsi_501",
-  labelHidden: Ts,
-  feedback: Fs
-}, Js = ({
-  id: d,
-  label: C,
-  actionButtonLabel: T,
-  actionButtonIconName: u,
-  actionButtonIconSource: h,
-  actionButtonOnClick: F,
-  className: P,
-  disabled: a = !1,
-  hint: b,
-  hideLabel: O = !1,
-  invalid: f = !1,
-  leadingIconName: r,
-  leadingIconSource: p,
-  prefix: t,
-  readonly: _ = !1,
-  required: R = !1,
-  size: e = "medium",
-  suffix: n,
-  systemFeedback: w,
-  type: o = "text",
-  ...$
-}) => {
-  process.env.NODE_ENV !== "production" && (cs({
-    id: d,
-    label: C,
-    prefix: t,
-    suffix: n,
-    leadingIconName: r,
-    leadingIconSource: p,
-    actionButtonIconName: u,
-    actionButtonIconSource: h
-  }), ds(o));
-  const [W, X] = m(!1), [M, V] = m(!1), [x, G] = m(!1), [U, J] = m({}), g = k(null), K = t == null ? void 0 : t.substring(0, _s), I = k(null), Q = n == null ? void 0 : n.substring(0, us), S = k(null), Y = ts(O);
-  B(() => {
-    const c = e === "medium" ? 16 : 8, y = {};
-    if (I.current) {
-      const H = I.current.offsetWidth;
-      y.paddingInlineStart = c + H + "px";
-    }
-    if (S.current) {
-      const H = S.current.offsetWidth;
-      y.paddingInlineEnd = c + H + "px";
-    }
-    J(y), X(!0);
-  }, [t, n, e, M]), B(() => {
-    (async () => {
-      "fonts" in document && (await document.fonts.load(
-        '1em "STIHL Contraface Digital Text Regular"'
-      ), V(!0));
-    })();
-  }, []), as(() => {
-    const c = fs(
-      v(o),
-      rs(o)
-    );
-    G(c);
-  }, [o]);
-  const j = l(s.affix, {
-    [s.affixSmall]: e === "small",
-    [s.affixDisabled]: a,
-    [s.affixReadonly]: _
-  }), L = `${d}-label`, A = `${d}-feedback`, D = `${d}-hint`, Z = b ? ` ${D}` : "", q = l(s.root, P), z = l(s.input, {
-    // small input
-    [s.inputSmall]: e === "small",
-    // invalid state
-    [s.inputInvalid]: f,
-    // leading icon
-    [s.inputHasLeadingIcon]: r || p,
-    // prefix/suffix
-    [s.inputHasAffix]: t || n,
-    // action button
-    [s.inputHasActionButton]: u || h || x,
-    [s.inputIsReady]: W
-  }), ss = l(s.label, {
-    // hide label only visually to keep them available for assistive technologies
-    [s.labelHidden]: Y
-  }), is = l(s.leadingIcon, {
-    [s.leadingIconSmall]: e === "small",
-    [s.leadingIconDisabled]: a
-  }), N = l(s.actionButton, {
-    [s.actionButtonSmall]: e === "small"
-  }), ns = (c) => {
-    g.current && !a && !_ && g.current.showPicker(), c.preventDefault();
-  };
-  return /* @__PURE__ */ i.jsxs("div", { className: q, children: [
-    /* @__PURE__ */ i.jsxs("label", { className: ss, id: L, htmlFor: d, children: [
-      C,
-      R && /* @__PURE__ */ i.jsx(es, {})
-    ] }),
-    b && /* @__PURE__ */ i.jsx("div", { className: s.hint, id: D, children: b }),
-    f && w && /* @__PURE__ */ i.jsx(
-      os,
-      {
-        className: s.feedback,
-        message: w,
-        type: "invalid",
-        id: A
-      }
-    ),
-    /* @__PURE__ */ i.jsxs("div", { className: s.wrapper, children: [
-      t && /* @__PURE__ */ i.jsx(
-        "span",
-        {
-          className: l(j, s.prefix),
-          ref: I,
-          "aria-disabled": a,
-          children: K
-        }
-      ),
-      !t && (r || p) && /* @__PURE__ */ i.jsx(
-        ls,
-        {
-          name: r,
-          theme: "light",
-          source: p,
-          className: is,
-          "aria-hidden": "true"
-        }
-      ),
-      /* @__PURE__ */ i.jsx(
-        "input",
-        {
-          type: o,
-          className: z,
-          id: d,
-          ref: g,
-          ...$,
-          style: U,
-          "aria-labelledby": `${L}${Z}`,
-          "aria-describedby": f && w ? A : void 0,
-          "aria-invalid": f,
-          "aria-disabled": _,
-          readOnly: _,
-          required: R,
-          disabled: a
-        }
-      ),
-      n && /* @__PURE__ */ i.jsx(
-        "span",
-        {
-          className: l(j, s.suffix),
-          ref: S,
-          "aria-disabled": a,
-          children: Q
-        }
-      ),
-      !n && !x && (u || h) && /* @__PURE__ */ i.jsx(
-        E,
-        {
-          hideLabel: !0,
-          theme: "light",
-          iconName: u,
-          variant: "ghost",
-          className: N,
-          size: e,
-          onClick: F,
-          type: "button",
-          disabled: a || _,
-          children: T
-        }
-      ),
-      !n && x && !_ && !a && /* @__PURE__ */ i.jsxs(
-        E,
-        {
-          hideLabel: !0,
-          theme: "light",
-          iconName: v(o) ? "calendar" : "clock",
-          variant: "ghost",
-          className: N,
-          size: e,
-          onClick: ns,
-          type: "button",
-          children: [
-            "Open ",
-            v(o) ? "date" : "time",
-            " picker"
-          ]
-        }
-      )
-    ] })
-  ] });
-};
-export {
-  Js as DSInput
-};

package/inputpassword.-MXq8baU.js

@@ -1,139 +0,0 @@
-"use client";
-import { j as a } from "./chunks/jsx-runtime.C-kxDJ4g.js";
-import { c as i } from "./chunks/index.CvOaL64Y.js";
-import { useState as A } from "react";
-import { u as D } from "./chunks/useBreakpoint.5xBNDiCf.js";
-import { Asterisk as C } from "./asterisk.DU8THnoC.js";
-import { DSButton as L } from "./button.BUUGRxIp.js";
-import { DSSystemFeedback as $ } from "./systemfeedback.C7iXO5A1.js";
-import { g as b } from "./chunks/helpers.B1JT5ShS.js";
-import './assets/inputpassword.C3Uyj7oA.css';const E = "_input_8z84y_187", q = "_input--invalid_8z84y_297", R = "_input--small_8z84y_304", V = "_input--has-leading-icon_8z84y_350", O = "_input--has-action-button_8z84y_353", F = "_input--has-second-action-button_8z84y_356", M = "_input--has-affix_8z84y_368", T = "_input--is-ready_8z84y_380", G = "_root_8z84y_387", J = "_hint_8z84y_395", K = "_label_8z84y_395", Q = "_wrapper_8z84y_399", U = "_action-button_8z84y_405", W = "_label--hidden_8z84y_422", X = "_feedback_8z84y_449", t = {
-  input: E,
-  "input--invalid": "_input--invalid_8z84y_297",
-  inputInvalid: q,
-  "input--small": "_input--small_8z84y_304",
-  inputSmall: R,
-  "input--has-leading-icon": "_input--has-leading-icon_8z84y_350",
-  inputHasLeadingIcon: V,
-  "input--has-action-button": "_input--has-action-button_8z84y_353",
-  inputHasActionButton: O,
-  "input--has-second-action-button": "_input--has-second-action-button_8z84y_356",
-  inputHasSecondActionButton: F,
-  "input--has-affix": "_input--has-affix_8z84y_368",
-  inputHasAffix: M,
-  "input--is-ready": "_input--is-ready_8z84y_380",
-  inputIsReady: T,
-  root: G,
-  hint: J,
-  label: K,
-  wrapper: Q,
-  "action-button": "_action-button_8z84y_405",
-  actionButton: U,
-  "label--hidden": "_label--hidden_8z84y_422",
-  labelHidden: W,
-  feedback: X
-}, Y = ({ id: n, label: s }) => {
-  if (!n)
-    throw new Error(
-      b(
-        "DSInputPassword",
-        'A unique "id" prop is required. Please add an unique "id" prop to the DSInputPassword component.'
-      )
-    );
-  if (!s)
-    throw new Error(
-      b(
-        "DSInputPassword",
-        `A label is always required for a11y reasons. Please add a descriptive "label" prop to the DSInputPassword component. If you don't want to display a label, set hideLabel={true}.`
-      )
-    );
-}, lt = ({
-  id: n,
-  label: s,
-  autocomplete: h = "new-password",
-  className: f,
-  disabled: c = !1,
-  hidePasswordText: w = "Hide password",
-  hint: e,
-  hideLabel: z = !1,
-  invalid: o = !1,
-  readonly: r = !1,
-  required: d = !1,
-  showPasswordText: S = "Show password",
-  size: l = "medium",
-  systemFeedback: u,
-  ...x
-}) => {
-  process.env.NODE_ENV !== "production" && Y({
-    id: n,
-    label: s
-  });
-  const [p, I] = A(!1), _ = `${n}-label`, m = `${n}-feedback`, y = `${n}-hint`, B = e ? ` ${y}` : "", H = D(z), g = i(t.root, f), v = i(t.input, {
-    // small input
-    [t.inputSmall]: l === "small",
-    // invalid state
-    [t.inputInvalid]: o,
-    // action button - input password always has an action button
-    [t.inputHasActionButton]: !0
-  }), P = i(t.label, {
-    // hide label only visually to keep them available for assistive technologies
-    [t.labelHidden]: H
-  }), N = i(t.actionButton, {
-    [t.actionButtonSmall]: l === "small"
-  }), j = () => {
-    I((k) => !k);
-  };
-  return /* @__PURE__ */ a.jsxs("div", { className: g, children: [
-    /* @__PURE__ */ a.jsxs("label", { className: P, id: _, htmlFor: n, children: [
-      s,
-      d && /* @__PURE__ */ a.jsx(C, {})
-    ] }),
-    e && /* @__PURE__ */ a.jsx("div", { className: t.hint, id: y, children: e }),
-    o && u && /* @__PURE__ */ a.jsx(
-      $,
-      {
-        className: t.feedback,
-        message: u,
-        type: "invalid",
-        id: m
-      }
-    ),
-    /* @__PURE__ */ a.jsxs("div", { className: t.wrapper, children: [
-      /* @__PURE__ */ a.jsx(
-        "input",
-        {
-          className: v,
-          id: n,
-          ...x,
-          "aria-labelledby": `${_}${B}`,
-          "aria-describedby": o && u ? m : void 0,
-          "aria-invalid": o,
-          "aria-disabled": r,
-          readOnly: r,
-          required: d,
-          disabled: c,
-          autoComplete: h,
-          type: p ? "text" : "password"
-        }
-      ),
-      /* @__PURE__ */ a.jsx(
-        L,
-        {
-          hideLabel: !0,
-          theme: "light",
-          iconName: p ? "eye-closed" : "eye",
-          variant: "ghost",
-          className: N,
-          size: l,
-          onClick: j,
-          type: "button",
-          disabled: c,
-          children: p ? w : S
-        }
-      )
-    ] })
-  ] });
-};
-export {
-  lt as DSInputPassword
-};

package/inputsearch.CoYTSjox.js

@@ -1,188 +0,0 @@
-"use client";
-import { j as e } from "./chunks/jsx-runtime.C-kxDJ4g.js";
-import { c } from "./chunks/index.CvOaL64Y.js";
-import { useState as J, useRef as w, useEffect as A } from "react";
-import { g as y, a as K } from "./chunks/helpers.B1JT5ShS.js";
-import { u as Q } from "./chunks/useBreakpoint.5xBNDiCf.js";
-import { Asterisk as U } from "./asterisk.DU8THnoC.js";
-import { DSButton as D } from "./button.BUUGRxIp.js";
-import { DSSystemFeedback as X } from "./systemfeedback.C7iXO5A1.js";
-import './assets/inputsearch.tL3e9-Ob.css';const Y = "_input_17rym_187", Z = "_input--invalid_17rym_297", z = "_input--small_17rym_304", tt = "_input--has-leading-icon_17rym_350", nt = "_input--has-action-button_17rym_353", et = "_input--has-second-action-button_17rym_356", at = "_input--has-affix_17rym_368", st = "_input--is-ready_17rym_380", ot = "_root_17rym_387", it = "_hint_17rym_395", ct = "_label_17rym_395", rt = "_wrapper_17rym_399", ut = "_action-button_17rym_405", lt = "_second-action-button_17rym_409", pt = "_label--hidden_17rym_426", mt = "_feedback_17rym_453", t = {
-  input: Y,
-  "input--invalid": "_input--invalid_17rym_297",
-  inputInvalid: Z,
-  "input--small": "_input--small_17rym_304",
-  inputSmall: z,
-  "input--has-leading-icon": "_input--has-leading-icon_17rym_350",
-  inputHasLeadingIcon: tt,
-  "input--has-action-button": "_input--has-action-button_17rym_353",
-  inputHasActionButton: nt,
-  "input--has-second-action-button": "_input--has-second-action-button_17rym_356",
-  inputHasSecondActionButton: et,
-  "input--has-affix": "_input--has-affix_17rym_368",
-  inputHasAffix: at,
-  "input--is-ready": "_input--is-ready_17rym_380",
-  inputIsReady: st,
-  root: ot,
-  hint: it,
-  label: ct,
-  wrapper: rt,
-  "action-button": "_action-button_17rym_405",
-  actionButton: ut,
-  "second-action-button": "_second-action-button_17rym_409",
-  secondActionButton: lt,
-  "label--hidden": "_label--hidden_17rym_426",
-  labelHidden: pt,
-  feedback: mt
-}, _t = ({ id: n, label: r }) => {
-  if (!n)
-    throw new Error(
-      y(
-        "DSInputSearch",
-        'A unique "id" prop is required. Please add an unique "id" prop to the DSInputSearch component.'
-      )
-    );
-  if (!r)
-    throw new Error(
-      y(
-        "DSInputSearch",
-        `A label is always required for a11y reasons. Please add a descriptive "label" prop to the DSInputSearch component. If you don't want to display a label, set hideLabel={true}.`
-      )
-    );
-}, dt = (n) => !!K(n, "form"), Bt = ({
-  id: n,
-  label: r,
-  className: H,
-  clearButtonLabel: E = "Clear search field",
-  disabled: u = !1,
-  hint: d,
-  hideLabel: j = !1,
-  invalid: l = !1,
-  readonly: s = !1,
-  required: S = !1,
-  size: o = "medium",
-  submitButtonLabel: C = "Search",
-  systemFeedback: h,
-  value: b,
-  submitButtonOnClick: k,
-  onChange: I,
-  ...L
-}) => {
-  process.env.NODE_ENV !== "production" && _t({
-    id: n,
-    label: r
-  });
-  const [p, g] = J(b), f = w(null), m = w(null), V = Q(j);
-  A(() => {
-    g(b);
-  }, [b]), A(() => {
-    f.current && !dt(f.current) && process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && console.warn(
-      y(
-        "DSInputSearch",
-        `The DSInputSearch component with the id "${n}" is not within a form element. This may cause issues with form submission. Please ensure the DSInputSearch component is within a form element.`
-      )
-    );
-  }, []);
-  const v = `${n}-label`, B = `${n}-feedback`, x = `${n}-hint`, O = d ? ` ${x}` : "", N = p !== "" && p !== void 0 && p !== null, P = c(t.root, H), $ = c(t.input, {
-    // small input
-    [t.inputSmall]: o === "small",
-    // invalid state
-    [t.inputInvalid]: l,
-    // action button - input password always has an action button
-    [t.inputHasActionButton]: !0,
-    // action second action button
-    [t.inputHasSecondActionButton]: N && !s && !u
-  }), R = c(t.label, {
-    // hide label only visually to keep them available for assistive technologies
-    [t.labelHidden]: V
-  }), q = c(t.actionButton, {
-    [t.actionButtonSmall]: o === "small"
-  }), T = c(t.secondActionButton, {
-    [t.secondActionButtonSmall]: o === "small"
-  }), F = (a, i) => {
-    const G = Object.getPrototypeOf(a), _ = Object.getOwnPropertyDescriptor(
-      G,
-      "value"
-    );
-    _ != null && _.set ? _.set.call(a, i) : a.value = i;
-  }, M = () => {
-    var i;
-    if (!m.current)
-      return;
-    F(m.current, "");
-    const a = new Event("change", { bubbles: !0 });
-    (i = m.current) == null || i.dispatchEvent(a);
-  }, W = (a) => {
-    g(a.target.value), I && I(a);
-  };
-  return /* @__PURE__ */ e.jsxs("div", { className: P, ref: f, children: [
-    /* @__PURE__ */ e.jsxs("label", { className: R, id: v, htmlFor: n, children: [
-      r,
-      S && /* @__PURE__ */ e.jsx(U, {})
-    ] }),
-    d && /* @__PURE__ */ e.jsx("div", { className: t.hint, id: x, children: d }),
-    l && h && /* @__PURE__ */ e.jsx(
-      X,
-      {
-        className: t.feedback,
-        message: h,
-        type: "invalid",
-        id: B
-      }
-    ),
-    /* @__PURE__ */ e.jsxs("div", { className: t.wrapper, children: [
-      /* @__PURE__ */ e.jsx(
-        "input",
-        {
-          className: $,
-          id: n,
-          ref: m,
-          ...L,
-          "aria-labelledby": `${v}${O}`,
-          "aria-describedby": l && h ? B : void 0,
-          "aria-invalid": l,
-          "aria-disabled": s,
-          readOnly: s,
-          required: S,
-          disabled: u,
-          type: "search",
-          value: p,
-          onChange: W
-        }
-      ),
-      N && !s && !u && /* @__PURE__ */ e.jsx(
-        D,
-        {
-          hideLabel: !0,
-          theme: "light",
-          iconName: "cross",
-          className: T,
-          variant: "ghost",
-          size: o,
-          onClick: M,
-          type: "button",
-          tabIndex: -1,
-          children: E
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        D,
-        {
-          hideLabel: !0,
-          theme: "light",
-          iconName: "magnifying-glass",
-          className: q,
-          variant: "ghost",
-          size: o,
-          onClick: k,
-          type: "submit",
-          disabled: u || s,
-          children: C
-        }
-      )
-    ] })
-  ] });
-};
-export {
-  Bt as DSInputSearch
-};