@konstructio/ui/dist/index-C65LtGuU.js

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

import { jsx as a, Fragment as O, jsxs as w } from "react/jsx-runtime";
import * as l from "react";
import { c as I, b as x } from "./index-CIAmiWcw.js";
import { u } from "./index-DLcqcWxM.js";
import { c as A, R as M, P as L, O as $, W as F, C as B, T as G, d as W, b as v, e as j } from "./index-Ds6U2x4Z.js";
import { Button as Y } from "./components/Button/Button.js";
import { cn as k } from "./utils/index.js";
var q = Symbol("radix.slottable");
// @__NO_SIDE_EFFECTS__
function H(r) {
  const e = ({ children: o }) => /* @__PURE__ */ a(O, { children: o });
  return e.displayName = `${r}.Slottable`, e.__radixId = q, e;
}
var D = "AlertDialog", [V, ne] = I(D, [
  A
]), s = A(), f = (r) => {
  const { __scopeAlertDialog: e, ...o } = r, t = s(e);
  return /* @__PURE__ */ a(M, { ...t, ...o, modal: !0 });
};
f.displayName = D;
var z = "AlertDialogTrigger", m = l.forwardRef(
  (r, e) => {
    const { __scopeAlertDialog: o, ...t } = r, i = s(o);
    return /* @__PURE__ */ a(j, { ...i, ...t, ref: e });
  }
);
m.displayName = z;
var J = "AlertDialogPortal", _ = (r) => {
  const { __scopeAlertDialog: e, ...o } = r, t = s(e);
  return /* @__PURE__ */ a(L, { ...t, ...o });
};
_.displayName = J;
var K = "AlertDialogOverlay", y = l.forwardRef(
  (r, e) => {
    const { __scopeAlertDialog: o, ...t } = r, i = s(o);
    return /* @__PURE__ */ a($, { ...i, ...t, ref: e });
  }
);
y.displayName = K;
var n = "AlertDialogContent", [Q, U] = V(n), X = /* @__PURE__ */ H("AlertDialogContent"), N = l.forwardRef(
  (r, e) => {
    const { __scopeAlertDialog: o, children: t, ...i } = r, d = s(o), p = l.useRef(null), P = u(e, p), g = l.useRef(null);
    return /* @__PURE__ */ a(
      F,
      {
        contentName: n,
        titleName: h,
        docsSlug: "alert-dialog",
        children: /* @__PURE__ */ a(Q, { scope: o, cancelRef: g, children: /* @__PURE__ */ w(
          B,
          {
            role: "alertdialog",
            ...d,
            ...i,
            ref: P,
            onOpenAutoFocus: x(i.onOpenAutoFocus, (c) => {
              c.preventDefault(), g.current?.focus({ preventScroll: !0 });
            }),
            onPointerDownOutside: (c) => c.preventDefault(),
            onInteractOutside: (c) => c.preventDefault(),
            children: [
              /* @__PURE__ */ a(X, { children: t }),
              /* @__PURE__ */ a(ee, { contentRef: p })
            ]
          }
        ) })
      }
    );
  }
);
N.displayName = n;
var h = "AlertDialogTitle", R = l.forwardRef(
  (r, e) => {
    const { __scopeAlertDialog: o, ...t } = r, i = s(o);
    return /* @__PURE__ */ a(G, { ...i, ...t, ref: e });
  }
);
R.displayName = h;
var C = "AlertDialogDescription", S = l.forwardRef((r, e) => {
  const { __scopeAlertDialog: o, ...t } = r, i = s(o);
  return /* @__PURE__ */ a(W, { ...i, ...t, ref: e });
});
S.displayName = C;
var Z = "AlertDialogAction", E = l.forwardRef(
  (r, e) => {
    const { __scopeAlertDialog: o, ...t } = r, i = s(o);
    return /* @__PURE__ */ a(v, { ...i, ...t, ref: e });
  }
);
E.displayName = Z;
var T = "AlertDialogCancel", b = l.forwardRef(
  (r, e) => {
    const { __scopeAlertDialog: o, ...t } = r, { cancelRef: i } = U(T, o), d = s(o), p = u(e, i);
    return /* @__PURE__ */ a(v, { ...d, ...t, ref: p });
  }
);
b.displayName = T;
var ee = ({ contentRef: r }) => {
  const e = `\`${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 \`${C}\` 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(() => {
    document.getElementById(
      r.current?.getAttribute("aria-describedby")
    ) || console.warn(e);
  }, [e, r]), null;
}, ce = f, re = m, pe = _, de = y, ge = N, ue = E, Ae = b, ve = R, De = S;
const fe = ({
  "data-theme": r,
  className: e,
  text: o,
  onOpen: t
}) => /* @__PURE__ */ a(re, { asChild: !0, children: /* @__PURE__ */ a(
  Y,
  {
    type: "button",
    "data-theme": r,
    className: k(e),
    onClick: t,
    children: o
  }
) });
export {
  fe as A,
  ge as C,
  De as D,
  de as O,
  pe as P,
  ce as R,
  ve as T,
  Ae as a,
  ue as b
};