Files
HiveGrid-Wireframes/hivegrid-cloud/apps/web/app/ui/components/ModalBlank/ModalBlank.tsx
T

68 lines
1.9 KiB
TypeScript

"use client";
/*
* Documentation:
* Modal Blank — https://app.subframe.com/f023064a5ca0/library?component=Modal+Blank_ca59db17-43fb-4247-8094-3c55162e902d
*/
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 ModalBlankRootProps
extends React.ComponentProps<typeof SubframeCore.Dialog.Root> {
children?: React.ReactNode;
open?: boolean;
onOpenChange?: (open: boolean) => void;
className?: string;
}
const ModalBlankRoot = React.forwardRef<HTMLDivElement, ModalBlankRootProps>(
function ModalBlankRoot(
{ children, className, ...otherProps }: ModalBlankRootProps,
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 ModalBlank = Object.assign(ModalBlankRoot, {
Content,
});