Lint and format src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.js

src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.js

@@ -5,7 +5,6 @@ import add_to_set from '../../../utils/add_to_set.js';
 
 /** @extends AttributeWrapper */
 export default class StyleAttributeWrapper extends AttributeWrapper {
-
 	/** @type {import('../../../nodes/Attribute.js').default} */
 	node;
 
@@ -15,8 +14,7 @@ export default class StyleAttributeWrapper extends AttributeWrapper {
 	/** @param {import('../../Block.js').default} block */
 	render(block) {
 		const style_props = optimize_style(this.node.chunks);
-        if (!style_props)
+		if (!style_props) return super.render(block);
-            return super.render(block);
 		style_props.forEach((prop) => {
 			let value;
 			if (is_dynamic(prop.value)) {
@@ -25,8 +23,7 @@ export default class StyleAttributeWrapper extends AttributeWrapper {
 					.map((chunk) => {
 						if (chunk.type === 'Text') {
 							return string_literal(chunk.data);
-                    }
+						} else {
-                    else {
 							add_to_set(prop_dependencies, chunk.dynamic_dependencies());
 							return chunk.manipulate(block);
 						}
@@ -47,11 +44,14 @@ export default class StyleAttributeWrapper extends AttributeWrapper {
 						}`;
 					block.chunks.update.push(update);
 				}
+			} else {
+				value = string_literal(
+					/** @type {import('../../../nodes/Text.js').default} */ (prop.value[0]).data
+				);
 			}
-            else {
+			block.chunks.hydrate.push(
-                value = string_literal(( /** @type {import('../../../nodes/Text.js').default} */(prop.value[0])).data);
+				b`@set_style(${this.parent.var}, "${prop.key}", ${value}, ${prop.important ? 1 : null});`
-            }
+			);
-            block.chunks.hydrate.push(b `@set_style(${this.parent.var}, "${prop.key}", ${value}, ${prop.important ? 1 : null});`);
 		});
 	}
 }
@@ -59,17 +59,14 @@ const regex_style_prop_key = /^\s*([\w-]+):\s*/;
 
 /** @param {Array<Text | import('../../../nodes/shared/Expression.js').default>} value */
 function optimize_style(value) {
-
 	/** @type {StyleProp[]} */
 	const props = [];
 	let chunks = value.slice();
 	while (chunks.length) {
 		const chunk = chunks[0];
-        if (chunk.type !== 'Text')
+		if (chunk.type !== 'Text') return null;
-            return null;
 		const key_match = regex_style_prop_key.exec(chunk.data);
-        if (!key_match)
+		if (!key_match) return null;
-            return null;
 		const key = key_match[1];
 		const offset = key_match.index + key_match[0].length;
 		const remaining_data = chunk.data.slice(offset);
@@ -80,8 +77,7 @@ function optimize_style(value) {
 				type: 'Text',
 				data: remaining_data
 			});
-        }
+		} else {
-        else {
 			chunks.shift();
 		}
 		const result = get_style_value(chunks);
@@ -95,7 +91,6 @@ const regex_semicolon_or_whitespace = /[;\s]/;
 
 /** @param {Array<Text | import('../../../nodes/shared/Expression.js').default>} chunks */
 function get_style_value(chunks) {
-
 	/** @type {Array<Text | import('../../../nodes/shared/Expression.js').default>} */
 	const value = [];
 	let in_url = false;
@@ -110,50 +105,46 @@ function get_style_value(chunks) {
 				const char = chunk.data[c];
 				if (escaped) {
 					escaped = false;
-                }
+				} else if (char === '\\') {
-                else if (char === '\\') {
 					escaped = true;
-                }
+				} else if (char === quote_mark) {
-                else if (char === quote_mark) {
 					quote_mark = null;
-                }
+				} else if (char === '"' || char === "'") {
-                else if (char === '"' || char === "'") {
 					quote_mark = char;
-                }
+				} else if (char === ')' && in_url) {
-                else if (char === ')' && in_url) {
 					in_url = false;
-                }
+				} else if (char === 'u' && chunk.data.slice(c, c + 4) === 'url(') {
-                else if (char === 'u' && chunk.data.slice(c, c + 4) === 'url(') {
 					in_url = true;
-                }
+				} else if (char === ';' && !in_url && !quote_mark) {
-                else if (char === ';' && !in_url && !quote_mark) {
 					closed = true;
 					break;
 				}
 				c += 1;
 			}
 			if (c > 0) {
-                value.push(/** @type {import('../../../nodes/Text.js').default} */ ({
+				value.push(
+					/** @type {import('../../../nodes/Text.js').default} */ ({
 						type: 'Text',
 						start: chunk.start,
 						end: chunk.start + c,
 						data: chunk.data.slice(0, c)
-                }));
+					})
+				);
 			}
-            while (regex_semicolon_or_whitespace.test(chunk.data[c]))
+			while (regex_semicolon_or_whitespace.test(chunk.data[c])) c += 1;
-                c += 1;
 			const remaining_data = chunk.data.slice(c);
 			if (remaining_data) {
-                chunks.unshift(/** @type {import('../../../nodes/Text.js').default} */ ({
+				chunks.unshift(
+					/** @type {import('../../../nodes/Text.js').default} */ ({
 						start: chunk.start + c,
 						end: chunk.end,
 						type: 'Text',
 						data: remaining_data
-                }));
+					})
+				);
 				break;
 			}
-        }
+		} else {
-        else {
 			value.push(chunk);
 		}
 	}
@@ -162,8 +153,7 @@ function get_style_value(chunks) {
 	if (last_chunk && last_chunk.type === 'Text' && regex_important_flag.test(last_chunk.data)) {
 		important = true;
 		last_chunk.data = last_chunk.data.replace(regex_important_flag, '');
-        if (!last_chunk.data)
+		if (!last_chunk.data) value.pop();
-            value.pop();
 	}
 	return {
 		chunks,
@@ -177,9 +167,6 @@ function is_dynamic(value) {
 	return value.length > 1 || value[0].type !== 'Text';
 }
 
-
-
-
 /** @typedef {Object} StyleProp
  * @property {string} key
  * @property {Array<Text|Expression>} value