This PR implements [feature request] #14845
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Add-block control that appears when hovering blocks in page mode to
insert and auto-focus a new paragraph; control hides after insertion.
* **Improvements**
* Improved hover and interaction handling to avoid accidental triggers
when interacting with the drag handle or add-block control.
* Consistent sizing, positioning, and visibility behavior for the
add-block control.
* **Style**
* Moved heading icon slightly for improved visual alignment.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: DarkSky <25152247+darkskygit@users.noreply.github.com>
# Closes#14855.
## The bug
When an `affine:embed-synced-doc` is placed on an edgeless canvas and
resized which sets `model.props.scale` to a value ≠ 1 - the
block-selection frame rendered **inside** that embedded editor is drawn
offset from the actual block boundary. The reporter hit this in Safari,
but the root cause is platform-independent.
## Root cause
`affine-embed-edgeless-synced-doc-block` applies `transform:
scale(modelScale)` to its `.affine-embed-synced-doc-container` so the
embedded editor visually fits inside its edgeless xywh
([embed-edgeless-synced-doc-block.ts#L48-L58](https://github.com/toeverything/AFFiNE/blob/canary/blocksuite/affine/blocks/embed-doc/src/embed-synced-doc-block/embed-edgeless-synced-doc-block.ts#L48-L58)).
The inner `Viewport` exposes that outer scale as `viewScale =
boundingClientRect.width / offsetWidth`.
PR #14015 and PR #14074 already taught the surface canvas and
`GfxBlockComponent.getCSSTransform` to compensate by dividing by
`viewScale`. But several selection-related overlays that render inside
the same scaled container were **not** updated in those PRs. They
either:
- read `viewport.toViewCoord(x, y)` - which returns `(x - viewportX) *
zoom * viewScale` and drop the result into CSS `left` / `top` inside the
scaled container, or
- hand-build a `translate(translateX, translateY) scale(zoom)` transform
without `viewScale` compensation.
The outer CSS `scale(viewScale)` then re-applies the scale, leaving the
overlays one factor of `viewScale` away from their blocks. That's
exactly the misalignment in the screenshot - the rect's size looks right
but its position is offset.
## The fix
Mirror the pattern shipped in #14074 everywhere the inner overlays are
placed:
- position: `(model - viewportX) * zoom / viewScale`
- transform scale: `zoom / viewScale`
- translate: `translateX / viewScale, translateY / viewScale`
This keeps the overlays in the same reference frame as
`GfxBlockComponent.getCSSTransform` so they line up with the block
they're framing. When `viewScale === 1` (normal edgeless canvas, outside
any embed) every `/ viewScale` is a no-op and behaviour is unchanged.
## Why this is safe
- When `viewScale === 1` - every existing caller outside
`embed-edgeless-synced-doc` - the math reduces to the original
expression byte-for-byte.
- The fix strictly mirrors the invariant already adopted by
`GfxBlockComponent.getCSSTransform` in #14074. It's the same division by
`viewScale` applied in the same place.
- No public API, type, or DOM structure changed.
## Scope / known limitations
- The `Viewport._cachedBoundingClientRect` cache is only invalidated by
its own `ResizeObserver`
([viewport.ts#L500-L505](https://github.com/toeverything/AFFiNE/blob/canary/blocksuite/framework/std/src/gfx/viewport.ts#L500-L505)).
A CSS-transform change on an ancestor (e.g. the user panning/zooming the
outer edgeless canvas) does not fire it, so in theory `viewScale` can go
stale between outer-viewport updates. In practice this hasn't come up in
repro - the inner viewport's shell is observed and fires whenever layout
shifts. If it turns out to matter I'm happy to add a
`viewport.onResize()` refresh hook off the existing
`GfxViewportInitializer` in a follow-up.
- No integration test added - the existing
`blocksuite/integration-test/edgeless/` suite has no `embed-synced-doc`
harness. Adding one is a larger scope; can follow up if requested.
## Test plan
- [x] `yarn typecheck` - passes
- [x] `yarn lint:ox` - `0 warnings, 0 errors`
- [x] `yarn prettier --write` on the 5 touched files - no changes
- [ ] Manual: on canary, create an edgeless canvas, drop an
embed-synced-doc, resize with `Shift` held so `model.props.scale` ≠ 1,
select any block inside, and verify the blue selection frame sits flush
with the block's boundary (confirm on Safari, Chrome, Firefox).
- [ ] Regression check: on a normal edgeless canvas (no embed), verify
element selection, drag handle, and text/shape inline editors still
render correctly (these code paths hit `viewScale === 1` and should be
unchanged).
## Related PRs
- #14015 - fixed surface canvas at non-1 `viewScale`.
- #14074 - fixed `GfxBlockComponent.getCSSTransform` at non-1
`viewScale`. This PR completes that series by covering the selection
overlays.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Fixed positioning and scaling of inline text editors, selection
rectangles, drag handles, and remote cursors so overlays and editors
remain correctly aligned and sized when the viewport uses an additional
outer scale/transform during zooming and panning.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Version bumped to 0.26.3 across the project and Helm charts.
* Removed an unused dependency (minimatch) from multiple packages.
* Updated build/tooling and packaging metadata, including packaging
maker replacement.
* Adjusted app release metadata and platform packaging config.
* **Tests**
* Updated test snapshots to reflect minor presentational styling
adjustments.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
#### PR Dependency Tree
* **PR #14429** 👈
This tree was auto-generated by
[Charcoal](https://github.com/danerwilliams/charcoal)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* HTML import now splits lines on <br> into separate paragraphs while
preserving inline formatting.
* **Bug Fixes**
* Paste falls back to inserting after the first paragraph when no
explicit target is found.
* **Style**
* Improved page-mode viewport styling for consistent content layout.
* **Tests**
* Added snapshot tests for <br>-based paragraph splitting; re-enabled an
e2e drag-page test.
* **Chores**
* Deferred/deduplicated font loading, inline text caching,
drag-handle/pointer optimizations, and safer inline render
synchronization.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
close#13952
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Upgraded the shared theme library from v1.1.16 to v1.1.23 across the
project (core components, UI widgets, content blocks, and frontend
apps), delivering the latest styling and design refinements
platform-wide.
<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: L-Sun <zover.v@gmail.com>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Updated dependency versions across the monorepo (notably zod →
^3.25.76 and vitest-related packages → ^3.2.4), plus minor package bumps
to align tooling and libraries. These are manifest/test-tooling updates
only; no public API, behavior, or end-user features were changed.
<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- 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**
- Icon Picker added with Emoji and Icon panels, search/filtering, recent
selections, color selection, skin tone options, and smooth group
navigation.
- **Documentation**
- Storybook example added to preview and test the Icon Picker.
- **Chores**
- Bumped icon library dependency to a newer minor version.
- Added emoji data dependency to support the Emoji Picker.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
#### PR Dependency Tree
* **PR #13434** 👈
This tree was auto-generated by
[Charcoal](https://github.com/danerwilliams/charcoal)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Improved clarity of TypeScript error suppression comments across
various test files and helper scripts. Comments now specify the reasons
for ignoring specific type errors, enhancing code readability for
developers.
* **Chores**
* Updated inline comments without affecting application functionality or
user experience. No changes to features, logic, or test outcomes.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## New Features
* **Block Meta Markdown Adapter**：Inject the Block's metadata into
Markdown.
* **UI**：Apply interaction
* **Widget**
* Block-Level Widget: Displays the diffs of individual blocks within the
main content and supports accepting/rejecting individual diffs.
* Page-Level Widget: Displays global options (Accept all/Reject all).
* **Block Diff Service**：Bridge widget and diff data
* Widget subscribes to DiffMap(RenderDiff) data, refreshing the view
when the data changes.
* Widget performs operations such as Accept/Reject via methods provided
by Service.
* **Doc Edit Tool Card**:
* Display apply preview of semantic doc edit
* Support apply & accept/reject to the main content
* **Apply Playground**：A devtool for testing apply new content to
current
> CLOSE AI-274 AI-275 AI-276 AI-278
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Introduced block-level markdown diffing with accept/reject controls
for insertions, deletions, and updates.
* Added block diff widgets for individual blocks and pages, featuring
navigation and bulk accept/reject actions.
* Provided a block diff playground for testing and previewing markdown
changes (development mode only).
* Added a new document editing AI tool component with interactive diff
viewing and change application.
* Supported rendering of the document editing tool within AI chat
content streams.
* **Improvements**
* Enhanced widget rendering in list, paragraph, data view, and database
blocks for improved extensibility.
* Improved widget flavour matching with hierarchical wildcard support
for more flexible UI integration.
* **Chores**
* Updated the "@toeverything/theme" dependency to version ^1.1.16 across
multiple packages.
* Added new workspace dependencies for core frontend packages to improve
module linkage.
* Extended global styles with visual highlights for deleted blocks in AI
block diff feature.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Close [BS-3148](https://linear.app/affine-design/issue/BS-3148/拖拽到note后，更新card样式)
### What Changes
- fix the style of card not updated after draggin it from canvas to note
- narrow type of specific card style by using `as const satisfies EmbedCardStyle[]`
- add type hint to the `props`, the second parameter of `store.updateBlock`
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Added middleware to automatically update card styles when dragging blocks into notes.
- **Bug Fixes**
- Ensured that dragging a bookmark card into a note preserves its style.
- **Tests**
- Introduced an end-to-end test to verify bookmark card style is retained after drag-and-drop.
- **Refactor**
- Enhanced type safety and clarity for card style configurations and block properties.
- **Chores**
- Refined type annotations and assertions across multiple block style constants and toolbar configurations.
- Improved generic typing for block update methods to increase type precision.
<!-- 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**
- Improved resource management by introducing explicit cleanup for various middleware components, ensuring that resources are properly released when no longer needed.
- **Refactor**
- Updated middleware logic to support cleanup functions, enhancing the stability and performance of the application by preventing potential memory leaks.
- **Chores**
- Enhanced lifecycle management in core systems to automatically dispose of resources when appropriate.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Related to: [BS-3559](https://linear.app/affine-design/issue/BS-3559/ui-%E5%9B%BE%E7%89%87-loading-%E5%8F%98%E9%87%8F%E6%9B%B4%E6%96%B0)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Style**
- Improved the appearance of image loading indicators by updating background and ring colors for a more consistent visual experience.
- **New Features**
- Added customization options for the loading icon's ring color.
- **Chores**
- Updated the "@toeverything/theme" dependency to version ^1.1.15 across multiple packages for improved consistency and compatibility.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Close [BS-3391](https://linear.app/affine-design/issue/BS-3391/无法从note中拖出embed-synced-doc到白板)
### Before
can not hover on drag handle
https://github.com/user-attachments/assets/5596538e-e922-4d7f-8188-b719b234f3ee
### After
can hover on drag handle
https://github.com/user-attachments/assets/855743ec-7601-48a8-8453-cd5aa395bd06
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Bug Fixes**
- Improved detection of hovering over notes in edgeless mode, ensuring the drag handle appears correctly when hovering on the background of a selected note.
- Enhanced background style updates for edgeless notes, providing more accurate visual feedback.
- **Tests**
- Added a test to verify that the drag handle is visible when hovering over the background of a selected edgeless note.
- Updated undo/redo tests to improve accuracy of background color evaluation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Fixes [BS-3152](https://linear.app/affine-design/issue/BS-3152/)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Bug Fixes**
- Improved widget stability by removing the event listener that caused the widget to hide on block updates, leaving only viewport changes to trigger hiding.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Close [BS-3500](https://linear.app/affine-design/issue/BS-3500/剪刀没问题了，通过拖动形成的段落能不能也有同样的表现？)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Bug Fixes**
- Improved the behavior when dragging blocks between notes, ensuring that new note blocks are inserted as siblings when appropriate, instead of always creating them at the root level.
- **Tests**
- Enhanced and enabled tests to verify correct drag-and-drop behavior across multiple notes and to ensure the relative order of note content is preserved during drag operations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Chores**
- Removed multiple internal export entries related to effects modules across various packages.
- Updated dependencies and configuration references to improve internal consistency. No visible changes for end-users.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Fixes [BS-3261](https://linear.app/affine-design/issue/BS-3261/部分情况下-edgeless-dnd-响应区域有问题)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Documentation**
- Improved documentation for the drag handle by adding a description for the `force` parameter in the hide method.
- **Style**
- Minor code formatting adjustments with no impact on functionality.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Close [BS-3418](https://linear.app/affine-design/issue/BS-3418/折叠的embed-doc调整宽度时，会出现一个最小高度，不需要这个)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Improved resizing and folding interactions for embedded synced documents in edgeless mode, including dynamic height calculation and enhanced drag-handle styling.
- **Bug Fixes**
- Adjusted minimum height for synced document embeds to allow more compact display.
- Ensured consistent width settings across embed cards.
- **Tests**
- Added end-to-end tests covering folding, unfolding, and resizing behaviors for edgeless synced document embeds.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Close [BS-3480](https://linear.app/affine-design/issue/BS-3480/event-tracking)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Added telemetry tracking to toolbar actions for embedding documents, duplicating notes, and toggling note display modes.
- Telemetry events now track when new note blocks are created from drag-and-drop actions on the whiteboard.
- **Chores**
- Improved event tracking for user interactions to enhance analytics and usage insights.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Refactor**
- Unified internal data access by replacing all references from `doc` to `store` across all components, blocks, widgets, and utilities. This affects how readonly state, block operations, and service retrieval are handled throughout the application.
- **Tests**
- Updated all test utilities and test cases to use `store` instead of `doc` for document-related operations.
- **Chores**
- Updated context providers and property names to reflect the change from `doc` to `store` for improved consistency and maintainability.
No user-facing features or behaviors have changed.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Close [BS-3268](https://linear.app/affine-design/issue/BS-3268/edgeless-下，-dark-mode-embed的配色应该更加清晰)
Close [BS-3067](https://linear.app/affine-design/issue/BS-3067/在embed上，添加split-view等相关的操作入口，基本接近page-block（见设计稿）)
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Introduced an interactive header for embedded synced documents with fold/unfold toggle, document opening, and multiple view options.
- Added info and copy link buttons for embedded synced documents and notes to improve document management and sharing.
- **Enhancements**
- Updated styles for embedded synced document blocks and headers for better visual consistency.
- Added new localization entries for header actions: "Fold", "Unfold", and "Open".
- Disabled redundant open document actions in toolbars, centralizing controls in the header.
- **Refactor**
- Unified header button components for notes and embedded synced documents into reusable components.
- Simplified header components by delegating button behaviors to shared components.
- **Bug Fixes**
- Fixed conditional rendering of editor content in embedded synced documents when folded.
- **Chores**
- Upgraded theme dependency version from "^1.1.12" to "^1.1.14" across multiple packages.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
DarkSky