68 lines
1.8 KiB
TypeScript
68 lines
1.8 KiB
TypeScript
"use client";
|
|
/*
|
|
* Documentation:
|
|
* Dialog — https://app.subframe.com/f023064a5ca0/library?component=Dialog_ecae5971-a047-4e67-9edd-3d361c1deef2
|
|
*/
|
|
|
|
import React from "react";
|
|
import * as SubframeCore from "@subframe/core";
|
|
import * as SubframeUtils from "../../utils";
|
|
|
|
export interface ContentProps
|
|
extends React.ComponentProps<typeof SubframeCore.Dialog.Content> {
|
|
children?: React.ReactNode;
|
|
className?: string;
|
|
}
|
|
|
|
const Content = React.forwardRef<HTMLDivElement, ContentProps>(function Content(
|
|
{ children, className, ...otherProps }: ContentProps,
|
|
ref
|
|
) {
|
|
return children ? (
|
|
<SubframeCore.Dialog.Content asChild={true} {...otherProps}>
|
|
<div
|
|
className={SubframeUtils.twClassNames(
|
|
"flex min-w-[320px] flex-col items-start gap-2 rounded-md border border-solid border-[#e5e5e5] bg-[#ffffff] shadow-lg max-h-[90vh] overflow-auto",
|
|
className
|
|
)}
|
|
ref={ref}
|
|
>
|
|
{children}
|
|
</div>
|
|
</SubframeCore.Dialog.Content>
|
|
) : null;
|
|
});
|
|
|
|
export interface DialogRootProps
|
|
extends React.ComponentProps<typeof SubframeCore.Dialog.Root> {
|
|
children?: React.ReactNode;
|
|
open?: boolean;
|
|
onOpenChange?: (open: boolean) => void;
|
|
className?: string;
|
|
}
|
|
|
|
const DialogRoot = React.forwardRef<HTMLDivElement, DialogRootProps>(
|
|
function DialogRoot(
|
|
{ children, className, ...otherProps }: DialogRootProps,
|
|
ref
|
|
) {
|
|
return children ? (
|
|
<SubframeCore.Dialog.Root asChild={true} {...otherProps}>
|
|
<div
|
|
className={SubframeUtils.twClassNames(
|
|
"flex h-full w-full flex-col items-center justify-center gap-2 bg-surface-neutral-overlay",
|
|
className
|
|
)}
|
|
ref={ref}
|
|
>
|
|
{children}
|
|
</div>
|
|
</SubframeCore.Dialog.Root>
|
|
) : null;
|
|
}
|
|
);
|
|
|
|
export const Dialog = Object.assign(DialogRoot, {
|
|
Content,
|
|
});
|