{#if componentSettings?.item?.data} {@const component = componentSettings.item.data}
{components[componentSettings.item.data.type].name}
See documentation
{#if component.componentInput}
{`${component.id}`}
{#if componentSettings.item.data.componentInput}
{#if componentSettings.item.data.componentInput.type === 'static'}
{:else if componentSettings.item.data.componentInput.type === 'template' && componentSettings.item.data.componentInput !== undefined}
{:else if componentSettings.item.data.componentInput.type === 'connected' && component.componentInput !== undefined}
{:else if componentSettings.item.data.componentInput?.type === 'runnable' && component.componentInput !== undefined}
{/if}
{/if} {#key $stateId} {#if componentSettings.item.data.componentInput?.type === 'runnable'} {#if Object.keys(componentSettings.item.data.componentInput.fields ?? {}).length > 0}
The runnable inputs are inferred from the inputs of the flow or script parameters this component is attached to.
{/if} {/if} {/key}
{/if} {#if Object.values(initialConfiguration).length > 0}
{:else}
{ccomponents[component.type].name} has no configuration
{/if} {#if componentSettings.item.data.type === 'tabscomponent'}
{:else if componentSettings.item.data.type === 'steppercomponent'}
{:else if componentSettings.item.data.type === 'conditionalwrapper'}
{:else if componentSettings.item.data.type === 'verticalsplitpanescomponent' || componentSettings.item.data.type === 'horizontalsplitpanescomponent'}
{:else if componentSettings.item.data.type === 'tablecomponent' && Array.isArray(componentSettings.item.data.actionButtons)}
{/if} {#if (`recomputeIds` in componentSettings.item.data && Array.isArray(componentSettings.item.data.recomputeIds)) || componentSettings.item.data.type === 'buttoncomponent' || componentSettings.item.data.type === 'formcomponent' || componentSettings.item.data.type === 'formbuttoncomponent' || componentSettings.item.data.type === 'checkboxcomponent'}
{/if}
{#if Object.keys(ccomponents[component.type].customCss ?? {}).length > 0}
(viewCssOptions = !viewCssOptions)} > {viewCssOptions ? 'Hide' : 'Show'}
secondaryMenu.open(StylePanel, { component })} > Rich Editor
{#if viewCssOptions}
{#each Object.keys(ccomponents[component.type].customCss ?? {}) as name} {#if componentSettings.item.data?.customCss != undefined}
{/if} {/each}
{/if}
{/if} {#if duplicateMoveAllowed}
Delete {#if isMac()}
⌘
+
{:else}
Del
{/if}
Copy:
{getModifierKey()}
+
C
,
{getModifierKey()}
+
V
Move:
{getModifierKey()}
+
X
,
{getModifierKey()}
+
V
Navigate:
←
↑
→
ESC
Add to selection:
⇑
+
click
{/if}
{/if}