Crossword approach 2 - prop + bind • Playground • Svelte

Skip to main content

App.svelte

Clues.svelte

Puzzle.svelte

Cell.svelte

<script>

import Clues from "./Clues.svelte";

import Puzzle from "./Puzzle.svelte";

export let data = ["Dog", "Cat"];

function capitalize(data) {

return data.map(d => d.toUpperCase());

}

let focusLetter = null;

$: words = capitalize(data);

</script>

<Clues {words} {focusLetter} />

<Puzzle {words} bind:focusLetter />

loading Svelte compiler...

/* Select a component to see its compiled code */

result = svelte.compile(source, {

generate: "client" "server",

dev: false });

/* Select a component to see its compiled code */