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

Always provide context from form fields regardless of standalone mode to ensure global bindings work when nesting inside a form

This commit is contained in:
Andrew Kingston 2024-11-08 12:15:12 +00:00
parent f08e528c99
commit 25bfc65764
No known key found for this signature in database
1 changed files with 47 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

94
packages/client/src/components/app/forms/Field.svelte
View File

@ -99,8 +99,8 @@
}) })
</script> </script>
{#if !formContext} <Provider data={{ value: fieldState?.value }}>
<Provider data={{ value: fieldState?.value }}> {#if !formContext}
<InnerForm <InnerForm
{disabled} {disabled}
{readonly} {readonly}
@ -111,53 +111,53 @@
<slot /> <slot />
</svelte:self> </svelte:self>
</InnerForm> </InnerForm>
</Provider> {:else}
{:else} <div
<div class="spectrum-Form-item"
class="spectrum-Form-item" class:span-2={span === 2}
class:span-2={span === 2} class:span-3={span === 3}
class:span-3={span === 3} class:span-6={span === 6 || !span}
class:span-6={span === 6 || !span} use:styleable={$component.styles}
use:styleable={$component.styles} class:above={labelPos === "above"}
class:above={labelPos === "above"} >
> {#key $component.editing}
{#key $component.editing} <label
<label bind:this={labelNode}
bind:this={labelNode} contenteditable={$component.editing}
contenteditable={$component.editing} on:blur={$component.editing ? updateLabel : null}
on:blur={$component.editing ? updateLabel : null} on:input={() => (touched = true)}
on:input={() => (touched = true)} class:hidden={!label}
class:hidden={!label} class:readonly
class:readonly for={fieldState?.fieldId}
for={fieldState?.fieldId} class={`spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-Form-itemLabel ${labelClass}`}
class={`spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-Form-itemLabel ${labelClass}`} >
> {label || " "}
{label || " "} </label>
</label> {/key}
{/key} <div class="spectrum-Form-itemField">
<div class="spectrum-Form-itemField"> {#if !fieldState}
{#if !fieldState} <Placeholder />
<Placeholder /> {:else if schemaType && schemaType !== type && !["options", "longform"].includes(type)}
{:else if schemaType && schemaType !== type && !["options", "longform"].includes(type)} <Placeholder
<Placeholder text="This Field setting is the wrong data type for this component"
text="This Field setting is the wrong data type for this component" />
/> {:else}
{:else} <slot />
<slot /> {#if fieldState.error}
{#if fieldState.error} <div class="error">
<div class="error"> <Icon name="Alert" />
<Icon name="Alert" /> <span>{fieldState.error}</span>
<span>{fieldState.error}</span> </div>
</div> {:else if helpText}
{:else if helpText} <div class="helpText">
<div class="helpText"> <Icon name="HelpOutline" /> <span>{helpText}</span>
<Icon name="HelpOutline" /> <span>{helpText}</span> </div>
</div> {/if}
{/if} {/if}
{/if} </div>
</div> </div>
</div> {/if}
{/if} </Provider>
<style> <style>
:global(.form-block .spectrum-Form-item.span-2) { :global(.form-block .spectrum-Form-item.span-2) {