Skip to content
Merged
19 changes: 19 additions & 0 deletions packages/adders/common.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import {
type AstKinds,
type AstTypes
} from '@svelte-cli/core/js';
import * as html from '@svelte-cli/core/html';
import { Walker, type Question, type FileEditor } from '@svelte-cli/core';
import { parseScript } from '@svelte-cli/core/parsers';

Expand Down Expand Up @@ -370,3 +371,21 @@ function isFunctionDeclaration(
): node is AstTypes.FunctionDeclaration {
return node.type === 'FunctionDeclaration' && node.id?.name === funcName;
}

export function addSlot(
jsAst: AstTypes.Program,
htmlAst: html.HtmlDocument,
svelteVersion: string
) {
const slotSyntax =
svelteVersion && (svelteVersion.startsWith('4') || svelteVersion.startsWith('3'));

if (slotSyntax) {
const slot = html.element('slot');
html.appendElement(htmlAst.childNodes, slot);
return;
}

common.addFromString(jsAst, 'let { children } = $props();');
html.addFromRawHtml(htmlAst.childNodes, '{@render children()}');
}
14 changes: 11 additions & 3 deletions packages/adders/tailwindcss/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { defineAdder, defineAdderOptions } from '@svelte-cli/core';
import { addImports } from '@svelte-cli/core/css';
import { array, common, exports, functions, imports, object } from '@svelte-cli/core/js';
import { parseCss, parseScript, parseJson, parseSvelte } from '@svelte-cli/core/parsers';
import { addSlot } from '../common.ts';

export const options = defineAdderOptions({
plugins: {
Expand Down Expand Up @@ -121,12 +122,19 @@ export default defineAdder({
},
{
name: ({ kit }) => `${kit?.routesDirectory}/+layout.svelte`,
content: ({ content, typescript }) => {
const { script, generateCode } = parseSvelte(content, { typescript });
content: ({ content, typescript, dependencyVersion }) => {
const { script, template, generateCode } = parseSvelte(content, { typescript });
imports.addEmpty(script.ast, '../app.css');

if (content.length === 0) {
const svelteVersion = dependencyVersion('svelte');
if (!svelteVersion) throw new Error('Failed to determine svelte version');
addSlot(script.ast, template.ast, svelteVersion);
}

return generateCode({
script: script.generateCode(),
template: content.length === 0 ? '<slot />' : undefined
template: content.length === 0 ? template.generateCode() : undefined
});
},
condition: ({ kit }) => Boolean(kit)
Expand Down
3 changes: 3 additions & 0 deletions packages/core/tooling/html/index.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import {
type HtmlChildNode,
type HtmlDocument,
HtmlElement,
HtmlElementType,
parseHtml
} from '@svelte-cli/ast-tooling';

export type { HtmlDocument };

export function div(attributes: Record<string, string> = {}): HtmlElement {
return element('div', attributes);
}
Expand Down