Skip to content

Commit 615e633

Browse files
committed
move the printing functions up
1 parent dd7bde3 commit 615e633

File tree

1 file changed

+50
-45
lines changed

1 file changed

+50
-45
lines changed

packages/render/src/shared/utils/pretty.ts

Lines changed: 50 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -82,6 +82,55 @@ export const wrapText = (
8282
return wrappedText;
8383
};
8484

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+
85134
const prettyNodes = (
86135
nodes: HtmlNode[],
87136
options: Options,
@@ -91,50 +140,6 @@ const prettyNodes = (
91140
const { preserveLinebreaks = false, maxLineLength = 80, lineBreak } = options;
92141
const indentation = ' '.repeat(currentIndentationSize);
93142

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., `&amp;`, `&quot;`, `&nbsp;`, 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-
138143
let formatted = '';
139144
for (const node of nodes) {
140145
if (node.type === 'text') {
@@ -152,7 +157,7 @@ const prettyNodes = (
152157
formatted += lineBreak;
153158
} else if (node.type === 'tag') {
154159
formatted += `${indentation}`;
155-
formatted += printTagStart(node).replaceAll(
160+
formatted += printTagStart(node, maxLineLength, lineBreak).replaceAll(
156161
lineBreak,
157162
`${lineBreak}${indentation}`,
158163
);

0 commit comments

Comments
 (0)