fix: rewrite selection logic and frame selection handling logic (#12421)

Fixes [BS-3528](https://linear.app/affine-design/issue/BS-3528)
Fixes [BS-3331](https://linear.app/affine-design/issue/BS-3331/frame-移动逻辑很奇怪)

### Changed
- Remove `onSelected` method from gfx view, use `handleSelection` provided by `GfxViewInteraction` instead.
- Add `selectable` to allow model to filter out itself from selection.
- Frame can be selected by body only if it's locked or its background is not transparent.

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Enhanced selection behavior for frames, edgeless text, notes, and mind map elements with refined control based on lock state and background transparency.
  - Introduced group-aware selection logic promoting selection of appropriate group ancestors.
  - Added support for element selection events in interactivity extensions.

- **Bug Fixes**
  - Resolved frame selection issues by enabling selection via title clicks and restricting body selection to locked frames or those with non-transparent backgrounds.

- **Documentation**
  - Added clarifying comments for group retrieval methods.

- **Tests**
  - Updated and added end-to-end tests for frame and lock selection reflecting new selection conditions.

- **Refactor**
  - Unified and simplified selection handling by moving logic from component methods to interaction handlers and removing deprecated selection methods.
  - Streamlined selection candidate processing with extension-driven target suggestion.
  - Removed legacy group element retrieval and selection helper methods to simplify interaction logic.

- **Style**
  - Renamed types and improved type signatures for selection context and interaction configurations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
doouding
2025-05-26 05:03:08 +00:00
parent 14a89c1e8a
commit 5de63c29f5
21 changed files with 535 additions and 369 deletions
@@ -13,6 +13,7 @@ import type {
ExtensionDragMoveContext,
ExtensionDragStartContext,
} from '../types/drag.js';
import type { ExtensionElementSelectContext } from '../types/select.js';
export const InteractivityExtensionIdentifier =
createIdentifier<InteractivityExtension>('interactivity-extension');
@@ -118,6 +119,10 @@ type ActionContextMap = {
| undefined
>;
};
elementSelect: {
context: ExtensionElementSelectContext;
returnType: void;
};
};
export class InteractivityActionAPI {
@@ -151,6 +156,18 @@ export class InteractivityActionAPI {
};
}
onElementSelect(
handler: (
ctx: ActionContextMap['elementSelect']['context']
) => ActionContextMap['elementSelect']['returnType']
) {
this._handlers['elementSelect'] = handler;
return () => {
return delete this._handlers['elementSelect'];
};
}
emit<K extends keyof ActionContextMap>(
event: K,
context: ActionContextMap[K]['context']
@@ -15,18 +15,21 @@ import type {
RotateEndContext,
RotateMoveContext,
RotateStartContext,
SelectableContext,
SelectContext,
} from '../types/view';
type ExtendedViewContext<
T extends GfxBlockComponent | GfxElementModelView,
Context,
DefaultReturnType = void,
> = {
/**
* The default function of the interaction.
* If the interaction is handled by the extension, the default function will not be executed.
* But extension can choose to call the default function by `context.default(context)` if needed.
*/
default: (context: Context) => void;
default: (context: Context) => DefaultReturnType;
model: T['model'];
@@ -99,6 +102,19 @@ export type GfxViewInteractionConfig<
context: RotateEndContext & ExtendedViewContext<T, RotateEndContext>
): void;
};
handleSelection?: (
context: Omit<ViewInteractionHandleContext<T>, 'add' | 'delete'>
) => {
selectable?: (
context: SelectableContext &
ExtendedViewContext<T, SelectableContext, boolean>
) => boolean;
onSelect?: (
context: SelectContext &
ExtendedViewContext<T, SelectContext, boolean | void>
) => boolean | void;
};
};
export const GfxViewInteractionIdentifier =