Create Phoenix LiveView WebMCP example app

[Copilot]

Description

Introduces the first Phoenix LiveView example demonstrating WebMCP integration with server-side state management using Elixir. Shows bidirectional communication: AI → JavaScript → LiveView → Elixir server.

Type of Change

• New example
• Bug fix in existing example
• Documentation update
• Refactoring (no functional changes)
• Performance improvement
• Dependency update

Related Issues

N/A

Changes Made

• Created Phoenix LiveView counter + item list app with 6 WebMCP tools
• Implemented LiveView hooks for tool registration and server event handling
• Added counter operations: increment, decrement, set value
• Added item management: add, remove, clear
• Updated root README.md and AGENTS.md with Phoenix example
• Added CI workflow, issue templates, and contributing guidelines

New Example Details

• Example name: Phoenix LiveView Counter & Items
• Framework: Phoenix 1.7, LiveView 1.0, Elixir
• WebMCP concepts demonstrated: Server-side state management, LiveView hooks, bidirectional communication, tool registration via JavaScript
• Tools registered: increment_counter, decrement_counter, set_counter, add_item, remove_item, clear_items
• Dependencies added: @mcp-b/global, Phoenix 1.7, Phoenix LiveView 1.0

Testing

Commands Run

cd phoenix-liveview
mix deps.get     # ✓ Dependencies installed
cd assets && npm install && cd ..  # ✓ Node deps installed
mix compile      # ✓ Compiled successfully
mix phx.server   # ✓ Runs on http://localhost:4000

Manual Testing with MCP-B Extension

• Extension detects the page
• All registered tools appear in extension
• Each tool executes successfully
• UI updates correctly after tool execution
• Error cases handled gracefully
• Tested in Chrome/Edge
• Tested on mobile (if applicable)

Screenshot/Demo

Phoenix LiveView app with counter and item list, controllable via WebMCP tools

Checklist

• My code follows the style guidelines in CONTRIBUTING.md
• I have used the modern WebMCP API (@mcp-b/global or @mcp-b/react-webmcp)
• I have NOT used deprecated APIs from /relegated
• I have performed a self-review of my own code
• I have added JSDoc comments to all exported functions/components
• I have created/updated README.md for the example
• My changes generate no TypeScript errors
• I have tested with the MCP-B Chrome Extension
• All tools register and execute successfully
• Example runs without console errors

Documentation

• README.md includes clear description of what the example demonstrates
• README.md has installation and usage instructions
• README.md explains WebMCP concepts used
• Code has explanatory comments for WebMCP-specific code
• Dependencies are documented in package.json

Additional Notes

This is the first server-side framework example in the repo. Unlike vanilla/React examples that manage state client-side, this demonstrates stateful server management with LiveView's real-time sync. The JavaScript hooks bridge WebMCP tool calls to LiveView's pushEvent(), enabling AI to control server state through the browser.

---

For AI Agents: Please verify all items in the checklist before submitting. Run all commands listed in the Testing section.

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.