import { getComponentBySlug, listComponents } from "../db/queries.js";
const PACKAGES = {
    vue: {
        name: "@mozaic-ds/vue-3",
        peerDependencies: ["vue@^3.0"],
    },
    react: {
        name: "@mozaic-ds/react",
        peerDependencies: ["react@^17 || ^18", "react-dom@^17 || ^18"],
    },
};
const RELATED_PACKAGES = {
    styles: "@mozaic-ds/styles",
    icons: "@mozaic-ds/icons",
};
function pascalCase(str) {
    return str
        .split(/[-_\s]+/)
        .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
        .join("");
}
function getInstallCommand(packageName, packageManager) {
    switch (packageManager) {
        case "yarn":
            return `yarn add ${packageName}`;
        case "pnpm":
            return `pnpm add ${packageName}`;
        default:
            return `npm install ${packageName}`;
    }
}
export function handleGetInstallInfo(db, input) {
    const { component, framework = "vue", packageManager = "npm" } = input;
    if (!component || component.trim().length === 0) {
        const components = listComponents(db).slice(0, 10);
        return {
            content: [
                {
                    type: "text",
                    text: JSON.stringify({
                        error: "Please provide a component name",
                        example: 'get_install_info({ component: "button", framework: "vue" })',
                        availableComponents: components.map((c) => c.slug),
                    }, null, 2),
                },
            ],
        };
    }
    // Find the component in database
    const componentData = getComponentBySlug(db, component);
    if (!componentData) {
        // Try to find similar components
        const allComponents = listComponents(db);
        const searchTerm = component.toLowerCase();
        const similar = allComponents
            .filter((c) => c.slug.toLowerCase().includes(searchTerm) || searchTerm.includes(c.slug.toLowerCase()))
            .slice(0, 5);
        return {
            content: [
                {
                    type: "text",
                    text: JSON.stringify({
                        error: `Component "${component}" not found`,
                        suggestions: similar.length > 0 ? similar.map((c) => c.slug) : undefined,
                        hint: "Use list_components to see all available components",
                    }, null, 2),
                },
            ],
        };
    }
    const packageInfo = PACKAGES[framework];
    const componentName = `M${pascalCase(componentData.slug)}`;
    const response = {
        component: componentName,
        componentSlug: componentData.slug,
        framework,
        package: packageInfo.name,
        installCommand: getInstallCommand(packageInfo.name, packageManager),
        imports: {
            component: framework === "vue"
                ? `import { ${componentName} } from "${packageInfo.name}";`
                : `import { ${componentName} } from "${packageInfo.name}";`,
            styles: `@import "${RELATED_PACKAGES.styles}/lib/index.css";`,
        },
        peerDependencies: packageInfo.peerDependencies,
        relatedPackages: {
            styles: {
                name: RELATED_PACKAGES.styles,
                installCommand: getInstallCommand(RELATED_PACKAGES.styles, packageManager),
                description: "Required CSS styles for Mozaic components",
            },
            icons: {
                name: RELATED_PACKAGES.icons,
                installCommand: getInstallCommand(RELATED_PACKAGES.icons, packageManager),
                description: "SVG icons library (optional)",
            },
        },
        quickStart: framework === "vue"
            ? {
                setup: `// main.ts
import { createApp } from "vue";
import App from "./App.vue";
import "${RELATED_PACKAGES.styles}/lib/index.css";

createApp(App).mount("#app");`,
                usage: `<template>
  <${componentName} />
</template>

<script setup lang="ts">
import { ${componentName} } from "${packageInfo.name}";
</script>`,
            }
            : {
                setup: `// index.tsx
import "${RELATED_PACKAGES.styles}/lib/index.css";`,
                usage: `import { ${componentName} } from "${packageInfo.name}";

function MyComponent() {
  return <${componentName} />;
}`,
            },
    };
    return {
        content: [
            {
                type: "text",
                text: JSON.stringify(response, null, 2),
            },
        ],
    };
}
// Tool definition for MCP
export const getInstallInfoTool = {
    name: "get_install_info",
    description: "Get installation commands and import statements for a Mozaic component. Returns package name, install command (npm/yarn/pnpm), import statements, peer dependencies, and quick start code.",
    inputSchema: {
        type: "object",
        properties: {
            component: {
                type: "string",
                description: 'Component name (e.g., "button", "modal", "text-input")',
            },
            framework: {
                type: "string",
                enum: ["vue", "react"],
                default: "vue",
                description: "Target framework: vue (@mozaic-ds/vue-3) or react (@mozaic-ds/react)",
            },
            packageManager: {
                type: "string",
                enum: ["npm", "yarn", "pnpm"],
                default: "npm",
                description: "Package manager for install commands",
            },
        },
        required: ["component"],
    },
};
//# sourceMappingURL=get-install-info.js.map