@tamilvananmurugan/xlibs/component-metadata-index.ts

Comprehensive UI component library with Aceternity, MagicUI, and ShadCN components

// Component Metadata Index
// This file exports all component metadata for design tools and auto layout systems

import type { ComponentMetadata } from "./component-metadata";

// Since we don't have the actual component files, we'll create a simplified registry
// In a real implementation, these would be imported from the actual component files

export const componentMetadataRegistry: Record<string, ComponentMetadata> = {
  // UI Components
  "Card": {
    displayName: "Card",
    category: "ui",
    tags: ["container", "layout"],
    useCases: ["content-container", "data-display"],
    complexity: "medium",
    animationLevel: "none",
    hasGradient: false,
    isComposite: true,
    preferredWidth: "auto",
    preferredHeight: "auto"
  },
  "Button": {
    displayName: "Button",
    category: "ui",
    tags: ["interactive", "action"],
    useCases: ["user-action", "form-submit"],
    complexity: "simple",
    animationLevel: "none",
    hasGradient: false,
    isComposite: false,
    preferredWidth: "auto",
    preferredHeight: "auto"
  },
  "BentoCard": {
    displayName: "Bento Card",
    category: "ui",
    tags: ["container", "layout", "grid"],
    useCases: ["dashboard-item", "content-card"],
    complexity: "medium",
    animationLevel: "none",
    hasGradient: false,
    isComposite: true,
    preferredWidth: "auto",
    preferredHeight: "auto"
  },
  // MagicUI Components
  "MagicCard": {
    displayName: "Magic Card",
    category: "magicui",
    tags: ["container", "layout", "animated"],
    useCases: ["content-container", "data-display"],
    complexity: "complex",
    animationLevel: "high",
    hasGradient: true,
    isComposite: true,
    preferredWidth: "auto",
    preferredHeight: "auto"
  },
  "ShinyButton": {
    displayName: "Shiny Button",
    category: "magicui",
    tags: ["interactive", "action", "animated"],
    useCases: ["user-action", "form-submit"],
    complexity: "medium",
    animationLevel: "high",
    hasGradient: true,
    isComposite: false,
    preferredWidth: "auto",
    preferredHeight: "auto"
  },
  "FloatingNav": {
    displayName: "Floating Navigation",
    category: "aceternity",
    tags: ["navigation", "floating", "animated", "responsive"],
    useCases: ["site-navigation", "floating-menu", "scroll-aware-nav"],
    complexity: "medium",
    animationLevel: "high",
    hasGradient: true,
    isComposite: true,
    preferredWidth: "auto",
    preferredHeight: "auto",
    layoutHints: ["top", "fixed", "responsive"]
  },
  "HoverMenu": {
    displayName: "Hover Menu",
    category: "aceternity",
    tags: ["navigation", "dropdown", "animated", "interactive"],
    useCases: ["site-navigation", "dropdown-menu", "product-showcase"],
    complexity: "medium",
    animationLevel: "high",
    hasGradient: true,
    isComposite: true,
    preferredWidth: "auto",
    preferredHeight: "auto",
    layoutHints: ["top", "center", "responsive"]
  },
  "Timeline": {
    displayName: "Timeline",
    category: "aceternity",
    tags: ["content", "timeline", "animated", "scroll-aware"],
    useCases: ["changelog", "history", "roadmap", "achievements"],
    complexity: "medium",
    animationLevel: "high",
    hasGradient: true,
    isComposite: true,
    preferredWidth: "auto",
    preferredHeight: "auto",
    layoutHints: ["full-width", "vertical", "responsive"]
  }
};

// Utility function to get metadata by component name
export function getComponentMetadata(componentName: string): ComponentMetadata | undefined {
  return componentMetadataRegistry[componentName];
}

// Get all available component names
export function getAvailableComponents(): string[] {
  return Object.keys(componentMetadataRegistry);
}

// Get components by layout hint
export function getComponentsByLayoutHint(hint: string): ComponentMetadata[] {
  return Object.values(componentMetadataRegistry).filter(
    metadata => metadata.layoutHints?.includes(hint)
  );
}