import { OriginUIService } from '../src/originui-service.js';
async function findAll20Tabs() {
console.log('š Finding all 20 tabs components (comp-426 to comp-445) with details...\n');
const service = new OriginUIService();
// Wait for discovery to complete
await new Promise(resolve => setTimeout(resolve, 3000));
// Search for each of the 20 tabs components from the main tabs page
const tabsRange = Array.from({length: 20}, (_, i) => `comp-${(426 + i).toString().padStart(3, '0')}`);
console.log(`šØ Getting details for all 20 tabs components from OriginUI tabs page:\n`);
for (let i = 0; i < tabsRange.length; i++) {
const componentId = tabsRange[i];
const componentNumber = i + 1;
console.log(`\n${'='.repeat(60)}`);
console.log(`šØ TABS VARIANT ${componentNumber}/20: ${componentId}`);
console.log('='.repeat(60));
try {
// Get component details
const detailsResult = await service.getComponentDetails(componentId);
const installResult = await service.getInstallCommand(componentId);
const screenshotResult = await service.getComponentScreenshot(componentId, 'light');
// Extract key information from details
const detailsText = detailsResult.content[0].text;
const typeMatch = detailsText.match(/\*\*Type:\*\* (.+)/);
const dependenciesMatch = detailsText.match(/\*\*Registry:\*\* (.+)/);
console.log(`š Component: ${componentId}`);
console.log(`š§ Type: ${typeMatch ? typeMatch[1] : 'registry:component'}`);
console.log(`š¦ Dependencies: ${dependenciesMatch ? dependenciesMatch[1] : 'Basic tabs'}`);
// Installation command
const installText = installResult.content[0].text;
const commandMatch = installText.match(/```bash\n(.+)\n```/);
if (commandMatch) {
console.log(`š¾ Install: ${commandMatch[1]}`);
}
// Visual reference
console.log(`š¼ļø Visual: Visit https://originui.com/tabs to see ${componentId} in action`);
// Try to infer what type of tabs this might be based on dependencies
if (dependenciesMatch) {
const deps = dependenciesMatch[1].toLowerCase();
if (deps.includes('scroll')) {
console.log(`šÆ Style Hint: Likely scrollable tabs variant`);
} else if (deps.includes('tooltip')) {
console.log(`šÆ Style Hint: Likely tabs with tooltip support`);
} else if (deps.includes('badge')) {
console.log(`šÆ Style Hint: Likely tabs with badge indicators`);
} else {
console.log(`šÆ Style Hint: Enhanced tabs variant`);
}
}
} catch (error) {
console.log(`ā Failed to get details for ${componentId}: ${error}`);
}
// Add small delay to avoid overwhelming the server
if (i < tabsRange.length - 1) {
await new Promise(resolve => setTimeout(resolve, 200));
}
}
console.log(`\n\nš Summary: Found details for all 20 tabs components!`);
console.log(`\nš Total tabs available: 26 components`);
console.log(` ā¢ 6 main variants (tabs, comp-400 to comp-404)`);
console.log(` ā¢ 20 specialized variants (comp-426 to comp-445)`);
console.log(`\nš” Recommendation: Visit https://originui.com/tabs to see all visual examples`);
console.log(`š¦ All components can be installed with: pnpm dlx shadcn@latest add https://originui.com/r/[component-id].json`);
}
findAll20Tabs().catch(console.error);
