@hoosei/voxweave-react/dist/esm/index7.js

A customizable and interactive voice UI component for React applications

import * as x from "react";
import { Root as f, Portal as p, Close as l, Trigger as g, Overlay as v, Content as d, Title as n, Description as r } from "./index23.js";
import { cn as s } from "./index8.js";
import { jsx as e, jsxs as i } from "react/jsx-runtime";
import u from "./index18.js";
const j = f, k = g, y = p, F = l, c = x.forwardRef(({
  className: o,
  ...a
}, t) => /* @__PURE__ */ e(v, {
  ref: t,
  className: s("vox-fixed vox-inset-0 vox-z-50 vox-bg-white/80 vox-backdrop-blur-sm data-[state=open]:vox-animate-in data-[state=closed]:vox-animate-out data-[state=closed]:vox-fade-out-0 data-[state=open]:vox-fade-in-0", o),
  ...a
}));
c.displayName = v.displayName;
const N = x.forwardRef(({
  className: o,
  children: a,
  ...t
}, m) => /* @__PURE__ */ i(y, {
  children: [/* @__PURE__ */ e(c, {}), /* @__PURE__ */ i(d, {
    ref: m,
    className: s("vox-fixed vox-left-[50%] vox-top-[50%] vox-z-50 vox-grid vox-w-full vox-max-w-lg vox-translate-x-[-50%] vox-translate-y-[-50%] vox-gap-4 vox-border vox-bg-white vox-p-6 vox-shadow-lg vox-duration-200 data-[state=open]:vox-animate-in data-[state=closed]:vox-animate-out data-[state=closed]:vox-fade-out-0 data-[state=open]:vox-fade-in-0 data-[state=closed]:vox-zoom-out-95 data-[state=open]:vox-zoom-in-95 data-[state=closed]:vox-slide-out-to-left-1/2 data-[state=closed]:vox-slide-out-to-top-[48%] data-[state=open]:vox-slide-in-from-left-1/2 data-[state=open]:vox-slide-in-from-top-[48%] sm:vox-rounded-lg", o),
    ...t,
    children: [a, /* @__PURE__ */ i(l, {
      className: "vox-absolute vox-right-4 vox-top-4 vox-rounded-sm vox-opacity-70 vox-ring-offset-background vox-transition-opacity hover:vox-opacity-100 focus:vox-outline-none focus:vox-ring-2 focus:vox-ring-ring focus:vox-ring-offset-2 disabled:vox-pointer-events-none data-[state=open]:vox-bg-accent data-[state=open]:vox-text-muted-foreground",
      children: [/* @__PURE__ */ e(u, {
        className: "vox-h-4 vox-w-4"
      }), /* @__PURE__ */ e("span", {
        className: "vox-sr-only",
        children: "Close"
      })]
    })]
  })]
}));
N.displayName = d.displayName;
const D = ({
  className: o,
  ...a
}) => /* @__PURE__ */ e("div", {
  className: s("vox-flex vox-flex-col vox-space-y-1.5 vox-text-center sm:vox-text-left", o),
  ...a
});
D.displayName = "DialogHeader";
const h = ({
  className: o,
  ...a
}) => /* @__PURE__ */ e("div", {
  className: s("vox-flex vox-flex-col-reverse sm:vox-flex-row sm:vox-justify-end sm:vox-space-x-2", o),
  ...a
});
h.displayName = "DialogFooter";
const w = x.forwardRef(({
  className: o,
  ...a
}, t) => /* @__PURE__ */ e(n, {
  ref: t,
  className: s("vox-text-lg vox-font-semibold vox-leading-none vox-tracking-tight", o),
  ...a
}));
w.displayName = n.displayName;
const b = x.forwardRef(({
  className: o,
  ...a
}, t) => /* @__PURE__ */ e(r, {
  ref: t,
  className: s("vox-text-sm vox-text-muted-foreground", o),
  ...a
}));
b.displayName = r.displayName;
export {
  j as Dialog,
  F as DialogClose,
  N as DialogContent,
  b as DialogDescription,
  h as DialogFooter,
  D as DialogHeader,
  c as DialogOverlay,
  y as DialogPortal,
  w as DialogTitle,
  k as DialogTrigger
};
//# sourceMappingURL=index7.js.map