import * as React$1 from "react";
//#region src/components/preview-pane.d.ts
/**
 * Side-pane preview pattern: a list of options (menu items, rows) with a
 * fixed-width pane beside it that previews the highlighted option. The pane
 * stays mounted so the container never resizes mid-interaction; drive it
 * from `onMouseEnter`/`onFocus` on the options and render `PreviewPane`
 * empty (no children) while nothing is highlighted.
 */
type MenuPreviewLayoutProps = React$1.PropsWithChildren<{
  preview: React$1.ReactNode;
  className?: string;
  /**
   * `fixed` sizes the menu around a fixed-width pane. `remaining` is for a
   * menu whose width is set from outside: the pane takes the width the
   * options leave and is dropped below 10rem, so it never paints past the
   * menu. Pair it with a `PreviewPane` of `w-full`.
   */
  previewWidth?: "fixed" | "remaining";
}>;
declare const MenuPreviewLayout: ({ children, preview, className, previewWidth }: MenuPreviewLayoutProps) => React$1.JSX.Element;
type PreviewPaneProps = React$1.ComponentProps<"div"> & {
  /**
   * `default` is the side pane described above. `thumbnail` is the same pane
   * shrunk to sit inline inside a card or list row beside its own label.
   */
  size?: "default" | "thumbnail";
};
declare const PreviewPane: ({ children, className, size, ...props }: PreviewPaneProps) => React$1.JSX.Element;
//#endregion
export { MenuPreviewLayout, PreviewPane };