dprint-plugin-typescript icon indicating copy to clipboard operation
dprint-plugin-typescript copied to clipboard

`jsxAttributes.preferHanging` and large `lineWidth` ignores explicit line breaks in between JSX attributes

Open JesseVelden opened this issue 3 years ago • 1 comments

When using "jsxAttributes.preferHanging": true with "lineWidth": 999 (or any line width maximum which is larger than the actual line width), JSX attributes will be put all (or as many as possible) on the same line, even when the input explicitly has a new line break in between attributes.

dprint-plugin-typescript version: 0.75.0

Input Code

const test = <div>
<Input type='text' className={textClass} style={{ width, maxWidth }} 
    defaultValue={defaultValue} placeholder={placeholder} {...props} />
</div>

Expected Output

const test = (
  <div>
    <Input type="text" className={textClass} style={{ width, maxWidth }}
      defaultValue={defaultValue} placeholder={placeholder} {...props} />
  </div>
);

Actual Output

const test = (
  <div>
    <Input type="text" className={textClass} style={{ width, maxWidth }} defaultValue={defaultValue} placeholder={placeholder} {...props} />
  </div>
);

Configuration

{
    "lineWidth": 999,
    "jsxAttributes.preferHanging": true
}

See also this dprint playground with a lineWidth of 999 and this dprint playground with a lineWidth of 130 where as many attributes as possible within the maximum line width will be put on the same line

JesseVelden avatar Oct 19 '22 11:10 JesseVelden

I would also like not to have jsxAttributes.preferSingleLine, but something like jsxAttributes.itemsPerLine with selection of:

"single" - one attribute per line "optimal" - place 3-4 attributes per line (maybe it could be determined by length of longest attribute length * 1.5) "preserve" - stay as it is "all" - wrap all attributes in one line

MrFoxPro avatar Jul 22 '23 13:07 MrFoxPro