This PR fixes#14040
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Code blocks can be collapsed and expanded via a toolbar toggle
(visible when the document is editable).
* Collapsed code blocks show a limited preview (~8 lines) with a bottom
fade overlay and reduced padding.
* Toolbar button updates icon and tooltip to reflect collapsed/expanded
state.
* Collapse state is preserved on the block so its current
collapsed/expanded setting is retained.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Fixes#13555https://github.com/user-attachments/assets/12e55c21-080c-4c69-9780-893ccad25b45
## Summary
- make the code block More popup reactive to `wrap` and `lineNumber`
prop updates
- read the latest toggle state at click time so same-menu double toggles
do not reuse stale closures
- add e2e coverage for wrap and line number toggling twice without
closing the More menu
## Bug Reason
- the code block More popup was rendered as a static portal, so it
stayed open without re-rendering after the first toggle
- the `Cancel line number` and `Wrap` menu actions captured render-time
state in their click handlers
- after the first click updated the model, a second click in the same
open menu reused stale state and wrote the same value again, so nothing
changed visually
## Testing
- yarn workspace @affine-test/blocksuite test e2e/code/crud.spec.ts
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Menu toggles now read and update the current wrap and line-number
states reliably.
* **Refactor**
* Replaced inline popup rendering with a dedicated more-menu component
for the code toolbar.
* **Style**
* Prevented text selection on menu action elements for smoother
interaction.
* **Tests**
* Added e2e tests for wrap and line-number toggle flows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Close BS-3423
Close BS-3505
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Style**
- Updated toolbar button background color and adjusted layout spacing for toolbar and preview buttons to improve visual consistency.
- **Refactor**
- Reorganized toolbar menu groups for better clarity, separating toggle and clipboard actions within the code block toolbar.
- **Bug Fixes**
- Improved UI interaction in code block tests to ensure menus behave as expected without closing prematurely.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Added a toggle in the code block toolbar to show or hide line numbers for individual code blocks.
- The display of line numbers now respects both global and per-block settings, allowing more flexible control.
- **Style**
- Updated styles to hide line numbers when disabled via the new toggle option.
- **Tests**
- Added end-to-end tests to verify toggling line numbers visibility and undo/redo behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Updated the code block toolbar to use a toggle switch for the "wrap" option, providing a more interactive user experience.
- **Style**
- Adjusted the height of the language selection button for consistent appearance.
- Refined code block container padding and increased spacing for line numbers to improve readability.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Introduced a preview mode for code blocks, allowing users to toggle between code and rendered previews (e.g., HTML output) directly within the editor.
- Added a preview toggle button to the code block toolbar for supported languages.
- Enabled dynamic rendering of code block previews using a shared WebContainer, allowing live HTML previews in an embedded iframe.
- Added HTML preview support with loading and error states for enhanced user feedback.
- Integrated the preview feature as a view extension provider for seamless framework support.
- **Bug Fixes**
- Improved toolbar layout and button alignment for a cleaner user interface.
- **Tests**
- Added end-to-end tests to verify the new code block preview functionality and language switching behavior.
- **Chores**
- Updated development server configuration to include enhanced security headers.
- Added a new runtime dependency for WebContainer support.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Ahsan Khaleeq