Svedit 0.6.0 is out! 🥳 - All new Command API - Keyboard shortcuts - Batching of history entries - Immutable data structures (each change yields a new doc) - API docs!!! (in README) - much more... Enjoy! (Let me know which parts of the docs were hard to read, so I can improve them) svedit.dev

I think the "Small Web" is a great idea, and I believe it was the original idea of the internet. Hope that svedit.dev and the upcoming editable.website v2 can contribute to making the web smaller. :)

Excellent execution of generative visuals in combination with minimalist webdesign by @raphaelameaume.com. Love it!

The upcoming Svedit 0.6.0 (in the works since ~7 weeks) will be a huge step towards API stability. At the heart is the new Command API, that will give you a ton of flexibility to design your own editable websites and apps. Docs are already in the README: github.com/michael/svedit

I'll be speaking about "CMS-Free, Editable Websites with Svelte and Svedit" at next week's Svelte Meetup in Vienna. Very much looking forward to meeting the Austrian Svelte Society. See you there! :) www.meetup.com/svelte-socie...

Now part of the W3C Web Editing Working Group. Gave a presentation on "What is stopping developers from creating editors based only on input events?" at todays TPAC Meeting in Japan. Web-editing ftw! :)

If you haven’t found the right birthday present for me yet, worry not! Visit svedit.dev and play around. If you like what you see (and only if you really find it useful) leave a star on Github. Means the world to me knowing my work helps others. <3

In the next version of svedit.dev, you'll be able to take fine-grained control over editing behavior by defining commands, and binding them to a keymap.

With the latest commit, svedit.dev may have become the first editor that handles ALL inputs before they modify the DOM (no more DOM reconciliation needed - BIG STEP!) (few workarounds were needed, which I hope can be removed over time — see github.com/michael/web-...)

TIL you actually *can* cancel character composition input events. function oncompositionstart() { // aborts the IME, that was about to start; window.getSelection().removeAllRanges(); } * works in all browsers; this way i can prevent the situation where Svedit gets destroyed. 🥳

Is there way I can follow *every* Svelte person in the Bluesky? :D

This week is dedicated to documenting and reproducing browser bugs, related to contenteditable et. al. Issues: github.com/michael/web-... Repros: github.com/michael/web-...

There's a future in which you can ditch the CMS and develop and edit (!) websites and apps *all in Svelte*. Sneak peek into editable.website v2, powered by svedit.dev. Full video on Youtube: youtube.com/watch?v=o4kc...

Tell me what I'm missing, but I don't understand why types in JavaScript needed a new syntax. JSDoc comments should have been the way. No compile step needed to run a program. Lets you copy and paste a snippet of code and run it in the browser console, etc. Why we needed .ts?

Will be chatting with @paolo.ricciuti.me later today (~4:30pm), and give a short demo on what's new for svedit.dev. See you there! :)

Browser mode testing! 🥳

A Svedit user asked if there's support inline (uneditable/dynamic) nodes. Well, not yet. But this morning I spent an hour or so replicating ProseMirror's Dinos example. Not done yet, but kinda works. Convo: github.com/michael/sved... PR: github.com/michael/sved...

Been working on the design of a storage layer for Svedit docs. A key challenge is sharing parts (e.g. a nav) of a doc (e.g. a page) for reuse. Svedit (the client) will always see one self-contained doc, but the server might split it up into sub-docs. github.com/michael/sved...

Hey @danabra.mov. Thanks for this inspiring writeup! Got a two questions: Shouldn't we force (encourage?) any identity to also run their own server? Only then people truly own their data, no? What if we purposely didn't solve aggregation at all? It's the layer where people start to game the system

I wish SvelteKit could provide/enable an idiomatic way of running stand-alone scripts that "just works" (and robustly respects-or-ignores Svelte/Kit-specific syntax). vite-node is brittle. :(

In Svedit I got Document.svelte.js, holding reactive state that drives the editor. However, I want to use that Document class outside of Svelte/Kit, like in a Node.js migration script. What options do I have? - vite-node? - move all $state outside of Document? - ???

svelte.dev/packages is now live! It's a convenient and easily discoverable place to find a sampling of high quality packages in the ecosystem. We hope it will give confidence in the Svelte ecosystem to newcomers and help them get started more easily.

Svedit 0.5.0 is out. It's all about better copy and paste. Try selecting and copying a couple of images in your filesystem and paste them into Svedit. Oh and since Svedit is growing up now, it's got its own domain. svedit.dev Enjoy!

You can now select and copy images from your file system and paste them into Svedit. Depending on your cursor position it will insert the correct node type (e.g. here it creates image grid items) Try it yourself at svedit.vercel.app

Major improvements to copy&paste behavior coming soon to Svedit. You can already test them at svedit.vercel.app. If you encounter any serious bugs, let me know, so I can fix them before the 0.5.0 release.

Anyone running node:sqlite in production yet?

Svedit 0.4.0 introduces schema-aware text annotations. Here’s how you can now define a custom annotation ‘highlight’. Annotations can also hold properties like any other node (see ‘link’).

Amazing new album CHOROPHOBIA (fear of dancing) by WEVAL. weval.lnk.to/chorophobiaAP

Character composition in iOS Safari works differently than anywhere else, hence it was still broken in Svedit 0.2.0. However, I just pushed a fix, and now on svedit.vercel.app you should be able to type Korean/Japanese/Chinese. Finally! 🥳

Svedit 0.3.0 is a big release focusing on stability & cross-browser compatibility. You can now use character/word composition (IME), grapheme clusters (emojis) are properly recognized, and lots of bugs related to contenteditable have been fixed. Demo: svedit.vercel.app

It took me way longer than I anticipated, but Svedit 0.3.0 is about to be ready. Stability and cross-browser compatibility should improve by a factor of 10. 🤞 Really happy to finally land this, after two-week-long struggle with making contenteditable behave across browsers.

To build an editor on top of contenteditable is like walking on eggshells. So many sneaky browser bugs, like this one in Safari 😱😱😱 svelte.dev/playground/h...

Totally forgot that years ago I was credited for contributing to a W3C spec. w3.org/TR/input-eve... Now to my surprise I learn that not Safari but Chrome (!) is lacking behind on implementing it. Means in Safari I can detect the edge case from the quoted tweet. Not in Chrome. :(

Just learned that Svedit — the editing library for Svelte, not the Swedish version of Reddit — was featured in yesterday's bytes.dev newsletter. 🥹 Thank you, to whoever found it - and the right words. ;)

Character composition now working in the live demo. However, when doing a longpress "a" and then confirm by pressing a number, there's no compositionstart event triggered, so I miss that. Any idea how I can detect this character selection popup, without funky timing heuristics?

In the next version of Svedit, character composition (dead keys et al.) will be properly handled. Well… wish me luck with that one! 😆

Svedit 0.2.0 is out. Mostly bug fixes related to selection mapping. One small breaking change was needed in the process. github.com/michael/sved... hello-svedit update shows what you need to do to migrate: github.com/michael/hell...

Svedit 0.1.0 is out, and available via npm for both JavaScript and TypeScript consumers. 🥳 Hundreds of hours went into this so far, and hundreds more to come. 😅 Enjoy! Demo: svedit.vercel.app Code: github.com/michael/svedit Example repo: github.com/michael/hell...

In Svedit we've got NodeArray and NodeSelection as core primitives. But how how to name these "gaps" between the nodes, which when focused represent a "collapsed NodeSelection" aka a "NodeCursor"? Candidates: - NodeCursorTrap - NodeCursorGap

Almost ready: Svedit 0.1.0 with support for TypeScript consumers. Plus, a bare-metal 'hello-svedit' example repo to get started.

TypeScript in JSDoc challenge: Derive types for document nodes from a single-source of truth (schema object). Got this working in TS (at least with a discriminated union) but failed to translate it to JSDoc, even when using a d.ts file for the types. www.typescriptlang.org/play/?target...

Has anyone published a Svelte component library using JS+JSDoc according to svelte.dev/docs/kit/pac...? I'd like to get Svedit ready for TypeScript consumers, but I'm struggling with the tooling/packaging. Would like to learn by example. But can't find any libs published this way. Thx for help!

Somewhat proud I achieved all the rich editing behavior I wanted for Svedit, while staying at only around 2000 lines of library code. The whole demo app at svedit.vercel.app compiles down to 62.6kb of JavaScript. Hope I can keep the slimness as the codebase majors. 🤞

GOT IT! 🍾 The trailing <br> is causing the push of the cursor to the end of the placeholder. I need this <br> so the empty AnnotatedStringProperty is keyboard-accessible. However, I can just hide the <br> once it is focused, fixing the cursor placement.

Has anyone yet solved the puzzle of enabling placehoder="Some placeholder" for text elements inside a contenteditable and still have the cursor end up at position zero when focused? Been trying many things but each trick leads to different side effects.

New in Svedit: Selecting content types and choosing visual variations is now possible entirely with the keyboard. Plus, we now have proper text placeholders, which really help to give the user an idea how the new content will look like. Try it out: svedit.vercel.app.

Never been a fan of mouseover hierarchical menus. In my opinion you could always replace them with a general page, that has prominent links to the subpages. Yes, it's one click more (on Desktop), but it's infinitely more scalable/flexible, and super trivial to implement.

If you're non-technical and in the market for a new high-quality website and want it to be easy to build and maintain, while still offering enough creative freedom, check out pagy.co (watch the intro video!) by @hernansartorio.bsky.social. Huge respect to him for pulling this off as a solopreneur.

Specialists in generalization. — Devs

I'm on team DHH re. dynamic typing/nobuild AND I love @svelte.dev. I love writing JS in small projects. I neither enjoy TS, nor do I enjoy writing JSDoc blocks. Dilemma: Would I be the only one to develop/distribute a Svelte lib in JS-only/nobuild style? github.com/michael/sved...