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

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

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