EDS Block Development Guide

⚠️ CRITICAL WARNING: EDS Reserved Class Names

BEFORE WRITING ANY CODE, READ THIS:

EDS automatically adds these class names to your blocks:

• .{blockname}-container - Added to parent <section> element
• .{blockname}-wrapper - Added to block's parent <div> wrapper

❌ NEVER use these suffixes in your CSS or JavaScript:

/* ❌ PRODUCTION BUG - Will break entire page */
.overlay-container { position: fixed; opacity: 0; }

/* ✅ SAFE - Use different suffix */
.overlay-backdrop { position: fixed; opacity: 0; }