@stihl-design-system/components/chunks/Dialog.Bv7k55He.js

Welcome to the STIHL Design System react component library.

"use client";
import { jsx as F, jsxs as Z } from "react/jsx-runtime";
import { d as ee } from "./index.CgTHIF3K.js";
import { c as W } from "./index.CEyLAtio.js";
import { useRef as Q, useState as oe, useEffect as U } from "react";
import { D as te } from "./Button.Cf1CKq8N.js";
import { g as le } from "./helpers.BbWkXTr3.js";
import '../assets/Dialog.CGAg7bnN.css';const se = "ds-dialog_root_kvopn_5", ne = "ds-dialog_content-wrapper_kvopn_166", re = "ds-dialog_content-wrapper--no-footer_kvopn_172", ce = "ds-dialog_close-button_kvopn_180", ae = "ds-dialog_header_kvopn_193", ie = "ds-dialog_content_kvopn_166", de = "ds-dialog_footer_kvopn_195", fe = "ds-dialog_header--scrollable_kvopn_216", pe = "ds-dialog_header--close-button_kvopn_225", ue = "ds-dialog_content--no-footer_kvopn_238", he = "ds-dialog_footer--scrollable_kvopn_245", t = {
  root: se,
  contentWrapper: ne,
  contentWrapperNoFooter: re,
  closeButton: ce,
  header: ae,
  content: ie,
  footer: de,
  headerScrollable: fe,
  headerCloseButton: pe,
  contentNoFooter: ue,
  footerScrollable: he
}, _e = ({
  tabIndex: c
}) => {
  if (c || c === 0)
    throw new Error(le("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."));
}, De = (c) => {
  const e = ee.c(59);
  let a, i, d, l, f, s, n, C, E, w;
  e[0] !== c ? ({
    children: a,
    className: i,
    closeButtonProps: d,
    disableBackdropClose: C,
    footer: l,
    header: f,
    hideCloseButton: E,
    isOpen: w,
    onClose: s,
    ...n
  } = c, e[0] = c, e[1] = a, e[2] = i, e[3] = d, e[4] = l, e[5] = f, e[6] = s, e[7] = n, e[8] = C, e[9] = E, e[10] = w) : (a = e[1], i = e[2], d = e[3], l = e[4], f = e[5], s = e[6], n = e[7], C = e[8], E = e[9], w = e[10]);
  const H = C === void 0 ? !1 : C, y = E === void 0 ? !1 : E, O = w === void 0 ? !1 : w;
  if (process.env.NODE_ENV !== "production") {
    const {
      tabIndex: o
    } = n;
    _e({
      tabIndex: o
    });
  }
  let p;
  e[11] !== d ? (p = d || {}, e[11] = d, e[12] = p) : p = e[12];
  let u, x;
  e[13] !== p ? ({
    label: x,
    ...u
  } = p, e[13] = p, e[14] = u, e[15] = x) : (u = e[14], x = e[15]);
  const I = x === void 0 ? "Close dialog" : x, r = Q(null), A = Q(null), [h, X] = oe(!1);
  let R, z;
  e[16] === Symbol.for("react.memo_cache_sentinel") ? (R = () => {
    const o = A.current;
    if (o) {
      const J = () => {
        X(o.scrollHeight > o.clientHeight);
      };
      J();
      const K = new ResizeObserver(J);
      return K.observe(o), () => {
        K.disconnect();
      };
    }
  }, z = [], e[16] = R, e[17] = z) : (R = e[16], z = e[17]), U(R, z);
  let L;
  e[18] !== O || e[19] !== s ? (L = [O, s], e[18] = O, e[19] = s, e[20] = L) : L = e[20], U(() => {
    const o = r.current;
    if (o)
      return o.addEventListener("close", G), O ? o.showModal() : o.close(), () => {
        o.removeEventListener("close", G);
      };
  }, L);
  const G = () => {
    s && s();
  };
  let M;
  e[21] !== H ? (M = (o) => {
    H || r.current && o.target === r.current && r.current.close();
  }, e[21] = H, e[22] = M) : M = e[22];
  const T = M;
  let P;
  e[23] === Symbol.for("react.memo_cache_sentinel") ? (P = () => {
    r.current && r.current.close();
  }, e[23] = P) : P = e[23];
  const Y = P;
  let _;
  e[24] !== i ? (_ = W(t.root, i), e[24] = i, e[25] = _) : _ = e[25];
  let m;
  e[26] !== T ? (m = (o) => T(o), e[26] = T, e[27] = m) : m = e[27];
  const V = !l;
  let v;
  e[28] !== V ? (v = W(t.contentWrapper, {
    [t.contentWrapperNoFooter]: V
  }), e[28] = V, e[29] = v) : v = e[29];
  let g;
  e[30] !== y || e[31] !== I || e[32] !== u ? (g = !y && /* @__PURE__ */ F(te, { ...u, className: t.closeButton, hideLabel: !0, iconName: "cross", size: "small", type: "button", variant: "ghost", onClick: () => Y(), children: I }), e[30] = y, e[31] = I, e[32] = u, e[33] = g) : g = e[33];
  const $ = !y;
  let b;
  e[34] !== h || e[35] !== $ ? (b = W(t.header, {
    [t.headerCloseButton]: $,
    [t.headerScrollable]: h
  }), e[34] = h, e[35] = $, e[36] = b) : b = e[36];
  let S;
  e[37] !== f || e[38] !== b ? (S = /* @__PURE__ */ F("header", { className: b, children: f }), e[37] = f, e[38] = b, e[39] = S) : S = e[39];
  const q = !l;
  let k;
  e[40] !== q ? (k = W(t.content, {
    [t.contentNoFooter]: q
  }), e[40] = q, e[41] = k) : k = e[41];
  let D;
  e[42] !== a || e[43] !== k ? (D = /* @__PURE__ */ F("div", { ref: A, className: k, tabIndex: 0, children: a }), e[42] = a, e[43] = k, e[44] = D) : D = e[44];
  let N;
  e[45] !== l || e[46] !== h ? (N = l && /* @__PURE__ */ F("footer", { className: W(t.footer, {
    [t.footerScrollable]: h
  }), children: l }), e[45] = l, e[46] = h, e[47] = N) : N = e[47];
  let B;
  e[48] !== v || e[49] !== g || e[50] !== S || e[51] !== D || e[52] !== N ? (B = /* @__PURE__ */ Z("div", { className: v, children: [
    g,
    S,
    D,
    N
  ] }), e[48] = v, e[49] = g, e[50] = S, e[51] = D, e[52] = N, e[53] = B) : B = e[53];
  let j;
  return e[54] !== n || e[55] !== _ || e[56] !== m || e[57] !== B ? (j = /* @__PURE__ */ F("dialog", { ...n, ref: r, className: _, onMouseDown: m, "aria-modal": "true", children: B }), e[54] = n, e[55] = _, e[56] = m, e[57] = B, e[58] = j) : j = e[58], j;
};
export {
  De as D,
  _e as v
};