this repo has no description
phaz.uk
1import { createSignal, For, Show } from 'solid-js';
2import './ParameterList.css';
3
4export interface ParameterListProps{
5 setPopupOpen: ( open: boolean ) => void
6 value: { type: string, desc: string }[],
7 changed: ( value: { type: string, desc: string }[] ) => void
8}
9
10export let ParameterList = ( props: ParameterListProps ) => {
11 let [ parameters, setParameters ] = createSignal<{ type: string, desc: string }[]>(props.value, { equals: false });
12 let [ addParametersOpen, setAddParametersOpen ] = createSignal(false);
13
14 return (
15 <div class="parameter-list">
16 <div class="parameter-list-inner">
17 <div class="parameter-list-header">
18 <h1 style={{ float: 'left' }}>Parameter List</h1>
19 <div style={{ float: 'right' }} class="parameter-list-close">
20 <div style={{ background: 'red', width: '25px', height: '25px', cursor: 'pointer' }} onClick={() => props.setPopupOpen(false)}></div>
21 </div>
22 </div>
23 <div class="parameter-list-content">
24 <For each={parameters()}>
25 { i => <div>{ JSON.stringify(i) }</div>}
26 </For>
27 <div class="button" onClick={() => { setAddParametersOpen(!addParametersOpen()) }}>Add Parameter + </div>
28 <Show when={addParametersOpen()}>
29 <div class="parameter-list-button-dropdown">
30 <div onClick={() => {
31 setAddParametersOpen(false);
32
33 let params = parameters();
34 params.push({ type: 'Float', desc: '' });
35
36 setParameters(params);
37 props.changed(params);
38 }}>Float Parameter</div>
39 <div onClick={() => {
40 setAddParametersOpen(false);
41
42 let params = parameters();
43 params.push({ type: 'Int', desc: '' });
44
45 setParameters(params);
46 props.changed(params);
47 }}>Integer Parameter</div>
48 <div onClick={() => {
49 setAddParametersOpen(false);
50
51 let params = parameters();
52 params.push({ type: 'Boolean', desc: '' });
53
54 setParameters(params);
55 props.changed(params);
56 }}>Boolean Parameter</div>
57 </div>
58 </Show>
59 </div>
60 </div>
61 </div>
62 )
63}