Files
supabase/apps/design-system/registry/default/example/dialog-close-button.tsx
Danny Whiteandcoderabbitai[bot] f6e8207e6d docs(design-system) add dialog pattern documentation (#41296)
* docs

* naming

* docs

* mini fix

* update policies component

* use destructured prop

* rls policies dialogs

* custom domain dialogs

* restart server dialog

* remove ConfirmDialog (aka ConfirmModal)

* docs updates

* remove unrelated work

* remove unrelated work

* remove unrelated work

* confirmation-modal demo

* use indicative components

* links

* tiny docs updates

* examples

* sheets and alert dialog examples

* docs and examples

* docs

* docs

* text confirm modal

* docs

* docs

* revert cursor rules

* fixes

* fix links

* Update apps/design-system/registry/examples.ts

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

* rabbit

* rabbit

* use variants

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
2025-12-17 11:24:36 +00:00

60 lines
1.6 KiB
TypeScript

import { Copy } from 'lucide-react'
import {
Button,
Dialog,
DialogClose,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogSection,
DialogSectionSeparator,
DialogTitle,
DialogTrigger,
Input_Shadcn_,
Label_Shadcn_,
} from 'ui'
export default function DialogCloseButton() {
return (
<Dialog>
<DialogTrigger asChild>
<Button type="default">Share</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-md">
<DialogHeader>
<DialogTitle>Share link</DialogTitle>
<DialogDescription>Anyone who has this link will be able to view this.</DialogDescription>
</DialogHeader>
<DialogSectionSeparator />
<DialogSection>
<div className="flex items-center space-x-2">
<div className="grid flex-1 gap-2">
<Label_Shadcn_ htmlFor="link" className="sr-only">
Link
</Label_Shadcn_>
<Input_Shadcn_
id="link"
defaultValue="https://ui.shadcn.com/docs/installation"
readOnly
/>
</div>
<Button htmlType="submit" size="small" type="secondary" className="px-3">
<span className="sr-only">Copy</span>
<Copy className="h-4 w-4" />
</Button>
</div>
</DialogSection>
<DialogFooter className="sm:justify-start">
<DialogClose asChild>
<Button type="default" htmlType="button">
Custom Close Button
</Button>
</DialogClose>
</DialogFooter>
</DialogContent>
</Dialog>
)
}