diff --git a/.changeset/polite-rockets-beg.md b/.changeset/polite-rockets-beg.md new file mode 100644 index 0000000..e1d6281 --- /dev/null +++ b/.changeset/polite-rockets-beg.md @@ -0,0 +1,5 @@ +--- +'@chialab/plasma': patch +--- + +Add event listeners to Svelte known properties. diff --git a/src/svelte.ts b/src/svelte.ts index 724ac9b..8e87fd3 100644 --- a/src/svelte.ts +++ b/src/svelte.ts @@ -244,9 +244,11 @@ import { ${declaration.name} as Base${declaration.name} } from '${options.entryp import { ${getAttributes(definition.extend ?? definition.name).split('<')[0]} } from 'svelte/elements'; `; - const propertiesTypings = filterPublicMemebers(declaration).map( - (member) => `${member.name}?: Base${declaration.name}['${member.name}'];` - ); + const propertiesTypings = filterPublicMemebers(declaration) + .map((member) => `${member.name}?: Base${declaration.name}['${member.name}'];`) + .concat( + declaration.events?.map((declaration) => `on${declaration.name}?: (event: CustomEvent) => boolean;`) ?? [] + ); const eventsTypings = []; if (declaration.events) { diff --git a/test/src/svelte/TestElement.d.ts b/test/src/svelte/TestElement.d.ts index 9adf7ed..4751853 100644 --- a/test/src/svelte/TestElement.d.ts +++ b/test/src/svelte/TestElement.d.ts @@ -9,6 +9,7 @@ declare const __propDef: { numericProp?: BaseTestElement['numericProp']; objectProp?: BaseTestElement['objectProp']; defaultValue?: BaseTestElement['defaultValue']; + onstringchange?: (event: CustomEvent) => boolean; }; events: { 'stringchange': CustomEvent; @@ -23,4 +24,5 @@ export type TestElementProps = typeof __propDef.props; export type TestElementEvents = typeof __propDef.events; export type TestElementSlots = typeof __propDef.slots; export class TestElement extends SvelteComponent { + getElement(): BaseTestElement; } diff --git a/test/src/svelte/TestElement.svelte b/test/src/svelte/TestElement.svelte index 70944cf..b771b86 100644 --- a/test/src/svelte/TestElement.svelte +++ b/test/src/svelte/TestElement.svelte @@ -17,6 +17,12 @@ }; } + let __element; + + export function getElement() { + return __element; + } + export let stringProp = undefined; export let booleanProp = undefined; export let numericProp = undefined; @@ -26,6 +32,7 @@ boolean; }; events: { 'stringchange': CustomEvent; @@ -23,4 +24,5 @@ export type TestLinkProps = typeof __propDef.props; export type TestLinkEvents = typeof __propDef.events; export type TestLinkSlots = typeof __propDef.slots; export class TestLink extends SvelteComponent { + getElement(): BaseTestLink; } diff --git a/test/src/svelte/TestLink.svelte b/test/src/svelte/TestLink.svelte index 924756f..03f7962 100644 --- a/test/src/svelte/TestLink.svelte +++ b/test/src/svelte/TestLink.svelte @@ -17,6 +17,12 @@ }; } + let __element; + + export function getElement() { + return __element; + } + export let stringProp = undefined; export let booleanProp = undefined; export let numericProp = undefined; @@ -26,6 +32,7 @@