"use client";
/*
 * Documentation:
 * Dialog — https://app.subframe.com/f023064a5ca0/library?component=Dialog_ca59db17-43fb-4247-8094-3c55162e902d
 * Dialog Layout — https://app.subframe.com/f023064a5ca0/library?component=Dialog+Layout_ff4920a8-df26-4012-934d-0a9edbf5e373
 */

import React from "react";
import { Dialog } from "../../components/Dialog";
import * as SubframeUtils from "../../utils";

export interface DialogLayoutRootProps
  extends React.ComponentProps<typeof Dialog> {
  children?: React.ReactNode;
  className?: string;
}

const DialogLayoutRoot = React.forwardRef<
  React.ElementRef<typeof Dialog>,
  DialogLayoutRootProps
>(function DialogLayoutRoot(
  { children, className, ...otherProps }: DialogLayoutRootProps,
  ref
) {
  return (
    <Dialog className={className} ref={ref} {...otherProps}>
      {children ? (
        <div className="flex items-start gap-6 bg-surface-neutral-secondary">
          {children}
        </div>
      ) : null}
    </Dialog>
  );
});

export const DialogLayout = DialogLayoutRoot;