got to a stable point again. next up is comming up with a decent API for modifications

This commit is contained in:
Chris Kruining 2025-02-25 16:21:21 +11:00
parent 4fb7405466
commit fc22ce6027
No known key found for this signature in database
GPG key ID: EB894A3560CCCAD2
19 changed files with 498 additions and 375 deletions

View file

@ -1,12 +1,13 @@
import { Component, createEffect, createMemo, createSignal, For, on, untrack } from 'solid-js';
import { createSelection, getTextNodes } from '@solid-primitives/selection';
import { isServer } from 'solid-js/web';
import { createEditContext } from '~/features/edit-context';
import { createEditContext } from '~/features/editor';
import { createSource } from '~/features/source';
import css from './textarea.module.css';
interface TextareaProps {
class?: string;
title?: string;
value: string;
lang: string;
placeholder?: string;
@ -20,28 +21,33 @@ export function Textarea(props: TextareaProps) {
const source = createSource(() => props.value);
const [text] = createEditContext(editorRef, () => source.out);
createEffect(() => {
source.out = text();
});
createEffect(() => {
props.oninput?.(source.in);
});
createEffect(on(() => [editorRef(), source.spellingErrors] as const, ([ref, errors]) => {
createEffect(on(() => [editorRef()!, source.spellingErrors] as const, ([ref, errors]) => {
createHighlights(ref, 'spelling-error', errors);
}));
createEffect(on(() => [editorRef(), source.grammarErrors] as const, ([ref, errors]) => {
createEffect(on(() => [editorRef()!, source.grammarErrors] as const, ([ref, errors]) => {
createHighlights(ref, 'grammar-error', errors);
}));
createEffect(on(() => [editorRef(), source.queryResults] as const, ([ref, errors]) => {
createEffect(on(() => [editorRef()!, source.queryResults] as const, ([ref, errors]) => {
createHighlights(ref, 'search-results', errors);
}));
return <>
<Suggestions />
<input class={css.search} type="search" oninput={e => source.query = e.target.value} />
<input class={css.search} type="search" title={`${props.title ?? ''}-search`} oninput={e => source.query = e.target.value} />
<div
ref={setEditorRef}
class={`${css.textarea} ${props.class}`}
title={props.title ?? ''}
dir="auto"
lang={props.lang}
innerHTML={text()}