misc updates with tests failing
This commit is contained in:
@@ -10,7 +10,7 @@
|
||||
class="space-y-2"
|
||||
x-data="{
|
||||
model: @js($model),
|
||||
value: @entangle($model).defer,
|
||||
value: @entangle($model),
|
||||
init() {
|
||||
this.$nextTick(() => {
|
||||
this.writeEditorValue(this.value || '');
|
||||
@@ -21,33 +21,43 @@
|
||||
return;
|
||||
}
|
||||
|
||||
this.$refs.editor.textContent = value || '';
|
||||
const nextValue = value || '';
|
||||
const currentValue = this.$refs.editor.innerText || '';
|
||||
|
||||
if (document.activeElement === this.$refs.editor && currentValue !== '' && currentValue !== nextValue) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.$refs.editor.textContent = nextValue;
|
||||
},
|
||||
syncToLivewire(live = false) {
|
||||
syncToLivewire(live = true) {
|
||||
const value = this.$refs.editor?.innerText || '';
|
||||
|
||||
this.value = value;
|
||||
this.$refs.input.value = value;
|
||||
this.$refs.input.dispatchEvent(new Event('input', { bubbles: true }));
|
||||
this.$wire.set(this.model, this.value, live);
|
||||
|
||||
if (this.$refs.input) {
|
||||
this.$refs.input.value = value;
|
||||
}
|
||||
|
||||
this.$wire.set(this.model, value, live);
|
||||
},
|
||||
resetEditor() {
|
||||
this.value = '';
|
||||
this.writeEditorValue('');
|
||||
this.syncToLivewire(false);
|
||||
this.syncToLivewire(true);
|
||||
},
|
||||
runCommand(command) {
|
||||
this.$refs.editor?.focus();
|
||||
document.execCommand(command, false, null);
|
||||
this.syncToLivewire(false);
|
||||
this.syncToLivewire(true);
|
||||
},
|
||||
wrapBlock(tagName) {
|
||||
this.$refs.editor?.focus();
|
||||
document.execCommand('formatBlock', false, tagName);
|
||||
this.syncToLivewire(false);
|
||||
this.syncToLivewire(true);
|
||||
},
|
||||
}"
|
||||
x-on:helpdesk-editor-sync.window="if (! $event.detail?.model || $event.detail.model === @js($model)) syncToLivewire(false)"
|
||||
x-on:helpdesk-editor-sync.window="if (! $event.detail?.model || $event.detail.model === @js($model)) syncToLivewire($event.detail?.live ?? true)"
|
||||
x-on:helpdesk-editor-reset.window="if (! $event.detail?.model || $event.detail.model === @js($model)) resetEditor()"
|
||||
>
|
||||
<label for="{{ $model }}-editor" class="block text-sm font-semibold text-zinc-200">
|
||||
@@ -108,7 +118,9 @@
|
||||
data-helpdesk-sync-target="{{ $model }}"
|
||||
data-helpdesk-editor-model="{{ $model }}"
|
||||
@if ($editorDusk) data-dusk="{{ $editorDusk }}" dusk="{{ $editorDusk }}" @endif
|
||||
x-on:blur="syncToLivewire(false)"
|
||||
x-on:input.debounce.350ms="syncToLivewire(true)"
|
||||
x-on:paste.debounce.350ms="syncToLivewire(true)"
|
||||
x-on:blur="syncToLivewire(true)"
|
||||
class="helpdesk-rich-editor block min-h-[14rem] w-full overflow-y-auto whitespace-pre-wrap break-words border-0 bg-zinc-950 px-5 py-4 text-base leading-7 text-zinc-100 outline-none transition placeholder:text-zinc-500 empty:before:pointer-events-none empty:before:text-zinc-500 empty:before:content-[attr(data-placeholder)] focus:ring-2 focus:ring-blue-500"
|
||||
></div>
|
||||
|
||||
@@ -129,6 +141,6 @@
|
||||
</div>
|
||||
|
||||
<p class="text-xs font-semibold text-zinc-400">
|
||||
Browser spellcheck stays active in the native editable area. Formatting is synchronised only on blur and submit to avoid Livewire keypress regressions.
|
||||
Browser spellcheck stays active in the native editable area. Formatting is synchronised before uploads and submit so Livewire does not lose unsaved editor text during attachment refreshes.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user