Linting.
This commit is contained in:
parent
c8f8fec8a0
commit
c8295f0fbd
|
@ -20,12 +20,9 @@
|
|||
</script>
|
||||
|
||||
<div on:click|stopPropagation bind:this={anchor}>
|
||||
<TextButton
|
||||
text
|
||||
on:click={dropdown.show}
|
||||
active={false}>
|
||||
<Icon name="add" />
|
||||
Add Parameters
|
||||
<TextButton text on:click={dropdown.show} active={false}>
|
||||
<Icon name="add" />
|
||||
Add Parameters
|
||||
</TextButton>
|
||||
<DropdownMenu align="right" {anchor} bind:this={dropdown}>
|
||||
<div class="wrapper">
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import { notificationStore } from "builderStore/store/notifications"
|
||||
import { flip } from 'svelte/animate';
|
||||
import { flip } from "svelte/animate"
|
||||
import { fly } from "svelte/transition"
|
||||
|
||||
export let themes = {
|
||||
|
|
|
@ -24,8 +24,8 @@
|
|||
</script>
|
||||
|
||||
<form on:submit|preventDefault>
|
||||
<div class="field">
|
||||
{#each schemaKeys as field}
|
||||
<div class="field">
|
||||
{#each schemaKeys as field}
|
||||
<Input
|
||||
placeholder="Enter {field} name"
|
||||
outline
|
||||
|
@ -33,8 +33,8 @@
|
|||
type={schema.fields[field]?.type}
|
||||
required={schema.fields[field]?.required}
|
||||
bind:value={fields[field]} />
|
||||
{/each}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
</form>
|
||||
{#if schema.customisable}
|
||||
<Editor
|
||||
|
|
|
@ -135,17 +135,22 @@
|
|||
<Input placeholder="✎ Edit Query Name" bind:value={query.name} />
|
||||
</div>
|
||||
{#if config}
|
||||
<div class="props">
|
||||
<div class="query-type">Query type: <span class="query-type-span">{config[query.queryVerb].type}</span></div>
|
||||
<div class="select">
|
||||
<Select primary thin bind:value={query.queryVerb}>
|
||||
{#each Object.keys(config) as queryVerb}
|
||||
<option value={queryVerb}>{queryVerb}</option>
|
||||
{/each}
|
||||
</Select>
|
||||
</div>
|
||||
<div class="props">
|
||||
<div class="query-type">
|
||||
Query type:
|
||||
<span class="query-type-span">{config[query.queryVerb].type}</span>
|
||||
</div>
|
||||
<div class="select">
|
||||
<Select primary thin bind:value={query.queryVerb}>
|
||||
{#each Object.keys(config) as queryVerb}
|
||||
<option value={queryVerb}>{queryVerb}</option>
|
||||
{/each}
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
<EditQueryParamsPopover bind:parameters={query.parameters} bindable={false} />
|
||||
<EditQueryParamsPopover
|
||||
bind:parameters={query.parameters}
|
||||
bindable={false} />
|
||||
{/if}
|
||||
</header>
|
||||
<Spacer extraLarge />
|
||||
|
@ -162,10 +167,7 @@
|
|||
<Spacer large />
|
||||
|
||||
<div class="viewer-controls">
|
||||
<Button
|
||||
blue
|
||||
disabled={data.length === 0}
|
||||
on:click={saveQuery}>
|
||||
<Button blue disabled={data.length === 0} on:click={saveQuery}>
|
||||
Save Query
|
||||
</Button>
|
||||
<Button primary on:click={previewQuery}>Run Query</Button>
|
||||
|
@ -182,7 +184,11 @@
|
|||
{#each fields as field, idx}
|
||||
<Spacer small />
|
||||
<div class="field">
|
||||
<Input outline placeholder="Field Name" type={'text'} bind:value={field.name} />
|
||||
<Input
|
||||
outline
|
||||
placeholder="Field Name"
|
||||
type={'text'}
|
||||
bind:value={field.name} />
|
||||
<Select thin border bind:value={field.type}>
|
||||
<option value={''}>Select a field type</option>
|
||||
<option value={'STRING'}>Text</option>
|
||||
|
@ -195,8 +201,8 @@
|
|||
on:click={() => deleteField(idx)} />
|
||||
</div>
|
||||
{/each}
|
||||
<Spacer small />
|
||||
<Button thin secondary on:click={newField}>Add Field</Button>
|
||||
<Spacer small />
|
||||
<Button thin secondary on:click={newField}>Add Field</Button>
|
||||
{/if}
|
||||
</Switcher>
|
||||
{/if}
|
||||
|
@ -206,7 +212,6 @@
|
|||
{/if}
|
||||
|
||||
<style>
|
||||
|
||||
.input {
|
||||
width: 300px;
|
||||
}
|
||||
|
|
|
@ -20,7 +20,6 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
|
||||
{#if schema}
|
||||
{#key query._id}
|
||||
{#if schema.type === QueryTypes.SQL}
|
||||
|
|
|
@ -59,7 +59,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
|
|
|
@ -2,9 +2,14 @@
|
|||
import { writable } from "svelte/store"
|
||||
import { setContext, onMount } from "svelte"
|
||||
import Component from "./Component.svelte"
|
||||
import NotificationDisplay from './NotificationDisplay.svelte'
|
||||
import NotificationDisplay from "./NotificationDisplay.svelte"
|
||||
import SDK from "../sdk"
|
||||
import { createDataStore, initialise, screenStore, notificationStore } from "../store"
|
||||
import {
|
||||
createDataStore,
|
||||
initialise,
|
||||
screenStore,
|
||||
notificationStore,
|
||||
} from "../store"
|
||||
|
||||
// Provide contexts
|
||||
setContext("sdk", SDK)
|
||||
|
|
|
@ -1,60 +1,59 @@
|
|||
<script>
|
||||
import { flip } from 'svelte/animate';
|
||||
import { fly } from "svelte/transition"
|
||||
import { getContext } from "svelte"
|
||||
const { notifications } = getContext("sdk")
|
||||
import { flip } from "svelte/animate"
|
||||
import { fly } from "svelte/transition"
|
||||
import { getContext } from "svelte"
|
||||
const { notifications } = getContext("sdk")
|
||||
|
||||
export let themes = {
|
||||
danger: "#E26D69",
|
||||
success: "#84C991",
|
||||
warning: "#f0ad4e",
|
||||
info: "#5bc0de",
|
||||
default: "#aaaaaa",
|
||||
}
|
||||
</script>
|
||||
export let themes = {
|
||||
danger: "#E26D69",
|
||||
success: "#84C991",
|
||||
warning: "#f0ad4e",
|
||||
info: "#5bc0de",
|
||||
default: "#aaaaaa",
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="notifications">
|
||||
{#each $notifications as notification (notification.id)}
|
||||
<div
|
||||
animate:flip
|
||||
class="toast"
|
||||
style="background: {themes[notification.type]};"
|
||||
transition:fly={{ y: -30 }}>
|
||||
<div class="content">{notification.message}</div>
|
||||
{#if notification.icon}<i class={notification.icon} />{/if}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
<div class="notifications">
|
||||
{#each $notifications as notification (notification.id)}
|
||||
<div
|
||||
animate:flip
|
||||
class="toast"
|
||||
style="background: {themes[notification.type]};"
|
||||
transition:fly={{ y: -30 }}>
|
||||
<div class="content">{notification.message}</div>
|
||||
{#if notification.icon}<i class={notification.icon} />{/if}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.notifications {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
pointer-events: none;
|
||||
}
|
||||
<style>
|
||||
.notifications {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.toast {
|
||||
flex: 0 0 auto;
|
||||
margin-bottom: 10px;
|
||||
border-radius: var(--border-radius-s);
|
||||
/* The toasts now support being auto sized, so this static width could be removed */
|
||||
width: 40vw;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 10px;
|
||||
display: block;
|
||||
color: white;
|
||||
font-weight: 500;
|
||||
}
|
||||
</style>
|
||||
.toast {
|
||||
flex: 0 0 auto;
|
||||
margin-bottom: 10px;
|
||||
border-radius: var(--border-radius-s);
|
||||
/* The toasts now support being auto sized, so this static width could be removed */
|
||||
width: 40vw;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 10px;
|
||||
display: block;
|
||||
color: white;
|
||||
font-weight: 500;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,7 +1,11 @@
|
|||
const Helper = require("./Helper")
|
||||
const { SafeString } = require("handlebars")
|
||||
const externalHandlebars = require("./external")
|
||||
const { HelperFunctionNames, HelperFunctionBuiltin, LITERAL_MARKER } = require("./constants")
|
||||
const {
|
||||
HelperFunctionNames,
|
||||
HelperFunctionBuiltin,
|
||||
LITERAL_MARKER,
|
||||
} = require("./constants")
|
||||
|
||||
const HTML_SWAPS = {
|
||||
"<": "<",
|
||||
|
@ -29,10 +33,10 @@ const HELPERS = [
|
|||
}),
|
||||
// adds a note for post-processor
|
||||
new Helper(HelperFunctionNames.LITERAL, value => {
|
||||
const type = typeof(value)
|
||||
const type = typeof value
|
||||
const outputVal = type === "object" ? JSON.stringify(value) : value
|
||||
return `{{-${LITERAL_MARKER}-${type}-${outputVal}-}}`
|
||||
})
|
||||
}),
|
||||
]
|
||||
|
||||
module.exports.HelperNames = () => {
|
||||
|
|
|
@ -39,5 +39,5 @@ module.exports.processors = [
|
|||
return JSON.parse(value)
|
||||
}
|
||||
return value
|
||||
})
|
||||
}),
|
||||
]
|
||||
|
|
Loading…
Reference in New Issue