import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useMemo } from "react";
import { twMerge } from "tailwind-merge";
import { PackageManagerInput } from "./package-manager-input.js";
import { PackageManagerList } from "./package-manager-list.js";
import { PackageManagerReactorSelect } from "./package-manager-select.js";
export const PackageManager = (props) => {
    const { className, reactorOptions, reactor, onReactorChange, onInstall, packages, onUninstall, mutable, packageOptions, ...rest } = props;
    const packageOptionsSet = useMemo(() => packageOptions?.filter((o) => !packages.find((p) => p.name === o.packageName)), [packages, packageOptions]);
    return (_jsxs("div", { ...rest, className: twMerge("flex h-full flex-1 flex-col rounded-lg p-3", className), children: [_jsx(PackageManagerReactorSelect, { reactor: reactor, reactorOptions: reactorOptions, onReactorChange: onReactorChange, className: "mb-4" }), mutable && (_jsx(PackageManagerInput, { onInstall: onInstall, packageOptions: packageOptionsSet })), _jsx(PackageManagerList, { packages: packages, onUninstall: onUninstall, mutable: mutable })] }));
};
//# sourceMappingURL=package-manager.js.map