diff --git a/src/constants/PixiReactIgnoredProps.ts b/src/constants/PixiReactIgnoredProps.ts index 04ceeba6..82e1bbac 100644 --- a/src/constants/PixiReactIgnoredProps.ts +++ b/src/constants/PixiReactIgnoredProps.ts @@ -1,3 +1,3 @@ -export const PixiReactIgnoredProps = Object.freeze([ - 'draw', -]); +import { PixiToReactEventPropNames } from './EventPropNames'; + +export const PixiReactIgnoredProps = Object.freeze(Object.keys(PixiToReactEventPropNames)); diff --git a/src/helpers/applyProps.ts b/src/helpers/applyProps.ts index 57bc00fb..babe46a3 100644 --- a/src/helpers/applyProps.ts +++ b/src/helpers/applyProps.ts @@ -57,11 +57,11 @@ export function applyProps( ...instanceProps } = instance; - let typedData: DiffSet; + let typedData; if (isDiffSet(data)) { - typedData = data; + typedData = data as DiffSet; } else { diff --git a/src/helpers/createInstance.ts b/src/helpers/createInstance.ts index 71c5799f..33ff5c2b 100644 --- a/src/helpers/createInstance.ts +++ b/src/helpers/createInstance.ts @@ -1,4 +1,4 @@ -import { PixiReactIgnoredProps } from '../constants/PixiReactIgnoredProps'; +import { ReactToPixiEventPropNames } from '../constants/EventPropNames'; import { applyProps } from './applyProps'; import { catalogue } from './catalogue'; import { convertStringToPascalCase } from './convertStringToPascalCase'; @@ -30,7 +30,18 @@ export function createInstance( // Get the class from an imported Pixi.js namespace const PixiComponent = catalogue[name]; - const pixiProps = gentleCloneProps(props, PixiReactIgnoredProps); + const pixiProps = gentleCloneProps(props); + + // Clone event props + Object.entries(props).forEach(([key, value]) => + { + if (key in ReactToPixiEventPropNames) + { + const pixiEventName = ReactToPixiEventPropNames[key as keyof typeof ReactToPixiEventPropNames]; + + pixiProps[pixiEventName] = value; + } + }); const instance = prepareInstance(new PixiComponent(pixiProps), { root, diff --git a/src/helpers/diffProps.ts b/src/helpers/diffProps.ts index 1ef2c3e3..f309ab16 100644 --- a/src/helpers/diffProps.ts +++ b/src/helpers/diffProps.ts @@ -1,7 +1,4 @@ -import { - PixiToReactEventPropNames, - ReactToPixiEventPropNames, -} from '../constants/EventPropNames'; +import { ReactToPixiEventPropNames } from '../constants/EventPropNames'; import { isEqual } from './compare'; import { gentleCloneProps } from './gentleCloneProps'; @@ -53,7 +50,7 @@ export function diffProps( } // Collect handlers and bail out - if ((key in PixiToReactEventPropNames) || (key in ReactToPixiEventPropNames)) + if (key in ReactToPixiEventPropNames) { changes.push([key, value, true, []]); diff --git a/src/helpers/gentleCloneProps.ts b/src/helpers/gentleCloneProps.ts index 9b65dbca..839daf08 100644 --- a/src/helpers/gentleCloneProps.ts +++ b/src/helpers/gentleCloneProps.ts @@ -1,3 +1,4 @@ +import { PixiReactIgnoredProps } from '../constants/PixiReactIgnoredProps'; import { ReactIgnoredProps } from '../constants/ReactIgnoredProps'; import { gentleClone } from './gentleClone'; @@ -7,5 +8,5 @@ export function gentleCloneProps( additionalIgnoredProps: readonly string[] = [], ) { - return gentleClone(props, ReactIgnoredProps.concat(additionalIgnoredProps)); + return gentleClone(props, ReactIgnoredProps.concat(PixiReactIgnoredProps, additionalIgnoredProps)); }