diff --git a/apps/svelte.dev/src/routes/(authed)/playground/[id]/+page.svelte b/apps/svelte.dev/src/routes/(authed)/playground/[id]/+page.svelte index 7976235f1b..00579ed7a0 100644 --- a/apps/svelte.dev/src/routes/(authed)/playground/[id]/+page.svelte +++ b/apps/svelte.dev/src/routes/(authed)/playground/[id]/+page.svelte @@ -72,7 +72,8 @@ if (!hash && !saved) { repl?.set({ // TODO make this munging unnecessary (using JSON instead of structuredClone for better browser compat) - files: JSON.parse(JSON.stringify(data.gist.components)).map(munge) + files: JSON.parse(JSON.stringify(data.gist.components)).map(munge), + tailwind: false // TODO }); modified = false; @@ -92,7 +93,7 @@ name = recovered.name; } - repl.set({ files }); + repl.set({ files, tailwind: recovered.tailwind ?? false }); } catch { alert(`Couldn't load the code from the URL. Make sure you copied the link correctly.`); } @@ -155,7 +156,8 @@ async function update_hash() { // Only change hash when necessary to avoid polluting everyone's browser history if (modified) { - const json = JSON.stringify({ name, files: repl.toJSON().files }); + const { files, tailwind } = repl.toJSON(); + const json = JSON.stringify({ name, files, tailwind }); await set_hash(json); } } @@ -210,7 +212,8 @@ if (modified) { // we can't save to the hash because it's an async operation, so we use // a short-lived sessionStorage value instead - const json = JSON.stringify({ name, files: repl.toJSON().files }); + const { files, tailwind } = repl.toJSON(); + const json = JSON.stringify({ name, files, tailwind }); sessionStorage.setItem(STORAGE_KEY, json); } }} diff --git a/apps/svelte.dev/src/routes/(authed)/playground/[id]/embed/+page.svelte b/apps/svelte.dev/src/routes/(authed)/playground/[id]/embed/+page.svelte index 6db54545e2..ab843d9ad3 100644 --- a/apps/svelte.dev/src/routes/(authed)/playground/[id]/embed/+page.svelte +++ b/apps/svelte.dev/src/routes/(authed)/playground/[id]/embed/+page.svelte @@ -45,7 +45,8 @@ if (!hash) { repl?.set({ - files: data.gist.components.map(munge) + files: data.gist.components.map(munge), + tailwind: false // TODO }); return; @@ -53,7 +54,7 @@ try { const recovered = JSON.parse(await decode_and_decompress_text(hash)); - repl.set({ files: recovered.files }); + repl.set({ files: recovered.files, tailwind: recovered.tailwind ?? false }); } catch { alert(`Couldn't load the code from the URL. Make sure you copied the link correctly.`); } diff --git a/packages/editor/src/lib/Workspace.svelte.ts b/packages/editor/src/lib/Workspace.svelte.ts index e8ec12d208..a4ec178e02 100644 --- a/packages/editor/src/lib/Workspace.svelte.ts +++ b/packages/editor/src/lib/Workspace.svelte.ts @@ -393,12 +393,14 @@ export class Workspace { this.#onreset?.(this.#files); } - reset(new_files: Item[], selected?: string) { + reset(new_files: Item[], options: { tailwind: boolean }, selected?: string) { this.states.clear(); this.set(new_files, selected); this.mark_saved(); + this.#tailwind = options.tailwind; + this.#onreset(new_files); this.#reset_diagnostics(); } @@ -471,7 +473,7 @@ export class Workspace { set tailwind(value) { this.#tailwind = value; - this.#onreset(this.#files); + this.#onupdate(this.#current); } get vim() { diff --git a/packages/repl/src/lib/Repl.svelte b/packages/repl/src/lib/Repl.svelte index 0e023d797b..85bd3f520b 100644 --- a/packages/repl/src/lib/Repl.svelte +++ b/packages/repl/src/lib/Repl.svelte @@ -67,13 +67,14 @@ export function toJSON() { return { imports: $bundle?.imports ?? [], - files: workspace.files + files: workspace.files, + tailwind: workspace.tailwind }; } // TODO get rid - export async function set(data: { files: File[]; css?: string }) { - workspace.reset(data.files, 'App.svelte'); + export async function set(data: { files: File[]; tailwind?: boolean }) { + workspace.reset(data.files, { tailwind: data.tailwind ?? false }, 'App.svelte'); } // TODO get rid