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

Formatting.

This commit is contained in:
mike12345567 2021-03-10 17:56:16 +00:00
parent 163d24a767
commit 68735f1b4f
10 changed files with 263 additions and 223 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/builder/src/components/automation/SetupPanel/AutomationBindingPanel.svelte
View File

@ -60,9 +60,7 @@
<span class="binding__label">{binding.label}</span> <span class="binding__label">{binding.label}</span>
<span class="binding__type">{binding.type}</span> <span class="binding__type">{binding.type}</span>
<br /> <br />
<div class="binding__description"> <div class="binding__description">{binding.description || ''}</div>
{binding.description || ''}
</div>
</div> </div>
{/each} {/each}
{/each} {/each}
@ -95,7 +93,6 @@
</div> </div>
</div> </div>
<style> <style>
.container { .container {
height: 40vh; height: 40vh;
@ -187,4 +184,3 @@
text-decoration: underline; text-decoration: underline;
} }
</style> </style>

6
packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte
View File

@ -6,7 +6,7 @@
import { automationStore } from "builderStore" import { automationStore } from "builderStore"
import WebhookDisplay from "../Shared/WebhookDisplay.svelte" import WebhookDisplay from "../Shared/WebhookDisplay.svelte"
import DrawerBindableInput from "../../common/DrawerBindableInput.svelte" import DrawerBindableInput from "../../common/DrawerBindableInput.svelte"
import AutomationBindingPanel from './AutomationBindingPanel.svelte' import AutomationBindingPanel from "./AutomationBindingPanel.svelte"
export let block export let block
export let webhookModal export let webhookModal
@ -70,7 +70,7 @@
type={'email'} type={'email'}
extraThin extraThin
value={block.inputs[key]} value={block.inputs[key]}
on:change={e => block.inputs[key] = e.detail} on:change={e => (block.inputs[key] = e.detail)}
{bindings} /> {bindings} />
{:else if value.customType === 'table'} {:else if value.customType === 'table'}
<TableSelector bind:value={block.inputs[key]} /> <TableSelector bind:value={block.inputs[key]} />
@ -86,7 +86,7 @@
type={value.customType} type={value.customType}
extraThin extraThin
value={block.inputs[key]} value={block.inputs[key]}
on:change={e => block.inputs[key] = e.detail} on:change={e => (block.inputs[key] = e.detail)}
{bindings} /> {bindings} />
{/if} {/if}
</div> </div>

4
packages/builder/src/components/automation/SetupPanel/RowSelector.svelte
View File

@ -2,7 +2,7 @@
import { backendUiStore } from "builderStore" import { backendUiStore } from "builderStore"
import { Select } from "@budibase/bbui" import { Select } from "@budibase/bbui"
import DrawerBindableInput from "../../common/DrawerBindableInput.svelte" import DrawerBindableInput from "../../common/DrawerBindableInput.svelte"
import AutomationBindingPanel from './AutomationBindingPanel.svelte' import AutomationBindingPanel from "./AutomationBindingPanel.svelte"
export let value export let value
export let bindings export let bindings
@ -44,7 +44,7 @@
panel={AutomationBindingPanel} panel={AutomationBindingPanel}
extraThin extraThin
value={value[field]} value={value[field]}
on:change={e => value[field] = e.detail} on:change={e => (value[field] = e.detail)}
label={field} label={field}
type="string" type="string"
{bindings} /> {bindings} />

16
packages/builder/src/components/design/PropertiesPanel/DesignView.svelte
View File

@ -25,10 +25,14 @@
] ]
const transitions = [ const transitions = [
'none', 'fade', 'blur', 'fly', 'scale' // slide is hidden because it does not seem to result in any effect "none",
"fade",
"blur",
"fly",
"scale", // slide is hidden because it does not seem to result in any effect
] ]
const capitalize = ([first,...rest]) => first.toUpperCase() + rest.join(''); const capitalize = ([first, ...rest]) => first.toUpperCase() + rest.join("")
$: groups = componentDefinition?.styleable ? Object.keys(allStyles) : [] $: groups = componentDefinition?.styleable ? Object.keys(allStyles) : []
</script> </script>
@ -73,7 +77,13 @@
</div> </div>
{#if componentDefinition?.transitionable} {#if componentDefinition?.transitionable}
<div class="transitions"> <div class="transitions">
<Select value={componentInstance._transition} on:change={event => onUpdateTransition(event.target.value)} name="transition" label="Transition" secondary thin> <Select
value={componentInstance._transition}
on:change={event => onUpdateTransition(event.target.value)}
name="transition"
label="Transition"
secondary
thin>
{#each transitions as transition} {#each transitions as transition}
<option value={transition}>{capitalize(transition)}</option> <option value={transition}>{capitalize(transition)}</option>
{/each} {/each}

22
packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/EventEditor.svelte
View File

@ -1,10 +1,10 @@
<script> <script>
import {flip} from "svelte/animate"; import { flip } from "svelte/animate"
import {dndzone} from "svelte-dnd-action"; import { dndzone } from "svelte-dnd-action"
import { Button, DropdownMenu, Spacer } from "@budibase/bbui" import { Button, DropdownMenu, Spacer } from "@budibase/bbui"
import actionTypes from "./actions" import actionTypes from "./actions"
const flipDurationMs = 150; const flipDurationMs = 150
const EVENT_TYPE_KEY = "##eventHandlerType" const EVENT_TYPE_KEY = "##eventHandlerType"
@ -41,7 +41,7 @@
const newAction = { const newAction = {
parameters: {}, parameters: {},
[EVENT_TYPE_KEY]: actionType.name, [EVENT_TYPE_KEY]: actionType.name,
id: actions ? actions.length + 1 : 0 id: actions ? actions.length + 1 : 0,
} }
if (!actions) { if (!actions) {
actions = [] actions = []
@ -56,10 +56,10 @@
} }
function handleDndConsider(e) { function handleDndConsider(e) {
actions = e.detail.items; actions = e.detail.items
} }
function handleDndFinalize(e) { function handleDndFinalize(e) {
actions = e.detail.items; actions = e.detail.items
} }
</script> </script>
@ -87,9 +87,15 @@
</div> </div>
{#if actions && actions.length > 0} {#if actions && actions.length > 0}
<div class="action-dnd-container" use:dndzone={{items: actions, flipDurationMs, dropTargetStyle: { outline: 'none'}}} on:consider={handleDndConsider} on:finalize={handleDndFinalize}> <div
class="action-dnd-container"
use:dndzone={{ items: actions, flipDurationMs, dropTargetStyle: { outline: 'none' } }}
on:consider={handleDndConsider}
on:finalize={handleDndFinalize}>
{#each actions as action, index (action.id)} {#each actions as action, index (action.id)}
<div class="action-container" animate:flip={{duration: flipDurationMs}}> <div
class="action-container"
animate:flip={{ duration: flipDurationMs }}>
<div <div
class="action-header" class="action-header"
class:selected={action === selectedAction} class:selected={action === selectedAction}

2
packages/client/src/components/Component.svelte
View File

@ -41,7 +41,7 @@
id, id,
children: children.length, children: children.length,
styles: { ...styles, id }, styles: { ...styles, id },
transition transition,
}) })
// Gets the component constructor for the specified component // Gets the component constructor for the specified component

52
packages/standard-components/src/Container.svelte
View File

@ -8,55 +8,81 @@
</script> </script>
{#if type === 'div'} {#if type === 'div'}
<div in:transition={{type: $component.transition}} use:styleable={$component.styles}> <div
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</div> </div>
{:else if type === 'header'} {:else if type === 'header'}
<header in:transition={{type: $component.transition}} use:styleable={$component.styles}> <header
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</header> </header>
{:else if type === 'main'} {:else if type === 'main'}
<main in:transition={{type: $component.transition}} use:styleable={$component.styles}> <main
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</main> </main>
{:else if type === 'footer'} {:else if type === 'footer'}
<footer in:transition={{type: $component.transition}} use:styleable={$component.styles}> <footer
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</footer> </footer>
{:else if type === 'aside'} {:else if type === 'aside'}
<aside in:transition={{type: $component.transition}} use:styleable={$component.styles}> <aside
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</aside> </aside>
{:else if type === 'summary'} {:else if type === 'summary'}
<summary in:transition={{type: $component.transition}} use:styleable={$component.styles}> <summary
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</summary> </summary>
{:else if type === 'details'} {:else if type === 'details'}
<details in:transition={{type: $component.transition}} use:styleable={$component.styles}> <details
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</details> </details>
{:else if type === 'article'} {:else if type === 'article'}
<article in:transition={{type: $component.transition}} use:styleable={$component.styles}> <article
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</article> </article>
{:else if type === 'nav'} {:else if type === 'nav'}
<nav in:transition={{type: $component.transition}} use:styleable={$component.styles}> <nav
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</nav> </nav>
{:else if type === 'mark'} {:else if type === 'mark'}
<mark in:transition={{type: $component.transition}} use:styleable={$component.styles}> <mark
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</mark> </mark>
{:else if type === 'figure'} {:else if type === 'figure'}
<figure in:transition={{type: $component.transition}} use:styleable={$component.styles}> <figure
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</figure> </figure>
{:else if type === 'figcaption'} {:else if type === 'figcaption'}
<figcaption in:transition={{type: $component.transition}} use:styleable={$component.styles}> <figcaption
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</figcaption> </figcaption>
{:else if type === 'paragraph'} {:else if type === 'paragraph'}
<p in:transition={{type: $component.transition}} use:styleable={$component.styles}> <p
in:transition={{ type: $component.transition }}
use:styleable={$component.styles}>
<slot /> <slot />
</p> </p>
{/if} {/if}

4
packages/standard-components/src/grid/Component.svelte
View File

@ -152,7 +152,9 @@
{#if selectedRows.length > 0} {#if selectedRows.length > 0}
<DeleteButton text small on:click={modal.show()}> <DeleteButton text small on:click={modal.show()}>
<Icon name="addrow" /> <Icon name="addrow" />
Delete {selectedRows.length} row(s) Delete
{selectedRows.length}
row(s)
</DeleteButton> </DeleteButton>
{/if} {/if}
</div> </div>