@stihl-design-system/components/chunks/Fieldset.BBMuLKps.js

Welcome to the STIHL Design System react component library.

"use client";
import { jsxs as a, jsx as t, Fragment as H } from "react/jsx-runtime";
import { c as _ } from "./index.DQOqod3i.js";
import "react";
import { u as L } from "./useBreakpoint.1txsny17.js";
import { Asterisk as F } from "../asterisk.Dwtdwpkq.js";
import { DSHeading as M } from "../heading.BHSklXho.js";
import { D as x } from "./Popover.CxZZ_y1Z.js";
import { D as B } from "./SystemFeedback.DhWcYjnu.js";
import { g as u } from "./helpers.CexwVao7.js";
import '../assets/Fieldset.BbLGXCWa.css';const E = "ds-fieldset_root_z6gah_1", T = "ds-fieldset_root--dark_z6gah_115", A = "ds-fieldset_child-wrapper_z6gah_220", I = "ds-fieldset_legend-wrapper_z6gah_227", U = "ds-fieldset_legend_z6gah_227", O = "ds-fieldset_legend--hidden_z6gah_238", V = "ds-fieldset_legend--utility--m_z6gah_253", $ = "ds-fieldset_description_z6gah_265", G = "ds-fieldset_description--small_z6gah_279", J = "ds-fieldset_system-feedback_z6gah_283", e = {
  root: E,
  rootDark: T,
  childWrapper: A,
  legendWrapper: I,
  legend: U,
  legendHidden: O,
  legendUtilityM: V,
  description: $,
  descriptionSmall: G,
  systemFeedback: J
}, K = ({
  description: l,
  hideLegend: c,
  id: s,
  legend: p,
  popoverContent: i,
  systemFeedback: g
}) => {
  if (!s && (l || g))
    throw new Error(u("DSFieldset", 'A unique "id" prop is required when providing the description or systemFeedback property. Please add a unique "id" prop to the DSFieldset component.'));
  if (!p)
    throw new Error(u("DSFieldset", "The legend prop is required. Please add the legend prop to the DSFieldset component."));
  c && i && console.warn(u("DSFieldset", 'Setting "hideLegend" and "popoverContent" at the same time is not supported. The popover info button is part of the legend and will be hidden along with it. Please remove either "hideLegend" or "popoverContent".'));
}, de = (l) => {
  const {
    children: c,
    legend: s,
    className: p,
    description: i,
    disabled: g = !1,
    hideLegend: D = !1,
    id: m,
    invalid: h = !1,
    popoverContent: f,
    popoverInfoButtonProps: z,
    required: b = !1,
    systemFeedback: d,
    theme: o = "light",
    ...w
  } = l, N = L(D);
  process.env.NODE_ENV !== "production" && K({
    description: i,
    hideLegend: D,
    id: m,
    legend: s,
    popoverContent: f,
    systemFeedback: d
  });
  let r, v, y;
  const n = typeof s == "object" && s !== void 0;
  n && ({
    headingSize: r,
    headingTag: v,
    headingText: y
  } = s);
  const S = `${m}-feedback`, k = `${m}-description`, P = [h && d && S, i && k].filter(Boolean).join(" ") || void 0, C = !n || r === "small" || r === "small-uppercase", W = _(e.root, p, {
    [e.rootDark]: o === "dark"
  }), j = _(e.legend, {
    [e.legendHidden]: N,
    [e.legendUtilityM]: !n
  }), q = _(e.description, {
    [e.descriptionSmall]: C
  });
  return /* @__PURE__ */ a("fieldset", { className: W, disabled: g, ...w, "aria-invalid": h, "aria-describedby": P, children: [
    /* @__PURE__ */ a("legend", { className: j, children: [
      /* @__PURE__ */ t("span", { className: e.legendWrapper, children: n ? /* @__PURE__ */ a(M, { tag: v, size: r, theme: o, children: [
        y,
        b && /* @__PURE__ */ t(F, {})
      ] }) : /* @__PURE__ */ a(H, { children: [
        s,
        b && /* @__PURE__ */ t(F, {})
      ] }) }),
      f && /* @__PURE__ */ t(x, { placement: "top", defaultAnchorButtonProps: z, theme: o, children: f })
    ] }),
    i && /* @__PURE__ */ t("span", { id: k, className: q, children: i }),
    h && d && /* @__PURE__ */ t(B, { id: S, variant: "error", message: d, theme: o, className: e.systemFeedback }),
    /* @__PURE__ */ t("div", { className: e.childWrapper, children: c })
  ] });
};
export {
  de as D,
  K as v
};