removed StateBindingControl and associated controls - not used
This commit is contained in:
Michael Shanks
parent
01798b137b
commit
00d1f9aaaf
|
|
@ -1,6 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import { setContext, onMount } from "svelte"
|
import { setContext, onMount } from "svelte"
|
||||||
import PropsView from "./PropsView.svelte"
|
|
||||||
|
|
||||||
import { store } from "builderStore"
|
import { store } from "builderStore"
|
||||||
import IconButton from "components/common/IconButton.svelte"
|
import IconButton from "components/common/IconButton.svelte"
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import { store } from "builderStore"
|
import { store } from "builderStore"
|
||||||
import PropsView from "./PropsView.svelte"
|
|
||||||
import Button from "components/common/Button.svelte"
|
import Button from "components/common/Button.svelte"
|
||||||
import ActionButton from "components/common/ActionButton.svelte"
|
import ActionButton from "components/common/ActionButton.svelte"
|
||||||
import ButtonGroup from "components/common/ButtonGroup.svelte"
|
import ButtonGroup from "components/common/ButtonGroup.svelte"
|
||||||
|
|
|
||||||
|
|
@ -1,44 +0,0 @@
|
||||||
<script>
|
|
||||||
import { store } from "builderStore"
|
|
||||||
import Checkbox from "../common/Checkbox.svelte"
|
|
||||||
import StateBindingControl from "./StateBindingControl.svelte"
|
|
||||||
|
|
||||||
export let index
|
|
||||||
export let prop_name
|
|
||||||
export let prop_value
|
|
||||||
export let prop_definition = {}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="root">
|
|
||||||
{#if prop_definition.type !== 'event'}
|
|
||||||
<h5>{prop_name}</h5>
|
|
||||||
<StateBindingControl
|
|
||||||
value={prop_value}
|
|
||||||
type={prop_definition.type || prop_definition}
|
|
||||||
options={prop_definition.options}
|
|
||||||
styleBindingProperty={prop_definition.styleBindingProperty}
|
|
||||||
onChanged={v => store.setComponentProp(prop_name, v)} />
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.root {
|
|
||||||
height: 40px;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
display: grid;
|
|
||||||
grid-template-rows: 1fr;
|
|
||||||
grid-template-columns: 70px 1fr;
|
|
||||||
grid-gap: 10px;
|
|
||||||
align-items: baseline;
|
|
||||||
}
|
|
||||||
|
|
||||||
h5 {
|
|
||||||
word-wrap: break-word;
|
|
||||||
font-size: 13px;
|
|
||||||
font-weight: 400;
|
|
||||||
color: var(--ink);
|
|
||||||
opacity: 0.8;
|
|
||||||
padding-top: 13px;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,52 +0,0 @@
|
||||||
<script>
|
|
||||||
import { some, includes, filter } from "lodash/fp"
|
|
||||||
import PropControl from "./PropControl.svelte"
|
|
||||||
import IconButton from "../common/IconButton.svelte"
|
|
||||||
|
|
||||||
export let component
|
|
||||||
export let components
|
|
||||||
|
|
||||||
let errors = []
|
|
||||||
const props_to_ignore = ["_component", "_children", "_styles", "_code", "_id"]
|
|
||||||
|
|
||||||
$: componentDef = components[component._component]
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="root">
|
|
||||||
|
|
||||||
<form on:submit|preventDefault class="uk-form-stacked form-root">
|
|
||||||
{#if componentDef}
|
|
||||||
{#each Object.entries(componentDef.props) as [prop_name, prop_def], index}
|
|
||||||
{#if prop_def !== 'event'}
|
|
||||||
<div class="prop-container">
|
|
||||||
<PropControl
|
|
||||||
{prop_name}
|
|
||||||
prop_value={component[prop_name]}
|
|
||||||
prop_definition={prop_def}
|
|
||||||
{index}
|
|
||||||
disabled={false} />
|
|
||||||
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{/each}
|
|
||||||
{/if}
|
|
||||||
</form>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.root {
|
|
||||||
font-size: 10pt;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-root {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.prop-container {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
min-width: 250px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,63 +0,0 @@
|
||||||
<script>
|
|
||||||
import { backendUiStore } from "builderStore"
|
|
||||||
import IconButton from "../common/IconButton.svelte"
|
|
||||||
import Input from "../common/Input.svelte"
|
|
||||||
|
|
||||||
export let value = ""
|
|
||||||
export let onChanged = () => {}
|
|
||||||
export let type = ""
|
|
||||||
export let options = []
|
|
||||||
export let styleBindingProperty = ""
|
|
||||||
|
|
||||||
$: bindOptionToStyle = !!styleBindingProperty
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="unbound-container">
|
|
||||||
{#if type === 'bool'}
|
|
||||||
<div>
|
|
||||||
<IconButton
|
|
||||||
icon={value == true ? 'check-square' : 'square'}
|
|
||||||
size="19"
|
|
||||||
on:click={() => onChanged(!value)} />
|
|
||||||
</div>
|
|
||||||
{:else if type === 'models'}
|
|
||||||
<select
|
|
||||||
class="uk-select uk-form-small"
|
|
||||||
bind:value
|
|
||||||
on:change={() => {
|
|
||||||
onChanged(value)
|
|
||||||
}}>
|
|
||||||
{#each $backendUiStore.models || [] as option}
|
|
||||||
<option value={option}>{option.name}</option>
|
|
||||||
{/each}
|
|
||||||
</select>
|
|
||||||
{:else if type === 'options' || type === 'models'}
|
|
||||||
<select
|
|
||||||
class="uk-select uk-form-small"
|
|
||||||
{value}
|
|
||||||
on:change={ev => onChanged(ev.target.value)}>
|
|
||||||
{#each options || [] as option}
|
|
||||||
{#if bindOptionToStyle}
|
|
||||||
<option style={`${styleBindingProperty}: ${option};`} value={option}>
|
|
||||||
{option}
|
|
||||||
</option>
|
|
||||||
{:else}
|
|
||||||
<option value={option}>{option}</option>
|
|
||||||
{/if}
|
|
||||||
{/each}
|
|
||||||
</select>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.unbound-container {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bound-header > div:nth-child(1) {
|
|
||||||
flex: 1 0 auto;
|
|
||||||
width: 30px;
|
|
||||||
color: var(--secondary50);
|
|
||||||
padding-left: 5px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
Reference in New Issue