MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Some final tweaks.

This commit is contained in:
mike12345567 2021-10-13 16:42:07 +01:00
parent cd1f48b920
commit 123dc581f0
2 changed files with 26 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
packages/builder/src/components/common/CodeMirrorEditor.svelte
View File

@ -28,6 +28,7 @@
export let mode = EditorModes.JS
export let value = ""
export let height = 300
export let resize = "none"
export let readonly = false
export let hints = []
export let label
@ -118,19 +119,23 @@
<Label small>{label}</Label>
</div>
{/if}
<div style={`--code-mirror-height: ${height}px`}>
<div
style={`--code-mirror-height: ${height}px; --code-mirror-resize: ${resize}`}
>
<textarea tabindex="0" bind:this={textarea} readonly {value} />
</div>
<style>
div :global(.CodeMirror) {
height: var(--code-mirror-height);
min-height: var(--code-mirror-height);
font-family: monospace;
line-height: 1.3;
border: var(--spectrum-alias-border-size-thin) solid;
border-color: var(--spectrum-alias-border-color);
overflow: hidden;
border-radius: var(--border-radius-s);
resize: var(--code-mirror-resize);
overflow: hidden;
}
/* Override default active line highlight colour in dark theme */

21
packages/builder/src/components/integration/QueryViewer.svelte
View File

@ -28,6 +28,8 @@
let parameters
let data = []
const transformerDocs =
"https://docs.budibase.com/building-apps/data/transformers"
const typeOptions = [
{ label: "Text", value: "STRING" },
{ label: "Number", value: "NUMBER" },
@ -174,14 +176,23 @@
<Divider />
</div>
<div class="config">
<Heading size="S">Transformer</Heading>
<div class="help-heading">
<Heading size="S">Transformer</Heading>
<Icon
on:click={() => window.open(transformerDocs)}
hoverable
name="Help"
size="L"
/>
</div>
<Body size="S"
>Add a Javascript function to transform the query result.</Body
>Add a JavaScript function to transform the query result.</Body
>
<CodeMirrorEditor
height={200}
label="Transformer"
value={query.transformer}
resize="vertical"
on:change={e => (query.transformer = e.detail)}
/>
<Divider />
@ -240,6 +251,7 @@
display: grid;
grid-gap: var(--spacing-s);
}
.config-field {
display: grid;
grid-template-columns: 20% 1fr;
@ -247,6 +259,11 @@
align-items: center;
}
.help-heading {
display: flex;
justify-content: space-between;
}
.field {
display: grid;
grid-template-columns: 1fr 1fr 5%;