A dialog with a trigger

// apps/docs/examples/ui/dialog-basic.tsx'use client';
import {Button} from '@workspace/active-ui/components/primitives/button';import {  Dialog,  DialogClose,  DialogContent,  DialogDescription,  DialogFooter,  DialogHeader,  DialogTitle,  DialogTrigger,} from '@workspace/active-ui/components/primitives/dialog';import {  Field,  FieldLabel,} from '@workspace/active-ui/components/primitives/field';import {Input} from '@workspace/active-ui/components/primitives/input';
/** * A trigger, a title and description, content, and a footer. The close * button at the top right has no visible text, so `closeLabel` gives it its * accessible name; the package does not supply one. */export default function DialogBasic() {  return (    <Dialog>      <DialogTrigger render={<Button variant="outline" />}>        Rename scheme      </DialogTrigger>      <DialogContent closeLabel="Close">        <DialogHeader>          <DialogTitle>Rename scheme</DialogTitle>          <DialogDescription>            The new name appears everywhere the scheme is listed.          </DialogDescription>        </DialogHeader>        <Field>          <FieldLabel htmlFor="dialog-scheme-name">Name</FieldLabel>          <Input id="dialog-scheme-name" defaultValue="Basic scheme 2026" />        </Field>        <DialogFooter>          <DialogClose render={<Button variant="outline" />}>            Cancel          </DialogClose>          <DialogClose render={<Button />}>Save</DialogClose>        </DialogFooter>      </DialogContent>    </Dialog>  );}