Choice Container

Component Structure
The following code is this component's initial HTML structure. Remember you can change this structure any time by using the template() component built-in function.
1
const choices = this.props.choices.map ((choice) => {
2
	if (typeof choice.Clickable === 'function') {
3
		return new Promise ((resolve, reject) => {
4
			this.engine.assertAsync (choice.Clickable, this.engine).then (() => {
5
				resolve (`<button data-do="${choice.Do}" ${ choice.Class ? `class="${choice.Class}"`: ''} data-choice="${choice._key}">${choice.Text}</button>`);
6
			}).catch (() => {
7
				resolve (`<button data-do="${choice.Do}" ${ choice.Class ? `class="${choice.Class}"`: ''} data-choice="${choice._key}" disabled>${choice.Text}</button>`);
8
			});
9
​
10
		});
11
	}
12
	return Promise.resolve (`<button data-do="${choice.Do}" ${ choice.Class ? `class="${choice.Class}"`: ''} data-choice="${choice._key}">${choice.Text}</button>`);
13
});
14
​
15
return Promise.all (choices).then ((choices) => `
16
	<div data-content="wrapper">
17
		${ choices.join('') }
18
	</div>
19
`);
Copied!
​

Components - Previous

Main Screen

Next - Components

Save Slot

Last modified 2yr ago

Copy link