diff --git a/src/compiler/compile/render_ssr/Renderer.ts b/src/compiler/compile/render_ssr/Renderer.ts index b0c1226564..096257d22e 100644 --- a/src/compiler/compile/render_ssr/Renderer.ts +++ b/src/compiler/compile/render_ssr/Renderer.ts @@ -46,7 +46,7 @@ export default class Renderer { has_bindings = false; stack: { current: { value: string }, literal: TemplateLiteral }[] = []; - current: { value: string }; + current: { value: string }; // TODO can it just be `current: string`? literal: TemplateLiteral; targets: AppendTarget[] = []; diff --git a/src/compiler/compile/render_ssr/handlers/Element.ts b/src/compiler/compile/render_ssr/handlers/Element.ts index f8f281de0a..2716e924b1 100644 --- a/src/compiler/compile/render_ssr/handlers/Element.ts +++ b/src/compiler/compile/render_ssr/handlers/Element.ts @@ -81,11 +81,13 @@ export default function(node: Element, renderer: Renderer, options: RenderOption // options.slot_scopes.set(slot_name, get_slot_scope(node.lets)); // } - const class_expression = node.classes.map((class_directive: Class) => { - const { expression, name } = class_directive; - const snippet = expression ? snip(expression) : `#ctx${quote_prop_if_necessary(name)}`; - return `${snippet} ? "${name}" : ""`; - }).join(', '); + const class_expression = node.classes.length > 0 && node.classes + .map((class_directive: Class) => { + const { expression, name } = class_directive; + const snippet = expression ? expression.node : x`#ctx.${name}`; + return x`${snippet} ? "${name}" : ""`; + }) + .reduce((lhs, rhs) => x`${lhs} + ${rhs}`); let add_class_attribute = class_expression ? true : false; @@ -171,9 +173,9 @@ export default function(node: Element, renderer: Renderer, options: RenderOption } }); - // if (add_class_attribute) { - // opening_tag += `\${@add_classes([${class_expression}].join(' ').trim())}`; - // } + if (add_class_attribute) { + renderer.add_expression(x`@add_classes([${class_expression}].join(' ').trim())`); + } renderer.add_string('>'); diff --git a/src/compiler/compile/render_ssr/index.ts b/src/compiler/compile/render_ssr/index.ts index f979df1b7b..a22e7fee0d 100644 --- a/src/compiler/compile/render_ssr/index.ts +++ b/src/compiler/compile/render_ssr/index.ts @@ -70,7 +70,7 @@ export default function ssr( : []; const reactive_declarations = component.reactive_declarations.map(d => { - let snippet = b`${d.node}`; + let statement = b`${d.node.body}`; if (d.declaration) { const declared = extract_names(d.declaration); @@ -88,16 +88,16 @@ export default function ssr( declared.length > injected.length ); - snippet = separate + statement = separate ? b` ${injected.map(name => b`let ${name};`)} - ${snippet}` + ${statement}` : b` - let ${snippet}`; + let ${d.node.body.expression.left} = ${d.node.body.expression.right}`; } } - return snippet; + return statement; }); const main = renderer.has_bindings diff --git a/src/compiler/compile/utils/get_slot_data.ts b/src/compiler/compile/utils/get_slot_data.ts index cb42cece7e..18df4e3118 100644 --- a/src/compiler/compile/utils/get_slot_data.ts +++ b/src/compiler/compile/utils/get_slot_data.ts @@ -8,25 +8,13 @@ export default function get_slot_data(values: Map, is_ssr: bo properties: Array.from(values.values()) .filter(attribute => attribute.name !== 'name') .map(attribute => { - if (is_ssr) { - throw new Error(`TODO SSR`); - } - const value = get_value(attribute); - - // const value = attribute.is_true - // ? x`true` - // : attribute.chunks.length === 0 - // ? x`""` - // : attribute.chunks.length === 1 && attribute.chunks[0].type !== 'Text' - // ? snip(attribute.chunks[0]) - // : '`' + stringify_attribute(attribute, is_ssr) + '`'; - return p`${attribute.name}: ${value}`; }) } } +// TODO fairly sure this is duplicated at least once function get_value(attribute: Attribute) { if (attribute.is_true) return x`true`; if (attribute.chunks.length === 0) return x`""`;