@@ -82,6 +82,55 @@ export const wrapText = (
82
82
return wrappedText ;
83
83
} ;
84
84
85
+ const printProperty = (
86
+ property : HtmlTagProperty ,
87
+ maxLineLength : number ,
88
+ lineBreak : string ,
89
+ ) => {
90
+ const singleLineProperty = `${ property . name } =${ property . value } ` ;
91
+ if ( property . name === 'style' && singleLineProperty . length > maxLineLength ) {
92
+ // This uses a negative lookbehing to ensure that the semicolon is not
93
+ // part of an HTML entity (e.g., `&`, `"`, ` `, etc.).
94
+ const nonHtmlEntitySemicolonRegex = / (?< ! & [ ^ ; ] + ) ; / ;
95
+ const styles = property . value
96
+ . slice ( 1 , - 1 )
97
+ . split ( nonHtmlEntitySemicolonRegex ) ;
98
+ const wrappedStyles = styles
99
+ . map ( ( style ) => ` ${ style } ` )
100
+ . join ( `;${ lineBreak } ` ) ;
101
+
102
+ let multiLineProperty = `${ property . name } ="${ lineBreak } ` ;
103
+ multiLineProperty += `${ wrappedStyles } ${ lineBreak } ` ;
104
+ multiLineProperty += ` "` ;
105
+
106
+ return multiLineProperty ;
107
+ }
108
+ return singleLineProperty ;
109
+ } ;
110
+
111
+ const printTagStart = (
112
+ node : HtmlTag ,
113
+ maxLineLength : number ,
114
+ lineBreak : string ,
115
+ ) => {
116
+ const singleLineProperties = node . properties
117
+ . map ( ( property ) => ` ${ property . name } =${ property . value } ` )
118
+ . join ( '' ) ;
119
+ const singleLineTagStart = `<${ node . name } ${ singleLineProperties } ${ node . void ? '/' : '' } >` ;
120
+
121
+ if ( singleLineTagStart . length <= maxLineLength ) {
122
+ return singleLineTagStart ;
123
+ }
124
+
125
+ let multilineTagStart = `<${ node . name } ${ lineBreak } ` ;
126
+ for ( const property of node . properties ) {
127
+ const printedProperty = printProperty ( property , maxLineLength , lineBreak ) ;
128
+ multilineTagStart += ` ${ printedProperty } ${ lineBreak } ` ;
129
+ }
130
+ multilineTagStart += `${ node . void ? '/' : '' } >` ;
131
+ return multilineTagStart ;
132
+ } ;
133
+
85
134
const prettyNodes = (
86
135
nodes : HtmlNode [ ] ,
87
136
options : Options ,
@@ -91,50 +140,6 @@ const prettyNodes = (
91
140
const { preserveLinebreaks = false , maxLineLength = 80 , lineBreak } = options ;
92
141
const indentation = ' ' . repeat ( currentIndentationSize ) ;
93
142
94
- const printProperty = ( property : HtmlTagProperty ) => {
95
- const singleLineProperty = `${ property . name } =${ property . value } ` ;
96
- if (
97
- property . name === 'style' &&
98
- singleLineProperty . length > maxLineLength
99
- ) {
100
- // This uses a negative lookbehing to ensure that the semicolon is not
101
- // part of an HTML entity (e.g., `&`, `"`, ` `, etc.).
102
- const nonHtmlEntitySemicolonRegex = / (?< ! & [ ^ ; ] + ) ; / ;
103
- const styles = property . value
104
- . slice ( 1 , - 1 )
105
- . split ( nonHtmlEntitySemicolonRegex ) ;
106
- const wrappedStyles = styles
107
- . map ( ( style ) => ` ${ style } ` )
108
- . join ( `;${ lineBreak } ` ) ;
109
-
110
- let multiLineProperty = `${ property . name } ="${ lineBreak } ` ;
111
- multiLineProperty += `${ wrappedStyles } ${ lineBreak } ` ;
112
- multiLineProperty += ` "` ;
113
-
114
- return multiLineProperty ;
115
- }
116
- return singleLineProperty ;
117
- } ;
118
-
119
- const printTagStart = ( node : HtmlTag ) => {
120
- const singleLineProperties = node . properties
121
- . map ( ( property ) => ` ${ property . name } =${ property . value } ` )
122
- . join ( '' ) ;
123
- const singleLineTagStart = `<${ node . name } ${ singleLineProperties } ${ node . void ? '/' : '' } >` ;
124
-
125
- if ( singleLineTagStart . length <= maxLineLength ) {
126
- return singleLineTagStart ;
127
- }
128
-
129
- let multilineTagStart = `<${ node . name } ${ lineBreak } ` ;
130
- for ( const property of node . properties ) {
131
- const printedProperty = printProperty ( property ) ;
132
- multilineTagStart += ` ${ printedProperty } ${ lineBreak } ` ;
133
- }
134
- multilineTagStart += `${ node . void ? '/' : '' } >` ;
135
- return multilineTagStart ;
136
- } ;
137
-
138
143
let formatted = '' ;
139
144
for ( const node of nodes ) {
140
145
if ( node . type === 'text' ) {
@@ -152,7 +157,7 @@ const prettyNodes = (
152
157
formatted += lineBreak ;
153
158
} else if ( node . type === 'tag' ) {
154
159
formatted += `${ indentation } ` ;
155
- formatted += printTagStart ( node ) . replaceAll (
160
+ formatted += printTagStart ( node , maxLineLength , lineBreak ) . replaceAll (
156
161
lineBreak ,
157
162
`${ lineBreak } ${ indentation } ` ,
158
163
) ;
0 commit comments