msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

Merge 5a6a1e3c22 into 435da13fdd

Browse Source
pull/17319/merge
Manuel 1 week ago committed by GitHub
parent 435da13fdd 5a6a1e3c22
commit e621fe9800
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 69 additions and 63 deletions
Show Stats Download Patch File Download Diff File

5
.changeset/rich-zoos-walk.md
Unescape View File

@ -0,0 +1,5 @@
---
'svelte': patch
---
fix: multiline html blocks now properlery seperated from other multiline blocks while `print()`-ing an AST

2
packages/svelte/package.json
Unescape View File

@ -176,7 +176,7 @@
"clsx": "^2.1.1",
"devalue": "^5.5.0",
"esm-env": "^1.2.1",
"esrap": "^2.2.1",
"esrap": "https://pkg.pr.new/sveltejs/esrap@101",
"is-reference": "^3.0.3",
"locate-character": "^3.0.0",
"magic-string": "^0.30.11",

64
packages/svelte/src/compiler/print/index.js
Unescape View File

@ -115,57 +115,17 @@ function base_element(node, context) {
const is_doctype_node = node.name.toLowerCase() === '!doctype';
const is_self_closing =
is_void(node.name) || (node.type === 'Component' && node.fragment.nodes.length === 0);
let multiline_content = false;
if (is_doctype_node) child_context.write(`>`);
else if (is_self_closing) {
child_context.write(`${multiline_attributes ? '' : ' '}/>`);
} else {
child_context.write('>');
// Process the element's content in a separate context for measurement
const content_context = child_context.new();
const allow_inline_content = child_context.measure() < LINE_BREAK_THRESHOLD;
block(content_context, node.fragment, allow_inline_content);
// Determine if content should be formatted on multiple lines
multiline_content = content_context.measure() > LINE_BREAK_THRESHOLD;
if (multiline_content) {
child_context.newline();
// Only indent if attributes are inline and content itself isn't already multiline
const should_indent = !multiline_attributes && !content_context.multiline;
if (should_indent) {
child_context.indent();
}
child_context.append(content_context);
if (should_indent) {
child_context.dedent();
}
child_context.newline();
} else {
child_context.append(content_context);
}
block(child_context, node.fragment, true);
child_context.write(`</${node.name}>`);
}
const break_line_after = child_context.measure() > LINE_BREAK_THRESHOLD;
if ((multiline_content || multiline_attributes) && !context.empty()) {
context.newline();
}
context.append(child_context);
if (is_self_closing) return;
if (multiline_content || multiline_attributes || break_line_after) {
context.newline();
}
}
/** @type {Visitors<AST.SvelteNode>} */
@ -412,6 +372,8 @@ const svelte_visitors = {
}
} else {
sequence.push(child_node);
if (child_node.type === 'RegularElement') flush();
}
}
@ -420,18 +382,20 @@ const svelte_visitors = {
let multiline = false;
let width = 0;
const child_contexts = items.map((sequence) => {
const child_context = context.new();
const child_contexts = items
.filter((x) => x.length > 0)
.map((sequence) => {
const child_context = context.new();
for (const node of sequence) {
child_context.visit(node);
multiline ||= child_context.multiline;
}
for (const node of sequence) {
child_context.visit(node);
multiline ||= child_context.multiline;
}
width += child_context.measure();
width += child_context.measure();
return child_context;
});
return child_context;
});
multiline ||= width > LINE_BREAK_THRESHOLD;

9
packages/svelte/tests/print/samples/formatting/input.svelte
Unescape View File

@ -1 +1,8 @@
<script>import { setLocale } from '$lib/paraglide/runtime';import { m } from '$lib/paraglide/messages.js';</script><h1>{m.hello_world({ name: 'SvelteKit User' })}</h1><div><button onclick={() => setLocale('en')}>en</button><button onclick={() => setLocale('es')}>es</button></div><p>If you use VSCode, install the <a href="https://marketplace.visualstudio.com/items?itemName=inlang.vs-code-extension" target="_blank">Sherlock i18n extension</a>for a better i18n experience.</p>
<script>import { setLocale } from '$lib/paraglide/runtime';import { m } from '$lib/paraglide/messages.js';</script>
<h1>{m.hello_world({ name: 'SvelteKit User' })}</h1><div><button onclick={() => setLocale('en')}>en</button><button onclick={() => setLocale('es')}>es</button></div><p>If you use VSCode, install the <a href="https://marketplace.visualstudio.com/items?itemName=inlang.vs-code-extension" target="_blank">Sherlock i18n extension</a>for a better i18n experience.</p>
<Component><div><button>Hello, this is a test</button><button>Hello, this is a test</button></div></Component>
<Component><button>Hello, this is a test</button><button>Hello, this is a test</button></Component>
<button class="foo bar" aria-label="click" onclick={() => console.log("clicked")}>Click me!</button>
<button class="foo bar" aria-label="click" onclick={() => console.log("clicked")}><span>some fancy looking</span><span>really long button text</span></button>

34
packages/svelte/tests/print/samples/formatting/output.svelte
Unescape View File

@ -4,18 +4,46 @@
</script>
<h1>{m.hello_world({ name: 'SvelteKit User' })}</h1>
<div>
<button onclick={() => setLocale('en')}>en</button>
<button onclick={() => setLocale('es')}>es</button>
</div>
<p>
If you use VSCode, install the
<a
href="https://marketplace.visualstudio.com/items?itemName=inlang.vs-code-extension"
target="_blank"
>
Sherlock i18n extension
</a>
>Sherlock i18n extension</a>
for a better i18n experience.
</p>
<Component>
<div>
<button>Hello, this is a test</button>
<button>Hello, this is a test</button>
</div>
</Component>
<Component>
<button>Hello, this is a test</button>
<button>Hello, this is a test</button>
</Component>
<button
class="foo bar"
aria-label="click"
onclick={() => console.log("clicked")}
>Click me!</button>
<button
class="foo bar"
aria-label="click"
onclick={() => console.log("clicked")}
>
<span>some fancy looking</span>
<span>really long button text</span>
</button>

5
packages/svelte/tests/print/samples/style-directive/output.svelte
Unescape View File

@ -1,8 +1,7 @@
<div style:color="red">...</div>
<div
style:color
style:width="12rem"
style:background-color={darkMode ? 'black' : 'white'}
>
...
</div>
>...</div>

1
packages/svelte/tests/print/samples/svelte-fragment/output.svelte
Unescape View File

@ -4,6 +4,7 @@
<Widget>
<h1 slot="header">Hello</h1>
<svelte:fragment slot="footer">
<p>All rights reserved.</p>
<p>Copyright (c) 2019 Svelte Industries</p>

1
packages/svelte/tests/print/samples/svelte-head/output.svelte
Unescape View File

@ -1,5 +1,6 @@
<svelte:head>
<title>Hello world!</title>
<meta
name="description"
content="This is where the description goes for SEO"

11
pnpm-lock.yaml
Unescape View File

@ -96,8 +96,8 @@ importers:
specifier: ^1.2.1
version: 1.2.1
esrap:
specifier: ^2.2.1
version: 2.2.1
specifier: https://pkg.pr.new/sveltejs/esrap@101
version: https://pkg.pr.new/sveltejs/esrap@101
is-reference:
specifier: ^3.0.3
version: 3.0.3
@ -1356,8 +1356,9 @@ packages:
resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==}
engines: {node: '>=0.10'}
esrap@2.2.1:
resolution: {integrity: sha512-GiYWG34AN/4CUyaWAgunGt0Rxvr1PTMlGC0vvEov/uOQYWne2bpN03Um+k8jT+q3op33mKouP2zeJ6OlM+qeUg==}
esrap@https://pkg.pr.new/sveltejs/esrap@101:
resolution: {tarball: https://pkg.pr.new/sveltejs/esrap@101}
version: 2.2.1
esrecurse@4.3.0:
resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
@ -3720,7 +3721,7 @@ snapshots:
dependencies:
estraverse: 5.3.0
esrap@2.2.1:
esrap@https://pkg.pr.new/sveltejs/esrap@101:
dependencies:
'@jridgewell/sourcemap-codec': 1.5.0

Write Preview
Loading…
Cancel
Save