@konstructio/ui/dist/index-BNU3RH-3.js

A set of reusable and customizable React components built for konstruct.io

import { jsx as i, jsxs as w } from "react/jsx-runtime";
import * as l from "react";
import { c as M, b as x } from "./index-Cq1I1cG9.js";
import { u as A, b as I } from "./index-B5MIi2tR.js";
import { c as v, R as $, P as L, O as F, W as G, C as W, T as j, d as B, b as D, e as Y } from "./index-DLYwlPRZ.js";
import { Button as k } from "./components/Button/Button.js";
import { cn as q } from "./utils/index.js";
var f = "AlertDialog", [H, se] = M(f, [
  v
]), s = v(), m = (e) => {
  const { __scopeAlertDialog: o, ...r } = e, a = s(o);
  return /* @__PURE__ */ i($, { ...a, ...r, modal: !0 });
};
m.displayName = f;
var V = "AlertDialogTrigger", y = l.forwardRef(
  (e, o) => {
    const { __scopeAlertDialog: r, ...a } = e, t = s(r);
    return /* @__PURE__ */ i(Y, { ...t, ...a, ref: o });
  }
);
y.displayName = V;
var z = "AlertDialogPortal", _ = (e) => {
  const { __scopeAlertDialog: o, ...r } = e, a = s(o);
  return /* @__PURE__ */ i(L, { ...a, ...r });
};
_.displayName = z;
var J = "AlertDialogOverlay", N = l.forwardRef(
  (e, o) => {
    const { __scopeAlertDialog: r, ...a } = e, t = s(r);
    return /* @__PURE__ */ i(F, { ...t, ...a, ref: o });
  }
);
N.displayName = J;
var n = "AlertDialogContent", [K, Q] = H(n), U = I("AlertDialogContent"), h = l.forwardRef(
  (e, o) => {
    const { __scopeAlertDialog: r, children: a, ...t } = e, d = s(r), p = l.useRef(null), O = A(o, p), g = l.useRef(null);
    return /* @__PURE__ */ i(
      G,
      {
        contentName: n,
        titleName: C,
        docsSlug: "alert-dialog",
        children: /* @__PURE__ */ i(K, { scope: r, cancelRef: g, children: /* @__PURE__ */ w(
          W,
          {
            role: "alertdialog",
            ...d,
            ...t,
            ref: O,
            onOpenAutoFocus: x(t.onOpenAutoFocus, (c) => {
              var u;
              c.preventDefault(), (u = g.current) == null || u.focus({ preventScroll: !0 });
            }),
            onPointerDownOutside: (c) => c.preventDefault(),
            onInteractOutside: (c) => c.preventDefault(),
            children: [
              /* @__PURE__ */ i(U, { children: a }),
              /* @__PURE__ */ i(Z, { contentRef: p })
            ]
          }
        ) })
      }
    );
  }
);
h.displayName = n;
var C = "AlertDialogTitle", R = l.forwardRef(
  (e, o) => {
    const { __scopeAlertDialog: r, ...a } = e, t = s(r);
    return /* @__PURE__ */ i(j, { ...t, ...a, ref: o });
  }
);
R.displayName = C;
var E = "AlertDialogDescription", P = l.forwardRef((e, o) => {
  const { __scopeAlertDialog: r, ...a } = e, t = s(r);
  return /* @__PURE__ */ i(B, { ...t, ...a, ref: o });
});
P.displayName = E;
var X = "AlertDialogAction", S = l.forwardRef(
  (e, o) => {
    const { __scopeAlertDialog: r, ...a } = e, t = s(r);
    return /* @__PURE__ */ i(D, { ...t, ...a, ref: o });
  }
);
S.displayName = X;
var T = "AlertDialogCancel", b = l.forwardRef(
  (e, o) => {
    const { __scopeAlertDialog: r, ...a } = e, { cancelRef: t } = Q(T, r), d = s(r), p = A(o, t);
    return /* @__PURE__ */ i(D, { ...d, ...a, ref: p });
  }
);
b.displayName = T;
var Z = ({ contentRef: e }) => {
  const o = `\`${n}\` requires a description for the component to be accessible for screen reader users.

You can add a description to the \`${n}\` by passing a \`${E}\` component as a child, which also benefits sighted users by adding visible context to the dialog.

Alternatively, you can use your own component as a description by assigning it an \`id\` and passing the same value to the \`aria-describedby\` prop in \`${n}\`. If the description is confusing or duplicative for sighted users, you can use the \`@radix-ui/react-visually-hidden\` primitive as a wrapper around your description component.

For more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;
  return l.useEffect(() => {
    var a;
    document.getElementById(
      (a = e.current) == null ? void 0 : a.getAttribute("aria-describedby")
    ) || console.warn(o);
  }, [o, e]), null;
}, ne = m, ee = y, ce = _, pe = N, de = h, ge = S, ue = b, Ae = R, ve = P;
const De = ({
  "data-theme": e,
  className: o,
  text: r,
  onOpen: a
}) => /* @__PURE__ */ i(ee, { asChild: !0, children: /* @__PURE__ */ i(
  k,
  {
    type: "button",
    "data-theme": e,
    className: q(o),
    onClick: a,
    children: r
  }
) });
export {
  De as A,
  de as C,
  ve as D,
  pe as O,
  ce as P,
  ne as R,
  Ae as T,
  ue as a,
  ge as b
};