60 lines
940 B
Svelte
60 lines
940 B
Svelte
<script>
|
|
import Composer from '$lib/core/refactor/Composer.svelte';
|
|
|
|
let composer = {
|
|
id: 'ComposerParent',
|
|
layout: {
|
|
columns: '1fr 1fr',
|
|
areas: `
|
|
"left right"
|
|
`
|
|
},
|
|
children: [
|
|
{
|
|
id: 'ComposerBob',
|
|
component: 'ComposerBob',
|
|
slot: 'left',
|
|
store: {
|
|
machine: { state: 'NOTREADY' }
|
|
},
|
|
machine: {
|
|
initial: 'NOTREADY',
|
|
states: {
|
|
NOTREADY: {
|
|
on: { TOGGLE: 'READY' }
|
|
},
|
|
READY: {
|
|
on: { TOGGLE: 'NOTREADY' }
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
id: 'ComposerAlice',
|
|
component: 'ComposerAlice',
|
|
slot: 'right',
|
|
machine: {
|
|
initial: 'RED',
|
|
states: {
|
|
GREEN: {
|
|
on: { SWITCH: 'YELLOW' }
|
|
},
|
|
YELLOW: {
|
|
on: { SWITCH: 'RED' }
|
|
},
|
|
RED: {
|
|
on: { SWITCH: 'GREEN' }
|
|
}
|
|
},
|
|
on: {
|
|
READY: 'GREEN',
|
|
NOTREADY: 'RED'
|
|
}
|
|
}
|
|
}
|
|
]
|
|
};
|
|
</script>
|
|
|
|
<Composer {composer} />
|