Skip to content

Commit

Permalink
feat: provide SvelteKit html typings
Browse files Browse the repository at this point in the history
This makes it possible to delete these from svelte/elements in Svelte 5 and have them controled in SvelteKit, decoupling the two
closes #10534
  • Loading branch information
dummdidumm committed Dec 7, 2023
1 parent 184331a commit 5be5689
Show file tree
Hide file tree
Showing 4 changed files with 51 additions and 1 deletion.
5 changes: 5 additions & 0 deletions .changeset/smart-buttons-return.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@sveltejs/kit': minor
---

feat: provide SvelteKit html typings
2 changes: 2 additions & 0 deletions packages/kit/src/core/sync/sync.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { write_root } from './write_root.js';
import { write_tsconfig } from './write_tsconfig.js';
import { write_types, write_all_types } from './write_types/index.js';
import { write_ambient } from './write_ambient.js';
import { write_non_ambient } from './write_non_ambient.js';
import { write_server } from './write_server.js';

/**
Expand All @@ -15,6 +16,7 @@ import { write_server } from './write_server.js';
export function init(config, mode) {
write_tsconfig(config.kit);
write_ambient(config.kit, mode);
write_non_ambient(config.kit);
}

/**
Expand Down
42 changes: 42 additions & 0 deletions packages/kit/src/core/sync/write_non_ambient.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
import path from 'node:path';
import { GENERATED_COMMENT } from '../../constants.js';
import { write_if_changed } from './utils.js';

// `declare module "svelte/elements"` needs to happen in a non-ambient module, and dts-buddy generates one big ambient module,
// so we can't add it there - therefore generate the typings ourselves here.
// We're not using the `declare namespace svelteHTML` variant because that one doesn't augment the HTMLAttributes interface
// people could use to type their own components.
// The T generic is needed or else there's a "all declarations must have identical type parameters" error.
const template = `
${GENERATED_COMMENT}
declare module "svelte/elements" {
export interface HTMLAttributes<T> {
'data-sveltekit-keepfocus'?: true | '' | 'off' | undefined | null;
'data-sveltekit-noscroll'?: true | '' | 'off' | undefined | null;
'data-sveltekit-preload-code'?:
| true
| ''
| 'eager'
| 'viewport'
| 'hover'
| 'tap'
| 'off'
| undefined
| null;
'data-sveltekit-preload-data'?: true | '' | 'hover' | 'tap' | 'off' | undefined | null;
'data-sveltekit-reload'?: true | '' | 'off' | undefined | null;
'data-sveltekit-replacestate'?: true | '' | 'off' | undefined | null;
}
}
export {};
`;

/**
* Writes non-ambient declarations to the output directory
* @param {import('types').ValidatedKitConfig} config
*/
export function write_non_ambient(config) {
write_if_changed(path.join(config.outDir, 'non-ambient.d.ts'), template);
}
3 changes: 2 additions & 1 deletion packages/kit/src/core/sync/write_tsconfig.js
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@ export function get_tsconfig(kit, include_base_url) {

const include = new Set([
'ambient.d.ts',
'non-ambient.d.ts',
'./types/**/$types.d.ts',
config_relative('vite.config.js'),
config_relative('vite.config.ts')
Expand All @@ -109,7 +110,7 @@ export function get_tsconfig(kit, include_base_url) {
include.add(config_relative(`${test_folder}/**/*.ts`));
include.add(config_relative(`${test_folder}/**/*.svelte`));

const exclude = [config_relative('node_modules/**'), './[!ambient.d.ts]**'];
const exclude = [config_relative('node_modules/**')];
if (path.extname(kit.files.serviceWorker)) {
exclude.push(config_relative(kit.files.serviceWorker));
} else {
Expand Down

0 comments on commit 5be5689

Please sign in to comment.