import { MICRO_COMPONENTS } from './micro'; export const NEW: string[] = []; export const UPDATED: string[] = [ ]; export type Category = { name: string; subcategories: string[]; }; export const CATEGORIES: Category[] = [ { name: 'Get Started', subcategories: ['Introduction', 'Installation', 'MCP Server', 'Index'] }, { name: 'Text Animations', subcategories: [ 'Split Text', 'Blur Text', 'Circular Text', 'Masked Heading', 'Text Type', 'Shuffle', 'Shiny Text', 'Text Pressure', 'Curved Loop', 'Fuzzy Text', 'Gradient Text', 'Falling Text', 'Text Cursor', 'Decrypted Text', 'True Focus', 'Scroll Float', 'Scroll Reveal', 'ASCII Text', 'Scrambled Text', 'Rotating Text', 'Glitch Text', 'Scroll Velocity', 'Variable Proximity', 'Count Up' ] }, { name: 'Animations', subcategories: [ 'Animated Content', 'Fade Content', 'Electric Border', 'Orbit Images', 'Pixel Transition', 'Glare Hover', 'Antigravity', 'Logo Loop', 'Target Cursor', 'Magic Rings', 'Laser Flow', 'Magnet Lines', 'Ghost Cursor', 'Gradual Blur', 'Click Spark', 'Cursor Grid', 'Scroll Expand', 'Magnet', 'Sticker Peel', 'Pixel Trail', 'Cubes', 'Metallic Paint', 'Noise', 'Shape Blur', 'Crosshair', 'Image Trail', 'Ribbons', 'Splash Cursor', 'Meta Balls', 'Blob Cursor', 'Star Border' ] }, { name: 'Components', subcategories: [ 'Animated List', 'Scroll Stack', 'Bubble Menu', 'Magic Bento', 'Circular Gallery', 'Reflective Card', 'Card Nav', 'Stack', 'Pill Nav', 'Tilted Card', 'Masonry', 'Glass Surface', 'Dome Gallery', 'Chroma Grid', 'Folder', 'Staggered Menu', 'Model Viewer', 'Profile Card', 'Dock', 'Gooey Nav', 'Pixel Card', 'Carousel', 'Spotlight Card', 'Border Glow', 'Flying Posters', 'Card Swap', 'Glass Icons', 'Decay Card', 'Flowing Menu', 'Elastic Slider', 'Counter', 'Infinite Menu', 'Stepper', 'Bounce Cards' ] }, { name: 'Micro', subcategories: Object.values(MICRO_COMPONENTS).map(component => component.title) }, { name: 'Backgrounds', subcategories: [ 'Liquid Ether', 'Prism', 'Dark Veil', 'Light Pillar', 'Silk', 'Floating Lines', 'Light Rays', 'Pixel Blast', 'Color Bends', 'Evil Eye', 'Line Waves', 'Radar', 'Soft Aurora', 'Aurora', 'Plasma', 'Plasma Wave', 'Particles', 'Gradient Blinds', 'Grainient', 'Grid Scan', 'Beams', 'Pixel Snow', 'Lightning', 'Prismatic Burst', 'Galaxy', 'Dither', 'Faulty Terminal', 'Ripple Grid', 'Dot Field', 'Dot Grid', 'Threads', 'Hyperspeed', 'Iridescence', 'Waves', 'Grid Distortion', 'Ballpit', 'Orb', 'Letter Glitch', 'Grid Motion', 'Shape Grid', 'Liquid Chrome', 'Balatro' ] } ]; // Slug helpers (kebab-case used in URLs). export const slug = (s: string) => s.replace(/\s+/g, '-').toLowerCase(); export const decodeLabel = (s: string) => s .split('-') .map((w) => w.charAt(0).toUpperCase() + w.slice(1)) .join(' '); // List of subcategory slugs that have a real implementation in svelte-bits. // Anything not in this set renders a "Coming soon" placeholder on the demo page. export const IMPLEMENTED_DEMOS = new Set([ 'warm-tooltip', 'voice-pill', 'tear-ticket', 'prompt-bar', 'folder-float', 'swipe-row', 'sling-button', 'rubber-segment', 'code-slots', 'swipe-toast', 'slide-commit', 'glide-select', 'peek-rating', 'comet-dial', 'branched-menu', 'scrub-field', 'jelly-radio', 'fuse-button', 'dodge-field', 'wake-slider', 'thought-line', 'refine-frame', 'pulse-heart', 'squish-switch', 'flip-card', 'bell-toggle', 'slosh-gauge', 'hold-button', 'call-chip', 'status-mark', 'spring-check', 'paper-crumple', 'lattice-loader', 'introduction', 'installation', 'mcp-server', 'index', 'shiny-text', 'split-text', 'scroll-expand', 'masked-heading', 'scroll-float', 'animated-content', 'dock', 'aurora', 'cursor-grid', 'balatro', 'iridescence', 'silk', 'threads', 'plasma', 'liquid-chrome', 'lightning', 'dark-veil', 'ripple-grid', 'light-rays', 'letter-glitch', 'particles', 'radar', 'soft-aurora', 'grid-motion', 'plasma-wave', 'grainient', 'line-waves', 'evil-eye', 'grid-distortion', 'dot-grid', 'orb', 'galaxy', 'pixel-snow', 'gradient-blinds', 'waves', 'floating-lines', 'prism', 'prismatic-burst', 'light-pillar', 'dither', 'pixel-blast', 'shape-grid', 'magic-rings', 'gradient-text', 'glitch-text', 'star-border', 'splash-cursor', 'noise', 'blur-text', 'fade-content', 'dot-field', 'color-bends', 'liquid-ether', 'faulty-terminal', 'hyperspeed', 'flying-posters', 'true-focus', 'falling-text', 'count-up', 'beams', 'ballpit', 'grid-scan', 'click-spark', 'magnet', 'magnet-lines', 'glare-hover', 'gradual-blur', 'crosshair', 'blob-cursor', 'cubes', 'logo-loop', 'orbit-images', 'pixel-transition', 'target-cursor', 'ghost-cursor', 'sticker-peel', 'electric-border', 'antigravity', 'pixel-trail', 'ribbons', 'shape-blur', 'meta-balls', 'laser-flow', 'metallic-paint', 'image-trail', 'animated-list', 'border-glow', 'bounce-cards', 'bubble-menu', 'card-nav', 'card-swap', 'carousel', 'chroma-grid', 'counter', 'decay-card', 'elastic-slider', 'flowing-menu', 'folder', 'glass-icons', 'gooey-nav', 'spotlight-card', 'tilted-card', 'reflective-card', 'stack', 'masonry', 'pixel-card', 'stepper', 'scroll-stack', 'pill-nav', 'staggered-menu', 'profile-card', 'magic-bento', 'glass-surface', 'circular-gallery', 'dome-gallery', 'infinite-menu', 'model-viewer', 'text-cursor', 'scrambled-text', 'circular-text', 'text-type', 'shuffle', 'text-pressure', 'curved-loop', 'fuzzy-text', 'decrypted-text', 'rotating-text', 'scroll-reveal', 'ascii-text', 'variable-proximity', 'scroll-velocity' ]); // Helper: is this subcategory label fully ported? export const isImplemented = (sub: string): boolean => IMPLEMENTED_DEMOS.has(slug(sub));