@arolariu/components
Version:
🎨 70+ beautiful, accessible React components built on Base UI. TypeScript-first, CSS Modules styling, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡
162 lines (161 loc) • 6.39 kB
JavaScript
"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { AlertDialog } from "@base-ui/react/alert-dialog";
import { mergeProps } from "@base-ui/react/merge-props";
import { useRender } from "@base-ui/react/use-render";
import { cn } from "../../lib/utilities.js";
import alert_dialog_module from "./alert-dialog.module.js";
import button_module from "./button.module.js";
import * as __rspack_external_react from "react";
function alert_dialog_AlertDialog(props) {
return /*#__PURE__*/ jsx(AlertDialog.Root, {
...props
});
}
alert_dialog_AlertDialog.displayName = "AlertDialog";
const AlertDialogTrigger = /*#__PURE__*/ __rspack_external_react.forwardRef((props, forwardedRef)=>{
const { asChild = false, children, className, render, ...otherProps } = props;
const renderProp = asChild && /*#__PURE__*/ __rspack_external_react.isValidElement(children) ? children : render;
return /*#__PURE__*/ jsx(AlertDialog.Trigger, {
...otherProps,
ref: forwardedRef,
render: useRender({
defaultTagName: "button",
render: renderProp,
props: mergeProps({
className
}, {})
}),
children: renderProp ? void 0 : children
});
});
AlertDialogTrigger.displayName = "AlertDialogTrigger";
const AlertDialogPortal = AlertDialog.Portal;
AlertDialogPortal.displayName = "AlertDialogPortal";
function AlertDialogOverlay(props) {
const { className, render, ...otherProps } = props;
return /*#__PURE__*/ jsx(AlertDialog.Backdrop, {
...otherProps,
render: useRender({
defaultTagName: "div",
render: render,
props: mergeProps({
className: cn(alert_dialog_module.backdrop, className)
}, {})
})
});
}
AlertDialogOverlay.displayName = "AlertDialogOverlay";
const AlertDialogContent = /*#__PURE__*/ __rspack_external_react.forwardRef((props, forwardedRef)=>{
const { className, children, render, ...otherProps } = props;
return /*#__PURE__*/ jsxs(AlertDialogPortal, {
children: [
/*#__PURE__*/ jsx(AlertDialogOverlay, {}),
/*#__PURE__*/ jsx(AlertDialog.Popup, {
...otherProps,
ref: forwardedRef,
render: useRender({
defaultTagName: "div",
render: render,
props: mergeProps({
className: cn(alert_dialog_module.popup, className)
}, {})
}),
children: children
})
]
});
});
AlertDialogContent.displayName = "AlertDialogContent";
function AlertDialogHeader(props) {
const { asChild = false, children, className, render, ...otherProps } = props;
const renderProp = asChild && /*#__PURE__*/ __rspack_external_react.isValidElement(children) ? children : render;
return useRender({
defaultTagName: "div",
render: renderProp,
props: mergeProps({
className: cn(alert_dialog_module.header, className)
}, otherProps, {
children: renderProp ? void 0 : children
})
});
}
AlertDialogHeader.displayName = "AlertDialogHeader";
function AlertDialogFooter(props) {
const { asChild = false, children, className, render, ...otherProps } = props;
const renderProp = asChild && /*#__PURE__*/ __rspack_external_react.isValidElement(children) ? children : render;
return useRender({
defaultTagName: "div",
render: renderProp,
props: mergeProps({
className: cn(alert_dialog_module.footer, className)
}, otherProps, {
children: renderProp ? void 0 : children
})
});
}
AlertDialogFooter.displayName = "AlertDialogFooter";
function AlertDialogTitle(props) {
const { className, children, render, ...otherProps } = props;
return /*#__PURE__*/ jsx(AlertDialog.Title, {
...otherProps,
render: useRender({
defaultTagName: "h2",
render: render,
props: mergeProps({
className: cn(alert_dialog_module.title, className)
}, {})
}),
children: children
});
}
AlertDialogTitle.displayName = "AlertDialogTitle";
function AlertDialogDescription(props) {
const { className, children, render, ...otherProps } = props;
return /*#__PURE__*/ jsx(AlertDialog.Description, {
...otherProps,
render: useRender({
defaultTagName: "p",
render: render,
props: mergeProps({
className: cn(alert_dialog_module.description, className)
}, {})
}),
children: children
});
}
AlertDialogDescription.displayName = "AlertDialogDescription";
const AlertDialogAction = /*#__PURE__*/ __rspack_external_react.forwardRef((props, forwardedRef)=>{
const { className, children, render, ...otherProps } = props;
return /*#__PURE__*/ jsx(AlertDialog.Close, {
...otherProps,
ref: forwardedRef,
render: useRender({
defaultTagName: "button",
render: render,
props: mergeProps({
className: cn(button_module.button, button_module["default"], button_module.sizeDefault, className)
}, {})
}),
children: children
});
});
AlertDialogAction.displayName = "AlertDialogAction";
const AlertDialogCancel = /*#__PURE__*/ __rspack_external_react.forwardRef((props, forwardedRef)=>{
const { className, children, render, ...otherProps } = props;
return /*#__PURE__*/ jsx(AlertDialog.Close, {
...otherProps,
ref: forwardedRef,
render: useRender({
defaultTagName: "button",
render: render,
props: mergeProps({
className: cn(button_module.button, button_module.outline, button_module.sizeDefault, alert_dialog_module.cancel, className)
}, {})
}),
children: children
});
});
AlertDialogCancel.displayName = "AlertDialogCancel";
export { AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, alert_dialog_AlertDialog as AlertDialog };
//# sourceMappingURL=alert-dialog.js.map