Files
image-studio/view/GenerateSheet.tsx
2026-07-04 15:37:54 +02:00

28 lines
1013 B
TypeScript

import type { GenerateSettings } from "@editor/tools";
import type { AppStore } from "@editor/store";
import { GenerateControls } from "./bottom-controls/GenerateControls";
export type GenerateSheetProps = {
settings: GenerateSettings;
open: boolean;
dispatch: AppStore["dispatch"];
};
export function GenerateSheet({ settings, open, dispatch }: GenerateSheetProps) {
return (
<aside
aria-hidden={!open}
aria-label="Generate settings"
className={`pointer-events-auto absolute bottom-6 right-4 top-24 z-20 flex w-[28rem] max-w-[calc(100vw-2rem)] flex-col overflow-hidden rounded-[2.5rem] px-4 text-sm text-white backdrop-blur-xl transition-all duration-200 ${
open ? "translate-x-0 opacity-100" : "pointer-events-none translate-x-8 opacity-0"
}`}
>
{open ? (
<div className="subtle-scrollbar min-h-0 flex-1 overflow-auto py-4">
<GenerateControls settings={settings} dispatch={dispatch} />
</div>
) : null}
</aside>
);
}