mirror of
https://github.com/konvajs/konva.git
synced 2025-04-05 03:13:41 +08:00
fix(pointer-events): fix possible undefined stage error
Sometimes a shape may not have a stage associated with it? I was hitting this in our app. I also cleaned up the event types a bit and added the pointer methods to Stage to be consistent with the other types
This commit is contained in:
parent
d24f6156c3
commit
4dd2a60b55
12
src/Node.ts
12
src/Node.ts
@ -163,21 +163,19 @@ const emptyChildren: Collection<any> = new Collection();
|
||||
let idCounter = 1;
|
||||
|
||||
// create all the events here
|
||||
interface NodeEventMap {
|
||||
type NodeEventMap = GlobalEventHandlersEventMap & {
|
||||
[index: string]: any;
|
||||
click: MouseEvent;
|
||||
touchstart: TouchEvent;
|
||||
}
|
||||
};
|
||||
|
||||
export interface KonvaEventObject<EventType extends keyof NodeEventMap> {
|
||||
export interface KonvaEventObject<EventType> {
|
||||
target: Shape | Stage;
|
||||
evt: NodeEventMap[EventType];
|
||||
evt: EventType;
|
||||
currentTarget: Node;
|
||||
cancelBubble: boolean;
|
||||
child?: Node;
|
||||
}
|
||||
|
||||
export type KonvaEventListener<This, EventType extends keyof NodeEventMap> = (
|
||||
export type KonvaEventListener<This, EventType> = (
|
||||
this: This,
|
||||
ev: KonvaEventObject<EventType>
|
||||
) => void;
|
||||
|
@ -5,12 +5,10 @@ import { Stage } from './Stage';
|
||||
|
||||
const Captures = new Map<number, Shape | Stage>();
|
||||
|
||||
export interface KonvaPointerEvent extends KonvaEventObject<'touchstart'> {
|
||||
export interface KonvaPointerEvent extends KonvaEventObject<MouseEvent> {
|
||||
pointerId: number;
|
||||
}
|
||||
|
||||
let implicitRelease = null;
|
||||
|
||||
export function getCapturedShape(pointerId: number) {
|
||||
return Captures.get(pointerId);
|
||||
}
|
||||
@ -29,9 +27,8 @@ export function hasPointerCapture(pointerId: number, shape: Shape | Stage) {
|
||||
export function setPointerCapture(pointerId: number, shape: Shape | Stage) {
|
||||
releaseCapture(pointerId);
|
||||
|
||||
const { content } = shape.getStage();
|
||||
|
||||
content.setPointerCapture(pointerId);
|
||||
const stage = shape.getStage();
|
||||
if (!stage) return;
|
||||
|
||||
Captures.set(pointerId, shape);
|
||||
|
||||
@ -46,9 +43,11 @@ export function releaseCapture(pointerId: number, target?: Shape | Stage) {
|
||||
|
||||
if (!shape) return;
|
||||
|
||||
const { content } = shape.getStage();
|
||||
const stage = shape.getStage();
|
||||
|
||||
content.releasePointerCapture(pointerId);
|
||||
if (stage && stage.content) {
|
||||
stage.content.releasePointerCapture(pointerId);
|
||||
}
|
||||
|
||||
Captures.delete(pointerId);
|
||||
|
||||
|
13
src/Stage.ts
13
src/Stage.ts
@ -376,6 +376,19 @@ export class Stage extends Container<BaseLayer> {
|
||||
getLayer() {
|
||||
return null;
|
||||
}
|
||||
|
||||
hasPointerCapture(pointerId: number): boolean {
|
||||
return PointerEvents.hasPointerCapture(pointerId, this);
|
||||
}
|
||||
|
||||
setPointerCapture(pointerId: number) {
|
||||
PointerEvents.setPointerCapture(pointerId, this);
|
||||
}
|
||||
|
||||
releaseCapture(pointerId: number) {
|
||||
PointerEvents.releaseCapture(pointerId, this);
|
||||
}
|
||||
|
||||
/**
|
||||
* returns a {@link Konva.Collection} of layers
|
||||
* @method
|
||||
|
2
src/index-types.d.ts
vendored
2
src/index-types.d.ts
vendored
@ -46,6 +46,8 @@ declare namespace Konva {
|
||||
EventType
|
||||
>;
|
||||
|
||||
export type KonvaPointerEvent = import('./PointerEvents').KonvaPointerEvent;
|
||||
|
||||
export type KonvaEventListener<
|
||||
This,
|
||||
EventType
|
||||
|
Loading…
Reference in New Issue
Block a user