import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Drawer, DrawerContent, DrawerTrigger, } from "@/components/ui/drawer";
import TemplateName from "./TemplateName";
import TemplateLanguage from "./LanguageSelector";
import TemplateArgs from "./TemplateArgs";
import { Button } from "@/components/ui/button";
import { Menu } from "lucide-react";
import { ScrollArea } from "@/components/ui/scroll-area";
import TemplateDescription from "./TemplateDescription";
export const Options = ({ locked, fixedArgs, }) => {
    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-col justify-between gap-10 sm:flex-row", children: [_jsx(TemplateName, { locked: locked }), _jsx(TemplateDescription, { locked: locked }), _jsx(TemplateLanguage, { locked: locked })] }), _jsx(TemplateArgs, { fixedArgs: fixedArgs, locked: locked })] }));
};
export const MobileOptions = () => {
    return (_jsxs(Drawer, { children: [_jsx(DrawerTrigger, { asChild: true, children: _jsxs(Button, { className: "gap-5", children: ["Template Options ", _jsx(Menu, {})] }) }), _jsx(DrawerContent, { className: "max-h-screen text-foreground", children: _jsx(ScrollArea, { className: "overflow-y-scroll", children: _jsx("div", { className: "mx-auto w-full max-w-sm", children: _jsx(Options, {}) }) }) })] }));
};
