# New Features Backlog

Feature ideas for future development, organized by priority.

---

## P1 — High Impact, Low Effort

[x] ### 1. Block Patterns (Section Templates)
Combine multiple blocks into pre-made layouts users can insert in one click.
- Hero + Features + CTA combo
- Pricing + FAQ combo
- Team + Testimonials combo
- Save custom patterns from existing sections

[x] ### 2. Anchor ID / Smooth Scroll Navigation
Add an anchor ID attribute to every block so users can link directly to sections.
- Auto-generate anchor from heading text
- Copy anchor link button in toolbar
- Smooth scroll on front-end

[x] ### 3. Responsive Visibility Toggle
Show or hide any block on desktop, tablet, or mobile.
- Toggle per block in inspector controls
- Adds CSS classes: `sb-hide-desktop`, `sb-hide-tablet`, `sb-hide-mobile`
- Useful for mobile-specific CTAs or desktop-only hero sections

[x] ### 4. Custom CSS Per Block
Textarea in inspector controls for adding custom CSS scoped to that block instance.
- Injected via `<style>` tag with unique selector
- Warn user about specificity
- Optional: limit to `editor.scss` only (no front-end impact)

---

## P2 — Medium Effort, High Value

### 5. Global Color Palette
Define a set of brand colors in one place, apply across all blocks.
- Settings page under Settings > Section Blocks
- Colors stored as custom options
- Inspector controls show palette swatches instead of freeform picker
- Syncs with WordPress `theme.json` if present

### 6. Import / Export Sections
Export a block's configuration as JSON, import on another site.
- "Copy JSON" button in block toolbar
- "Import JSON" in empty block state
- Includes all attributes + innerBlocks
- Useful for sharing layouts between clients

### 7. Conditional Display Rules
Show or hide blocks based on conditions.
- User role (logged in / logged out / specific role)
- Date range (schedule content)
- Query string parameter (UTM-based personalization)
- WooCommerce: show if cart has items / cart total > X

### 8. Animation Presets Library
Expand beyond the current animation options.
- Scroll-triggered: fade-up, fade-left, fade-right, zoom-in
- Hover: glow, border-draw, text-shine
- Stagger: children animate in sequence
- Parallax: subtle depth effect on scroll
- All gated behind `@media (scripting: enabled)` + `prefers-reduced-motion`

### 9. Schema / Structured Data per Block
Auto-generate JSON-LD for relevant blocks.
- FAQ block → `FAQPage` schema
- Pricing block → `Product` / `Offer` schema
- Team block → `Person` schema
- Testimonials → `Review` schema
- Toggle on/off per block

---

## P3 — Larger Scope, Future Consideration

### 10. Section Reusable Blocks (Synced Patterns)
Leverage WordPress synced patterns for section templates.
- "Save as Pattern" button in block toolbar
- Updates sync across all instances
- Override specific attributes per instance (partial sync)

### 11. Global Spacing System
Consistent margin/padding controls across all blocks.
- Define spacing scale (xs, sm, md, lg, xl) in settings
- Inspector controls use dropdown instead of freeform values
- CSS custom properties: `--sb-spacing-xs`, `--sb-spacing-sm`, etc.

### 12. Performance Dashboard
Track block usage and front-end impact.
- Which blocks are used most
- Average render time per block
- CSS/JS size per block
- Suggestions for unused blocks to deactivate

### 13. Accessibility Audit Panel
Built-in a11y checker in the editor.
- Warns if heading hierarchy is broken
- Checks color contrast ratios
- Validates ARIA attributes
- Suggests alt text for images
- Links to WordPress a11y documentation

### 14. AI Content Suggestions
Integration with AI APIs to generate placeholder content.
- Generate lorem ipsum tailored to block type
- Suggest heading variations
- Rewrite copy for different tones (professional, casual, playful)
- Requires API key in settings (OpenAI, Anthropic, etc.)

### 15. Multisite Network Settings
Centralized configuration for multisite installs.
- Network admin settings page
- Enable/disable blocks per site
- Push global color palette to all sites
- Usage statistics across network

---

## Technical Debt / Infrastructure

- [ ] Add unit tests for render.php output
- [ ] Add Playwright E2E tests for block editor interactions
- [ ] Migrate to `@wordpress/scripts` latest with React 19 support
- [ ] Add TypeScript types for block attributes
- [ ] Performance benchmarks: track bundle size per release
- [ ] Add CI lint step for PHP (PHPCS) + JS (ESLint)
