33 lines
982 B
TypeScript
33 lines
982 B
TypeScript
import type { JSX } from "solid-js";
|
|
import { splitProps } from "solid-js";
|
|
import { useInternalAlertDialogContext } from "./alert-dialog-context";
|
|
|
|
/** Props for AlertDialog.Trigger. */
|
|
export interface AlertDialogTriggerProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
children?: JSX.Element;
|
|
}
|
|
|
|
/** Opens the AlertDialog when clicked. */
|
|
export function AlertDialogTrigger(props: AlertDialogTriggerProps): JSX.Element {
|
|
const [local, rest] = splitProps(props, ["children", "onClick"]);
|
|
const ctx = useInternalAlertDialogContext();
|
|
|
|
const handleClick: JSX.EventHandler<HTMLButtonElement, MouseEvent> = (e) => {
|
|
if (typeof local.onClick === "function") local.onClick(e);
|
|
ctx.setOpen(true);
|
|
};
|
|
|
|
return (
|
|
<button
|
|
type="button"
|
|
aria-haspopup="dialog"
|
|
aria-controls={ctx.contentId()}
|
|
aria-expanded={ctx.isOpen() ? "true" : "false"}
|
|
onClick={handleClick}
|
|
{...rest}
|
|
>
|
|
{local.children}
|
|
</button>
|
|
);
|
|
}
|