forked from tsai/budibase
Rory Powell
5 years ago
73 changed files with 1536 additions and 359 deletions
@ -0,0 +1,69 @@ |
|||||
|
<script> |
||||
|
import { getContext } from "svelte" |
||||
|
import { Layout, Heading, Tabs, Tab, Icon } from "@budibase/bbui" |
||||
|
import DevToolsStatsTab from "./DevToolsStatsTab.svelte" |
||||
|
import DevToolsComponentTab from "./DevToolsComponentTab.svelte" |
||||
|
import { devToolsStore } from "stores" |
||||
|
|
||||
|
const context = getContext("context") |
||||
|
</script> |
||||
|
|
||||
|
<div |
||||
|
class="devtools" |
||||
|
class:hidden={!$devToolsStore.visible} |
||||
|
class:mobile={$context.device.mobile} |
||||
|
> |
||||
|
{#if $devToolsStore.visible} |
||||
|
<Layout noPadding gap="XS"> |
||||
|
<div class="header"> |
||||
|
<Heading size="XS">Budibase DevTools</Heading> |
||||
|
<Icon |
||||
|
hoverable |
||||
|
name="Close" |
||||
|
on:click={() => devToolsStore.actions.setVisible(false)} |
||||
|
/> |
||||
|
</div> |
||||
|
<Tabs selected="Application"> |
||||
|
<Tab title="Application"> |
||||
|
<div class="tab-content"> |
||||
|
<DevToolsStatsTab /> |
||||
|
</div> |
||||
|
</Tab> |
||||
|
<Tab title="Components"> |
||||
|
<div class="tab-content"> |
||||
|
<DevToolsComponentTab /> |
||||
|
</div> |
||||
|
</Tab> |
||||
|
</Tabs> |
||||
|
</Layout> |
||||
|
{/if} |
||||
|
</div> |
||||
|
|
||||
|
<style> |
||||
|
.devtools { |
||||
|
background: var(--spectrum-alias-background-color-primary); |
||||
|
flex: 0 0 320px; |
||||
|
border-left: 1px solid var(--spectrum-global-color-gray-300); |
||||
|
overflow: auto; |
||||
|
transition: margin-right 300ms ease; |
||||
|
margin-right: 0; |
||||
|
} |
||||
|
.devtools.hidden { |
||||
|
margin-right: -320px; |
||||
|
} |
||||
|
.devtools.mobile { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
.header { |
||||
|
padding: var(--spacing-xl) var(--spacing-xl) 0 var(--spacing-xl); |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.tab-content { |
||||
|
padding: 0 var(--spacing-xl); |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,113 @@ |
|||||
|
<script> |
||||
|
import { Layout, Select, Body } from "@budibase/bbui" |
||||
|
import { componentStore } from "stores/index.js" |
||||
|
import DevToolsStat from "./DevToolsStat.svelte" |
||||
|
|
||||
|
const ReadableBindingMap = { |
||||
|
user: "Current user", |
||||
|
state: "State", |
||||
|
url: "URL", |
||||
|
device: "Device", |
||||
|
rowSelection: "Selected rows", |
||||
|
} |
||||
|
|
||||
|
let category |
||||
|
|
||||
|
$: selectedInstance = $componentStore.selectedComponentInstance |
||||
|
$: context = selectedInstance?.getDataContext() |
||||
|
$: bindingCategories = getContextProviders(context) |
||||
|
$: bindings = Object.entries(context?.[category] || {}) |
||||
|
|
||||
|
const getContextProviders = context => { |
||||
|
const filteredContext = { ...context } |
||||
|
|
||||
|
// Remove some keys from context |
||||
|
delete filteredContext.key |
||||
|
delete filteredContext.closestComponentId |
||||
|
delete filteredContext.user_RefreshDataSource |
||||
|
|
||||
|
// Keep track of encountered IDs so we can find actions |
||||
|
let actions = [] |
||||
|
let encounteredCategories = [] |
||||
|
|
||||
|
// Create readable bindings |
||||
|
let categories = [] |
||||
|
Object.keys(filteredContext) |
||||
|
.sort() |
||||
|
.forEach(category => { |
||||
|
let isAction = false |
||||
|
for (let cat of encounteredCategories) { |
||||
|
if (category.startsWith(`${cat}_`)) { |
||||
|
isAction = true |
||||
|
break |
||||
|
} |
||||
|
} |
||||
|
if (isAction) { |
||||
|
actions.push(category) |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
// Mark category as encountered so we can find any matching actions |
||||
|
encounteredCategories.push(category) |
||||
|
|
||||
|
// Map any static categories to pretty names |
||||
|
if (ReadableBindingMap[category]) { |
||||
|
categories.push({ |
||||
|
label: ReadableBindingMap[category], |
||||
|
value: category, |
||||
|
}) |
||||
|
} else { |
||||
|
const component = componentStore.actions.getComponentById(category) |
||||
|
if (component) { |
||||
|
categories.push({ |
||||
|
label: component._instanceName, |
||||
|
value: category, |
||||
|
}) |
||||
|
} else { |
||||
|
// Check if its a block |
||||
|
if (category.includes("-")) { |
||||
|
const split = category.split("-") |
||||
|
const potentialId = split[0] |
||||
|
const component = |
||||
|
componentStore.actions.getComponentById(potentialId) |
||||
|
if (component) { |
||||
|
categories.push({ |
||||
|
label: `${component._instanceName} (${split[1]})`, |
||||
|
value: category, |
||||
|
}) |
||||
|
return |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// Otherwise we don't know |
||||
|
categories.push({ |
||||
|
label: "Unknown - " + category, |
||||
|
value: category, |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
return categories |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<Layout noPadding gap="S"> |
||||
|
<Body size="S"> |
||||
|
Choose a category to see the value of all its available bindings. |
||||
|
</Body> |
||||
|
<Select bind:value={category} label="Category" options={bindingCategories} /> |
||||
|
{#if bindings?.length} |
||||
|
<Layout noPadding gap="XS"> |
||||
|
{#each bindings as binding} |
||||
|
<DevToolsStat |
||||
|
copyable |
||||
|
label={binding[0]} |
||||
|
value={JSON.stringify(binding[1])} |
||||
|
/> |
||||
|
{/each} |
||||
|
</Layout> |
||||
|
{:else if category} |
||||
|
<Body size="XS">There aren't any bindings available in this category.</Body> |
||||
|
{/if} |
||||
|
</Layout> |
||||
@ -0,0 +1,13 @@ |
|||||
|
<script> |
||||
|
import DevToolsStat from "./DevToolsStat.svelte" |
||||
|
|
||||
|
export let name |
||||
|
export let value |
||||
|
export let settingsMap |
||||
|
|
||||
|
$: prettyName = settingsMap?.[name]?.label |
||||
|
</script> |
||||
|
|
||||
|
{#if prettyName} |
||||
|
<DevToolsStat label={prettyName} value={JSON.stringify(value)} /> |
||||
|
{/if} |
||||
@ -0,0 +1,30 @@ |
|||||
|
<script> |
||||
|
import { Layout, Toggle } from "@budibase/bbui" |
||||
|
import DevToolsStat from "./DevToolsStat.svelte" |
||||
|
import { componentStore } from "stores/index.js" |
||||
|
import { getSettingsDefinition } from "utils/componentProps.js" |
||||
|
|
||||
|
let showEnrichedSettings = true |
||||
|
|
||||
|
$: selectedInstance = $componentStore.selectedComponentInstance |
||||
|
$: settingsDefinition = getSettingsDefinition( |
||||
|
$componentStore.selectedComponentDefinition |
||||
|
) |
||||
|
$: rawSettings = selectedInstance?.getRawSettings() |
||||
|
$: settings = selectedInstance?.getSettings() |
||||
|
</script> |
||||
|
|
||||
|
<Layout noPadding gap="S"> |
||||
|
<Toggle text="Show enriched settings" bind:value={showEnrichedSettings} /> |
||||
|
<Layout noPadding gap="XS"> |
||||
|
{#each settingsDefinition as setting} |
||||
|
<DevToolsStat |
||||
|
copyable |
||||
|
label={setting.label} |
||||
|
value={JSON.stringify( |
||||
|
(showEnrichedSettings ? settings : rawSettings)?.[setting.key] |
||||
|
)} |
||||
|
/> |
||||
|
{/each} |
||||
|
</Layout> |
||||
|
</Layout> |
||||
@ -0,0 +1,102 @@ |
|||||
|
<script> |
||||
|
import { Body, Layout, Heading, Button, Tabs, Tab } from "@budibase/bbui" |
||||
|
import { builderStore, devToolsStore, componentStore } from "stores" |
||||
|
import DevToolsStat from "./DevToolsStat.svelte" |
||||
|
import DevToolsComponentSettingsTab from "./DevToolsComponentSettingsTab.svelte" |
||||
|
import DevToolsComponentContextTab from "./DevToolsComponentContextTab.svelte" |
||||
|
|
||||
|
$: { |
||||
|
// Reset selection store if we can't find a matching instance |
||||
|
if (!$componentStore.selectedComponentInstance) { |
||||
|
builderStore.actions.selectComponent(null) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
{#if !$builderStore.selectedComponentId} |
||||
|
<Layout noPadding gap="S"> |
||||
|
<Heading size="XS">Please choose a component</Heading> |
||||
|
<Body size="S"> |
||||
|
Press the button below to enable component selection, then click a |
||||
|
component in your app to view its settings and available data bindings. |
||||
|
</Body> |
||||
|
<div> |
||||
|
<Button |
||||
|
cta |
||||
|
on:click={() => devToolsStore.actions.setAllowSelection(true)} |
||||
|
> |
||||
|
Choose component |
||||
|
</Button> |
||||
|
</div> |
||||
|
</Layout> |
||||
|
{:else} |
||||
|
<Layout noPadding gap="S"> |
||||
|
<Heading size="XS"> |
||||
|
{$componentStore.selectedComponent?._instanceName} |
||||
|
</Heading> |
||||
|
<Layout noPadding gap="XS"> |
||||
|
<DevToolsStat |
||||
|
label="Type" |
||||
|
value={$componentStore.selectedComponentDefinition?.name} |
||||
|
/> |
||||
|
<DevToolsStat |
||||
|
copyable |
||||
|
label="Component ID" |
||||
|
value={$componentStore.selectedComponent?._id} |
||||
|
/> |
||||
|
</Layout> |
||||
|
<div class="buttons"> |
||||
|
<Button |
||||
|
cta |
||||
|
on:click={() => devToolsStore.actions.setAllowSelection(true)} |
||||
|
> |
||||
|
Change component |
||||
|
</Button> |
||||
|
<Button |
||||
|
quiet |
||||
|
secondary |
||||
|
on:click={() => builderStore.actions.selectComponent(null)} |
||||
|
> |
||||
|
Reset |
||||
|
</Button> |
||||
|
</div> |
||||
|
|
||||
|
<div class="data"> |
||||
|
<Layout noPadding gap="XS"> |
||||
|
<Tabs selected="Settings"> |
||||
|
<Tab title="Settings"> |
||||
|
<div class="tab-content"> |
||||
|
<DevToolsComponentSettingsTab /> |
||||
|
</div> |
||||
|
</Tab> |
||||
|
<Tab title="Bindings"> |
||||
|
<div class="tab-content"> |
||||
|
<DevToolsComponentContextTab /> |
||||
|
</div> |
||||
|
</Tab> |
||||
|
</Tabs> |
||||
|
</Layout> |
||||
|
</div> |
||||
|
</Layout> |
||||
|
{/if} |
||||
|
|
||||
|
<style> |
||||
|
.buttons { |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: flex-start; |
||||
|
align-items: center; |
||||
|
gap: var(--spacing-xs); |
||||
|
} |
||||
|
.data { |
||||
|
margin: 0 calc(-1 * var(--spacing-xl)); |
||||
|
} |
||||
|
.data :global(.spectrum-Textfield-input) { |
||||
|
min-height: 200px !important; |
||||
|
white-space: pre; |
||||
|
font-size: var(--font-size-s); |
||||
|
} |
||||
|
.tab-content { |
||||
|
padding: 0 var(--spacing-xl); |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,74 @@ |
|||||
|
<script> |
||||
|
import { Heading, Button, Select } from "@budibase/bbui" |
||||
|
import { devToolsStore } from "../../stores" |
||||
|
import { getContext } from "svelte" |
||||
|
|
||||
|
const context = getContext("context") |
||||
|
|
||||
|
$: previewOptions = [ |
||||
|
{ |
||||
|
label: "View as yourself", |
||||
|
value: "self", |
||||
|
}, |
||||
|
{ |
||||
|
label: "View as public user", |
||||
|
value: "PUBLIC", |
||||
|
}, |
||||
|
{ |
||||
|
label: "View as basic user", |
||||
|
value: "BASIC", |
||||
|
}, |
||||
|
{ |
||||
|
label: "View as power user", |
||||
|
value: "POWER", |
||||
|
}, |
||||
|
{ |
||||
|
label: "View as admin user", |
||||
|
value: "ADMIN", |
||||
|
}, |
||||
|
] |
||||
|
</script> |
||||
|
|
||||
|
<div class="dev-preview-header" class:mobile={$context.device.mobile}> |
||||
|
<Heading size="XS">Budibase App Preview</Heading> |
||||
|
<Select |
||||
|
quiet |
||||
|
options={previewOptions} |
||||
|
value={$devToolsStore.role || "self"} |
||||
|
placeholder={null} |
||||
|
autoWidth |
||||
|
on:change={e => devToolsStore.actions.changeRole(e.detail)} |
||||
|
/> |
||||
|
{#if !$context.device.mobile} |
||||
|
<Button |
||||
|
quiet |
||||
|
overBackground |
||||
|
icon="Code" |
||||
|
on:click={() => devToolsStore.actions.setVisible(!$devToolsStore.visible)} |
||||
|
> |
||||
|
{$devToolsStore.visible ? "Close" : "Open"} DevTools |
||||
|
</Button> |
||||
|
{/if} |
||||
|
</div> |
||||
|
|
||||
|
<style> |
||||
|
.dev-preview-header { |
||||
|
flex: 0 0 50px; |
||||
|
height: 50px; |
||||
|
display: grid; |
||||
|
align-items: center; |
||||
|
background-color: var(--spectrum-global-color-blue-400); |
||||
|
padding: 0 var(--spacing-xl); |
||||
|
grid-template-columns: 1fr auto auto; |
||||
|
grid-gap: var(--spacing-xl); |
||||
|
} |
||||
|
.dev-preview-header.mobile { |
||||
|
flex: 0 0 50px; |
||||
|
grid-template-columns: 1fr auto; |
||||
|
} |
||||
|
.dev-preview-header :global(.spectrum-Heading), |
||||
|
.dev-preview-header :global(.spectrum-Picker-menuIcon), |
||||
|
.dev-preview-header :global(.spectrum-Picker-label) { |
||||
|
color: white !important; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,75 @@ |
|||||
|
<script> |
||||
|
import { Helpers } from "@budibase/bbui" |
||||
|
import { notificationStore } from "stores" |
||||
|
|
||||
|
export let label |
||||
|
export let value |
||||
|
export let copyable = false |
||||
|
|
||||
|
$: prettyLabel = label == null ? "-" : label |
||||
|
$: prettyValue = value == null ? "-" : value |
||||
|
$: empty = value == null |
||||
|
$: canCopy = copyable && !empty |
||||
|
|
||||
|
const copyValue = async () => { |
||||
|
try { |
||||
|
await Helpers.copyToClipboard(value) |
||||
|
notificationStore.actions.success("Copied to clipboard") |
||||
|
} catch (error) { |
||||
|
notificationStore.actions.error( |
||||
|
"Failed to copy to clipboard. Check the dev console for the value." |
||||
|
) |
||||
|
console.warn("Failed to copy the value", value) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<div class="stat"> |
||||
|
<div class="stat-label" title={prettyLabel}>{prettyLabel}</div> |
||||
|
<div |
||||
|
class="stat-value" |
||||
|
class:copyable={canCopy} |
||||
|
class:empty |
||||
|
title={prettyValue} |
||||
|
on:click={canCopy ? copyValue : null} |
||||
|
> |
||||
|
{prettyValue} |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<style> |
||||
|
.stat { |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
gap: var(--spacing-xl); |
||||
|
} |
||||
|
.stat-label { |
||||
|
font-size: var(--font-size-xs); |
||||
|
color: var(--spectrum-global-color-gray-600); |
||||
|
text-transform: uppercase; |
||||
|
flex: 0 0 auto; |
||||
|
width: 120px; |
||||
|
overflow: hidden; |
||||
|
text-overflow: ellipsis; |
||||
|
white-space: nowrap; |
||||
|
} |
||||
|
.stat-value { |
||||
|
flex: 1 1 auto; |
||||
|
width: 0; |
||||
|
text-align: right; |
||||
|
overflow: hidden; |
||||
|
text-overflow: ellipsis; |
||||
|
white-space: nowrap; |
||||
|
transition: color var(--spectrum-global-animation-duration-100, 130ms) |
||||
|
ease-in-out; |
||||
|
} |
||||
|
.stat-value.empty { |
||||
|
color: var(--spectrum-global-color-gray-500); |
||||
|
} |
||||
|
.stat-value.copyable:hover { |
||||
|
color: var(--spectrum-global-color-blue-600); |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,27 @@ |
|||||
|
<script> |
||||
|
import { Layout } from "@budibase/bbui" |
||||
|
import { authStore, appStore, screenStore, componentStore } from "stores" |
||||
|
import DevToolsStat from "./DevToolsStat.svelte" |
||||
|
</script> |
||||
|
|
||||
|
<Layout noPadding gap="XS"> |
||||
|
<DevToolsStat label="App" value={$appStore.application?.name} /> |
||||
|
<DevToolsStat label="Tenant" value={$appStore.application?.tenantId} /> |
||||
|
<DevToolsStat label="Version" value={$appStore.application?.version} /> |
||||
|
{#if $appStore.clientLoadTime} |
||||
|
<DevToolsStat |
||||
|
label="Client load time" |
||||
|
value={`${$appStore.clientLoadTime} ms`} |
||||
|
/> |
||||
|
{/if} |
||||
|
<DevToolsStat label="App layouts" value={$screenStore.layouts?.length || 0} /> |
||||
|
<DevToolsStat label="Active layout" value={$screenStore.activeLayout?.name} /> |
||||
|
<DevToolsStat label="App screens" value={$screenStore.screens?.length || 0} /> |
||||
|
<DevToolsStat |
||||
|
label="Active screen" |
||||
|
value={$screenStore.activeScreen?.routing.route} |
||||
|
/> |
||||
|
<DevToolsStat label="Components" value={$componentStore.mountedComponents} /> |
||||
|
<DevToolsStat label="User" value={$authStore.email} /> |
||||
|
<DevToolsStat label="Role" value={$authStore.roleId} /> |
||||
|
</Layout> |
||||
@ -0,0 +1,81 @@ |
|||||
|
import { get, writable, derived } from "svelte/store" |
||||
|
import Manifest from "manifest.json" |
||||
|
import { findComponentById, findComponentPathById } from "../utils/components" |
||||
|
import { devToolsStore } from "./devTools" |
||||
|
import { screenStore } from "./screens" |
||||
|
import { builderStore } from "./builder" |
||||
|
|
||||
|
const createComponentStore = () => { |
||||
|
const store = writable({}) |
||||
|
|
||||
|
const derivedStore = derived( |
||||
|
[store, builderStore, devToolsStore, screenStore], |
||||
|
([$store, $builderState, $devToolsState, $screenState]) => { |
||||
|
// Avoid any of this logic if we aren't in the builder preview
|
||||
|
if (!$builderState.inBuilder && !$devToolsState.visible) { |
||||
|
return {} |
||||
|
} |
||||
|
|
||||
|
// Derive the selected component instance and definition
|
||||
|
let asset |
||||
|
const { layout, screen, previewType, selectedComponentId } = $builderState |
||||
|
if ($builderState.inBuilder) { |
||||
|
asset = previewType === "layout" ? layout : screen |
||||
|
} else { |
||||
|
asset = $screenState.activeScreen |
||||
|
} |
||||
|
const component = findComponentById(asset?.props, selectedComponentId) |
||||
|
const prefix = "@budibase/standard-components/" |
||||
|
const type = component?._component?.replace(prefix, "") |
||||
|
const definition = type ? Manifest[type] : null |
||||
|
|
||||
|
// Derive the selected component path
|
||||
|
const path = |
||||
|
findComponentPathById(asset?.props, selectedComponentId) || [] |
||||
|
|
||||
|
return { |
||||
|
selectedComponentInstance: $store[selectedComponentId], |
||||
|
selectedComponent: component, |
||||
|
selectedComponentDefinition: definition, |
||||
|
selectedComponentPath: path?.map(component => component._id), |
||||
|
mountedComponents: Object.keys($store).length, |
||||
|
currentAsset: asset, |
||||
|
} |
||||
|
} |
||||
|
) |
||||
|
|
||||
|
const registerInstance = (id, instance) => { |
||||
|
store.update(state => ({ |
||||
|
...state, |
||||
|
[id]: instance, |
||||
|
})) |
||||
|
} |
||||
|
|
||||
|
const unregisterInstance = id => { |
||||
|
store.update(state => { |
||||
|
delete state[id] |
||||
|
return state |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
const isComponentRegistered = id => { |
||||
|
return get(store)[id] != null |
||||
|
} |
||||
|
|
||||
|
const getComponentById = id => { |
||||
|
const asset = get(derivedStore).currentAsset |
||||
|
return findComponentById(asset?.props, id) |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
...derivedStore, |
||||
|
actions: { |
||||
|
registerInstance, |
||||
|
unregisterInstance, |
||||
|
isComponentRegistered, |
||||
|
getComponentById, |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
export const componentStore = createComponentStore() |
||||
@ -0,0 +1,47 @@ |
|||||
|
import { get } from "svelte/store" |
||||
|
import { createLocalStorageStore } from "@budibase/frontend-core" |
||||
|
import { appStore } from "./app" |
||||
|
import { initialise } from "./initialise" |
||||
|
import { authStore } from "./auth" |
||||
|
|
||||
|
const initialState = { |
||||
|
visible: false, |
||||
|
allowSelection: false, |
||||
|
role: null, |
||||
|
} |
||||
|
|
||||
|
const createDevToolStore = () => { |
||||
|
const localStorageKey = `${get(appStore).appId}.devTools` |
||||
|
const store = createLocalStorageStore(localStorageKey, initialState) |
||||
|
|
||||
|
const setVisible = visible => { |
||||
|
store.update(state => ({ |
||||
|
...state, |
||||
|
visible: visible, |
||||
|
})) |
||||
|
} |
||||
|
|
||||
|
const setAllowSelection = allowSelection => { |
||||
|
store.update(state => ({ |
||||
|
...state, |
||||
|
allowSelection, |
||||
|
})) |
||||
|
} |
||||
|
|
||||
|
const changeRole = async role => { |
||||
|
store.update(state => ({ |
||||
|
...state, |
||||
|
role: role === "self" ? null : role, |
||||
|
})) |
||||
|
// location.reload()
|
||||
|
await authStore.actions.fetchUser() |
||||
|
await initialise() |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
subscribe: store.subscribe, |
||||
|
actions: { setVisible, setAllowSelection, changeRole }, |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
export const devToolsStore = createDevToolStore() |
||||
@ -0,0 +1,50 @@ |
|||||
|
exports.definition = { |
||||
|
name: "Looping", |
||||
|
icon: "Reuse", |
||||
|
tagline: "Loop the block", |
||||
|
description: "Loop", |
||||
|
stepId: "LOOP", |
||||
|
internal: true, |
||||
|
inputs: {}, |
||||
|
schema: { |
||||
|
inputs: { |
||||
|
properties: { |
||||
|
option: { |
||||
|
customType: "loopOption", |
||||
|
title: "Input type", |
||||
|
}, |
||||
|
binding: { |
||||
|
type: "string", |
||||
|
title: "Binding / Value", |
||||
|
}, |
||||
|
iterations: { |
||||
|
type: "number", |
||||
|
title: "Max loop iterations", |
||||
|
}, |
||||
|
failure: { |
||||
|
type: "string", |
||||
|
title: "Failure Condition", |
||||
|
}, |
||||
|
}, |
||||
|
required: ["type", "value", "iterations", "failure"], |
||||
|
}, |
||||
|
outputs: { |
||||
|
properties: { |
||||
|
items: { |
||||
|
customType: "item", |
||||
|
description: "The item currently being executed", |
||||
|
}, |
||||
|
success: { |
||||
|
type: "boolean", |
||||
|
description: "Whether the message loop was successfully", |
||||
|
}, |
||||
|
iterations: { |
||||
|
type: "number", |
||||
|
descriptions: "The amount of times the block ran", |
||||
|
}, |
||||
|
}, |
||||
|
required: ["success", "items", "iterations"], |
||||
|
}, |
||||
|
}, |
||||
|
type: "LOGIC", |
||||
|
} |
||||
Loading…
Reference in new issue