Something went wrong. Try again.
ATProto-based AI Assistant Chat interface.
Something went wrong. Try again.
1234567891011121314151617181920212223242526272829303132333435363738import type { ReactNode } from 'react'import { cn } from '../cn.ts'import { floating } from './menu.ts'
/** * The class for a form around a panel card. The form lays out no box of its own, so the floating * card alone takes part in the layout it opens from, such as the header's row, and takes no room * there. */export const panelForm = 'contents'
interface Props { /** What the panel is for, its legend. */ title: string /** Classes that place the panel, such as under the control that opened it. */ className?: string children: ReactNode}
/** * A floating panel of controls under its title, such as a chat's sharing, whose corner nests around * its controls'. Its controls wrap in rows. */export function PanelCard(props: Props) { return ( <fieldset className={cn( floating, 'flex w-[min(--spacing(104),calc(100%-(--spacing(5.5))))] flex-wrap gap-2 rounded-panel p-3.5', props.className, )} > <legend className="float-start w-full font-semibold text-ink text-ui">{props.title}</legend> {props.children} </fieldset> )}