diff --git a/packages/bbui/src/Form/Core/RichTextField.svelte b/packages/bbui/src/Form/Core/RichTextField.svelte index f964405f0d..3e0b0caf4d 100644 --- a/packages/bbui/src/Form/Core/RichTextField.svelte +++ b/packages/bbui/src/Form/Core/RichTextField.svelte @@ -4,6 +4,7 @@ export let value = "" export let placeholder = null export let disabled = false + export let readonly = false export let error = null export let height = null export let id = null @@ -20,6 +21,7 @@ {fullScreenOffset} {disabled} {easyMDEOptions} + {readonly} on:change /> diff --git a/packages/bbui/src/Form/Core/TextArea.svelte b/packages/bbui/src/Form/Core/TextArea.svelte index 465212cd44..be7eed466d 100644 --- a/packages/bbui/src/Form/Core/TextArea.svelte +++ b/packages/bbui/src/Form/Core/TextArea.svelte @@ -5,6 +5,7 @@ export let value = "" export let placeholder = null export let disabled = false + export let readonly = false export let error = null export let id = null export let height = null @@ -61,6 +62,7 @@ class="spectrum-Textfield-input" style={align ? `text-align: ${align}` : ""} {disabled} + {readonly} {id} on:focus={() => (focus = true)} on:blur={onChange} diff --git a/packages/bbui/src/Markdown/MarkdownEditor.svelte b/packages/bbui/src/Markdown/MarkdownEditor.svelte index 7fb6414ad8..27035d8033 100644 --- a/packages/bbui/src/Markdown/MarkdownEditor.svelte +++ b/packages/bbui/src/Markdown/MarkdownEditor.svelte @@ -8,6 +8,7 @@ export let id = null export let fullScreenOffset = 0 export let disabled = false + export let readonly = false export let easyMDEOptions const dispatch = createEventDispatcher() @@ -19,6 +20,7 @@ // control $: checkValue(value) $: mde?.codemirror.on("change", debouncedUpdate) + $: mde?.codemirror.setOption("readOnly", readonly) const checkValue = val => { if (mde && val !== latestValue) { @@ -43,7 +45,7 @@ const debouncedUpdate = debounce(update, 250) -{#key height} +{#key (height, readonly)} diff --git a/packages/client/manifest.json b/packages/client/manifest.json index eef1e50b7c..6e175c44de 100644 --- a/packages/client/manifest.json +++ b/packages/client/manifest.json @@ -2589,6 +2589,17 @@ "key": "disabled", "defaultValue": false }, + { + "type": "boolean", + "label": "Read only", + "key": "readonly", + "defaultValue": false, + "dependsOn": { + "setting": "disabled", + "value": true, + "invert": true + } + }, { "type": "text", "label": "Initial form step", @@ -2738,6 +2749,17 @@ "key": "disabled", "defaultValue": false }, + { + "type": "boolean", + "label": "Read only", + "key": "readonly", + "defaultValue": false, + "dependsOn": { + "setting": "disabled", + "value": true, + "invert": true + } + }, { "type": "validation/string", "label": "Validation", @@ -3427,6 +3449,17 @@ "key": "disabled", "defaultValue": false }, + { + "type": "boolean", + "label": "Read only", + "key": "readonly", + "defaultValue": false, + "dependsOn": { + "setting": "disabled", + "value": true, + "invert": true + } + }, { "type": "validation/string", "label": "Validation", diff --git a/packages/client/src/components/app/forms/LongFormField.svelte b/packages/client/src/components/app/forms/LongFormField.svelte index 8d94f83319..8482a6a68e 100644 --- a/packages/client/src/components/app/forms/LongFormField.svelte +++ b/packages/client/src/components/app/forms/LongFormField.svelte @@ -8,6 +8,7 @@ export let label export let placeholder export let disabled = false + export let readonly = false export let validation export let defaultValue = "" export let format = "auto" @@ -71,6 +72,7 @@ value={fieldState.value} on:change={handleChange} disabled={fieldState.disabled} + {readonly} error={fieldState.error} id={fieldState.fieldId} {placeholder} @@ -88,6 +90,7 @@ value={fieldState.value} on:change={handleChange} disabled={fieldState.disabled} + {readonly} error={fieldState.error} id={fieldState.fieldId} {placeholder} diff --git a/packages/client/src/components/app/forms/StringField.svelte b/packages/client/src/components/app/forms/StringField.svelte index 26136b5d8d..624611c733 100644 --- a/packages/client/src/components/app/forms/StringField.svelte +++ b/packages/client/src/components/app/forms/StringField.svelte @@ -11,6 +11,7 @@ export let defaultValue = "" export let align export let onChange + export let readonly = false let fieldState let fieldApi @@ -44,6 +45,7 @@ {placeholder} {type} {align} + {readonly} /> {/if}