mirror of https://github.com/sveltejs/svelte
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
37 lines
889 B
37 lines
889 B
8 years ago
|
<script>
|
||
6 years ago
|
import { beforeUpdate } from 'svelte';
|
||
|
|
||
6 years ago
|
import Editor from './Editor.svelte';
|
||
|
import ComponentSelector from './ComponentSelector.svelte';
|
||
8 years ago
|
|
||
6 years ago
|
export let components;
|
||
|
export let selectedComponent;
|
||
|
export let compiled;
|
||
7 years ago
|
|
||
6 years ago
|
let previouslySelectedComponent;
|
||
8 years ago
|
|
||
6 years ago
|
beforeUpdate(() => {
|
||
|
components.forEach(component => {
|
||
|
if (component === selectedComponent) return;
|
||
|
component.compiled = component.source.toUpperCase();
|
||
|
});
|
||
8 years ago
|
|
||
6 years ago
|
if (selectedComponent !== previouslySelectedComponent) {
|
||
|
selectedComponent.compiled = selectedComponent.source.toUpperCase();
|
||
|
updateBundle();
|
||
8 years ago
|
|
||
6 years ago
|
previouslySelectedComponent = selectedComponent;
|
||
8 years ago
|
}
|
||
6 years ago
|
});
|
||
|
|
||
|
function updateBundle() {
|
||
|
compiled = components.map(component => component.compiled).join('\n');
|
||
8 years ago
|
}
|
||
6 years ago
|
</script>
|
||
|
|
||
|
<ComponentSelector {components} bind:selectedComponent/>
|
||
|
<Editor bind:code={selectedComponent.source} />
|
||
|
|
||
|
<pre>
|
||
|
{compiled}
|
||
|
</pre>
|