diff --git a/packages/language-server/src/plugins/html/dataProvider.ts b/packages/language-server/src/plugins/html/dataProvider.ts index d42368e32..e515b1e3f 100644 --- a/packages/language-server/src/plugins/html/dataProvider.ts +++ b/packages/language-server/src/plugins/html/dataProvider.ts @@ -288,6 +288,12 @@ const addAttributes: Record = { description: "SvelteKit-specific attribute. Will cause SvelteKit to run the page's load function as soon as the user hovers over the link (on a desktop) or touches it (on mobile), rather than waiting for the click event to trigger navigation.", valueSet: 'v' + }, + { + name: 'sveltekit:reload', + description: + 'SvelteKit-specific attribute. Will cause SvelteKit to do a normal browser navigation which results in a full page reload.', + valueSet: 'v' } ], details: [ diff --git a/packages/svelte2tsx/src/htmlxtojsx/nodes/attribute.ts b/packages/svelte2tsx/src/htmlxtojsx/nodes/attribute.ts index 68533b958..fc3ad0309 100644 --- a/packages/svelte2tsx/src/htmlxtojsx/nodes/attribute.ts +++ b/packages/svelte2tsx/src/htmlxtojsx/nodes/attribute.ts @@ -60,7 +60,11 @@ export function handleAttribute( //if we are on an "element" we are case insensitive, lowercase to match our JSX if (parent.type == 'Element') { const sapperLinkActions = ['sapper:prefetch', 'sapper:noscroll']; - const sveltekitLinkActions = ['sveltekit:prefetch', 'sveltekit:noscroll']; + const sveltekitLinkActions = [ + 'sveltekit:prefetch', + 'sveltekit:noscroll', + 'sveltekit:reload' + ]; // skip Attribute shorthand, that is handled below if ( (attr.value !== true && diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Attribute.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Attribute.ts index ab5202dd3..15881f83b 100644 --- a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Attribute.ts +++ b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Attribute.ts @@ -29,8 +29,6 @@ const numberOnlyAttributes = new Set([ 'results', 'volume' ]); -const sapperLinkActions = ['sapper:prefetch', 'sapper:noscroll']; -const sveltekitLinkActions = ['sveltekit:prefetch', 'sveltekit:noscroll']; /** * Handle various kinds of attributes and make them conform to being valid in context of a object definition @@ -109,13 +107,7 @@ export function handleAttribute( const attributeName: TransformationArray = []; - if (sapperLinkActions.includes(attr.name) || sveltekitLinkActions.includes(attr.name)) { - //strip ":" from out attribute name and uppercase the next letter to convert to jsx attribute - const parts = attr.name.split(':'); - const name = parts[0] + parts[1][0].toUpperCase() + parts[1].substring(1); - str.overwrite(attr.start, attr.start + attr.name.length, name); - attributeName.push([attr.start, attr.start + attr.name.length]); - } else if (attributeValueIsOfType(attr.value, 'AttributeShorthand')) { + if (attributeValueIsOfType(attr.value, 'AttributeShorthand')) { // For the attribute shorthand, the name will be the mapped part addAttribute([[attr.value[0].start, attr.value[0].end]]); return; diff --git a/packages/svelte2tsx/svelte-jsx.d.ts b/packages/svelte2tsx/svelte-jsx.d.ts index fbaf4ce03..92655d158 100644 --- a/packages/svelte2tsx/svelte-jsx.d.ts +++ b/packages/svelte2tsx/svelte-jsx.d.ts @@ -98,11 +98,16 @@ declare namespace svelteHTML { // eslint-disable-next-line @typescript-eslint/no-empty-interface interface SvelteWindowProps extends svelte.JSX.SvelteWindowProps {} - // eslint-disable-next-line @typescript-eslint/no-empty-interface - interface SapperAnchorProps extends svelte.JSX.SapperAnchorProps {} - - // eslint-disable-next-line @typescript-eslint/no-empty-interface - interface SvelteKitAnchorProps extends svelte.JSX.SvelteKitAnchorProps {} + interface SapperAnchorProps { + "sapper:noscroll"?: true | undefined | null; + "sapper:prefetch"?: true | undefined | null; + } + + interface SvelteKitAnchorProps { + "sveltekit:noscroll"?: true | undefined | null; + "sveltekit:prefetch"?: true | undefined | null; + "sveltekit:reload"?: true | undefined | null; + } // eslint-disable-next-line @typescript-eslint/no-empty-interface interface SvelteMediaTimeRange extends svelte.JSX.SvelteMediaTimeRange {} @@ -1230,6 +1235,7 @@ declare namespace svelte.JSX { // transformed from sveltekit:noscroll so it should be camel case sveltekitNoscroll?: true | undefined | null; sveltekitPrefetch?: true | undefined | null; + sveltekitReload?: true | undefined | null; } interface SvelteMediaTimeRange { diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-noscroll/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-noscroll/expectedv2.js index 10bce5f14..4d6403e59 100644 --- a/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-noscroll/expectedv2.js +++ b/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-noscroll/expectedv2.js @@ -1 +1 @@ - { svelteHTML.createElement("a", {sapperNoscroll:true,}); } \ No newline at end of file + { svelteHTML.createElement("a", {"sapper:noscroll":true,}); } \ No newline at end of file diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-prefetch/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-prefetch/expectedv2.js index 76f68ef53..20901d7b7 100644 --- a/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-prefetch/expectedv2.js +++ b/packages/svelte2tsx/test/htmlx2jsx/samples/sapper-prefetch/expectedv2.js @@ -1 +1 @@ - { svelteHTML.createElement("a", {sapperPrefetch:true,}); } \ No newline at end of file + { svelteHTML.createElement("a", {"sapper:prefetch":true,}); } \ No newline at end of file diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expected.jsx b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expected.jsx index 7efc257d6..0f023660e 100644 --- a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expected.jsx +++ b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expected.jsx @@ -1,2 +1,3 @@ <> - \ No newline at end of file + + \ No newline at end of file diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expectedv2.js b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expectedv2.js index 6b1fe849e..d4478cdaa 100644 --- a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expectedv2.js +++ b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/expectedv2.js @@ -1,2 +1,3 @@ - { svelteHTML.createElement("a", {sveltekitNoscroll:true,}); } - { svelteHTML.createElement("a", {sveltekitPrefetch:true,}); } \ No newline at end of file + { svelteHTML.createElement("a", {"sveltekit:noscroll":true,}); } + { svelteHTML.createElement("a", {"sveltekit:prefetch":true,}); } + { svelteHTML.createElement("a", {"sveltekit:reload":true,}); } \ No newline at end of file diff --git a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/input.svelte b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/input.svelte index 53cb16120..7e888c35d 100644 --- a/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/input.svelte +++ b/packages/svelte2tsx/test/htmlx2jsx/samples/sveltekit-anchor-attrs/input.svelte @@ -1,2 +1,3 @@ +