mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-13 04:48:53 +00:00
08d6c5a97c
### Changed
This pr split the old `edgeless-selected-rect` into four focused modules:
- `edgeless-selected-rect`: Provide an entry point for user operation on view layer only, no further logic here.
- `GfxViewInteractionExtension`: Allow you to plug in custom resize/rotate behaviors for block or canvas element. If you don’t register an extension, it falls back to the default behaviours.
- `InteractivityManager`: Provide the API that accepts resize/rotate requests, invokes any custom behaviors you’ve registered, tracks the lifecycle and intermediate state, then hands off to the math engine.
- `ResizeController`: A pure math engine that listens for pointer moves and pointer ups and calculates new sizes, positions, and angles. It doesn’t call any business APIs.
### Customizing an element’s resize/rotate behavior
Call `GfxViewInteractionExtension` with the element’s flavour or type plus a config object. In the config you can define:
- `resizeConstraint` (min/max width & height, lock ratio)
- `handleResize(context)` method that returns an object containing `beforeResize`、`onResizeStart`、`onResizeMove`、`onResizeEnd`
- `handleRotate(context)` method that returns an object containing `beforeRotate`、`onRotateStart`、`onRotateMove`、`onRotateEnd`
```typescript
import { GfxViewInteractionExtension } from '@blocksuite/std/gfx';
GfxViewInteractionExtension(
flavourOrElementType,
{
resizeConstraint: {
minWidth,
maxWidth,
lockRatio,
minHeight,
maxHeight
},
handleResize(context) {
return {
beforeResize(context) {},
onResizeStart(context) {},
onResizeMove(context) {},
onResizeEnd(context) {}
};
},
handleRotate(context) {
return {
beforeRotate(context) {},
onRotateStart(context) {},
onRotateMove(context) {},
onRotateEnd(context) {}
};
}
}
);
```
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Added interaction extensions for edgeless variants of attachment, bookmark, edgeless text, embedded docs, images, notes, frames, AI chat blocks, and various embed blocks (Figma, GitHub, HTML, iframe, Loom, YouTube).
- Introduced interaction extensions for graphical elements including connectors, groups, mind maps, shapes, and text, supporting constrained resizing and rotation disabling where applicable.
- Implemented a unified interaction extension framework enabling configurable resize and rotate lifecycle handlers.
- Enhanced autocomplete overlay behavior based on selection context.
- **Refactor**
- Removed legacy resize manager and element-specific resize/rotate logic, replacing with a centralized, extensible interaction system.
- Simplified resize handle rendering to a data-driven approach with improved cursor management.
- Replaced complex cursor rotation calculations with fixed-angle mappings for resize handles.
- Streamlined selection rectangle component to use interactivity services for resize and rotate handling.
- **Bug Fixes**
- Fixed connector update triggers to reduce unnecessary updates.
- Improved resize constraints enforcement and interaction state tracking.
- **Tests**
- Refined end-to-end tests to use higher-level resize utilities and added finer-grained assertions on element dimensions.
- Enhanced mouse movement granularity in drag tests for better simulation fidelity.
- **Chores**
- Added new workspace dependencies and project references for the interaction framework modules.
- Extended public API exports to include new interaction types and extensions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
102 lines
3.0 KiB
JSON
102 lines
3.0 KiB
JSON
{
|
|
"name": "@affine/core",
|
|
"type": "module",
|
|
"private": true,
|
|
"version": "0.21.0",
|
|
"exports": {
|
|
"./*": "./src/*",
|
|
"./bootstrap": "./src/bootstrap/index.ts"
|
|
},
|
|
"dependencies": {
|
|
"@affine/component": "workspace:*",
|
|
"@affine/debug": "workspace:*",
|
|
"@affine/electron-api": "workspace:*",
|
|
"@affine/env": "workspace:*",
|
|
"@affine/error": "workspace:*",
|
|
"@affine/graphql": "workspace:*",
|
|
"@affine/i18n": "workspace:*",
|
|
"@affine/nbstore": "workspace:*",
|
|
"@affine/templates": "workspace:*",
|
|
"@affine/track": "workspace:*",
|
|
"@blocksuite/affine": "workspace:*",
|
|
"@blocksuite/icons": "^2.2.13",
|
|
"@blocksuite/std": "workspace:*",
|
|
"@dotlottie/player-component": "^2.7.12",
|
|
"@emotion/cache": "^11.14.0",
|
|
"@emotion/css": "^11.13.5",
|
|
"@emotion/react": "^11.14.0",
|
|
"@floating-ui/dom": "^1.6.13",
|
|
"@juggle/resize-observer": "^3.4.0",
|
|
"@lit/context": "^1.1.4",
|
|
"@marsidev/react-turnstile": "^1.1.0",
|
|
"@preact/signals-core": "^1.8.0",
|
|
"@radix-ui/react-collapsible": "^1.1.2",
|
|
"@radix-ui/react-dialog": "^1.1.3",
|
|
"@radix-ui/react-popover": "^1.1.3",
|
|
"@radix-ui/react-scroll-area": "^1.2.2",
|
|
"@radix-ui/react-slot": "^1.1.1",
|
|
"@radix-ui/react-toolbar": "^1.1.1",
|
|
"@sentry/react": "^9.2.0",
|
|
"@toeverything/infra": "workspace:*",
|
|
"@toeverything/pdf-viewer": "^0.1.1",
|
|
"@toeverything/theme": "^1.1.14",
|
|
"@vanilla-extract/dynamic": "^2.1.2",
|
|
"@webcontainer/api": "^1.6.1",
|
|
"animejs": "^4.0.0",
|
|
"bytes": "^3.1.2",
|
|
"clsx": "^2.1.1",
|
|
"cmdk": "^1.0.4",
|
|
"core-js": "^3.39.0",
|
|
"dayjs": "^1.11.13",
|
|
"eventemitter2": "^6.4.9",
|
|
"file-type": "^20.0.0",
|
|
"filesize": "^10.1.6",
|
|
"foxact": "^0.2.43",
|
|
"fuse.js": "^7.0.0",
|
|
"graphemer": "^1.4.0",
|
|
"graphql": "^16.9.0",
|
|
"history": "^5.3.0",
|
|
"ical.js": "^2.1.0",
|
|
"idb": "^8.0.0",
|
|
"idb-keyval": "^6.2.1",
|
|
"image-blob-reduce": "^4.1.0",
|
|
"is-svg": "^6.0.0",
|
|
"jotai": "^2.10.3",
|
|
"jotai-scope": "^0.7.2",
|
|
"lib0": "^0.2.99",
|
|
"lit": "^3.2.1",
|
|
"lodash-es": "^4.17.21",
|
|
"lottie-react": "^2.4.0",
|
|
"mp4-muxer": "^5.2.1",
|
|
"nanoid": "^5.0.9",
|
|
"next-themes": "^0.4.4",
|
|
"query-string": "^9.1.1",
|
|
"react": "19.1.0",
|
|
"react-dom": "19.1.0",
|
|
"react-error-boundary": "^6.0.0",
|
|
"react-router-dom": "^6.28.0",
|
|
"react-transition-state": "^2.2.0",
|
|
"react-virtuoso": "^4.12.3",
|
|
"rxjs": "^7.8.1",
|
|
"ses": "^1.10.0",
|
|
"socket.io-client": "^4.8.1",
|
|
"swr": "2.3.3",
|
|
"tinykeys": "patch:tinykeys@npm%3A2.1.0#~/.yarn/patches/tinykeys-npm-2.1.0-819feeaed0.patch",
|
|
"y-protocols": "^1.0.6",
|
|
"yjs": "^13.6.21",
|
|
"zod": "^3.24.1"
|
|
},
|
|
"devDependencies": {
|
|
"@testing-library/dom": "^10.4.0",
|
|
"@testing-library/react": "^16.1.0",
|
|
"@types/animejs": "^3.1.12",
|
|
"@types/bytes": "^3.1.5",
|
|
"@types/image-blob-reduce": "^4.1.4",
|
|
"@types/lodash-es": "^4.17.12",
|
|
"@vanilla-extract/css": "^1.17.0",
|
|
"fake-indexeddb": "^6.0.0",
|
|
"lodash-es": "^4.17.21",
|
|
"vitest": "3.1.3"
|
|
}
|
|
}
|