diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/EventHandler.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/EventHandler.ts
index 159c7997c..277212740 100644
--- a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/EventHandler.ts
+++ b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/EventHandler.ts
@@ -19,9 +19,9 @@ export function handleEventHandler(
const nameEnd = nameStart + attr.name.length;
if (element instanceof Element) {
- // Prefix with "on" for better mapping.
+ // Prefix with "on:" for better mapping.
// Surround with quotes because event name could contain invalid prop chars.
- surroundWith(str, [nameStart, nameEnd], '"on', '"');
+ surroundWith(str, [nameStart, nameEnd], '"on:', '"');
element.addAttribute(
[[nameStart, nameEnd]],
attr.expression
diff --git a/packages/svelte2tsx/svelte-jsx.d.ts b/packages/svelte2tsx/svelte-jsx.d.ts
index f6f158dbe..2b8f711ea 100644
--- a/packages/svelte2tsx/svelte-jsx.d.ts
+++ b/packages/svelte2tsx/svelte-jsx.d.ts
@@ -62,14 +62,335 @@ declare namespace svelteHTML {
// This interface is not complete. Only properties accepting
// unit-less numbers are listed here (see CSSProperty.js in React)
- // eslint-disable-next-line @typescript-eslint/no-empty-interface
- interface DOMAttributes extends svelte.JSX.DOMAttributes {}
+ interface DOMAttributes {
+ // Clipboard Events
+ "on:copy"?: ClipboardEventHandler | undefined | null;
+ "on:cut"?: ClipboardEventHandler | undefined | null;
+ "on:paste"?: ClipboardEventHandler | undefined | null;
+
+ // Composition Events
+ "on:compositionend"?: CompositionEventHandler | undefined | null;
+ "on:compositionstart"?: CompositionEventHandler | undefined | null;
+ "on:compositionupdate"?: CompositionEventHandler | undefined | null;
+
+ // Focus Events
+ "on:focus"?: FocusEventHandler | undefined | null;
+ "on:focusin"?: FocusEventHandler | undefined | null;
+ "on:focusout"?: FocusEventHandler | undefined | null;
+ "on:blur"?: FocusEventHandler | undefined | null;
+
+ // Form Events
+ "on:change"?: FormEventHandler | undefined | null;
+ "on:input"?: FormEventHandler | undefined | null;
+ "on:reset"?: FormEventHandler | undefined | null;
+ "on:submit"?: EventHandler | undefined | null;
+ "on:invalid"?: EventHandler | undefined | null;
+ "on:beforeinput"?: EventHandler | undefined | null;
+
+ // Image Events
+ "on:load"?: EventHandler | undefined | null;
+ "on:error"?: EventHandler | undefined | null; // also a Media Event
+
+ // Detail Events
+ "on:toggle"?: EventHandler | undefined | null;
+
+ // Keyboard Events
+ "on:keydown"?: KeyboardEventHandler | undefined | null;
+ "on:keypress"?: KeyboardEventHandler | undefined | null;
+ "on:keyup"?: KeyboardEventHandler | undefined | null;
+
+ // Media Events
+ "on:abort"?: EventHandler | undefined | null;
+ "on:canplay"?: EventHandler | undefined | null;
+ "on:canplaythrough"?: EventHandler | undefined | null;
+ "on:cuechange"?: EventHandler | undefined | null;
+ "on:durationchange"?: EventHandler | undefined | null;
+ "on:emptied"?: EventHandler | undefined | null;
+ "on:encrypted"?: EventHandler | undefined | null;
+ "on:ended"?: EventHandler | undefined | null;
+ "on:loadeddata"?: EventHandler | undefined | null;
+ "on:loadedmetadata"?: EventHandler | undefined | null;
+ "on:loadstart"?: EventHandler | undefined | null;
+ "on:pause"?: EventHandler | undefined | null;
+ "on:play"?: EventHandler | undefined | null;
+ "on:playing"?: EventHandler | undefined | null;
+ "on:progress"?: EventHandler | undefined | null;
+ "on:ratechange"?: EventHandler | undefined | null;
+ "on:seeked"?: EventHandler | undefined | null;
+ "on:seeking"?: EventHandler | undefined | null;
+ "on:stalled"?: EventHandler | undefined | null;
+ "on:suspend"?: EventHandler | undefined | null;
+ "on:timeupdate"?: EventHandler | undefined | null;
+ "on:volumechange"?: EventHandler | undefined | null;
+ "on:waiting"?: EventHandler | undefined | null;
+
+ // MouseEvents
+ "on:auxclick"?: MouseEventHandler | undefined | null;
+ "on:click"?: MouseEventHandler | undefined | null;
+ "on:contextmenu"?: MouseEventHandler | undefined | null;
+ "on:dblclick"?: MouseEventHandler | undefined | null;
+ "on:drag"?: DragEventHandler | undefined | null;
+ "on:dragend"?: DragEventHandler | undefined | null;
+ "on:dragenter"?: DragEventHandler | undefined | null;
+ "on:dragexit"?: DragEventHandler | undefined | null;
+ "on:dragleave"?: DragEventHandler | undefined | null;
+ "on:dragover"?: DragEventHandler | undefined | null;
+ "on:dragstart"?: DragEventHandler | undefined | null;
+ "on:drop"?: DragEventHandler | undefined | null;
+ "on:mousedown"?: MouseEventHandler | undefined | null;
+ "on:mouseenter"?: MouseEventHandler | undefined | null;
+ "on:mouseleave"?: MouseEventHandler | undefined | null;
+ "on:mousemove"?: MouseEventHandler | undefined | null;
+ "on:mouseout"?: MouseEventHandler | undefined | null;
+ "on:mouseover"?: MouseEventHandler | undefined | null;
+ "on:mouseup"?: MouseEventHandler | undefined | null;
+
+ // Selection Events
+ "on:select"?: EventHandler | undefined | null;
+ "on:selectionchange"?: EventHandler | undefined | null;
+ "on:selectstart"?: EventHandler | undefined | null;
+
+ // Touch Events
+ "on:touchcancel"?: TouchEventHandler | undefined | null;
+ "on:touchend"?: TouchEventHandler | undefined | null;
+ "on:touchmove"?: TouchEventHandler | undefined | null;
+ "on:touchstart"?: TouchEventHandler | undefined | null;
+
+ // Pointer Events
+ "on:gotpointercapture"?: PointerEventHandler | undefined | null;
+ "on:pointercancel"?: PointerEventHandler | undefined | null;
+ "on:pointerdown"?: PointerEventHandler | undefined | null;
+ "on:pointerenter"?: PointerEventHandler | undefined | null;
+ "on:pointerleave"?: PointerEventHandler | undefined | null;
+ "on:pointermove"?: PointerEventHandler | undefined | null;
+ "on:pointerout"?: PointerEventHandler | undefined | null;
+ "on:pointerover"?: PointerEventHandler | undefined | null;
+ "on:pointerup"?: PointerEventHandler | undefined | null;
+ "on:lostpointercapture"?: PointerEventHandler | undefined | null;
+
+ // UI Events
+ "on:scroll"?: UIEventHandler | undefined | null;
+ "on:resize"?: UIEventHandler | undefined | null;
+
+ // Wheel Events
+ "on:wheel"?: WheelEventHandler | undefined | null;
+
+ // Animation Events
+ "on:animationstart"?: AnimationEventHandler | undefined | null;
+ "on:animationend"?: AnimationEventHandler | undefined | null;
+ "on:animationiteration"?: AnimationEventHandler | undefined | null;
+
+ // Transition Events
+ "on:transitionstart"?: TransitionEventHandler | undefined | null;
+ "on:transitionrun"?: TransitionEventHandler | undefined | null;
+ "on:transitionend"?: TransitionEventHandler | undefined | null;
+ "on:transitioncancel"?: TransitionEventHandler | undefined | null;
+
+ // Svelte Transition Events
+ "on:outrostart"?: EventHandler, T> | undefined | null;
+ "on:outroend"?: EventHandler, T> | undefined | null;
+ "on:introstart"?: EventHandler, T> | undefined | null;
+ "on:introend"?: EventHandler, T> | undefined | null;
+
+ // Message Events
+ "on:message"?: MessageEventHandler | undefined | null;
+ "on:messageerror"?: MessageEventHandler | undefined | null;
+
+ // Global Events
+ "on:cancel"?: EventHandler | undefined | null;
+ "on:close"?: EventHandler | undefined | null;
+ "on:fullscreenchange"?: EventHandler | undefined | null;
+ "on:fullscreenerror"?: EventHandler | undefined | null;
+ }
// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface AriaAttributes extends svelte.JSX.AriaAttributes {}
- // eslint-disable-next-line @typescript-eslint/no-empty-interface
- interface HTMLAttributes extends svelte.JSX.HTMLAttributes {}
+ interface HTMLAttributes extends AriaAttributes, DOMAttributes {
+ // Standard HTML Attributes
+ class?: string | undefined | null;
+ dataset?: object | undefined | null; // eslint-disable-line
+ accept?: string | undefined | null;
+ acceptcharset?: string | undefined | null;
+ accesskey?: string | undefined | null;
+ action?: string | undefined | null;
+ allow?: string | undefined | null;
+ allowfullscreen?: boolean | undefined | null;
+ allowtransparency?: boolean | undefined | null;
+ allowpaymentrequest?: boolean | undefined | null;
+ alt?: string | undefined | null;
+ as?: string | undefined | null;
+ async?: boolean | undefined | null;
+ autocomplete?: string | undefined | null;
+ autofocus?: boolean | undefined | null;
+ autoplay?: boolean | undefined | null;
+ capture?: 'environment' | 'user' | boolean | undefined | null;
+ cellpadding?: number | string | undefined | null;
+ cellspacing?: number | string | undefined | null;
+ charset?: string | undefined | null;
+ challenge?: string | undefined | null;
+ checked?: boolean | undefined | null;
+ cite?: string | undefined | null;
+ classid?: string | undefined | null;
+ cols?: number | undefined | null;
+ colspan?: number | undefined | null;
+ content?: string | undefined | null;
+ contenteditable?: 'true' | 'false' | boolean | undefined | null;
+
+ // Doesn't work when used as HTML attribute
+ /**
+ * Elements with the contenteditable attribute support innerHTML and textContent bindings.
+ */
+ innerHTML?: string | undefined | null;
+ // Doesn't work when used as HTML attribute
+ /**
+ * Elements with the contenteditable attribute support innerHTML and textContent bindings.
+ */
+
+ textContent?: string | undefined | null;
+
+ contextmenu?: string | undefined | null;
+ controls?: boolean | undefined | null;
+ coords?: string | undefined | null;
+ crossorigin?: string | undefined | null;
+ currenttime?: number | undefined | null;
+ decoding?: 'async' | 'sync' | 'auto' | undefined | null;
+ data?: string | undefined | null;
+ datetime?: string | undefined | null;
+ default?: boolean | undefined | null;
+ defaultmuted?: boolean | undefined | null;
+ defaultplaybackrate?: number | undefined | null;
+ defer?: boolean | undefined | null;
+ dir?: string | undefined | null;
+ dirname?: string | undefined | null;
+ disabled?: boolean | undefined | null;
+ download?: any | undefined | null;
+ draggable?: boolean | 'true' | 'false' | undefined | null;
+ enctype?: string | undefined | null;
+ enterkeyhint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send' | undefined | null;
+ for?: string | undefined | null;
+ form?: string | undefined | null;
+ formaction?: string | undefined | null;
+ formenctype?: string | undefined | null;
+ formmethod?: string | undefined | null;
+ formnovalidate?: boolean | undefined | null;
+ formtarget?: string | undefined | null;
+ frameborder?: number | string | undefined | null;
+ headers?: string | undefined | null;
+ height?: number | string | undefined | null;
+ hidden?: boolean | undefined | null;
+ high?: number | undefined | null;
+ href?: string | undefined | null;
+ hreflang?: string | undefined | null;
+ htmlfor?: string | undefined | null;
+ httpequiv?: string | undefined | null;
+ id?: string | undefined | null;
+ inputmode?: string | undefined | null;
+ integrity?: string | undefined | null;
+ is?: string | undefined | null;
+ ismap?: boolean | undefined | null;
+ keyparams?: string | undefined | null;
+ keytype?: string | undefined | null;
+ kind?: string | undefined | null;
+ label?: string | undefined | null;
+ lang?: string | undefined | null;
+ list?: string | undefined | null;
+ loading?: string | undefined | null;
+ loop?: boolean | undefined | null;
+ low?: number | undefined | null;
+ manifest?: string | undefined | null;
+ marginheight?: number | undefined | null;
+ marginwidth?: number | undefined | null;
+ max?: number | string | undefined | null;
+ maxlength?: number | undefined | null;
+ media?: string | undefined | null;
+ mediagroup?: string | undefined | null;
+ method?: string | undefined | null;
+ min?: number | string | undefined | null;
+ minlength?: number | undefined | null;
+ multiple?: boolean | undefined | null;
+ muted?: boolean | undefined | null;
+ name?: string | undefined | null;
+ nonce?: string | undefined | null;
+ novalidate?: boolean | undefined | null;
+ open?: boolean | undefined | null;
+ optimum?: number | undefined | null;
+ part?: string | undefined | null;
+ pattern?: string | undefined | null;
+ placeholder?: string | undefined | null;
+ playsinline?: boolean | undefined | null;
+ ping?: string | undefined | null;
+ poster?: string | undefined | null;
+ preload?: string | undefined | null;
+ radiogroup?: string | undefined | null;
+ readonly?: boolean | undefined | null;
+ referrerpolicy?: string | undefined | null;
+ rel?: string | undefined | null;
+ required?: boolean | undefined | null;
+ reversed?: boolean | undefined | null;
+ role?: string | undefined | null;
+ rows?: number | undefined | null;
+ rowspan?: number | undefined | null;
+ sandbox?: string | undefined | null;
+ scope?: string | undefined | null;
+ scoped?: boolean | undefined | null;
+ scrolling?: string | undefined | null;
+ seamless?: boolean | undefined | null;
+ selected?: boolean | undefined | null;
+ shape?: string | undefined | null;
+ size?: number | undefined | null;
+ sizes?: string | undefined | null;
+ slot?: string | undefined | null;
+ span?: number | undefined | null;
+ spellcheck?: boolean | 'true' | 'false' | undefined | null;
+ src?: string | undefined | null;
+ srcdoc?: string | undefined | null;
+ srclang?: string | undefined | null;
+ srcset?: string | undefined | null;
+ start?: number | undefined | null;
+ step?: number | string | undefined | null;
+ style?: string | undefined | null;
+ summary?: string | undefined | null;
+ tabindex?: number | undefined | null;
+ target?: string | undefined | null;
+ title?: string | undefined | null;
+ translate?: "yes" | "no" | "" | undefined | null;
+ type?: string | undefined | null;
+ usemap?: string | undefined | null;
+ value?: any | undefined | null;
+ /**
+ * a value between 0 and 1
+ */
+ volume?: number | undefined | null;
+ width?: number | string | undefined | null;
+ wmode?: string | undefined | null;
+ wrap?: string | undefined | null;
+
+ // RDFa Attributes
+ about?: string | undefined | null;
+ datatype?: string | undefined | null;
+ inlist?: any | undefined | null;
+ prefix?: string | undefined | null;
+ property?: string | undefined | null;
+ resource?: string | undefined | null;
+ typeof?: string | undefined | null;
+ vocab?: string | undefined | null;
+
+ // Non-standard Attributes
+ autocapitalize?: string | undefined | null;
+ autocorrect?: string | undefined | null;
+ autosave?: string | undefined | null;
+ color?: string | undefined | null;
+ controlslist?: 'nodownload' | 'nofullscreen' | 'noplaybackrate' | 'noremoteplayback';
+ itemprop?: string | undefined | null;
+ itemscope?: boolean | undefined | null;
+ itemtype?: string | undefined | null;
+ itemid?: string | undefined | null;
+ itemref?: string | undefined | null;
+ results?: number | undefined | null;
+ security?: string | undefined | null;
+ unselectable?: boolean | undefined | null;
+ }
// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface SVGAttributes extends svelte.JSX.SVGAttributes {
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/directive-quoted/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/directive-quoted/expectedv2.js
index 6b1b60b5a..2def2fb4c 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/directive-quoted/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/directive-quoted/expectedv2.js
@@ -1,4 +1,4 @@
- { svelteHTML.createElement("h1", { "onclick":()=>console.log("click"),}); }
+ { svelteHTML.createElement("h1", { "on:click":()=>console.log("click"),}); }
{ const $$_Component0C = __sveltets_2_ensureComponent(Component); const $$_Component0 = new $$_Component0C({ target: __sveltets_2_any(), props: { }});$$_Component0.$on("click", test);}
{ svelteHTML.createElement("img", { });__sveltets_2_ensureAction(action(svelteHTML.mapElementTag('img'),(thing)));}
{ svelteHTML.createElement("img", { });__sveltets_2_ensureTransition(fade(svelteHTML.mapElementTag('img'),(params)));}
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/editing-event-handler/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/editing-event-handler/expectedv2.js
index 312c6d750..8993cfc30 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/editing-event-handler/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/editing-event-handler/expectedv2.js
@@ -1,3 +1,3 @@
- { svelteHTML.createElement("div", { "onclick":handlers.,}); }
+ { svelteHTML.createElement("div", { "on:click":handlers.,}); }
{ const $$_Component0C = __sveltets_2_ensureComponent(Component); const $$_Component0 = new $$_Component0C({ target: __sveltets_2_any(), props: { }});$$_Component0.$on("click", handlers.);}
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-bare/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-bare/expectedv2.js
index 38a46de7e..9ae89e9a6 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-bare/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-bare/expectedv2.js
@@ -1 +1 @@
- { svelteHTML.createElement("h1", { "onclick":undefined,}); }
\ No newline at end of file
+ { svelteHTML.createElement("h1", { "on:click":undefined,}); }
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-customname/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-customname/expectedv2.js
index 5aa576eaa..6e5abcb65 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-customname/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-customname/expectedv2.js
@@ -1 +1 @@
- { svelteHTML.createElement("h1", { "onclick-outside":undefined,"onclick-outside2":() => 'hi',}); }
\ No newline at end of file
+ { svelteHTML.createElement("h1", { "on:click-outside":undefined,"on:click-outside2":() => 'hi',}); }
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-modifiers/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-modifiers/expectedv2.js
index caab42067..95531480a 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-modifiers/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-modifiers/expectedv2.js
@@ -1 +1 @@
- { svelteHTML.createElement("h1", { "onclick":click,}); }
\ No newline at end of file
+ { svelteHTML.createElement("h1", { "on:click":click,}); }
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-quoted/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-quoted/expectedv2.js
index 04696ca2c..8fa03941d 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-quoted/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler-quoted/expectedv2.js
@@ -1,2 +1,2 @@
- { svelteHTML.createElement("button", { "onclick":(e) => {},}); }
- { svelteHTML.createElement("button", { "onclick":(e) => {},}); }
\ No newline at end of file
+ { svelteHTML.createElement("button", { "on:click":(e) => {},}); }
+ { svelteHTML.createElement("button", { "on:click":(e) => {},}); }
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler/expectedv2.js
index 79df435d8..256b731e6 100644
--- a/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler/expectedv2.js
+++ b/packages/svelte2tsx/test/htmlx2jsx/samples/event-handler/expectedv2.js
@@ -1 +1 @@
- { svelteHTML.createElement("h1", { "onclick":()=>console.log("click"),"onUpperCaseEvent":() => log('hi'),}); }
\ No newline at end of file
+ { svelteHTML.createElement("h1", { "on:click":()=>console.log("click"),"on:UpperCaseEvent":() => log('hi'),}); }
\ No newline at end of file
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/circle-drawer-example/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/circle-drawer-example/expectedv2.ts
index 18e7444c9..37f1ef048 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/circle-drawer-example/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/circle-drawer-example/expectedv2.ts
@@ -65,13 +65,13 @@ async () => {
{ svelteHTML.createElement("div", { "class":`controls`,});
- { svelteHTML.createElement("button", { "onclick":() => travel(-1),"disabled":i === 0,}); }
- { svelteHTML.createElement("button", { "onclick":() => travel(+1),"disabled":i === undoStack.length -1,}); }
+ { svelteHTML.createElement("button", { "on:click":() => travel(-1),"disabled":i === 0,}); }
+ { svelteHTML.createElement("button", { "on:click":() => travel(+1),"disabled":i === undoStack.length -1,}); }
}
- { svelteHTML.createElement("svg", { "onclick":handleClick,});
+ { svelteHTML.createElement("svg", { "on:click":handleClick,});
for(const circle of __sveltets_2_ensureArray(circles)){
- { svelteHTML.createElement("circle", { "cx":circle.cx,"cy":circle.cy,"r":circle.r,"onclick":event => select(circle, event),"oncontextmenu":() => {
+ { svelteHTML.createElement("circle", { "cx":circle.cx,"cy":circle.cy,"r":circle.r,"on:click":event => select(circle, event),"on:contextmenu":() => {
adjusting = !adjusting;
if (adjusting) selected = circle;
},"fill":circle === selected ? '#ccc': 'white',});}
@@ -81,7 +81,7 @@ async () => {
if(adjusting){
{ svelteHTML.createElement("div", { "class":`adjuster`,});
{ svelteHTML.createElement("p", {}); selected.cx; selected.cy; }
- { svelteHTML.createElement("input", { "type":`range`,"value":selected.r,"oninput":adjust,});}
+ { svelteHTML.createElement("input", { "type":`range`,"value":selected.r,"on:input":adjust,});}
}
}};
return { props: {}, slots: {}, getters: {}, events: {} }}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/component-events-strictEvents/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/component-events-strictEvents/expectedv2.ts
index 681828dd7..8d6dfbc75 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/component-events-strictEvents/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/component-events-strictEvents/expectedv2.ts
@@ -10,7 +10,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":undefined,}); }};
+ { svelteHTML.createElement("button", { "on:click":undefined,}); }};
return { props: {}, slots: {}, getters: {}, events: {'click':__sveltets_1_mapElementEvent('click'), 'foo': __sveltets_1_customEvent} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(render())) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/event-and-forwarded-event/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/event-and-forwarded-event/expectedv2.ts
index b612ffb3a..c93b0196e 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/event-and-forwarded-event/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/event-and-forwarded-event/expectedv2.ts
@@ -10,7 +10,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("input", { "onfocus":undefined,});}};
+ { svelteHTML.createElement("input", { "on:focus":undefined,});}};
return { props: {}, slots: {}, getters: {}, events: {'focus':__sveltets_1_mapElementEvent('focus'), 'mount': __sveltets_1_customEvent} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-element/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-element/expectedv2.ts
index dafff8ee4..f9f406f6c 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-element/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-element/expectedv2.ts
@@ -1,6 +1,6 @@
///
;function render() {
-async () => { { svelteHTML.createElement("button", { "onclick":undefined,}); }};
+async () => { { svelteHTML.createElement("button", { "on:click":undefined,}); }};
return { props: {}, slots: {}, getters: {}, events: {'click':__sveltets_1_mapElementEvent('click')} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts
index d65196c96..7dd6c3dd2 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/event-bubble-svelte-element/expectedv2.ts
@@ -1,7 +1,7 @@
///
;function render() {
-async () => { { svelteHTML.createElement("svelte:body", { "onclick":undefined,}); }
- { svelteHTML.createElement("svelte:window", { "onresize":undefined,}); }};
+async () => { { svelteHTML.createElement("svelte:body", { "on:click":undefined,}); }
+ { svelteHTML.createElement("svelte:window", { "on:resize":undefined,}); }};
return { props: {}, slots: {}, getters: {}, events: {'click':__sveltets_1_mapBodyEvent('click'), 'resize':__sveltets_1_mapWindowEvent('resize')} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events-alias/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events-alias/expectedv2.ts
index 179354b1d..806c8a9a6 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events-alias/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events-alias/expectedv2.ts
@@ -17,7 +17,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":() => dispatch('btn', ''),}); }};
+ { svelteHTML.createElement("button", { "on:click":() => dispatch('btn', ''),}); }};
return { props: {}, slots: {}, getters: {}, events: {'btn': __sveltets_1_customEvent, 'hi': __sveltets_1_customEvent, 'bye': __sveltets_1_customEvent} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events/expectedv2.ts
index fd1173450..a3a1f3a9f 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatcher-events/expectedv2.ts
@@ -17,7 +17,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":() => dispatch('btn', ''),}); }};
+ { svelteHTML.createElement("button", { "on:click":() => dispatch('btn', ''),}); }};
return { props: {}, slots: {}, getters: {}, events: {'btn': __sveltets_1_customEvent, 'hi': __sveltets_1_customEvent, 'bye': __sveltets_1_customEvent} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatchers/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatchers/expectedv2.ts
index 3a799353b..6fc894883 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatchers/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/event-dispatchers/expectedv2.ts
@@ -14,7 +14,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":undefined,}); }};
+ { svelteHTML.createElement("button", { "on:click":undefined,}); }};
return { props: {}, slots: {}, getters: {}, events: {'click':__sveltets_1_mapElementEvent('click'), 'hi': __sveltets_1_customEvent, 'bye': __sveltets_1_customEvent} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/nested-$-variables-template/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/nested-$-variables-template/expectedv2.ts
index f8816c6c4..9f536daf6 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/nested-$-variables-template/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/nested-$-variables-template/expectedv2.ts
@@ -1,6 +1,6 @@
///
;function render() {
-async () => { { svelteHTML.createElement("h1", { "onclick":() => {
+async () => { { svelteHTML.createElement("h1", { "on:click":() => {
// TODO: this is invalid Svelte right now, stores have to be top level
// it's therefore okay to not append "let top1$/top2$ = __svelte_store_get(..)"
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/svelte-element/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/svelte-element/expectedv2.ts
index ff17b1eaf..dfeb85824 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/svelte-element/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/svelte-element/expectedv2.ts
@@ -9,7 +9,7 @@ async () => {
{ svelteHTML.createElement("tag", { });}
{ svelteHTML.createElement(tag ? 'a' : 'b', { });}
{ svelteHTML.createElement(tag, { });tag; }
- { svelteHTML.createElement(tag, { "onclick":() => tag,});}
+ { svelteHTML.createElement(tag, { "on:click":() => tag,});}
{ svelteHTML.createElement('a', { "sveltekit:prefetch":true,"href":`https://kit.svelte.dev`,});}};
return { props: {}, slots: {}, getters: {}, events: {} }}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatcher-typed/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatcher-typed/expectedv2.ts
index 06ec93748..cba15e75a 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatcher-typed/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatcher-typed/expectedv2.ts
@@ -30,7 +30,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":() => dispatch('btn', ''),}); }};
+ { svelteHTML.createElement("button", { "on:click":() => dispatch('btn', ''),}); }};
return { props: {}, slots: {}, getters: {}, events: {...__sveltets_1_toEventTypings<{
/**
* A DOC
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers-same-event/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers-same-event/expectedv2.ts
index 390ea7b04..13982b86a 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers-same-event/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers-same-event/expectedv2.ts
@@ -19,7 +19,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":undefined,}); }};
+ { svelteHTML.createElement("button", { "on:click":undefined,}); }};
return { props: {}, slots: {}, getters: {}, events: {...__sveltets_1_toEventTypings<{
/**
* A DOC
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers/expectedv2.ts
index 175a5cdcd..899dd9352 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatchers/expectedv2.ts
@@ -19,7 +19,7 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":undefined,}); }};
+ { svelteHTML.createElement("button", { "on:click":undefined,}); }};
return { props: {}, slots: {}, getters: {}, events: {...__sveltets_1_toEventTypings<{
/**
* A DOC
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-in-event-binding/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-in-event-binding/expectedv2.ts
index 7c83db819..e686c9cbd 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-in-event-binding/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-in-event-binding/expectedv2.ts
@@ -1,7 +1,7 @@
///
;function render() {
async () => { { const $$_Component0C = __sveltets_2_ensureComponent(Component); const $$_Component0 = new $$_Component0C({ target: __sveltets_2_any(), props: { }});$$_Component0.$on("click", $check ? method1 : method2);}
- { svelteHTML.createElement("button", { "onclick":$check ? method1 : method2,}); }};
+ { svelteHTML.createElement("button", { "on:click":$check ? method1 : method2,}); }};
return { props: {}, slots: {}, getters: {}, events: {} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-assignment-operators/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-assignment-operators/expectedv2.ts
index 329b08940..99198bfd5 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-assignment-operators/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-assignment-operators/expectedv2.ts
@@ -21,18 +21,18 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":() => $count += myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count -= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count *= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count /= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count **= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count %= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count <<= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count >>= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count >>>= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count &= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count ^= myvar,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count |= myvar,}); }};
+ { svelteHTML.createElement("button", { "on:click":() => $count += myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count -= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count *= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count /= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count **= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count %= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count <<= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count >>= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count >>>= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count &= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count ^= myvar,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count |= myvar,}); }};
return { props: {}, slots: {}, getters: {}, events: {} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-increments/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-increments/expectedv2.ts
index 8a7ac317b..1ed54b64d 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-increments/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-increments/expectedv2.ts
@@ -10,9 +10,9 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":() => ++$count,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count--,}); }
- { svelteHTML.createElement("button", { "onclick":() => $count++,}); }};
+ { svelteHTML.createElement("button", { "on:click":() => ++$count,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count--,}); }
+ { svelteHTML.createElement("button", { "on:click":() => $count++,}); }};
return { props: {}, slots: {}, getters: {}, events: {} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-unary-operators/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-unary-operators/expectedv2.ts
index b63ffa3dd..0a85401d0 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-unary-operators/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-unary-operators/expectedv2.ts
@@ -12,10 +12,10 @@ function render() {
;
async () => {
- { svelteHTML.createElement("button", { "onclick":() => !$count,}); }
- { svelteHTML.createElement("button", { "onclick":() => +$count,}); }
- { svelteHTML.createElement("button", { "onclick":() => -$count,}); }
- { svelteHTML.createElement("button", { "onclick":() => ~$count,}); }};
+ { svelteHTML.createElement("button", { "on:click":() => !$count,}); }
+ { svelteHTML.createElement("button", { "on:click":() => +$count,}); }
+ { svelteHTML.createElement("button", { "on:click":() => -$count,}); }
+ { svelteHTML.createElement("button", { "on:click":() => ~$count,}); }};
return { props: {}, slots: {}, getters: {}, events: {} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store/expectedv2.ts
index 2ee7d1999..dbbb81dbf 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store/expectedv2.ts
@@ -2,7 +2,7 @@
;function render() {
$b=$b.concat(5);
async () => {
- { svelteHTML.createElement("h1", { "onclick":() => $b=$b.concat(5),});$b; }};
+ { svelteHTML.createElement("h1", { "on:click":() => $b=$b.concat(5),});$b; }};
return { props: {}, slots: {}, getters: {}, events: {} }}
export default class Input__SvelteComponent_ extends __sveltets_1_createSvelte2TsxComponent(__sveltets_1_partial(__sveltets_1_with_any_event(render()))) {
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts
index b1b203480..544cf0bbc 100644
--- a/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts
+++ b/packages/svelte2tsx/test/svelte2tsx/samples/uses-svelte-components/expectedv2.ts
@@ -6,8 +6,8 @@ async () => {if(true){
{ const $$_svelte_component0C = __sveltets_2_ensureComponent(testComponent); new $$_svelte_component0C({ target: __sveltets_2_any(), props: { "propa":5,}});
{ svelteHTML.createElement("h1", {}); }
}
- { svelteHTML.createElement("svelte:window", { "onclick":e => {},});}
- { svelteHTML.createElement("svelte:body", { "onclick":e => {},});}
+ { svelteHTML.createElement("svelte:window", { "on:click":e => {},});}
+ { svelteHTML.createElement("svelte:body", { "on:click":e => {},});}
{ svelteHTML.createElement("svelte:head", {});
{ svelteHTML.createElement("h1", {}); }
}