// product-visuals.jsx — SVG placeholder visuals for FlowFire products // Dark, moody, machined-metal aesthetic. Each product has a distinct silhouette. const ProductBg = ({ children, accent = false }) => (
{/* subtle grain */}
\")", }} /> {/* side rim light */}
{accent && (
)} {children}
); // Trigger silhouette (curved) const ProductTriggerCurved = () => ( {/* trigger housing */} {/* curved trigger shoe */} {/* pin holes */} {/* engraved logo */} FLOWFIRE {/* rim light */} ); // Safety selector const ProductSafety = () => ( {/* selector lever */} {/* central pivot */} {/* knurled grip */} {[...Array(12)].map((_, i) => ( ))} {[...Array(12)].map((_, i) => ( ))} S7S ); // ARC-Fire ambi kit const ProductArcFire = () => ( {/* main body */} {/* trigger flat */} {/* ambi levers */} {/* selector positions */} {/* pin holes */} ARC-FIRE V2 ); // Disruptor const ProductDisruptor = () => ( {/* angular body */} {/* flat trigger */} {/* pins */} {/* engraving */} DISRUPTOR PARTISAN · A2 ); // Generic component const ProductShoe = () => ( ); const ProductTools = () => ( {/* punches */} {[0, 1, 2].map(i => ( ))} {/* hammer */} ); const PRODUCT_VISUALS = { 'super-safety-curved': ProductTriggerCurved, 's7s-super-safety': ProductSafety, 'arc-fire-v2': ProductArcFire, 'disruptor': ProductDisruptor, 'curved-shoe': ProductShoe, 'install-tools': ProductTools, }; const ProductVisual = ({ id, image }) => { if (image) { return (
); } const C = PRODUCT_VISUALS[id] || ProductTriggerCurved; return ; }; // Hero visual — exploded view + grid lines const HeroVisual = () => (
{/* blueprint grid */} {/* Large product silhouette */}
{/* main body */} {/* trigger curve */} {/* selector */} {/* pins */} {/* accent dot */} {/* label */} FLOWFIRE CNC · TX · MIL-SPEC {/* spec callouts */} ±0.0005" A2 TOOL STEEL
); Object.assign(window, { ProductVisual, HeroVisual });