merge master

Author: benmccann

.changeset/eighty-poems-deliver.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: css sourcemap generation with unicode filenames

documentation/blog/2023-08-01-whats-new-in-svelte-august-2023.md

@@ -46,7 +46,7 @@ For all the patches and performance updates from this month, check out the [Svel
 **Learning Resources**
 _Featuring Svelte Contributors and Ambassadors_
 - [Exploring Svelte 4 w/ Kevin AK: Performance, Compatibility, & Web Component Support | Modern Web Pod](https://www.youtube.com/watch?v=YOL0HGGVib4) by This Dot Media
-- [Svelte Sirens Stream Design Systems: Lessons Learned](https://www.youtube.com/live/YHZaiIGSqsE?feature=share) featuring Eric Liu creator of Carbon Components Svelte and Svelde the docgen library
+- [Svelte Sirens Stream Design Systems: Lessons Learned](https://www.youtube.com/live/YHZaiIGSqsE?feature=share) featuring Eric Liu, creator of Carbon Components Svelte and the `sveld` docgen library
 - This Week in Svelte:
   - [2023 June 30](https://www.youtube.com/watch?v=sDz4_BLoYQ4) - Svelte 4.0.1, SK 1.21, lists, screen readers, loading
   - [2023 July 7](https://www.youtube.com/watch?v=0tq1ph4DDFA) - Svelte 4.0.5, Kit 1.22.1, Svelte 5, local storage and markdown

documentation/docs/02-template-syntax/02-basic-markup.md

@@ -56,8 +56,9 @@ All other attributes are included unless their value is [nullish](https://develo
 
 An expression might include characters that would cause syntax highlighting to fail in regular HTML, so quoting the value is permitted. The quotes do not affect how the value is parsed:
 
+<!-- prettier-ignore -->
 ```svelte
-<button disabled={number !== 42}>...</button>
+<button disabled="{number !== 42}">...</button>
 ```
 
 When the attribute name and value match (`name={name}`), they can be replaced with `{name}`.

documentation/docs/05-misc/03-typescript.md

@@ -140,6 +140,26 @@ declare namespace svelteHTML {
 
 Then make sure that `d.ts` file is referenced in your `tsconfig.json`. If it reads something like `"include": ["src/**/*"]` and your `d.ts` file is inside `src`, it should work. You may need to reload for the changes to take effect.
 
+Since Svelte version 4.2 / `svelte-check` version 3.5 / VS Code extension version 107.10.0 you can also declare the typings by augmenting the `svelte/elements` module like this:
+
+```ts
+/// file: additional-svelte-typings.d.ts
+import { HTMLButtonAttributes } from 'svelte/elements'
+
+declare module 'svelte/elements' {
+    export interface SvelteHTMLElements {
+        'custom-button': HTMLButtonAttributes;
+    }
+
+	// allows for more granular control over what element to add the typings to
+    export interface HTMLButtonAttributes {
+        'veryexperimentalattribute'?: string;
+    }
+}
+
+export {}; // ensure this is not an ambient module, else types will be overridden instead of augmented
+```
+
 ## Experimental advanced typings
 
 A few features are missing from taking full advantage of TypeScript in more advanced use cases like typing that a component implements a certain interface, explicitly typing slots, or using generics. These things are possible using experimental advanced type capabilities. See [this RFC](https://github.com/dummdidumm/rfcs/blob/ts-typedefs-within-svelte-components/text/ts-typing-props-slots-events.md) for more information on how to make use of them.

packages/playground/start.js

@@ -69,11 +69,12 @@ const watcher = watch([
 				async generateBundle(_, bundle) {
 					const result = bundle['entry-server.js'];
 					const mod = (0, eval)(result.code);
-					const { html } = mod.render();
+					const { html, head } = mod.render();
 
 					writeFileSync(
 						'dist/index.html',
 						readFileSync('src/template.html', 'utf-8')
+							.replace('<!--app-head-->', head)
 							.replace('<!--app-html-->', html)
 							.replace('<!--app-title-->', svelte.VERSION)
 					);

packages/svelte/CHANGELOG.md

@@ -1,5 +1,11 @@
 # svelte
 
+## 4.2.0
+
+### Minor Changes
+
+- feat: move `svelteHTML` from language-tools into core to load the correct `svelte/element` types ([#9070](https://github.com/sveltejs/svelte/pull/9070))
+
 ## 4.1.2
 
 ### Patch Changes

packages/svelte/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte",
-  "version": "4.1.2",
+  "version": "4.2.0",
   "description": "Cybernetically enhanced web apps",
   "type": "module",
   "module": "src/runtime/index.js",
@@ -19,6 +19,7 @@
     "motion.d.ts",
     "action.d.ts",
     "elements.d.ts",
+    "svelte-html.d.ts",
     "README.md"
   ],
   "exports": {
@@ -129,7 +130,7 @@
     "dts-buddy": "^0.1.7",
     "esbuild": "^0.18.11",
     "happy-dom": "^9.20.3",
-    "jsdom": "^22.0.0",
+    "jsdom": "22.0.0",
     "kleur": "^4.1.5",
     "rollup": "^3.26.2",
     "source-map": "^0.7.4",

packages/svelte/scripts/globals-extractor.js

@@ -16,7 +16,7 @@ const GLOBAL_TS_PATH = './src/compiler/utils/globals.js';
 const SPECIALS = ['global', 'globalThis', 'InternalError', 'process', 'undefined'];
 
 const get_url = (name) =>
-	`https://raw.githubusercontent.com/microsoft/TypeScript/main/lib/lib.${name}.d.ts`;
+	`https://raw.githubusercontent.com/microsoft/TypeScript/main/src/lib/${name}.d.ts`;
 const extract_name = (split) => split.match(/^[a-zA-Z0-9_$]+/)[0];
 
 const extract_functions_and_references = (name, data) => {

packages/svelte/src/compiler/utils/globals.js

@@ -1,6 +1,6 @@
 /** ----------------------------------------------------------------------
 This file is automatically generated by `scripts/globals-extractor.js`.
-Generated At: 2023-05-24T13:16:20.777Z
+Generated At: 2023-08-11T04:11:50.562Z
 ---------------------------------------------------------------------- */
 
 export default new Set([

packages/svelte/src/compiler/utils/mapped_code.js

@@ -292,7 +292,18 @@ export function apply_preprocessor_sourcemap(filename, svelte_map, preprocessor_
 		toUrl: {
 			enumerable: false,
 			value: function toUrl() {
-				return 'data:application/json;charset=utf-8;base64,' + btoa(this.toString());
+				let b64 = '';
+				if (typeof window !== 'undefined' && window.btoa) {
+					// btoa doesn't support multi-byte characters
+					b64 = window.btoa(unescape(encodeURIComponent(this.toString())));
+				} else if (typeof Buffer !== 'undefined') {
+					b64 = Buffer.from(this.toString(), 'utf8').toString('base64');
+				} else {
+					throw new Error(
+						'Unsupported environment: `window.btoa` or `Buffer` should be present to use toUrl.'
+					);
+				}
+				return 'data:application/json;charset=utf-8;base64,' + b64;
 			}
 		}
 	});