Skip to content

Commit 683ac1b

Browse files
authored
Merge pull request #139 from ony3000/output-adjustment
The text leading the first line of the class name is included in the line wrapping
2 parents 9b35578 + c809f5a commit 683ac1b

256 files changed

Lines changed: 3700 additions & 3348 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

README.md

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -129,14 +129,13 @@ This is the criterion for ending the class name on each line when replacing the
129129
- `absolute` example:
130130

131131
```
132-
--------------------------------------------------| printWidth=50
132+
------------------------------------------------------------| printWidth=60
133133
export function Callout({ children }) {
134134
return (
135135
<div
136-
className="bg-gray-100/50 border
137-
border-zinc-400/30 dark:bg-neutral-900/50
138-
dark:border-neutral-500/30 px-4 py-4
139-
rounded-xl"
136+
className="bg-gray-100/50 dark:bg-neutral-900/50
137+
border border-zinc-400/30 dark:border-neutral-500/30
138+
rounded-xl px-4 py-4"
140139
>
141140
{children}
142141
</div>
@@ -147,15 +146,15 @@ This is the criterion for ending the class name on each line when replacing the
147146
- `relative` example:
148147

149148
```
150-
--------------------------------------------------| printWidth=50
149+
------------------------------------------------------------| printWidth=60
151150
export function Callout({ children }) {
152151
return (
153152
<div
154-
|--------------------------------------------------|
155-
className="bg-gray-100/50 border border-zinc-400/30
156-
|--------------------------------------------------|
157-
dark:bg-neutral-900/50 dark:border-neutral-500/30
158-
px-4 py-4 rounded-xl"
153+
|------------------------------------------------------------|
154+
className="bg-gray-100/50 dark:bg-neutral-900/50 border
155+
|------------------------------------------------------------|
156+
border-zinc-400/30 dark:border-neutral-500/30 rounded-xl
157+
px-4 py-4"
159158
>
160159
{children}
161160
</div>

src/core-parts/processor.ts

Lines changed: 12 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -359,13 +359,12 @@ function formatTokens(
359359
const props = token.props as Omit<AttributeNode, 'range' | 'type'> & {
360360
indentLevel: number;
361361
};
362-
const leadingText = isEndingPositionAbsolute
363-
? assembleTokens(formattedTokens.slice(0, tokenIndex))
364-
.split(EOL)
365-
.slice(-1)
366-
.join('')
367-
.replace(/\t/g, SPACE.repeat(options.tabWidth))
368-
: '';
362+
const rawLeadingText = assembleTokens(formattedTokens.slice(0, tokenIndex))
363+
.split(EOL)
364+
.slice(-1)
365+
.join('')
366+
.replace(/\t/g, SPACE.repeat(options.tabWidth));
367+
const leadingText = isEndingPositionAbsolute ? rawLeadingText : rawLeadingText.trimStart();
369368
const trailingDelimiter = isEndingPositionAbsolute
370369
? formattedTokens[tokenIndex + 1].body
371370
: '';
@@ -431,13 +430,12 @@ function formatTokens(
431430
const props = token.props as Omit<ExpressionNode, 'range' | 'type'> & {
432431
indentLevel: number;
433432
};
434-
const leadingText = isEndingPositionAbsolute
435-
? assembleTokens(formattedTokens.slice(0, tokenIndex))
436-
.split(EOL)
437-
.slice(-1)
438-
.join('')
439-
.replace(/\t/g, SPACE.repeat(options.tabWidth))
440-
: '';
433+
const rawLeadingText = assembleTokens(formattedTokens.slice(0, tokenIndex))
434+
.split(EOL)
435+
.slice(-1)
436+
.join('')
437+
.replace(/\t/g, SPACE.repeat(options.tabWidth));
438+
const leadingText = isEndingPositionAbsolute ? rawLeadingText : rawLeadingText.trimStart();
441439
const trailingDelimiter = isEndingPositionAbsolute
442440
? formattedTokens[tokenIndex + 1].body
443441
: '';

src/options.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,8 @@ export const options: SupportOptions = {
3636
},
3737
{
3838
value: 'relative',
39-
description: 'Each line ends at a `printWidth` distance from the start of the class name.',
39+
description:
40+
'Each line ends at a `printWidth` distance from the start of the non-whitespace text.',
4041
},
4142
],
4243
},

tests/angular/attribute-multiple/__snapshots__/relative.test.ts.snap

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,9 @@ exports[`'long enough (1) - single line with no…' > expectation 1`] = `
88
dir="ltr"
99
id="lorem-ipsum"
1010
title="lorem ipsum"
11-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
12-
ex massa hendrerit eu posuere eu volutpat id neque
13-
pellentesque"
11+
class="lorem ipsum dolor sit amet consectetur adipiscing
12+
elit proin ex massa hendrerit eu posuere eu volutpat id
13+
neque pellentesque"
1414
>
1515
<slot></slot>
1616
</div>
@@ -27,9 +27,9 @@ exports[`'long enough (2) - single line with sp…' > expectation 1`] = `
2727
dir="ltr"
2828
id="lorem-ipsum"
2929
title="lorem ipsum"
30-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
31-
ex massa hendrerit eu posuere eu volutpat id neque
32-
pellentesque"
30+
class="lorem ipsum dolor sit amet consectetur adipiscing
31+
elit proin ex massa hendrerit eu posuere eu volutpat id
32+
neque pellentesque"
3333
>
3434
<slot></slot>
3535
</div>
@@ -46,9 +46,9 @@ exports[`'long enough (3) - multiple lines' > expectation 1`] = `
4646
dir="ltr"
4747
id="lorem-ipsum"
4848
title="lorem ipsum"
49-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
50-
ex massa hendrerit eu posuere eu volutpat id neque
51-
pellentesque"
49+
class="lorem ipsum dolor sit amet consectetur adipiscing
50+
elit proin ex massa hendrerit eu posuere eu volutpat id
51+
neque pellentesque"
5252
>
5353
<slot></slot>
5454
</div>
@@ -65,7 +65,8 @@ exports[`'near boundary (1) - single line with …' > expectation 1`] = `
6565
dir="ltr"
6666
id="lorem-ipsum"
6767
title="lorem ipsum"
68-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin"
68+
class="lorem ipsum dolor sit amet consectetur adipiscing
69+
elit proin"
6970
>
7071
<slot></slot>
7172
</div>
@@ -82,7 +83,8 @@ exports[`'near boundary (2) - single line with …' > expectation 1`] = `
8283
dir="ltr"
8384
id="lorem-ipsum"
8485
title="lorem ipsum"
85-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin"
86+
class="lorem ipsum dolor sit amet consectetur adipiscing
87+
elit proin"
8688
>
8789
<slot></slot>
8890
</div>
@@ -99,7 +101,8 @@ exports[`'near boundary (3) - multiple lines' > expectation 1`] = `
99101
dir="ltr"
100102
id="lorem-ipsum"
101103
title="lorem ipsum"
102-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin"
104+
class="lorem ipsum dolor sit amet consectetur adipiscing
105+
elit proin"
103106
>
104107
<slot></slot>
105108
</div>
@@ -167,8 +170,8 @@ exports[`'syntax variants - component' > expectation 1`] = `
167170
dir="ltr"
168171
id="lorem-ipsum"
169172
title="lorem ipsum"
170-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
171-
ex massa hendrerit eu posuere"
173+
class="lorem ipsum dolor sit amet consectetur adipiscing
174+
elit proin ex massa hendrerit eu posuere"
172175
>
173176
<slot></slot>
174177
</Box>

tests/angular/attribute-single/__snapshots__/relative.test.ts.snap

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ exports[`'long enough (1) - single line with no…' > expectation 1`] = `
55
<template>
66
<div>
77
<div
8-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
9-
ex massa hendrerit eu posuere eu volutpat id neque
10-
pellentesque"
8+
class="lorem ipsum dolor sit amet consectetur adipiscing
9+
elit proin ex massa hendrerit eu posuere eu volutpat id
10+
neque pellentesque"
1111
>
1212
<slot></slot>
1313
</div>
@@ -21,9 +21,9 @@ exports[`'long enough (2) - single line with sp…' > expectation 1`] = `
2121
<template>
2222
<div>
2323
<div
24-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
25-
ex massa hendrerit eu posuere eu volutpat id neque
26-
pellentesque"
24+
class="lorem ipsum dolor sit amet consectetur adipiscing
25+
elit proin ex massa hendrerit eu posuere eu volutpat id
26+
neque pellentesque"
2727
>
2828
<slot></slot>
2929
</div>
@@ -37,9 +37,9 @@ exports[`'long enough (3) - multiple lines' > expectation 1`] = `
3737
<template>
3838
<div>
3939
<div
40-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
41-
ex massa hendrerit eu posuere eu volutpat id neque
42-
pellentesque"
40+
class="lorem ipsum dolor sit amet consectetur adipiscing
41+
elit proin ex massa hendrerit eu posuere eu volutpat id
42+
neque pellentesque"
4343
>
4444
<slot></slot>
4545
</div>
@@ -53,7 +53,8 @@ exports[`'near boundary (1) - single line with …' > expectation 1`] = `
5353
<template>
5454
<div>
5555
<div
56-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin"
56+
class="lorem ipsum dolor sit amet consectetur adipiscing
57+
elit proin"
5758
>
5859
<slot></slot>
5960
</div>
@@ -67,7 +68,8 @@ exports[`'near boundary (2) - single line with …' > expectation 1`] = `
6768
<template>
6869
<div>
6970
<div
70-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin"
71+
class="lorem ipsum dolor sit amet consectetur adipiscing
72+
elit proin"
7173
>
7274
<slot></slot>
7375
</div>
@@ -81,7 +83,8 @@ exports[`'near boundary (3) - multiple lines' > expectation 1`] = `
8183
<template>
8284
<div>
8385
<div
84-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin"
86+
class="lorem ipsum dolor sit amet consectetur adipiscing
87+
elit proin"
8588
>
8689
<slot></slot>
8790
</div>
@@ -131,8 +134,8 @@ exports[`'syntax variants - component' > expectation 1`] = `
131134
<template>
132135
<div>
133136
<Box
134-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
135-
ex massa hendrerit eu posuere"
137+
class="lorem ipsum dolor sit amet consectetur adipiscing
138+
elit proin ex massa hendrerit eu posuere"
136139
>
137140
<slot></slot>
138141
</Box>

tests/angular/classnames-print-width/__snapshots__/relative.test.ts.snap

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ exports[`'(1) If no value is provided, the \`pri…' > expectation 1`] = `
55
<template>
66
<div>
77
<div
8-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin ex massa hendrerit
9-
eu posuere eu volutpat id neque pellentesque"
8+
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin ex massa
9+
hendrerit eu posuere eu volutpat id neque pellentesque"
1010
>
1111
<slot></slot>
1212
</div>
@@ -21,9 +21,9 @@ exports[`'(2) \`classnamesPrintWidth\` is shorter…' > expectation 1`] = `
2121
<template>
2222
<div>
2323
<div
24-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin
25-
ex massa hendrerit eu posuere eu volutpat id neque
26-
pellentesque"
24+
class="lorem ipsum dolor sit amet consectetur adipiscing
25+
elit proin ex massa hendrerit eu posuere eu volutpat id
26+
neque pellentesque"
2727
>
2828
<slot></slot>
2929
</div>
@@ -38,8 +38,8 @@ exports[`'(3) \`classnamesPrintWidth\` is longer …' > expectation 1`] = `
3838
<template>
3939
<div>
4040
<div
41-
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin ex massa hendrerit
42-
eu posuere eu volutpat id neque pellentesque"
41+
class="lorem ipsum dolor sit amet consectetur adipiscing elit proin ex massa
42+
hendrerit eu posuere eu volutpat id neque pellentesque"
4343
>
4444
<slot></slot>
4545
</div>

tests/angular/complex-ternary/__snapshots__/relative.test.ts.snap

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,10 @@ exports[`'(1) nested ternary' > expectation 1`] = `
99
condition
1010
? 'lorem ipsum dolor sit amet'
1111
: condition
12-
? 'lorem ipsum dolor sit amet consectetur adipiscing elit proin'
13-
: 'lorem ipsum dolor sit amet consectetur adipiscing elit proin
14-
ex massa hendrerit eu posuere'
12+
? 'lorem ipsum dolor sit amet consectetur adipiscing elit
13+
proin'
14+
: 'lorem ipsum dolor sit amet consectetur adipiscing elit
15+
proin ex massa hendrerit eu posuere'
1516
"
1617
>
1718
<slot></slot>
@@ -30,11 +31,13 @@ exports[`'(2) double nested ternary' > expectation 1`] = `
3031
condition
3132
? 'lorem ipsum dolor sit amet'
3233
: condition
33-
? 'lorem ipsum dolor sit amet consectetur adipiscing elit proin'
34+
? 'lorem ipsum dolor sit amet consectetur adipiscing elit
35+
proin'
3436
: condition
35-
? 'lorem ipsum dolor sit amet consectetur adipiscing elit proin'
36-
: 'lorem ipsum dolor sit amet consectetur adipiscing elit proin
37-
ex massa hendrerit eu posuere'
37+
? 'lorem ipsum dolor sit amet consectetur adipiscing elit
38+
proin'
39+
: 'lorem ipsum dolor sit amet consectetur adipiscing elit
40+
proin ex massa hendrerit eu posuere'
3841
"
3942
>
4043
<slot></slot>

tests/angular/default-supported/__snapshots__/relative.test.ts.snap

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ exports[`'supported attributes and supported fu…' > expectation 1`] = `
88
<div
99
[class]="
1010
classNames(
11-
'lorem ipsum dolor sit amet consectetur adipiscing elit proin
12-
ex massa hendrerit eu posuere'
11+
'lorem ipsum dolor sit amet consectetur adipiscing elit
12+
proin ex massa hendrerit eu posuere'
1313
)
1414
"
1515
>
@@ -18,8 +18,8 @@ exports[`'supported attributes and supported fu…' > expectation 1`] = `
1818
<div
1919
[className]="
2020
classNames(
21-
'lorem ipsum dolor sit amet consectetur adipiscing elit proin
22-
ex massa hendrerit eu posuere'
21+
'lorem ipsum dolor sit amet consectetur adipiscing elit
22+
proin ex massa hendrerit eu posuere'
2323
)
2424
"
2525
>
@@ -39,8 +39,8 @@ exports[`'supported attributes and unsupported …' > expectation 1`] = `
3939
<div
4040
[class]="
4141
foo(
42-
'lorem ipsum dolor sit amet consectetur adipiscing elit proin
43-
ex massa hendrerit eu posuere'
42+
'lorem ipsum dolor sit amet consectetur adipiscing elit
43+
proin ex massa hendrerit eu posuere'
4444
)
4545
"
4646
>
@@ -49,8 +49,8 @@ exports[`'supported attributes and unsupported …' > expectation 1`] = `
4949
<div
5050
[className]="
5151
foo(
52-
'lorem ipsum dolor sit amet consectetur adipiscing elit proin
53-
ex massa hendrerit eu posuere'
52+
'lorem ipsum dolor sit amet consectetur adipiscing elit
53+
proin ex massa hendrerit eu posuere'
5454
)
5555
"
5656
>
@@ -70,8 +70,8 @@ exports[`'unsupported attributes and supported …' > expectation 1`] = `
7070
<div
7171
[title]="
7272
classNames(
73-
'lorem ipsum dolor sit amet consectetur adipiscing elit proin
74-
ex massa hendrerit eu posuere'
73+
'lorem ipsum dolor sit amet consectetur adipiscing elit
74+
proin ex massa hendrerit eu posuere'
7575
)
7676
"
7777
>

tests/angular/delimiter-conversion/__snapshots__/relative.test.ts.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ exports[`'contains backtick - delimiter is sing…' > expectation 1`] = `
55
<template>
66
<div>
77
<div
8-
[class]="'lorem ipsum do\`or sit amet consectetur adipiscing elit proin
9-
ex massa hendrerit eu posuere'"
8+
[class]="'lorem ipsum do\`or sit amet consectetur adipiscing
9+
elit proin ex massa hendrerit eu posuere'"
1010
>
1111
<slot></slot>
1212
</div>

0 commit comments

Comments
 (0)